Skip to content

C
civil-front
Commit 9ee092ed by 苏咏卓
Options

更新

parent b7119885
Showing with 146 additions and 18 deletions
.env.development
ENV = 'development' ENV = 'development'
# 接口地址 # 接口地址
VUE_APP_BASE_API = 'http://192.168.0.29:9888' VUE_APP_BASE_API = 'http://172.18.99.141:9888'
VUE_APP_WS_API = 'ws://192.168.0.29:9888' VUE_APP_WS_API = 'ws://172.18.99.141:9888'
# 是否启用 babel-plugin-dynamic-import-node插件 # 是否启用 babel-plugin-dynamic-import-node插件
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true
.eslintignore
...@@ -2,3 +2,4 @@ build/*.js ...@@ -2,3 +2,4 @@ build/*.js
src/assets src/assets
public public
dist dist
src
\ No newline at end of file
src/api/marriage/marriage.js 0 → 100644
import request from '@/utils/request'
//获取结婚离婚人数
export const getMarriageStats = data =>{
return request({
url:'portal/admin/stats/getMarriageStats',
method: 'POST',
data
})
}
\ No newline at end of file
src/api/population/population.js 0 → 100644
import request from '@/utils/request'
//获取近5年结婚离婚走势
export const getMarryPerYear = data => {
return request({
url: 'portal/admin/stats/getMarryPerYear',
method: 'POST',
data
})
}
//获取结婚离婚人数
export const getMarriageStats = data => {
return request({
url: 'portal/admin/stats/getMarriageStats',
method: 'POST',
data
})
}
//获取人口统计走势图
export const getDemographicsLineData = data => {
return request({
url: 'portal/admin/stats/getDemographicsLineData',
method: 'GET',
data
})
}
\ No newline at end of file
src/views/comprehensive/comprehensive.vue
...@@ -8,17 +8,17 @@ ...@@ -8,17 +8,17 @@
<div class="flexInfo"> <div class="flexInfo">
<div> <div>
<div class="month">本月农村</div> <div class="month">本月农村</div>
<div class="num">547330</div> <div class="blueNum">547330</div>
<div class="lift">-0.18%</div> <div class="lift">-0.18%</div>
</div> </div>
<div> <div>
<div class="month">本月城镇</div> <div class="month">本月城镇</div>
<div class="num">61197</div> <div class="blueNum">61197</div>
<div class="lift">-0.18%</div> <div class="lift">-0.18%</div>
</div> </div>
<div> <div>
<div class="month">本月低边</div> <div class="month">本月低边</div>
<div class="num">179368</div> <div class="blueNum">179368</div>
<div class="lift">-0.18%</div> <div class="lift">-0.18%</div>
</div> </div>
</div> </div>
...@@ -171,7 +171,7 @@ export default { ...@@ -171,7 +171,7 @@ export default {
margin-bottom: 10px; margin-bottom: 10px;
} }
.num { .blueNum {
font-size: 24px; font-size: 24px;
color: #3396fb; color: #3396fb;
text-align: center; text-align: center;
......
src/views/funeral/cremation.vue
...@@ -210,7 +210,7 @@ export default { ...@@ -210,7 +210,7 @@ export default {
<style lang="scss"> <style lang="scss">
.box { .box {
width: 300px; width: 100%;
height: 300px; height: 300px;
} }
</style> </style>
\ No newline at end of file
src/views/marriage/marriage.vue
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<el-card shadow="hover"> <el-card shadow="hover">
<div class="titles">结婚人数</div> <div class="titles">结婚人数</div>
<div class="flex"> <div class="flex">
<div class="num">468</div> <div class="num">{{marriageNum.crossMarryNum}}</div>
<div class="right">对</div> <div class="right">对</div>
</div> </div>
</el-card> </el-card>
...@@ -14,11 +14,16 @@ ...@@ -14,11 +14,16 @@
<el-card shadow="hover"> <el-card shadow="hover">
<div class="titles">离婚人数</div> <div class="titles">离婚人数</div>
<div class="flex"> <div class="flex">
<div class="num">216</div> <div class="num">{{marriageNum.crossDivorceNum}}</div>
<div class="right">对</div> <div class="right">对</div>
</div> </div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :span="16">
<el-card shadow="hover">
<div class="sss" id="1"></div>
</el-card>
</el-col>
</el-row> </el-row>
<br /> <br />
<el-row> <el-row>
...@@ -102,10 +107,13 @@ ...@@ -102,10 +107,13 @@
</template> </template>
<script> <script>
import * as echarts from "echarts";
import { getMarriageStats,getMarryPerYear } from "@/api/marriage/marriage";
export default { export default {
data() { data() {
return { return {
tableData: [], tableData: [],
marriageNum: {},
pageInfo: { pageInfo: {
page: 1, page: 1,
size: 10, size: 10,
...@@ -115,7 +123,72 @@ export default { ...@@ -115,7 +123,72 @@ export default {
value1: "", value1: "",
}; };
}, },
created() {
this.getMarriageStatsFun();
},
methods: { methods: {
getMarriageStatsFun() {
getMarriageStats({ areaCode: 450000000000 }).then((res) => {
console.log(res, "获取结婚离婚人数");
this.marriageNum = res.data;
});
},
marriage() {
var chartDom = document.getElementById("1");
var myChart = echarts.init(chartDom);
var option;
option = {
title: {
text: "2021年(冷静期对数与离婚期对数)",
},
tooltip: {
trigger: "axis",
},
legend: {
top: "8%",
left: "center",
data: ["冷静期", "离婚期"],
},
grid: {
left: "3%",
right: "4%",
bottom: "1%",
containLabel: true,
},
toolbox: {
feature: {
saveAsImage: {},
},
},
xAxis: {
type: "category",
boundaryGap: false,
data: ["一月", "二月", "三月", "四月", "五月", "六月"],
},
yAxis: {
type: "value",
},
series: [
{
name: "冷静期",
type: "line",
stack: "总量",
data: [120, 132, 101, 134, 90, 230, 210],
},
{
name: "离婚期",
type: "line",
stack: "总量",
data: [220, 182, 191, 234, 290, 330, 310],
},
],
};
option && myChart.setOption(option);
},
// 显示数量切换 // 显示数量切换
sizeChange(e) { sizeChange(e) {
this.pageInfo.size = e; this.pageInfo.size = e;
...@@ -129,6 +202,11 @@ export default { ...@@ -129,6 +202,11 @@ export default {
this.pageImageAlbumFun(); this.pageImageAlbumFun();
}, },
}, },
mounted() {
setTimeout(() => {
this.marriage();
}, 500);
},
}; };
</script> </script>
...@@ -150,8 +228,13 @@ export default { ...@@ -150,8 +228,13 @@ export default {
.right { .right {
font-size: 16px; font-size: 16px;
color: #F0B37B; color: #f0b37b;
margin-top: 18px; margin-top: 18px;
margin-left: 6px; margin-left: 6px;
} }
.sss {
width: 100%;
height: 300px;
}
</style> </style>
\ No newline at end of file
src/views/socialOrganization/socialOrganization.vue
...@@ -7,14 +7,14 @@ ...@@ -7,14 +7,14 @@
<div class="statisticalNum">社会组织统计总数量</div> <div class="statisticalNum">社会组织统计总数量</div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="3">
<el-card shadow="hover" class="purples"> <el-card shadow="hover" class="purplesBox">
<div class="organizationBlue">33174</div> <div class="organizationBlue">33174</div>
<div class="organization">社会团体</div> <div class="organization">社会团体</div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="4">
<el-card shadow="hover" class="green"> <el-card shadow="hover" class="greenBox">
<div class="organizationGreen">59778</div> <div class="organizationGreen">59778</div>
<div class="organization">民办非企业单位</div> <div class="organization">民办非企业单位</div>
</el-card> </el-card>
...@@ -139,11 +139,11 @@ export default { ...@@ -139,11 +139,11 @@ export default {
background-color: #fff; background-color: #fff;
} }
.purples { .purplesBox {
background-color: rgba(242, 235, 253); background-color: rgba(242, 235, 253);
} }
.green { .greenBox {
background-color: rgba(237, 246, 241); background-color: rgba(237, 246, 241);
} }
...@@ -153,7 +153,7 @@ export default { ...@@ -153,7 +153,7 @@ export default {
.statisticalNum { .statisticalNum {
font-size: 16px; font-size: 16px;
text-align: center; //text-align: center;
color: #000; color: #000;
} }
...@@ -165,7 +165,7 @@ export default { ...@@ -165,7 +165,7 @@ export default {
.organizationWhite { .organizationWhite {
font-size: 24px; font-size: 24px;
color: #3c3c3c; color: #3c3c3c;
text-align: center; // text-align: center;
margin-bottom: 6px; margin-bottom: 6px;
} }
......
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