Commit f089c18a by 苏咏卓

完成基本页面,对接人口专题接口

parent 05700735
......@@ -7,4 +7,44 @@ export const getFivesYearMarriageLine = data => {
method: 'POST',
data
})
}
//获取结婚离婚人数
export const getMarriageStats = data => {
return request({
url: 'portal/admin/stats/getMarriageStats',
method: 'POST',
data
})
}
//儿童福利统计
export const getAgencyChildStatsList = data => {
return request({
url: 'portal/admin/stats/getAgencyChildStatsList',
method: 'POST',
data
})
}
//获取近三年城市农村低保发放人数统计
export const getThreeYearShjzAchieveStats = data => {
return request({
url: 'portal/admin/stats/getThreeYearShjzAchieveStats',
method: 'POST',
data
})
}
//残疾人两项补贴
export const getAreaDisabledIssueStats = data => {
return request({
url: 'portal/admin/stats/getAreaDisabledIssueStats',
method: 'POST',
data
})
}
\ No newline at end of file
......@@ -7,7 +7,43 @@
<el-col :span="24"> </el-col>
<el-col :span="24">
<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="yellowNum">40037987</div>
<div class="borderTop"></div>
</div>
<div class="text"></div>
</div>
<div class="socialOrganizationFlex">
<div class="textLeft">社团</div>
<div>
<div class="borderBottom"></div>
<div class="textNum">10037987</div>
<div class="borderTop"></div>
</div>
<div class="text"></div>
</div>
<div class="socialOrganizationFlex">
<div class="textLeft">民非</div>
<div>
<div class="borderBottom"></div>
<div class="textNum">37987</div>
<div class="borderTop"></div>
</div>
<div class="text"></div>
</div>
<div class="socialOrganizationFlex">
<div class="textLefts">基金会</div>
<div>
<div class="borderBottom"></div>
<div class="textNum">67987</div>
<div class="borderTop"></div>
</div>
<div class="text"></div>
</div>
</div>
</el-col>
</el-row>
......@@ -34,17 +70,26 @@
<div class="title">年度按月份统计</div>
<el-row :gutter="20">
<el-col :span="6">
<br>
<br><br><br>
<br />
<br /><br /><br />
<el-row :gutter="20">
<el-col :span="18" :offset="6">
<div class="classification">社团:</div>
<div class="classification">
<div class="classificationText">社团:</div>
<div class="numText">123456</div>
</div>
</el-col>
<el-col :span="18" :offset="6">
<div class="classification">民非:</div>
<div class="classification">
<div class="classificationText">民非:</div>
<div class="numText">123456</div>
</div>
</el-col>
<el-col :span="18" :offset="6">
<div class="classification">基金会:</div>
<div class="classification">
<div class="classificationText">基金会:</div>
<div class="numText">123456</div>
</div>
</el-col>
</el-row>
</el-col>
......@@ -66,13 +111,13 @@
<el-table
:data="tableData"
stripe
style="width: 300px; background-color: #051d3f; color: #2177b9"
style="width: 100%; background-color: #051d3f; color: #2177b9"
>
<el-table-column prop="date" label="区域名称" align="center">
<el-table-column prop="date" 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="address" label="离婚整数" align="center">
<el-table-column prop="address" label="组织名称/代码" align="center">
</el-table-column>
</el-table>
</div>
......@@ -369,16 +414,93 @@ export default {
</script>
<style lang="scss" scoped>
.classification{
font-size: 18px;
.socialOrganizationFlex {
display: flex;
margin-top: 30px;
margin-left: 20px;
}
.text {
font-size: 12px;
color: #0e62bf;
margin-top: 16px;
}
.textLeft {
font-size: 12px;
color: #0e62bf;
margin-top: 16px;
margin-left: 48px;
}
.textLefts {
font-size: 12px;
color: #0e62bf;
margin-top: 16px;
margin-left: 36px;
}
.textNum {
width: 180px;
font-size: 24px;
text-align: center;
color: #fff;
margin: 10px;
font-weight: bold;
}
.yellowNum {
width: 180px;
font-size: 24px;
text-align: center;
color: #ffff20;
font-weight: bold;
}
.textNums {
width: 180px;
font-size: 24px;
text-align: center;
color: #c1bdbd;
font-weight: bold;
}
.borderBottom {
width: 180px;
height: 12px;
border: 2px solid #0e62bf;
border-bottom: none;
}
.borderTop {
width: 100%;
height: 12px;
border: 2px solid #0e62bf;
border-top: none;
}
.classification {
display: flex;
margin-top: 20px;
}
.classificationText {
font-size: 12px;
color: #fff;
margin-top: 6px;
text-align: center;
}
.numText {
font-size: 20px;
color: #3A92F1;
text-align: center;
}
.proportion {
width: 100%;
height: 350px;
}
.annualStatistics {
margin-top: 10px;
width: 100%;
......
......@@ -34,8 +34,26 @@
<el-col :span="24">
<div class="wian">
<div class="title">残疾人比例</div>
<div class="subsidiesBox">
<div class="subsidiesText">一级残疾</div>
<div class="subsidiesText">总数299884</div>
<div class="subsidiesText">贫困18%</div>
</div>
<div class="subsidiesBox">
<div class="subsidiesText">二级残疾</div>
<div class="subsidiesText">总数299884</div>
<div class="subsidiesText">贫困28%</div>
</div>
<div class="subsidiesBox">
<div class="subsidiesText">三级残疾</div>
<div class="subsidiesText">总数299884</div>
<div class="subsidiesText">贫困38%</div>
</div>
<div class="subsidiesBox">
<div class="subsidiesText">四级残疾</div>
<div class="subsidiesText">总数299884</div>
<div class="subsidiesText">贫困48%</div>
</div>
</div>
</el-col>
</el-row>
......@@ -74,13 +92,17 @@
<el-table
:data="tableData"
stripe
style="width: 300px; background-color: #051d3f; color: #2177b9"
style="width: 100%; background-color: #051d3f; color: #2177b9"
>
<el-table-column prop="date" label="区域名称" align="center">
<el-table-column prop="date" 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="name" label="结婚总数" align="center">
<el-table-column prop="address" label="所在地" align="center">
</el-table-column>
<el-table-column prop="address" label="离婚整数" align="center">
<el-table-column prop="date" label="残疾等级" align="center" >
</el-table-column>
<el-table-column prop="date" label="补助标准" align="center">
</el-table-column>
</el-table>
</div>
......@@ -103,12 +125,12 @@ export default {
return {
tableData: [
{
date: "2016-05-02",
date: "1",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
date: "2",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
},
......@@ -219,10 +241,6 @@ export default {
option && myChart.setOption(option);
},
// 农村城市统计
ruralAndcityFun() {
var chartDom = document.getElementById("ruralAndcity");
......@@ -415,7 +433,10 @@ export default {
emphasis: {
focus: "series",
},
data: [320, 332, 301, 334, 390,220, 182, 191, 234, 290,220, 182, 191, 234, 290,220, 182, 191, 234, 290],
data: [
320, 332, 301, 334, 390, 220, 182, 191, 234, 290, 220, 182, 191,
234, 290, 220, 182, 191, 234, 290,
],
itemStyle: {
normal: {
color: "#3167ff",
......@@ -432,7 +453,10 @@ export default {
emphasis: {
focus: "series",
},
data: [220, 182, 191, 234, 290,220, 182, 191, 234, 290,220, 182, 191,220, 182, 191, 234, 290],
data: [
220, 182, 191, 234, 290, 220, 182, 191, 234, 290, 220, 182, 191,
220, 182, 191, 234, 290,
],
itemStyle: {
normal: {
color: "#ff4444",
......@@ -450,7 +474,7 @@ export default {
},
mounted() {
setTimeout(() => {
this.fivePeopleFun();
this.fivePeopleFun();
this.ruralAndcityFun();
}, 1000);
},
......@@ -563,13 +587,13 @@ export default {
}
.rural {
text-align: center;
text-align: center;
font-size: 12px;
color: #fff;
}
.city {
text-align: center;
text-align: center;
font-size: 12px;
color: #fff;
}
......@@ -578,4 +602,19 @@ export default {
width: 100%;
height: 300px;
}
.subsidiesBox {
width: 80%;
display: flex;
justify-content: space-around;
align-items: center;
border-bottom: 2px solid #526787;
margin: 60px 30px;
}
.subsidiesText {
font-size: 16px;
color: #fff;
margin-bottom: 6px;
}
</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