Commit f50a57d6 by 苏咏卓

完成地图,查询

parent 0ed15335
ENV = 'development' ENV = 'development'
# 接口地址 # 接口地址
VUE_APP_BASE_API = 'http://172.18.99.141:9888' VUE_APP_BASE_API = 'http://172.18.99.141:9888/'
VUE_APP_WS_API = 'ws://172.18.99.141:9888' VUE_APP_WS_API = 'ws://124.227.197.29:8088'
VUE_APP_FILE_API = 'http://124.227.197.29:8088/'
# 是否启用 babel-plugin-dynamic-import-node插件 # 是否启用 babel-plugin-dynamic-import-node插件
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true
...@@ -2,6 +2,6 @@ ENV = 'production' ...@@ -2,6 +2,6 @@ ENV = 'production'
# 如果使用 Nginx 代理后端接口,那么此处需要改为 '/',文件查看 Docker 部署篇,Nginx 配置 # 如果使用 Nginx 代理后端接口,那么此处需要改为 '/',文件查看 Docker 部署篇,Nginx 配置
# 接口地址,注意协议,如果你没有配置 ssl,需要将 https 改为 http # 接口地址,注意协议,如果你没有配置 ssl,需要将 https 改为 http
VUE_APP_BASE_API = 'https://el-admin.xin' VUE_APP_BASE_API = 'http://124.227.197.29:8088'
# 如果接口是 http 形式, wss 需要改为 ws # 如果接口是 http 形式, wss 需要改为 ws
VUE_APP_WS_API = 'wss://el-admin.xin' VUE_APP_WS_API = 'ws://124.227.197.29:8088'
...@@ -54,6 +54,24 @@ export const getMarriageStats = data => { ...@@ -54,6 +54,24 @@ export const getMarriageStats = data => {
}) })
} }
//婚姻搜索
export const marriageSearch = data => {
return request({
url: 'portal/admin/stats/marriageSearch',
method: 'POST',
data
})
}
//获取人员列表
export const getPersonnelList = data => {
return request({
url: 'portal/admin/stats/getPersonnelList',
method: 'POST',
data
})
}
/** -------------------- 社会组织 -------------------- **/ /** -------------------- 社会组织 -------------------- **/
//获取社会机构区域占比统计 //获取社会机构区域占比统计
export const getSoorganPercentageStats = data => { export const getSoorganPercentageStats = data => {
...@@ -65,6 +83,17 @@ export const getSoorganPercentageStats = data => { ...@@ -65,6 +83,17 @@ export const getSoorganPercentageStats = data => {
}) })
} }
//社会组织搜索
export const soorganSearch = data => {
return request({
url: 'portal/admin/stats/soorganSearch',
method: 'POST',
data
})
}
/** -------------------- 社会救助 -------------------- **/ /** -------------------- 社会救助 -------------------- **/
//获取近三年城市农村低保发放人数统计 //获取近三年城市农村低保发放人数统计
export const getThreeYearShjzAchieveStats = data => { export const getThreeYearShjzAchieveStats = data => {
...@@ -106,6 +135,16 @@ export const getFivesYearShjzProvideStats = data => { ...@@ -106,6 +135,16 @@ export const getFivesYearShjzProvideStats = data => {
}) })
} }
//低保对象搜索
export const lowIncomeSearch = data => {
return request({
url: 'portal/admin/stats/lowIncomeSearch',
method: 'POST',
data
})
}
// 获取近年城市农村低保发放人数统计 城市柱形图 // 获取近年城市农村低保发放人数统计 城市柱形图
export const getAreaYearShjzAchieveStats = data => { export const getAreaYearShjzAchieveStats = data => {
return request({ return request({
...@@ -116,6 +155,16 @@ export const getAreaYearShjzAchieveStats = data => { ...@@ -116,6 +155,16 @@ export const getAreaYearShjzAchieveStats = data => {
}) })
} }
//残疾人搜索
export const deformedManSearch = data => {
return request({
url: 'portal/admin/stats/deformedManSearch',
method: 'POST',
data
})
}
/** -------------------- 儿童福利 -------------------- **/ /** -------------------- 儿童福利 -------------------- **/
//统计该区域的机构和儿童数量 //统计该区域的机构和儿童数量
export const getAgencyChildStats = data => { export const getAgencyChildStats = data => {
...@@ -153,8 +202,27 @@ export const getAgencyUnderChildStatsList = data => { ...@@ -153,8 +202,27 @@ export const getAgencyUnderChildStatsList = data => {
}) })
} }
//儿童搜索
export const childSearch = data => {
return request({
url: 'portal/admin/stats/childSearch',
method: 'POST',
data
})
}
/** -------------------- 殡葬 -------------------- **/ /** -------------------- 殡葬 -------------------- **/
//统计该区域的殡葬火化量 //获取区域火化率占比
export const getCremationRateStats = data => {
return request({
url: 'portal/admin/stats/getCremationRateStats',
method: 'POST',
data
})
}
//统计该区域火化量和火化率
export const getCremationStats = data => { export const getCremationStats = data => {
return request({ return request({
url: 'portal/admin/stats/getCremationStats', url: 'portal/admin/stats/getCremationStats',
...@@ -164,6 +232,26 @@ export const getCremationStats = data => { ...@@ -164,6 +232,26 @@ export const getCremationStats = data => {
}) })
} }
//获取区域殡葬火化分析列表
export const getCremationStatsList = data => {
return request({
url: 'portal/admin/stats/getCremationStatsList',
method: 'POST',
data
})
}
//殡葬搜索
export const cremationSearch = data => {
return request({
url: 'portal/admin/stats/cremationSearch',
method: 'POST',
data
})
}
/** -------------------- 两项补贴 -------------------- **/ /** -------------------- 两项补贴 -------------------- **/
//获取区域残疾发放统计 //获取区域残疾发放统计
export const getAreaDisabledIssueStats = data => { export const getAreaDisabledIssueStats = data => {
...@@ -207,9 +295,9 @@ export const getAreaNursingStatsList = data => { ...@@ -207,9 +295,9 @@ export const getAreaNursingStatsList = data => {
/** -------------------- 地图 -------------------- **/ /** -------------------- 地图 -------------------- **/
//获取地图数据 //获取地图数据
export const getMapData = (areaId) =>{ export const getMapData = (areaId) => {
return request({ return request({
url:`portal/static/map/${areaId}.json`, url: `portal/static/map/${areaId}.json`,
method: 'get' method: 'get'
}) })
} }
\ No newline at end of file
...@@ -25,7 +25,7 @@ export default { ...@@ -25,7 +25,7 @@ export default {
}, },
data() { data() {
return { return {
title: 'ELADMIN-后台管理', title: '广西民政决策分析',
logo: Logo logo: Logo
} }
} }
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="login" :style="'background-image:url('+ Background +');'"> <div class="login" :style="'background-image:url('+ Background +');'">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left" label-width="0px" class="login-form"> <el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left" label-width="0px" class="login-form">
<h3 class="title"> <h3 class="title">
EL-ADMIN 后台管理系统 广西民政决策分析
</h3> </h3>
<el-form-item prop="username"> <el-form-item prop="username">
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号"> <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
......
...@@ -12,7 +12,9 @@ ...@@ -12,7 +12,9 @@
<div class="textLefts">收养总数</div> <div class="textLefts">收养总数</div>
<div> <div>
<div class="borderBottom"></div> <div class="borderBottom"></div>
<div class="yellowNum">{{agencyChildStats.adoptChildNum}}</div> <div class="yellowNum">
{{ agencyChildStats.adoptChildNum }}
</div>
<div class="borderTop"></div> <div class="borderTop"></div>
</div> </div>
<div class="text"></div> <div class="text"></div>
...@@ -21,7 +23,7 @@ ...@@ -21,7 +23,7 @@
<div class="textLeft">孤儿</div> <div class="textLeft">孤儿</div>
<div> <div>
<div class="borderBottom"></div> <div class="borderBottom"></div>
<div class="textNum">{{agencyChildStats.orphanNum}}</div> <div class="textNum">{{ agencyChildStats.orphanNum }}</div>
<div class="borderTop"></div> <div class="borderTop"></div>
</div> </div>
<div class="text"></div> <div class="text"></div>
...@@ -30,7 +32,9 @@ ...@@ -30,7 +32,9 @@
<div class="text">事实无人领养</div> <div class="text">事实无人领养</div>
<div> <div>
<div class="borderBottom"></div> <div class="borderBottom"></div>
<div class="textNum">{{agencyChildStats.factUnadoptedNum}}</div> <div class="textNum">
{{ agencyChildStats.factUnadoptedNum }}
</div>
<div class="borderTop"></div> <div class="borderTop"></div>
</div> </div>
<div class="text"></div> <div class="text"></div>
...@@ -52,7 +56,13 @@ ...@@ -52,7 +56,13 @@
<!-- 中 --> <!-- 中 -->
<el-col :span="12"> <el-col :span="12">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24"><div class="wians"></div> </el-col> <el-col :span="24"
><div class="wians">
<div class="title">当前选择:广西全区</div>
<div class="childWelfareMap" id="childWelfareMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div>
</el-col>
</el-row> </el-row>
<br /> <br />
<el-row :gutter="20"> <el-row :gutter="20">
...@@ -71,16 +81,28 @@ ...@@ -71,16 +81,28 @@
<el-col :span="24"> <el-col :span="24">
<div class="wiansInfo"> <div class="wiansInfo">
<div class="title">婚姻统计</div> <div class="title">婚姻统计</div>
<el-input
type="text"
placeholder="身份证或者姓名查询"
class="input"
v-model="value"
@change="inputBtn"
suffix-icon="el-icon-search"
/>
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
style="width: 300px; background-color: #051d3f; color: #2177b9" style="width: 100%; background-color: #051d3f; color: #2177b9"
:header-cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:cell-style="{ background: '#082C61', color: '#DAD7DB' }"
> >
<el-table-column prop="date" label="区域名称" align="center"> <el-table-column type="index" label="序号" align="center">
</el-table-column>
<el-table-column prop="name" label="姓名" align="center">
</el-table-column> </el-table-column>
<el-table-column prop="name" label="结婚总数" align="center"> <el-table-column prop="address" label="身份证" align="center">
</el-table-column> </el-table-column>
<el-table-column prop="address" label="离婚整数" align="center"> <el-table-column prop="address" label="所在福利院" align="center">
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -103,27 +125,20 @@ import { ...@@ -103,27 +125,20 @@ import {
getAgencyChildStatsList, getAgencyChildStatsList,
getAgencyUnderChildStatsList, getAgencyUnderChildStatsList,
getAgencyPercentageStats, getAgencyPercentageStats,
childSearch,
getMapData,
} from "@/api/unified/unified"; } from "@/api/unified/unified";
export default { export default {
data() { data() {
return { return {
tableData: [ num: 0,
{ tableData: [],
date: "2016-05-02",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
},
],
agencyChildStats: {}, agencyChildStats: {},
agencyChildStatsList: {}, agencyChildStatsList: {},
agencyUnderChildStatsList: {}, agencyUnderChildStatsList: {},
agencyPercentageStats:[], agencyPercentageStats: [],
welfareHomeName: [], welfareHomeName: [],
value:""
}; };
}, },
created() { created() {
...@@ -131,24 +146,41 @@ export default { ...@@ -131,24 +146,41 @@ export default {
this.getAgencyChildStatsListFun(); this.getAgencyChildStatsListFun();
this.getAgencyUnderChildStatsListFun(); this.getAgencyUnderChildStatsListFun();
this.getAgencyPercentageStatsFun(); this.getAgencyPercentageStatsFun();
this.getMapData("g450000"); //默认展示广西 g450000
this.childSearchFun()
}, },
methods: { methods: {
getAgencyChildStatsFun() { inputBtn() {
getAgencyChildStats({}).then((res) => { console.log(this.value);
this.childSearchFun();
},
childSearchFun(){
childSearch({
keyword: this.value,
}).then(res =>{
console.log(res,'儿童搜索')
this.tableData = res.data
})
},
getAgencyChildStatsFun(data) {
getAgencyChildStats({ areaCode: data }).then((res) => {
console.log(res, "统计该区域的机构和儿童数量"); console.log(res, "统计该区域的机构和儿童数量");
this.agencyChildStats = res.data; this.agencyChildStats = res.data;
}); });
}, },
getAgencyChildStatsListFun() { getAgencyChildStatsListFun(data) {
getAgencyChildStatsList({}).then((res) => { getAgencyChildStatsList({ areaCode: data }).then((res) => {
console.log(res, "统计该区域的机构和儿童数量统计列表"); console.log(res, "统计该区域的机构和儿童数量统计列表");
this.agencyChildStatsList = res.data; this.agencyChildStatsList = res.data;
this.annualStatisticsFun();
}); });
}, },
getAgencyPercentageStatsFun() { getAgencyPercentageStatsFun(data) {
getAgencyPercentageStats({}).then((res) => { getAgencyPercentageStats({ areaCode: data }).then((res) => {
console.log(res, "获取区域机构占比"); console.log(res, "获取区域机构占比");
this.agencyPercentageStats = res.data; this.agencyPercentageStats = res.data;
res.data.forEach((item) => { res.data.forEach((item) => {
...@@ -159,13 +191,138 @@ export default { ...@@ -159,13 +191,138 @@ export default {
}); });
}, },
getAgencyUnderChildStatsListFun() { getAgencyUnderChildStatsListFun(data) {
getAgencyUnderChildStatsList({}).then((res) => { getAgencyUnderChildStatsList({ areaCode: data }).then((res) => {
console.log(res, "获取福利院下的儿童统计"); console.log(res, "获取福利院下的儿童统计");
this.agencyUnderChildStatsList = res.data; this.agencyUnderChildStatsList = res.data;
}); });
}, },
//获取地图数据
getMapData(areaId) {
getMapData(areaId).then((res) => {
console.log("map", res);
this.childWelfareMap([], res);
});
},
returnInfo() {
this.num = 0;
this.getMapData("g450000");
this.getAgencyChildStatsListFun("450000");
this.getAgencyPercentageStatsFun("450000");
},
/**
* 渲染地图
* dataList 分布数据
* mapList 地图数据
* max 最大值
* min 最小值
*/
childWelfareMap(dataList, mapList, max, min) {
console.log(dataList, mapList);
let map = echarts.init(document.getElementById("childWelfareMap"));
echarts.registerMap("GX", mapList);
map.setOption({
tooltip: {
trigger: "item",
// formatter: '{b}<br/>{c}%(完成数 / 指标数)'
formatter: function (data) {
return `${data.name}`;
},
},
grid: {
left: "3%",
right: "5%",
bottom: "3%",
containLabel: true,
},
// toolbox: {
// show: true,
// orient: "vertical",
// left: "right",
// top: "center",
// feature: {
// dataView: { readOnly: false },
// restore: {},
// saveAsImage: {}
// }
// },
visualMap: {
min: min,
max: max,
show: false,
//text: ["高完成率%", "低完成率%"],
realtime: false,
calculable: true,
inRange: {
color: ["#BDBEC2", "#EEC418", "#E11D27"],
},
textStyle: {
color: "#fff",
},
},
series: [
{
//name: "项目任务完成情况",
type: "map",
mapType: "GX", // 自定义扩展图表类型
itemStyle: {
normal: {
label: { show: true, color: "#fff" },
borderWidth: 1, //区域边框宽度
borderColor: "#fff", //区域边框颜色
areaColor: "#0070BC", //默认区域颜色
},
emphasis: {
show: true,
areaColor: "#3066ba", //鼠标滑过区域颜色
label: {
show: true,
textStyle: {
color: "#fff",
},
},
},
},
textStyle: {
color: "#fff",
},
data: dataList,
},
],
});
if (map._$handlers.click) {
map._$handlers.click.length = 0;
}
map.on("click", (res) => {
this.num++;
console.log(this.num, "点击数字,2不执行");
if (this.num >= 2) {
//不执行
} else {
console.log("点击取值", res);
console.log("地图数组", mapList.features);
console.log("地区下标", res.dataIndex);
console.log("区域信息", mapList.features[res.dataIndex].properties);
console.log(
"区域信息地区码",
mapList.features[res.dataIndex].properties.adcode
);
this.getMapData(
"g" + mapList.features[res.dataIndex].properties.adcode
);
this.getAgencyChildStatsListFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getAgencyPercentageStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
}
});
},
//机构占比 //机构占比
proportionFun() { proportionFun() {
console.log( console.log(
...@@ -409,7 +566,8 @@ export default { ...@@ -409,7 +566,8 @@ export default {
}, },
}, },
}, },
},{ },
{
name: "无人领养", name: "无人领养",
type: "bar", type: "bar",
label: labelOption, label: labelOption,
...@@ -425,7 +583,7 @@ export default { ...@@ -425,7 +583,7 @@ export default {
}, },
}, },
}, },
} },
], ],
}; };
...@@ -464,6 +622,12 @@ export default { ...@@ -464,6 +622,12 @@ export default {
display: flex; display: flex;
} }
.childWelfareMap {
width: 100%;
height: 430px;
background-color: #082c61;
}
.wian { .wian {
width: 100%; width: 100%;
height: 400px; height: 400px;
...@@ -473,7 +637,7 @@ export default { ...@@ -473,7 +637,7 @@ export default {
.wians { .wians {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: blanchedalmond; background-color: #082c61;
} }
.wianss { .wianss {
...@@ -485,7 +649,13 @@ export default { ...@@ -485,7 +649,13 @@ export default {
.wiansInfo { .wiansInfo {
width: 100%; width: 100%;
height: 818px; height: 818px;
background-color: blanchedalmond; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wiansInfo::-webkit-scrollbar {
display: none;
} }
.socialOrganizationFlex { .socialOrganizationFlex {
...@@ -551,4 +721,21 @@ export default { ...@@ -551,4 +721,21 @@ export default {
border: 1px solid #0e62bf; border: 1px solid #0e62bf;
border-top: none; border-top: none;
} }
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
.input {
width: 90%;
background-color: #082c61;
color: #7f8b9d;
margin: 10px 20px;
}
.el-icon-search {
color: #fff;
}
</style> </style>
\ No newline at end of file
...@@ -8,6 +8,15 @@ ...@@ -8,6 +8,15 @@
<el-col :span="24"> <el-col :span="24">
<div class="wian"> <div class="wian">
<div class="title">婚姻统计</div> <div class="title">婚姻统计</div>
<div class="socialOrganizationFlex">
<div class="text"></div>
<div>
<div class="borderBottom"></div>
<div class="yellowNums">123456</div>
<div class="borderTop"></div>
</div>
<div class="text"></div>
</div>
<div id="mainInfo" class="trend"></div> <div id="mainInfo" class="trend"></div>
</div> </div>
</el-col> </el-col>
...@@ -19,14 +28,14 @@ ...@@ -19,14 +28,14 @@
<div class="title">婚姻统计</div> <div class="title">婚姻统计</div>
<div class="marriageStatistics"> <div class="marriageStatistics">
<div class="flexBox"> <div class="flexBox">
<div class="imgBox"></div> <!-- <div class="imgBox"></div> -->
<div> <div>
<div class="marriedNum">结婚总数(对)</div> <div class="marriedNum">结婚总数(对)</div>
<div class="yellowNum">{{ marriageStats.marryNum }}</div> <div class="yellowNum">{{ marriageStats.marryNum }}</div>
</div> </div>
</div> </div>
<div class="flexBox"> <div class="flexBox">
<div class="imgBox"></div> <!-- <div class="imgBox"></div> -->
<div> <div>
<div class="marriedNum">申请离婚(对)</div> <div class="marriedNum">申请离婚(对)</div>
<div class="yellowNum"> <div class="yellowNum">
...@@ -35,14 +44,14 @@ ...@@ -35,14 +44,14 @@
</div> </div>
</div> </div>
<div class="flexBox"> <div class="flexBox">
<div class="imgBox"></div> <!-- <div class="imgBox"></div> -->
<div> <div>
<div class="marriedNum">成功离婚(对)</div> <div class="marriedNum">成功离婚(对)</div>
<div class="yellowNum">{{ marriageStats.divorceNum }}</div> <div class="yellowNum">{{ marriageStats.divorceNum }}</div>
</div> </div>
</div> </div>
<div class="flexBox"> <div class="flexBox">
<div class="imgBox"></div> <!-- <div class="imgBox"></div> -->
<div> <div>
<div class="marriedNum">跨地区结婚/离婚</div> <div class="marriedNum">跨地区结婚/离婚</div>
<div class="yellowNum"> <div class="yellowNum">
...@@ -63,8 +72,8 @@ ...@@ -63,8 +72,8 @@
<el-col :span="24" <el-col :span="24"
><div class="wians"> ><div class="wians">
<div class="title">当前选择:广西全区</div> <div class="title">当前选择:广西全区</div>
<div class="title" @click="returnInfo">返回上一级</div>
<div class="marriageMap" id="marriageMap"></div> <div class="marriageMap" id="marriageMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
...@@ -85,24 +94,49 @@ ...@@ -85,24 +94,49 @@
<el-col :span="24"> <el-col :span="24">
<div class="wiansInfo"> <div class="wiansInfo">
<div class="title">婚姻统计</div> <div class="title">婚姻统计</div>
<el-input
type="text"
placeholder="身份证或者姓名查询"
class="input"
v-model="value"
@change="inputBtn"
suffix-icon="el-icon-search"
/>
<!-- <i class="el-icon-search" @click="marriageSearchFun"></i> -->
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
height="0" style="width: 100%; background-color: #051d3f; color: #2177b9"
:row-style="{ height: '10px' }" :header-cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:cell-style="{ height: '10px' }" :cell-style="{ background: '#082C61', color: '#DAD7DB' }"
style="width: 300px"
> >
<el-table-column prop="date" label="序号" align="center"> <el-table-column
type="index"
label="序号"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
<el-table-column prop="name" label="名称" align="center"> <el-table-column
prop="manName"
label="名称"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
<el-table-column prop="address" label="所在地" align="center"> <el-table-column
prop="manDomicile"
label="所在地"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="address" label="婚姻状况" align="center"> <el-table-column prop="address" label="婚姻状况" align="center">
</el-table-column> </el-table-column>
<el-table-column prop="address" label="时间" align="center"> <el-table-column
prop="registerDate"
label="时间"
align="center"
>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -124,27 +158,18 @@ import { ...@@ -124,27 +158,18 @@ import {
getFivesYearMarriageLine, getFivesYearMarriageLine,
getMarriageStats, getMarriageStats,
getAreaUnderMarriageStatsList, getAreaUnderMarriageStatsList,
marriageSearch,
getMapData, getMapData,
} from "@/api/unified/unified"; } from "@/api/unified/unified";
export default { export default {
data() { data() {
return { return {
num: 0, num: 0,
tableData: [ tableData: [],
{
date: "1",
name: "王小虎",
address: "1518",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
],
marriageLine: {}, marriageLine: {},
marriageStats: {}, marriageStats: {},
areaUnderMarriageStatsList: {}, areaUnderMarriageStatsList: {},
value: "",
}; };
}, },
created() { created() {
...@@ -152,8 +177,23 @@ export default { ...@@ -152,8 +177,23 @@ export default {
this.getMarriageStatsFun(); this.getMarriageStatsFun();
this.getAreaUnderMarriageStatsListFun(); this.getAreaUnderMarriageStatsListFun();
this.getMapData("g450000"); //默认展示广西 g450000 this.getMapData("g450000"); //默认展示广西 g450000
this.marriageSearchFun();
}, },
methods: { methods: {
inputBtn() {
console.log(this.value);
this.marriageSearchFun();
},
marriageSearchFun() {
marriageSearch({
keyword: this.value,
}).then((res) => {
console.log(res, "搜索");
this.tableData = res.data;
});
},
getFivesYearMarriageLineFun(data) { getFivesYearMarriageLineFun(data) {
getFivesYearMarriageLine({ getFivesYearMarriageLine({
areaCode: data, areaCode: data,
...@@ -332,7 +372,7 @@ export default { ...@@ -332,7 +372,7 @@ export default {
trigger: "axis", trigger: "axis",
}, },
legend: { legend: {
top: "3%", top: "2%",
data: ["结婚", "离婚"], data: ["结婚", "离婚"],
}, },
grid: { grid: {
...@@ -640,7 +680,7 @@ export default { ...@@ -640,7 +680,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.trend { .trend {
width: 100%; width: 100%;
height: 350px; height: 280px;
} }
.annualStatistics { .annualStatistics {
margin-top: 10px; margin-top: 10px;
...@@ -684,7 +724,7 @@ export default { ...@@ -684,7 +724,7 @@ export default {
.marriageMap { .marriageMap {
width: 100%; width: 100%;
height: 500px; height: 430px;
background-color: #082c61; background-color: #082c61;
} }
...@@ -697,7 +737,7 @@ export default { ...@@ -697,7 +737,7 @@ export default {
.wians { .wians {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: blanchedalmond; background-color: #082c61;
} }
.wianss { .wianss {
...@@ -709,6 +749,63 @@ export default { ...@@ -709,6 +749,63 @@ export default {
.wiansInfo { .wiansInfo {
width: 100%; width: 100%;
height: 818px; height: 818px;
background-color: blanchedalmond; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wiansInfo::-webkit-scrollbar {
display: none;
}
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
.input {
width: 90%;
background-color: #082c61;
color: #7f8b9d;
margin: 10px 20px;
}
.el-icon-search {
color: #fff;
}
.socialOrganizationFlex {
display: flex;
margin-top: 20px;
margin-left: 60px;
}
.text {
font-size: 12px;
color: #0e62bf;
margin-top: 16px;
}
.yellowNums {
width: 180px;
font-size: 24px;
text-align: center;
color: #ffff20;
font-weight: bold;
}
.borderBottom {
width: 100%;
height: 12px;
border: 1px solid #0e62bf;
border-bottom: none;
}
.borderTop {
width: 100%;
height: 12px;
border: 1px solid #0e62bf;
border-top: none;
} }
</style> </style>
\ No newline at end of file
...@@ -32,8 +32,8 @@ ...@@ -32,8 +32,8 @@
<el-col :span="16"> <el-col :span="16">
<div class="wians"> <div class="wians">
<div class="title">当前选择:广西全区</div> <div class="title">当前选择:广西全区</div>
<div class="title" @click="returnInfo">返回上一级</div>
<div class="mechanismMap" id="mechanismMap"></div> <div class="mechanismMap" id="mechanismMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div> </div>
</el-col> </el-col>
...@@ -45,16 +45,18 @@ ...@@ -45,16 +45,18 @@
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
height="400" style="width: 100%; background-color: #051d3f; color: #2177b9"
:header-cell-style="{ background: '#042465', color: '#fff' }" :header-cell-style="{
:cell-style="{ background: '#022872', color: '#fff' }" background: '#082C61',
style="width: 300px; margib-left: 10px" color: '#DAD7DB',
}"
:cell-style="{ background: '#082C61', color: '#DAD7DB' }"
> >
<el-table-column prop="date" label="排名" align="center"> <el-table-column type="index" label="排名" align="center">
</el-table-column> </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>
<el-table-column prop="address" label="数量" align="center"> <el-table-column prop="num" label="数量" align="center">
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -117,69 +119,7 @@ export default { ...@@ -117,69 +119,7 @@ export default {
data() { data() {
return { return {
num: 0, num: 0,
tableData: [ tableData: [],
{
date: "1",
name: "王小虎",
address: "1518",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
{
date: "2",
name: "王小虎",
address: "1517",
},
],
soorganStats: {}, soorganStats: {},
areaUnderSoorganStatsList: {}, areaUnderSoorganStatsList: {},
areaNursingStatsList: {}, areaNursingStatsList: {},
...@@ -220,6 +160,7 @@ export default { ...@@ -220,6 +160,7 @@ export default {
}).then((res) => { }).then((res) => {
console.log(res, "获取区域养老院统计列表"); console.log(res, "获取区域养老院统计列表");
this.areaNursingStatsList = res.data; this.areaNursingStatsList = res.data;
this.tableData = res.data.statsLst;
this.pensionFun(); this.pensionFun();
}); });
}, },
...@@ -817,7 +758,7 @@ export default { ...@@ -817,7 +758,7 @@ export default {
.mechanismMap { .mechanismMap {
width: 100%; width: 100%;
height: 500px; height: 430px;
background-color: #082c61; background-color: #082c61;
} }
...@@ -835,6 +776,12 @@ export default { ...@@ -835,6 +776,12 @@ export default {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: #082c61; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wians::-webkit-scrollbar {
display: none;
} }
.wianss { .wianss {
...@@ -848,4 +795,10 @@ export default { ...@@ -848,4 +795,10 @@ export default {
height: 818px; height: 818px;
background-color: #082c61; background-color: #082c61;
} }
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
</style> </style>
\ No newline at end of file
...@@ -12,11 +12,11 @@ ...@@ -12,11 +12,11 @@
<el-col :span="12"> <el-col :span="12">
<el-row> <el-row>
<el-col :span="6" :offset="2"> <el-col :span="6" :offset="2">
<div class="marriageImg"></div> <!-- <div class="marriageImg"></div> -->
</el-col> </el-col>
<el-col :span="16"> <el-col :span="16">
<div class="marriageNum"> <div class="marriageNum">
<div class="size16">结婚总数</div> <div class="size16">结婚总数(对)</div>
<div class="size16">{{ marriageStats.marryNum }}</div> <div class="size16">{{ marriageStats.marryNum }}</div>
</div> </div>
</el-col> </el-col>
...@@ -25,13 +25,13 @@ ...@@ -25,13 +25,13 @@
<el-col :span="12"> <el-col :span="12">
<el-row justify="center"> <el-row justify="center">
<el-col :span="6"> <el-col :span="6">
<div class="marriageImg"></div> <!-- <div class="marriageImg"></div> -->
</el-col> </el-col>
<el-col :span="18"> <el-col :span="18">
<div class="marriageNum"> <div class="marriageNum">
<div class="size16">结婚总数</div> <div class="size16">离婚总数(对)</div>
<div class="size16"> <div class="size16">
{{ marriageStats.inDivorceNum }} {{ marriageStats.divorceNum }}
</div> </div>
</div> </div>
</el-col> </el-col>
...@@ -74,8 +74,8 @@ ...@@ -74,8 +74,8 @@
<el-col :span="24" <el-col :span="24"
><div class="wians"> ><div class="wians">
<div class="title">当前选择:广西全区</div> <div class="title">当前选择:广西全区</div>
<div class="title" @click="returnInfo">返回上一级</div>
<div class="populationMap" id="populationMap"></div> <div class="populationMap" id="populationMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
...@@ -1005,7 +1005,7 @@ export default { ...@@ -1005,7 +1005,7 @@ export default {
.populationMap { .populationMap {
width: 100%; width: 100%;
height: 500px; height: 430px;
background-color: #082c61; background-color: #082c61;
} }
...@@ -1032,4 +1032,10 @@ export default { ...@@ -1032,4 +1032,10 @@ export default {
height: 818px; height: 818px;
background-color: #082c61; background-color: #082c61;
} }
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
</style> </style>
\ No newline at end of file
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<div class="text">火化总数</div> <div class="text">火化总数</div>
<div> <div>
<div class="borderBottom"></div> <div class="borderBottom"></div>
<div class="textNum">{{cremationStats.cremationSum}}</div> <div class="textNum">{{ cremationStats.cremationSum }}</div>
<div class="borderTop"></div> <div class="borderTop"></div>
</div> </div>
<div class="text"></div> <div class="text"></div>
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<div class="texts">火化率</div> <div class="texts">火化率</div>
<div> <div>
<div class="borderBottom"></div> <div class="borderBottom"></div>
<div class="textNums">{{cremationStats.cremationRate}}</div> <div class="textNums">{{ cremationStats.cremationRate }}</div>
<div class="borderTop"></div> <div class="borderTop"></div>
</div> </div>
<div class="text">%</div> <div class="text">%</div>
...@@ -43,7 +43,13 @@ ...@@ -43,7 +43,13 @@
<!-- 中 --> <!-- 中 -->
<el-col :span="12"> <el-col :span="12">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24"><div class="wians"></div> </el-col> <el-col :span="24"
><div class="wians">
<div class="title">当前选择:广西全区</div>
<div class="provideMap" id="provideMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div>
</el-col>
</el-row> </el-row>
<br /> <br />
<el-row :gutter="20"> <el-row :gutter="20">
...@@ -62,27 +68,47 @@ ...@@ -62,27 +68,47 @@
<el-col :span="24"> <el-col :span="24">
<div class="wiansInfo"> <div class="wiansInfo">
<div class="title">火化信息查询</div> <div class="title">火化信息查询</div>
<el-input
type="text"
placeholder="身份证或者姓名查询"
class="input"
v-model="value"
@change="inputBtn"
suffix-icon="el-icon-search"
/>
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
style="width: 100%; background-color: #082C61; color: #2177b9" style="width: 100%; background-color: #082c61; color: #2177b9"
fit fit
:header-cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:cell-style="{ background: '#082C61', color: '#DAD7DB' }"
> >
<el-table-column prop="date" label="序号" align="center" width="50px"> <el-table-column
type="index"
label="序号"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
<el-table-column prop="name" label="姓名" align="center"> <el-table-column prop="siName" label="姓名" align="center" width="60px">
</el-table-column> </el-table-column>
<el-table-column <!-- <el-table-column
prop="address" prop="siDeathDate"
label="所在地" label="所在地"
align="center" align="center"
></el-table-column> ></el-table-column> -->
<el-table-column <el-table-column
prop="address" prop="organName"
label="殡仪馆" label="殡仪馆"
align="center" align="center"
></el-table-column> ></el-table-column>
<el-table-column prop="dates" label="时间" align="center" width="50px"> <el-table-column
prop="siCremationTime"
label="时间"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -100,39 +126,199 @@ ...@@ -100,39 +126,199 @@
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { getCremationStats } from "@/api/unified/unified"; import {
getCremationStats,
getCremationStatsList,
getCremationRateStats,
cremationSearch,
getMapData,
} from "@/api/unified/unified";
export default { export default {
data() { data() {
return { return {
tableData: [ num: 0,
{ tableData: [],
date: "1", value: "",
name: "王小虎", cremationStats: {},
address: "上海市普陀区金沙江路 1518 弄", cremationRateStats: {},
dates:"2020-12-2" cremationStatsList: {},
},
{
date: "2",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
dates:"2020-12-2"
},
],
cremationStats:{}
}; };
}, },
created() { created() {
this.getCremationStatsFun() this.getCremationStatsFun();
this.getCremationRateStatsFun();
this.getCremationStatsListFun();
this.getMapData("g450000"); //默认展示广西 g450000
this.cremationSearchFun()
}, },
methods: { methods: {
getCremationStatsFun(){ inputBtn() {
getCremationStats({}).then(res =>{ console.log(this.value);
console.log(res,'统计该区域的殡葬火化量') this.cremationSearchFun();
this.cremationStats = res.data },
})
cremationSearchFun() {
cremationSearch({
keyword: this.values,
}).then((res) => {
console.log(res, "殡葬搜索");
this.tableData = res.data;
});
},
getCremationStatsFun(data) {
getCremationStats({ areaCode: data }).then((res) => {
console.log(res, "统计该区域的殡葬火化量");
this.cremationStats = res.data;
});
}, },
//机构占比 getCremationRateStatsFun(data) {
getCremationRateStats({ areaCode: data }).then((res) => {
console.log(res, "区域火化率");
this.cremationRateStats = res.data;
this.proportionFun();
});
},
getCremationStatsListFun(data) {
getCremationStatsList({ areaCode: data }).then((res) => {
console.log(res, "获取区域殡葬火化分析列表");
this.cremationStatsList = res.data;
this.annualStatisticsFun();
});
},
//获取地图数据
getMapData(areaId) {
getMapData(areaId).then((res) => {
console.log("map", res);
this.provideMap([], res);
});
},
returnInfo() {
this.num = 0;
this.getMapData("g450000");
this.getCremationStatsFun("450000");
this.getCremationRateStatsFun("450000");
this.getCremationStatsListFun("450000");
},
/**
* 渲染地图
* dataList 分布数据
* mapList 地图数据
* max 最大值
* min 最小值
*/
provideMap(dataList, mapList, max, min) {
console.log(dataList, mapList);
let map = echarts.init(document.getElementById("provideMap"));
echarts.registerMap("GX", mapList);
map.setOption({
tooltip: {
trigger: "item",
// formatter: '{b}<br/>{c}%(完成数 / 指标数)'
formatter: function (data) {
return `${data.name}`;
},
},
grid: {
left: "3%",
right: "5%",
bottom: "3%",
containLabel: true,
},
// toolbox: {
// show: true,
// orient: "vertical",
// left: "right",
// top: "center",
// feature: {
// dataView: { readOnly: false },
// restore: {},
// saveAsImage: {}
// }
// },
visualMap: {
min: min,
max: max,
show: false,
//text: ["高完成率%", "低完成率%"],
realtime: false,
calculable: true,
inRange: {
color: ["#BDBEC2", "#EEC418", "#E11D27"],
},
textStyle: {
color: "#fff",
},
},
series: [
{
//name: "项目任务完成情况",
type: "map",
mapType: "GX", // 自定义扩展图表类型
itemStyle: {
normal: {
label: { show: true, color: "#fff" },
borderWidth: 1, //区域边框宽度
borderColor: "#fff", //区域边框颜色
areaColor: "#0070BC", //默认区域颜色
},
emphasis: {
show: true,
areaColor: "#3066ba", //鼠标滑过区域颜色
label: {
show: true,
textStyle: {
color: "#fff",
},
},
},
},
textStyle: {
color: "#fff",
},
data: dataList,
},
],
});
if (map._$handlers.click) {
map._$handlers.click.length = 0;
}
map.on("click", (res) => {
this.num++;
console.log(this.num, "点击数字,2不执行");
if (this.num >= 2) {
//不执行
} else {
console.log("点击取值", res);
console.log("地图数组", mapList.features);
console.log("地区下标", res.dataIndex);
console.log("区域信息", mapList.features[res.dataIndex].properties);
console.log(
"区域信息地区码",
mapList.features[res.dataIndex].properties.adcode
);
this.getMapData(
"g" + mapList.features[res.dataIndex].properties.adcode
);
this.getCremationStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getCremationRateStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getCremationStatsListFun(
mapList.features[res.dataIndex].properties.adcode
);
}
});
},
//区域火化率
proportionFun() { proportionFun() {
var chartDom = document.getElementById("proportion"); var chartDom = document.getElementById("proportion");
var myChart = echarts.init(chartDom, "dark"); var myChart = echarts.init(chartDom, "dark");
...@@ -174,6 +360,7 @@ export default { ...@@ -174,6 +360,7 @@ export default {
option && myChart.setOption(option); option && myChart.setOption(option);
}, },
//获取区域殡葬火化分析列表
annualStatisticsFun() { annualStatisticsFun() {
var chartDom = document.getElementById("annualStatistics"); var chartDom = document.getElementById("annualStatistics");
var myChart = echarts.init(chartDom, "dark"); var myChart = echarts.init(chartDom, "dark");
...@@ -284,7 +471,7 @@ export default { ...@@ -284,7 +471,7 @@ export default {
}, },
}, },
legend: { legend: {
data: ["Forest", "Steppe", "Desert", "Wetland"], data: ["火化量", "火化率"],
}, },
toolbox: { toolbox: {
show: true, show: true,
...@@ -296,7 +483,7 @@ export default { ...@@ -296,7 +483,7 @@ export default {
{ {
type: "category", type: "category",
axisTick: { show: false }, axisTick: { show: false },
data: ["2012", "2013", "2014", "2015", "2016"], data: this.cremationStatsList.cityList,
axisLabel: { axisLabel: {
textStyle: { textStyle: {
color: "#FFFFFF", color: "#FFFFFF",
...@@ -342,36 +529,36 @@ export default { ...@@ -342,36 +529,36 @@ export default {
], ],
series: [ series: [
{ {
name: "Forest", name: "火化量",
type: "bar", type: "bar",
barGap: 0, barGap: 0,
label: labelOption, label: labelOption,
emphasis: { emphasis: {
focus: "series", focus: "series",
}, },
data: [320, 332, 301, 334, 390], data: this.cremationStatsList.numList,
itemStyle: { itemStyle: {
normal: { normal: {
color: "#3167ff", color: "#5470C6",
lineStyle: { lineStyle: {
color: "#3167ff", color: "#5470C6",
}, },
}, },
}, },
}, },
{ {
name: "Steppe", name: "火化率",
type: "bar", type: "bar",
label: labelOption, label: labelOption,
emphasis: { emphasis: {
focus: "series", focus: "series",
}, },
data: [220, 182, 191, 234, 290], data: this.cremationStatsList.numList,
itemStyle: { itemStyle: {
normal: { normal: {
color: "#ff4444", color: "#91CC75",
lineStyle: { lineStyle: {
color: "#ff4444", color: "#91CC75",
}, },
}, },
}, },
...@@ -465,6 +652,12 @@ export default { ...@@ -465,6 +652,12 @@ export default {
display: flex; display: flex;
} }
.provideMap {
width: 100%;
height: 430px;
background-color: #082c61;
}
.wian { .wian {
width: 100%; width: 100%;
height: 400px; height: 400px;
...@@ -474,7 +667,7 @@ export default { ...@@ -474,7 +667,7 @@ export default {
.wians { .wians {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: blanchedalmond; background-color: #082c61;
} }
.wianss { .wianss {
...@@ -486,6 +679,25 @@ export default { ...@@ -486,6 +679,25 @@ export default {
.wiansInfo { .wiansInfo {
width: 100%; width: 100%;
height: 818px; height: 818px;
background-color: blanchedalmond; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wiansInfo::-webkit-scrollbar {
display: none;
}
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
.input {
width: 90%;
background-color: #082c61;
color: #7f8b9d;
margin: 10px 20px;
} }
</style> </style>
\ No newline at end of file
...@@ -78,8 +78,8 @@ ...@@ -78,8 +78,8 @@
<el-col :span="24" <el-col :span="24"
><div class="wians"> ><div class="wians">
<div class="title">当前选择:广西全区</div> <div class="title">当前选择:广西全区</div>
<div class="title" @click="returnInfo">返回上一级</div>
<div class="socialAssistanceMap" id="socialAssistanceMap"></div> <div class="socialAssistanceMap" id="socialAssistanceMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
...@@ -99,17 +99,59 @@ ...@@ -99,17 +99,59 @@
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24"> <el-col :span="24">
<div class="wiansInfo"> <div class="wiansInfo">
<div class="title">婚姻统计</div> <div class="title">低保对象查询</div>
<el-input
type="text"
placeholder="身份证或者姓名查询"
class="input"
v-model="values"
@change="inputBtn"
suffix-icon="el-icon-search"
/>
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
style="width: 300px; background-color: #051d3f; color: #2177b9" style="width: 100%; background-color: #051d3f; color: #2177b9"
:header-cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:row-style="rowStyle"
> >
<el-table-column prop="date" label="区域名称" align="center"> <el-table-column
type="index"
label="序号"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
<el-table-column prop="name" label="结婚总数" align="center"> <el-table-column
prop="name"
label="姓名"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
<el-table-column prop="address" label="离婚整数" align="center"> <el-table-column prop="address" label="所在地" align="center" >
</el-table-column>
<!-- <el-table-column
prop="name"
label="类型"
align="center"
width="50px"
>
</el-table-column>
<el-table-column
prop="name"
label="金额"
align="center"
width="50px"
>
</el-table-column> -->
<el-table-column
prop="createTime"
label="时间"
align="center"
width="70px"
>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -132,24 +174,15 @@ import { ...@@ -132,24 +174,15 @@ import {
getThreeYearShjzProvideStats, getThreeYearShjzProvideStats,
getFivesYearShjzAchieveStats, getFivesYearShjzAchieveStats,
getAreaYearShjzAchieveStats, getAreaYearShjzAchieveStats,
lowIncomeSearch,
getMapData, getMapData,
} from "@/api/unified/unified"; } from "@/api/unified/unified";
export default { export default {
data() { data() {
return { return {
num: 0, num: 0,
tableData: [ tableData: [],
{ values: "",
date: "2016-05-02",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
},
],
fivesYearShjzAchieveStats: {}, fivesYearShjzAchieveStats: {},
threeYearShjzProvideStats: {}, threeYearShjzProvideStats: {},
fivesYearShjzAchieveStats: {}, fivesYearShjzAchieveStats: {},
...@@ -157,6 +190,7 @@ export default { ...@@ -157,6 +190,7 @@ export default {
cityNames: [], cityNames: [],
cityAndvillagePeople: {}, // 五年享受低保资金人数 cityAndvillagePeople: {}, // 五年享受低保资金人数
cityAndvillageNum: {}, // 五年享受低保资金总数 cityAndvillageNum: {}, // 五年享受低保资金总数
value: {},
}; };
}, },
created() { created() {
...@@ -165,8 +199,31 @@ export default { ...@@ -165,8 +199,31 @@ export default {
this.getFivesYearShjzAchieveStatsFun(); this.getFivesYearShjzAchieveStatsFun();
this.getAreaYearShjzAchieveStatsFun(); this.getAreaYearShjzAchieveStatsFun();
this.getMapData("g450000"); //默认展示广西 g450000 this.getMapData("g450000"); //默认展示广西 g450000
this.lowIncomeSearchFun();
}, },
methods: { methods: {
rowStyle({ row, rowsIndex }) {
if (row) {
return {
backgroundColor: "#134880",
};
}
},
inputBtn() {
console.log(this.value);
this.lowIncomeSearchFun();
},
lowIncomeSearchFun() {
lowIncomeSearch({
keyword: this.values,
}).then((res) => {
console.log(res, "低保对象搜索");
this.tableData = res.data;
});
},
getThreeYearShjzAchieveStatsFun(data) { getThreeYearShjzAchieveStatsFun(data) {
getThreeYearShjzAchieveStats({ getThreeYearShjzAchieveStats({
areaCode: data, areaCode: data,
...@@ -811,32 +868,38 @@ export default { ...@@ -811,32 +868,38 @@ export default {
.socialAssistanceMap { .socialAssistanceMap {
width: 100%; width: 100%;
height: 500px; height: 430px;
background-color: #082c61; background-color: #082c61;
} }
.wian { .wian {
width: 100%; width: 100%;
height: 416px; height: 415px;
background-color: #082c61; background-color: #082c61;
} }
.wians { .wians {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: blanchedalmond; background-color: #082c61;
} }
.wianss { .wianss {
width: 100%; width: 100%;
height: 300px; height: 330px;
background-color: #082c61; background-color: #082c61;
} }
.wiansInfo { .wiansInfo {
width: 100%; width: 100%;
height: 848px; height: 848px;
background-color: blanchedalmond; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wiansInfo::-webkit-scrollbar {
display: none;
} }
.display { .display {
...@@ -888,4 +951,32 @@ export default { ...@@ -888,4 +951,32 @@ export default {
width: 100%; width: 100%;
height: 300px; height: 300px;
} }
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
.search {
width: 90%;
height: 30px;
border-radius: 6px;
border: 1px solid #7f8b9d;
display: flex;
justify-content: space-around;
align-items: center;
margin: 10px 20px;
}
.input {
width: 90%;
background-color: #082c61;
color: #7f8b9d;
margin: 10px 20px;
}
.el-icon-search {
color: #fff;
}
</style> </style>
\ No newline at end of file
...@@ -61,7 +61,16 @@ ...@@ -61,7 +61,16 @@
<!-- 中 --> <!-- 中 -->
<el-col :span="12"> <el-col :span="12">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24"><div class="wians"></div> </el-col> <el-col :span="24"
><div class="wians">
<div class="title">当前选择:广西全区</div>
<div
class="socialOrganizationMap"
id="socialOrganizationMap"
></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div>
</el-col>
</el-row> </el-row>
<br /> <br />
<el-row :gutter="20"> <el-row :gutter="20">
...@@ -110,17 +119,27 @@ ...@@ -110,17 +119,27 @@
<el-col :span="24"> <el-col :span="24">
<div class="wiansInfo"> <div class="wiansInfo">
<div class="title">婚姻统计</div> <div class="title">婚姻统计</div>
<el-input
type="text"
placeholder="请输入组织代码或名称查询"
class="input"
v-model="value"
@change="inputBtn"
suffix-icon="el-icon-search"
/>
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
style="width: 100%; background-color: #051d3f; color: #2177b9" style="width: 100%; background-color: #051d3f; color: #2177b9"
:header-cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:cell-style="{ background: '#082C61', color: '#DAD7DB' }"
> >
<el-table-column prop="date" label="序号" align="center"> <el-table-column type="index" label="序号" align="center">
</el-table-column> </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>
<el-table-column <el-table-column
prop="address" prop="regno"
label="组织名称/代码" label="组织名称/代码"
align="center" align="center"
> >
...@@ -145,57 +164,197 @@ import { ...@@ -145,57 +164,197 @@ import {
getSoorganStats, getSoorganStats,
getSoorganPercentageStats, getSoorganPercentageStats,
getAreaUnderSoorganStatsList, getAreaUnderSoorganStatsList,
soorganSearch,
getMapData,
} from "@/api/unified/unified"; } from "@/api/unified/unified";
export default { export default {
data() { data() {
return { return {
tableData: [ num: 0,
{ tableData: [],
date: "2016-05-02",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
},
],
soorganStats: {}, soorganStats: {},
SoorganPercentageStats: [], SoorganPercentageStats: [],
placeNames: [], placeNames: [],
soorganStats: {}, soorganStats: {},
areaUnderSoorganStatsList: {}, areaUnderSoorganStatsList: {},
value: "",
}; };
}, },
created() { created() {
this.getSoorganStatsFun(); this.getSoorganStatsFun();
this.getSoorganPercentageStatsFun(); this.getSoorganPercentageStatsFun();
this.getAreaUnderSoorganStatsListFun(); this.getAreaUnderSoorganStatsListFun();
this.getMapData("g450000"); //默认展示广西 g450000
this.soorganSearchFun()
}, },
methods: { methods: {
getSoorganStatsFun() { inputBtn() {
getSoorganStats({}).then((res) => { console.log(this.value);
this.soorganSearchFun();
},
soorganSearchFun() {
soorganSearch({
keyword: this.value,
}).then((res) => {
console.log(res, "社会组织搜索");
this.tableData = res.data;
});
},
getSoorganStatsFun(data) {
getSoorganStats({ areaCode: data }).then((res) => {
console.log(res, "获取社会机构统计"); console.log(res, "获取社会机构统计");
this.soorganStats = res.data; this.soorganStats = res.data;
}); });
}, },
getSoorganPercentageStatsFun() { getSoorganPercentageStatsFun(data) {
getSoorganPercentageStats({}).then((res) => { getSoorganPercentageStats({ areaCode: data }).then((res) => {
console.log(res.data, "获取社会机构区域占比统计"); console.log(res.data, "获取社会机构区域占比统计");
this.SoorganPercentageStats = res.data; this.SoorganPercentageStats = res.data;
res.data.forEach((item) => { res.data.forEach((item) => {
this.placeNames.push(item.name); this.placeNames.push(item.name);
}); });
console.log(this.placeNames); console.log(this.placeNames);
this.proportionFun();
}); });
}, },
getAreaUnderSoorganStatsListFun() { getAreaUnderSoorganStatsListFun(data) {
getAreaUnderSoorganStatsList({}).then((res) => { getAreaUnderSoorganStatsList({ areaCode: data }).then((res) => {
console.log(res, "获取地区下面社会机构统计列表"); console.log(res, "获取地区下面社会机构统计列表");
this.areaUnderSoorganStatsList = res.data; this.areaUnderSoorganStatsList = res.data;
this.annualStatisticsFun();
});
},
//获取地图数据
getMapData(areaId) {
getMapData(areaId).then((res) => {
console.log("map", res);
this.socialOrganizationMap([], res);
});
},
returnInfo() {
this.num = 0;
this.getMapData("g450000");
this.getSoorganStatsFun("450000");
this.getSoorganPercentageStatsFun("450000");
this.getAreaUnderSoorganStatsListFun("450000");
},
/**
* 渲染地图
* dataList 分布数据
* mapList 地图数据
* max 最大值
* min 最小值
*/
socialOrganizationMap(dataList, mapList, max, min) {
console.log(dataList, mapList);
let map = echarts.init(document.getElementById("socialOrganizationMap"));
echarts.registerMap("GX", mapList);
map.setOption({
tooltip: {
trigger: "item",
// formatter: '{b}<br/>{c}%(完成数 / 指标数)'
formatter: function (data) {
return `${data.name}`;
},
},
grid: {
left: "3%",
right: "5%",
bottom: "3%",
containLabel: true,
},
// toolbox: {
// show: true,
// orient: "vertical",
// left: "right",
// top: "center",
// feature: {
// dataView: { readOnly: false },
// restore: {},
// saveAsImage: {}
// }
// },
visualMap: {
min: min,
max: max,
show: false,
//text: ["高完成率%", "低完成率%"],
realtime: false,
calculable: true,
inRange: {
color: ["#BDBEC2", "#EEC418", "#E11D27"],
},
textStyle: {
color: "#fff",
},
},
series: [
{
//name: "项目任务完成情况",
type: "map",
mapType: "GX", // 自定义扩展图表类型
itemStyle: {
normal: {
label: { show: true, color: "#fff" },
borderWidth: 1, //区域边框宽度
borderColor: "#fff", //区域边框颜色
areaColor: "#0070BC", //默认区域颜色
},
emphasis: {
show: true,
areaColor: "#3066ba", //鼠标滑过区域颜色
label: {
show: true,
textStyle: {
color: "#fff",
},
},
},
},
textStyle: {
color: "#fff",
},
data: dataList,
},
],
});
if (map._$handlers.click) {
map._$handlers.click.length = 0;
}
map.on("click", (res) => {
this.num++;
console.log(this.num, "点击数字,2不执行");
if (this.num >= 2) {
//不执行
} else {
console.log("点击取值", res);
console.log("地图数组", mapList.features);
console.log("地区下标", res.dataIndex);
console.log("区域信息", mapList.features[res.dataIndex].properties);
console.log(
"区域信息地区码",
mapList.features[res.dataIndex].properties.adcode
);
this.getMapData(
"g" + mapList.features[res.dataIndex].properties.adcode
);
this.getSoorganStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getSoorganPercentageStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getAreaUnderSoorganStatsListFun(
mapList.features[res.dataIndex].properties.adcode
);
}
}); });
}, },
...@@ -576,6 +735,12 @@ export default { ...@@ -576,6 +735,12 @@ export default {
display: flex; display: flex;
} }
.socialOrganizationMap {
width: 100%;
height: 430px;
background-color: #082c61;
}
.wian { .wian {
width: 100%; width: 100%;
height: 400px; height: 400px;
...@@ -585,7 +750,7 @@ export default { ...@@ -585,7 +750,7 @@ export default {
.wians { .wians {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: blanchedalmond; background-color: #082c61;
} }
.wianss { .wianss {
...@@ -597,6 +762,29 @@ export default { ...@@ -597,6 +762,29 @@ export default {
.wiansInfo { .wiansInfo {
width: 100%; width: 100%;
height: 818px; height: 818px;
background-color: blanchedalmond; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wiansInfo::-webkit-scrollbar {
display: none;
}
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
.input {
width: 90%;
background-color: #082c61;
color: #7f8b9d;
margin: 10px 20px;
}
.el-icon-search {
color: #fff;
} }
</style> </style>
\ No newline at end of file
...@@ -11,14 +11,16 @@ ...@@ -11,14 +11,16 @@
<div class="display"> <div class="display">
<div> <div>
<div class="flex"> <div class="flex">
<div class="num">2020</div> <div class="num">
{{ poorDisabledNum.difficultTotalNum }}
</div>
<div class="text"></div> <div class="text"></div>
</div> </div>
<div class="rural">贫困残疾人</div> <div class="rural">贫困残疾人</div>
</div> </div>
<div> <div>
<div class="flex"> <div class="flex">
<div class="nums">2020</div> <div class="nums">{{ poorDisabledNum.severeTotalNum }}</div>
<div class="texts"></div> <div class="texts"></div>
</div> </div>
<div class="city">重度残疾人</div> <div class="city">重度残疾人</div>
...@@ -34,9 +36,13 @@ ...@@ -34,9 +36,13 @@
<el-col :span="24"> <el-col :span="24">
<div class="wian"> <div class="wian">
<div class="title">残疾人比例</div> <div class="title">残疾人比例</div>
<div class="subsidiesBox" v-for="(item,index) in disabledLevelStats" :key="index"> <div
<div class="subsidiesText">{{item.level}}</div> class="subsidiesBox"
<div class="subsidiesText">{{item.num}}</div> v-for="(item, index) in disabledLevelStats"
:key="index"
>
<div class="subsidiesText">{{ item.level }}</div>
<div class="subsidiesText">{{ item.num }}</div>
<div class="subsidiesText">贫困18%</div> <div class="subsidiesText">贫困18%</div>
</div> </div>
</div> </div>
...@@ -55,7 +61,13 @@ ...@@ -55,7 +61,13 @@
<!-- 中 --> <!-- 中 -->
<el-col :span="12"> <el-col :span="12">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24"><div class="wians"></div> </el-col> <el-col :span="24"
><div class="wians">
<div class="title">当前选择:广西全区</div>
<div class="subsidiesMap" id="subsidiesMap"></div>
<a class="returnInfos" @click="returnInfo">返回上一级</a>
</div>
</el-col>
</el-row> </el-row>
<br /> <br />
<el-row :gutter="20"> <el-row :gutter="20">
...@@ -74,21 +86,40 @@ ...@@ -74,21 +86,40 @@
<el-col :span="24"> <el-col :span="24">
<div class="wiansInfo"> <div class="wiansInfo">
<div class="title">婚姻统计</div> <div class="title">婚姻统计</div>
<el-input
type="text"
placeholder="身份证或者姓名查询"
class="input"
v-model="value"
@change="inputBtn"
suffix-icon="el-icon-search"
/>
<el-table <el-table
:data="tableData" :data="tableData"
stripe stripe
style="width: 100%; background-color: #051d3f; color: #2177b9" style="width: 100%; background-color: #051d3f; color: #2177b9"
:header-cell-style="{ background: '#082C61', color: '#DAD7DB' }"
:cell-style="{ background: '#082C61', color: '#DAD7DB' }"
> >
<el-table-column prop="date" label="序号" align="center" width="50px"> <el-table-column
</el-table-column> type="index"
<el-table-column prop="name" label="姓名" align="center" width="50px"> label="序号"
align="center"
width="50px"
>
</el-table-column> </el-table-column>
<el-table-column prop="address" label="所在地" align="center"> <el-table-column
prop="name"
label="姓名"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="date" label="残疾等级" align="center" > <el-table-column prop="addressName" label="所在地" align="center">
</el-table-column> </el-table-column>
<el-table-column prop="date" label="补助标准" align="center"> <el-table-column prop="levelId" label="残疾等级" align="center" >
</el-table-column> </el-table-column>
<!-- <el-table-column prop="date" label="补助标准" align="center">
</el-table-column> -->
</el-table> </el-table>
</div> </div>
</el-col> </el-col>
...@@ -105,58 +136,203 @@ ...@@ -105,58 +136,203 @@
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { getYearDisabledIssueStats,getDisabledLevelStats,getAreaDisabledIssueStats } from "@/api/unified/unified"; import {
getYearDisabledIssueStats,
getDisabledLevelStats,
getAreaDisabledIssueStats,
deformedManSearch,
getMapData,
} from "@/api/unified/unified";
export default { export default {
data() { data() {
return { return {
tableData: [ num: 0,
{ tableData: [],
date: "1", yearDisabledIssueStats: {},
name: "王小虎", disabledLevelStats: {},
address: "上海市普陀区金沙江路 1518 弄", areaDisabledIssueStats: {},
}, poorDisabledNum: {},
{ value:""
date: "2",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
},
],
yearDisabledIssueStats:{},
disabledLevelStats:{},
areaDisabledIssueStats:{}
}; };
}, },
created() { created() {
this.getYearDisabledIssueStatsFun() this.getYearDisabledIssueStatsFun();
this.getDisabledLevelStatsFun() this.getDisabledLevelStatsFun();
this.getAreaDisabledIssueStatsFun() this.getAreaDisabledIssueStatsFun();
this.getMapData("g450000"); //默认展示广西 g450000
this.deformedManSearchFun()
}, },
methods: { methods: {
getYearDisabledIssueStatsFun(){ inputBtn() {
getYearDisabledIssueStats({}).then(res =>{ console.log(this.value);
console.log(res,'近三年发放人数和金额统计') this.deformedManSearchFun();
this.yearDisabledIssueStats = res.data.admin },
this.fivePeopleFun(res.data.admin)
}) deformedManSearchFun() {
deformedManSearch({
keyword: this.value,
}).then((res) => {
console.log(res, "残疾人搜索");
this.tableData = res.data;
});
}, },
getDisabledLevelStatsFun(){ getYearDisabledIssueStatsFun(data) {
getDisabledLevelStats({}).then(res =>{ getYearDisabledIssueStats({ areaCode: data }).then((res) => {
console.log(res,'获取残疾等级统计') console.log(res, "近三年发放人数和金额统计");
this.disabledLevelStats = res.data this.yearDisabledIssueStats = res.data.admin;
}) this.poorDisabledNum = res.data.totalNumMap;
this.fivePeopleFun(res.data.admin);
});
}, },
getAreaDisabledIssueStatsFun(){ getDisabledLevelStatsFun(data) {
getAreaDisabledIssueStats({}).then(res =>{ getDisabledLevelStats({ areaCode: data }).then((res) => {
console.log(res,'获取区域残疾发放统计') console.log(res, "获取残疾等级统计");
this.areaDisabledIssueStats = res.data this.disabledLevelStats = res.data;
}) });
},
getAreaDisabledIssueStatsFun(data) {
getAreaDisabledIssueStats({ areaCode: data }).then((res) => {
console.log(res, "获取区域残疾发放统计");
this.areaDisabledIssueStats = res.data;
this.ruralAndcityFun();
});
},
//获取地图数据
getMapData(areaId) {
getMapData(areaId).then((res) => {
console.log("map", res);
this.subsidiesMap([], res);
});
},
returnInfo() {
this.num = 0;
this.getMapData("g450000");
this.getYearDisabledIssueStatsFun("450000");
this.getDisabledLevelStatsFun("450000");
this.getAreaDisabledIssueStatsFun("450000");
},
/**
* 渲染地图
* dataList 分布数据
* mapList 地图数据
* max 最大值
* min 最小值
*/
subsidiesMap(dataList, mapList, max, min) {
console.log(dataList, mapList);
let map = echarts.init(document.getElementById("subsidiesMap"));
echarts.registerMap("GX", mapList);
map.setOption({
tooltip: {
trigger: "item",
// formatter: '{b}<br/>{c}%(完成数 / 指标数)'
formatter: function (data) {
return `${data.name}`;
},
},
grid: {
left: "3%",
right: "5%",
bottom: "3%",
containLabel: true,
},
// toolbox: {
// show: true,
// orient: "vertical",
// left: "right",
// top: "center",
// feature: {
// dataView: { readOnly: false },
// restore: {},
// saveAsImage: {}
// }
// },
visualMap: {
min: min,
max: max,
show: false,
//text: ["高完成率%", "低完成率%"],
realtime: false,
calculable: true,
inRange: {
color: ["#BDBEC2", "#EEC418", "#E11D27"],
},
textStyle: {
color: "#fff",
},
},
series: [
{
//name: "项目任务完成情况",
type: "map",
mapType: "GX", // 自定义扩展图表类型
itemStyle: {
normal: {
label: { show: true, color: "#fff" },
borderWidth: 1, //区域边框宽度
borderColor: "#fff", //区域边框颜色
areaColor: "#0070BC", //默认区域颜色
},
emphasis: {
show: true,
areaColor: "#3066ba", //鼠标滑过区域颜色
label: {
show: true,
textStyle: {
color: "#fff",
},
},
},
},
textStyle: {
color: "#fff",
},
data: dataList,
},
],
});
if (map._$handlers.click) {
map._$handlers.click.length = 0;
}
map.on("click", (res) => {
this.num++;
console.log(this.num, "点击数字,2不执行");
if (this.num >= 2) {
//不执行
} else {
console.log("点击取值", res);
console.log("地图数组", mapList.features);
console.log("地区下标", res.dataIndex);
console.log("区域信息", mapList.features[res.dataIndex].properties);
console.log(
"区域信息地区码",
mapList.features[res.dataIndex].properties.adcode
);
this.getMapData(
"g" + mapList.features[res.dataIndex].properties.adcode
);
this.getYearDisabledIssueStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getDisabledLevelStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
this.getAreaDisabledIssueStatsFun(
mapList.features[res.dataIndex].properties.adcode
);
}
});
}, },
//3年享受低保人数 //3年享受低保人数
fivePeopleFun(data) { fivePeopleFun(data) {
console.log(data) console.log(data);
var chartDom = document.getElementById("fivePeople"); var chartDom = document.getElementById("fivePeople");
var myChart = echarts.init(chartDom, "dark"); var myChart = echarts.init(chartDom, "dark");
var option; var option;
...@@ -468,7 +644,7 @@ export default { ...@@ -468,7 +644,7 @@ export default {
}, },
mounted() { mounted() {
setTimeout(() => { setTimeout(() => {
this.ruralAndcityFun(); //this.ruralAndcityFun();
}, 1000); }, 1000);
}, },
}; };
...@@ -520,6 +696,12 @@ export default { ...@@ -520,6 +696,12 @@ export default {
margin-left: 20px; margin-left: 20px;
} }
.subsidiesMap {
width: 100%;
height: 430px;
background-color: #082c61;
}
.wian { .wian {
width: 100%; width: 100%;
height: 416px; height: 416px;
...@@ -529,7 +711,7 @@ export default { ...@@ -529,7 +711,7 @@ export default {
.wians { .wians {
width: 100%; width: 100%;
height: 500px; height: 500px;
background-color: blanchedalmond; background-color: #082c61;
} }
.wianss { .wianss {
...@@ -541,7 +723,13 @@ export default { ...@@ -541,7 +723,13 @@ export default {
.wiansInfo { .wiansInfo {
width: 100%; width: 100%;
height: 848px; height: 848px;
background-color: blanchedalmond; background-color: #082c61;
overflow: hidden;
overflow-y: scroll;
}
.wiansInfo::-webkit-scrollbar {
display: none;
} }
.display { .display {
...@@ -610,4 +798,21 @@ export default { ...@@ -610,4 +798,21 @@ export default {
color: #fff; color: #fff;
margin-bottom: 6px; margin-bottom: 6px;
} }
.returnInfos {
font-size: 16px;
color: #fff;
margin: 0px 0 0 30px;
}
.input {
width: 90%;
background-color: #082c61;
color: #7f8b9d;
margin: 10px 20px;
}
.el-icon-search {
color: #fff;
}
</style> </style>
\ No newline at end of file
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