Skip to content

C
civil-front
Commit e35d6c3b by 李耀琨
Options

优化ui

parent d690c688
Showing with 609 additions and 88 deletions
.env.development
ENV = 'development'
# 接口地址
VUE_APP_BASE_API = 'http://172.18.99.141:9888/'
VUE_APP_BASE_API = 'http://124.227.197.29:8088/'
VUE_APP_WS_API = 'ws://124.227.197.29:8088'
VUE_APP_FILE_API = 'http://124.227.197.29:8088/'
......
src/utils/request.js
......@@ -75,12 +75,13 @@ service.interceptors.response.use(
})
}
}
} else {
Notification.error({
title: '接口请求失败',
duration: 5000
})
}
// else {
// Notification.error({
// title: '接口请求失败',
// duration: 5000
// })
// }
}
return Promise.reject(error)
}
......
src/views/home.vue
......@@ -8,7 +8,7 @@
<div class="flex-container">
<img src="./../assets/images/标题左边素材.png" alt="" class="about" />
<div class="title-text">
广西民政决策分析
民政数据分析系统
<img src="./../assets/images/标题下划线.png" alt="" class="underline" />
</div>
<img src="./../assets/images/标题右边素材.png" alt="" class="about" />
......
src/views/unified/entrance.vue
<template>
<div class="page">
<el-row>
<el-col :span="8">
<div class="horizontal"></div>
</el-col>
<el-col :span="8">
<div class="topTitle">广西民政人口专题分析</div>
</el-col>
<el-col :span="8">
<div class="horizontal"></div>
</el-col>
</el-row>
<div class="flex-container">
<img src="./../../assets/images/标题左边素材.png" alt="" class="about" />
<div class="title-text">
民政数据分析系统
<img src="./../../assets/images/标题下划线.png" alt="" class="underline" />
</div>
<img src="./../../assets/images/标题右边素材.png" alt="" class="about" />
</div>
<br />
<br>
......@@ -132,6 +127,7 @@ export default {
<style lang="scss" scoped>
.switchMa{
margin: 0 10px;
background-color: #0b0f4e;
}
.white{
color: #fff;
......@@ -190,4 +186,25 @@ export default {
height: 600px;
background-color: brown;
}
.flex-container {
display: flex;
width: 1300px;
height: 110px;
margin: auto;
}
.title-text {
width: 380px;
line-height: 25px;
margin: 40px 20px -20px 20px;
color: #00f9fd;
font-size: 45px;
}
.about {
margin-top: 20px;
width: 450px;
height: 60px;
}
.underline {
width: 100%;
}
</style>
\ No newline at end of file
src/views/unified/tapSwitch/childWelfare.vue
......@@ -7,6 +7,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">儿童福利机构汇总</div>
<div class="socialOrganizationFlex">
<div class="textLefts">收养总数</div>
......@@ -46,6 +50,10 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">机构占比</div>
<div id="proportion" class="proportion"></div>
</div>
......@@ -58,6 +66,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wians">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">当前选择：广西全区</div>
<div class="childWelfareMap" id="childWelfareMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
......@@ -68,6 +80,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wianss">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">年度按月份统计</div>
<div id="annualStatistics" class="annualStatistics"></div>
</div>
......@@ -77,9 +93,13 @@
<!-- 右 -->
<el-col :span="6">
<el-row :gutter="20">
<el-col :span="24">
<div class="wiansInfoS">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="wiansInfo">
<div class="title">婚姻统计</div>
<el-input
type="text"
......@@ -106,14 +126,10 @@
</el-table-column>
</el-table>
</div>
</div>
</el-col>
</el-row>
</el-col>
<!-- <br />
<el-row :gutter="20">
<el-col :span="24"><div class="wian"></div> </el-col>
</el-row>
</el-col> -->
</el-row>
</div>
</template>
......@@ -599,6 +615,34 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft{
position:absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.proportion {
width: 100%;
height: 350px;
......@@ -606,7 +650,7 @@ export default {
.annualStatistics {
margin-top: 10px;
width: 100%;
height: 260px;
height: 220px;
}
.title {
......@@ -629,23 +673,34 @@ export default {
}
.wian {
border: 1px solid #1A6295;
position: relative;
width: 100%;
height: 400px;
background-color: #082c61;
}
.wians {
border: 1px solid #1A6295;
position: relative;
width: 100%;
height: 500px;
background-color: #082c61;
}
.wianss {
border: 1px solid #1A6295;
position: relative;
width: 100%;
height: 300px;
background-color: #082c61;
}
.wiansInfoS{
width: 100%;
position: relative;
border: 1px solid #1A6295;
}
.wiansInfo {
width: 100%;
height: 818px;
......
src/views/unified/tapSwitch/marriage.vue
......@@ -7,6 +7,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">婚姻统计</div>
<div class="socialOrganizationFlex">
<div class="text">共</div>
......@@ -25,6 +29,10 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">婚姻统计</div>
<div class="marriageStatistics">
<div class="flexBox">
......@@ -71,6 +79,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wians">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">当前选择：广西全区</div>
<div class="marriageMap" id="marriageMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
......@@ -81,6 +93,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wianss">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">年度按月份统计</div>
<div id="annualStatistics" class="annualStatistics"></div>
</div>
......@@ -90,9 +106,13 @@
<!-- 右 -->
<el-col :span="6">
<el-row :gutter="20">
<el-col :span="24">
<div class="wiansInfoS">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="wiansInfo">
<div class="title">婚姻统计</div>
<el-input
type="text"
......@@ -140,8 +160,7 @@
</el-table-column>
</el-table>
</div>
</el-col>
</el-row>
</div>
</el-col>
<!-- <br />
<el-row :gutter="20">
......@@ -678,6 +697,34 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft{
position:absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.trend {
width: 100%;
height: 280px;
......@@ -685,7 +732,7 @@ export default {
.annualStatistics {
margin-top: 10px;
width: 100%;
height: 260px;
height: 240px;
}
.title {
......@@ -729,25 +776,36 @@ export default {
}
.wian {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 400px;
background-color: #082c61;
}
.wians {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 500px;
background-color: #082c61;
}
.wianss {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 300px;
background-color: #082c61;
}
.wiansInfo {
.wiansInfoS{
position: relative;
border: 1px solid #1A6295;
width: 100%;
}
.wiansInfo {
height: 818px;
background-color: #082c61;
overflow: hidden;
......
src/views/unified/tapSwitch/mechanism.vue
......@@ -7,6 +7,26 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img
src="./../../../assets/images/01-左上角.png"
alt=""
class="topLeft"
/>
<img
src="./../../../assets/images/02-右上角.png"
alt=""
class="topRight"
/>
<img
src="./../../../assets/images/03-左下角.png"
alt=""
class="lowerLeft"
/>
<img
src="./../../../assets/images/04-右下角.png"
alt=""
class="lowerRight"
/>
<div class="title">儿童福利机构</div>
<div class="mechanismNum">1000个</div>
<div id="children" class="children"></div>
......@@ -18,8 +38,28 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wian">
<img
src="./../../../assets/images/01-左上角.png"
alt=""
class="topLeft"
/>
<img
src="./../../../assets/images/02-右上角.png"
alt=""
class="topRight"
/>
<img
src="./../../../assets/images/03-左下角.png"
alt=""
class="lowerLeft"
/>
<img
src="./../../../assets/images/04-右下角.png"
alt=""
class="lowerRight"
/>
<div class="title">养老机构</div>
<div class="mechanismNum">1000个</div>
<div class="mechanismNum">{{ nursingFacilityNum }}</div>
<div class="pension" id="pension"></div>
</div>
</el-col>
......@@ -30,22 +70,69 @@
<el-col :span="18">
<el-row :gutter="20">
<el-col :span="16">
<div class="wianstow">
<img
src="./../../../assets/images/01-左上角.png"
alt=""
class="topLeft"
/>
<img
src="./../../../assets/images/02-右上角.png"
alt=""
class="topRight"
/>
<img
src="./../../../assets/images/03-左下角.png"
alt=""
class="lowerLeft"
/>
<img
src="./../../../assets/images/04-右下角.png"
alt=""
class="lowerRight"
/>
<div class="wians">
<div class="title">当前选择：广西全区</div>
<div class="mechanismMap" id="mechanismMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div>
</div>
</el-col>
<el-col :span="8">
<div class="wianstow">
<img
src="./../../../assets/images/01-左上角.png"
alt=""
class="topLeft"
/>
<img
src="./../../../assets/images/02-右上角.png"
alt=""
class="topRight"
/>
<img
src="./../../../assets/images/03-左下角.png"
alt=""
class="lowerLeft"
/>
<img
src="./../../../assets/images/04-右下角.png"
alt=""
class="lowerRight"
/>
<div class="wians">
<div class="title">敬老院</div>
<div class="mechanismNum">1000个</div>
<div class="mechanismNum">{{ beadhouseNum }}</div>
<div class="datalist">
<el-table
:data="tableData"
stripe
style="width: 100%; background-color: #051d3f; color: #2177b9"
style="
width: 100%;
background-color: #051d3f;
color: #2177b9;
"
:header-cell-style="{
background: '#082C61',
color: '#DAD7DB',
......@@ -54,18 +141,43 @@
>
<el-table-column type="index" label="排名" align="center">
</el-table-column>
<el-table-column prop="name" label="区域名称" align="center">
<el-table-column
prop="name"
label="区域名称"
align="center"
>
</el-table-column>
<el-table-column prop="num" label="数量" align="center">
</el-table-column>
</el-table>
</div>
</div>
</div>
</el-col>
<el-col :span="24">
<br />
<div class="wiansw">
<img
src="./../../../assets/images/01-左上角.png"
alt=""
class="topLeft"
/>
<img
src="./../../../assets/images/02-右上角.png"
alt=""
class="topRight"
/>
<img
src="./../../../assets/images/03-左下角.png"
alt=""
class="lowerLeft"
/>
<img
src="./../../../assets/images/04-右下角.png"
alt=""
class="lowerRight"
/>
<div class="title">社会组织</div>
<el-row :gutter="20">
<el-col :span="6">
......@@ -125,6 +237,8 @@ export default {
areaNursingStatsList: {},
agencyPercentageStats: [],
welfareHomeName: [],
nursingFacilityNum: 125,
beadhouseNum: 169,
};
},
created() {
......@@ -157,10 +271,29 @@ export default {
getAreaNursingStatsListFun(data) {
getAreaNursingStatsList({
areaCode: data,
type: 146,
}).then((res) => {
console.log(res, "获取区域养老院统计列表");
this.areaNursingStatsList = res.data;
this.beadhouseNum = 0;
res.data.numList.forEach((item) => {
this.beadhouseNum += item * 1;
});
this.tableData = res.data.statsLst;
this.pensionFun();
});
getAreaNursingStatsList({
areaCode: data,
type: 103,
}).then((res) => {
console.log(res, "柱形图");
this.areaNursingStatsList = res.data;
this.nursingFacilityNum = 0;
res.data.numList.forEach((item) => {
this.nursingFacilityNum += item * 1;
});
this.pensionFun();
});
},
......@@ -669,6 +802,34 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft {
position: absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight {
position: absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft {
position: absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight {
position: absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.el-table th {
overflow: hidden;
......@@ -724,7 +885,7 @@ export default {
}
.children {
width: 100%;
height: 280px;
height: 100%;
}
.mechanismNum {
text-align: center;
......@@ -763,11 +924,15 @@ export default {
}
.wian {
position: relative;
border: 1px solid #1a6295;
width: 100%;
height: 400px;
background-color: #082c61;
}
.wiansw {
position: relative;
border: 1px solid #1a6295;
width: 100%;
height: 300px;
background-color: #082c61;
......@@ -779,7 +944,11 @@ export default {
overflow: hidden;
overflow-y: scroll;
}
.wianstow {
position: relative;
border: 1px solid #1a6295;
width: 100%;
}
.wians::-webkit-scrollbar {
display: none;
}
......
src/views/unified/tapSwitch/population.vue
<template>
<div>
<div class="testbox">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<br>
</div>
<el-row :gutter="18">
<!--左 -->
<el-col :span="6">
......@@ -974,37 +968,31 @@ export default {
position:absolute;
width: 10px;
height: 10px;
left: -1px;
bottom: -1px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -1px;
bottom: -1px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -1px;
left: -1px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -1px;
right: -1px;
top: -2px;
right: -2px;
}
.testbox{
position: relative;
border: 1px solid #1A6295;
width: 200px;
height: 200px;
}
.orphan {
width: 100%;
height: 300px;
......@@ -1054,7 +1042,7 @@ bottom: -1px;
.annualStatistics {
margin-top: 10px;
width: 100%;
height: 260px;
height: 240px;
}
.title {
......
src/views/unified/tapSwitch/provide.vue
......@@ -7,6 +7,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">火化量汇总</div>
<div class="provideFlex">
<div class="text">火化总数</div>
......@@ -33,6 +37,10 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">火化率统计</div>
<div id="proportion" class="proportion"></div>
</div>
......@@ -45,6 +53,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wians">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">当前选择：广西全区</div>
<div class="provideMap" id="provideMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
......@@ -55,6 +67,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wianss">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">火化区域分析</div>
<div id="annualStatistics" class="annualStatistics"></div>
</div>
......@@ -64,9 +80,14 @@
<!-- 右 -->
<el-col :span="6">
<el-row :gutter="20">
<el-col :span="24">
<div class="wiansInfoS">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="wiansInfo">
<div class="title">火化信息查询</div>
<el-input
type="text"
......@@ -112,8 +133,7 @@
</el-table-column>
</el-table>
</div>
</el-col>
</el-row>
</div>
</el-col>
<!-- <br />
<el-row :gutter="20">
......@@ -579,6 +599,35 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft{
position:absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.provideFlex {
display: flex;
margin-top: 30px;
......@@ -636,7 +685,7 @@ export default {
.annualStatistics {
margin-top: 10px;
width: 100%;
height: 260px;
height: 240px;
}
.title {
......@@ -659,18 +708,24 @@ export default {
}
.wian {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 400px;
background-color: #082c61;
}
.wians {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 500px;
background-color: #082c61;
}
.wianss {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 300px;
background-color: #082c61;
......@@ -683,6 +738,11 @@ export default {
overflow: hidden;
overflow-y: scroll;
}
.wiansInfoS{
width: 100%;
position: relative;
border: 1px solid #1A6295;
}
.wiansInfo::-webkit-scrollbar {
display: none;
......
src/views/unified/tapSwitch/socialAssistance.vue
......@@ -7,6 +7,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">三年享受低保人数</div>
<div class="display">
<div>
......@@ -37,6 +41,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">三年享受低保资金</div>
<div class="display">
<div>
......@@ -77,6 +85,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wians">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">当前选择：广西全区</div>
<div class="socialAssistanceMap" id="socialAssistanceMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
......@@ -87,6 +99,10 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wianss">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">农村城市低保人数统计</div>
<div id="ruralAndcity" class="ruralAndcity"></div>
</div>
......@@ -96,9 +112,13 @@
<!-- 右 -->
<el-col :span="6">
<el-row :gutter="20">
<el-col :span="24">
<div class="wiansInfoS">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="wiansInfo">
<div class="title">低保对象查询</div>
<el-input
type="text"
......@@ -155,8 +175,7 @@
</el-table-column>
</el-table>
</div>
</el-col>
</el-row>
</div>
</el-col>
<!-- <br />
<el-row :gutter="20">
......@@ -822,6 +841,35 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft{
position:absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.trend {
width: 100%;
height: 200px;
......@@ -873,23 +921,33 @@ export default {
}
.wian {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 415px;
background-color: #082c61;
}
.wians {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 500px;
background-color: #082c61;
}
.wianss {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 330px;
background-color: #082c61;
}
.wiansInfoS{
width: 100%;
position: relative;
border: 1px solid #1A6295;
}
.wiansInfo {
width: 100%;
height: 848px;
......@@ -949,7 +1007,7 @@ export default {
.ruralAndcity {
width: 100%;
height: 300px;
height: 280px;
}
.returnInfos {
......
src/views/unified/tapSwitch/socialOrganization.vue
......@@ -7,6 +7,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">社会组织汇总</div>
<div class="socialOrganizationFlex">
<div class="text">社会组织总数</div>
......@@ -51,6 +55,10 @@
<el-row :gutter="18">
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">区域占比</div>
<div id="proportion" class="proportion"></div>
</div>
......@@ -63,6 +71,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wians">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">当前选择：广西全区</div>
<div
class="socialOrganizationMap"
......@@ -76,6 +88,10 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wianss">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">年度按月份统计</div>
<el-row :gutter="20">
<el-col :span="6">
......@@ -115,9 +131,13 @@
<!-- 右 -->
<el-col :span="6">
<el-row :gutter="20">
<el-col :span="24">
<div class="wiansInfoS">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="wiansInfo">
<div class="title">婚姻统计</div>
<el-input
type="text"
......@@ -146,8 +166,7 @@
</el-table-column>
</el-table>
</div>
</el-col>
</el-row>
</div>
</el-col>
<!-- <br />
<el-row :gutter="20">
......@@ -630,6 +649,34 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft{
position:absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.socialOrganizationFlex {
display: flex;
margin-top: 30px;
......@@ -742,23 +789,33 @@ export default {
}
.wian {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 400px;
background-color: #082c61;
}
.wians {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 500px;
background-color: #082c61;
}
.wianss {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 300px;
background-color: #082c61;
}
.wiansInfoS{
position: relative;
border: 1px solid #1A6295;
width: 100%;
}
.wiansInfo {
width: 100%;
height: 818px;
......
src/views/unified/tapSwitch/subsidies.vue
......@@ -7,6 +7,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">三年贫困残疾资金发放</div>
<div class="display">
<div>
......@@ -35,6 +39,10 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<div class="wian">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">残疾人比例</div>
<div
class="subsidiesBox"
......@@ -63,6 +71,10 @@
<el-row :gutter="20">
<el-col :span="24"
><div class="wians">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">当前选择：广西全区</div>
<div class="subsidiesMap" id="subsidiesMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
......@@ -73,6 +85,10 @@
<el-row :gutter="20">
<el-col :span="24">
<div class="wianss">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="title">农村城市低保人数统计</div>
<div id="ruralAndcity" class="ruralAndcity"></div>
</div>
......@@ -82,9 +98,13 @@
<!-- 右 -->
<el-col :span="6">
<el-row :gutter="20">
<el-col :span="24">
<div class="wiansInfoS">
<img src="./../../../assets/images/01-左上角.png" alt="" class="topLeft">
<img src="./../../../assets/images/02-右上角.png" alt="" class="topRight">
<img src="./../../../assets/images/03-左下角.png" alt="" class="lowerLeft">
<img src="./../../../assets/images/04-右下角.png" alt="" class="lowerRight">
<div class="wiansInfo">
<div class="title">婚姻统计</div>
<el-input
type="text"
......@@ -122,8 +142,7 @@
</el-table-column> -->
</el-table>
</div>
</el-col>
</el-row>
</div>
</el-col>
<!-- <br />
<el-row :gutter="20">
......@@ -651,6 +670,34 @@ export default {
</script>
<style lang="scss" scoped>
.lowerLeft{
position:absolute;
width: 10px;
height: 10px;
left: -2px;
bottom: -2px;
}
.lowerRight{
position:absolute;
width: 10px;
height: 10px;
right: -2px;
bottom: -2px;
}
.topLeft{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
left: -2px;
}
.topRight{
position:absolute;
width: 10px;
height: 10px;
top: -2px;
right: -2px;
}
.trend {
width: 100%;
height: 200px;
......@@ -703,23 +750,33 @@ export default {
}
.wian {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 416px;
background-color: #082c61;
}
.wians {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 500px;
background-color: #082c61;
}
.wianss {
position: relative;
border: 1px solid #1A6295;
width: 100%;
height: 300px;
height: 332px;
background-color: #082c61;
}
.wiansInfoS{
width: 100%;
position: relative;
border: 1px solid #1A6295;
}
.wiansInfo {
width: 100%;
height: 848px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment