elink-star
/
ShibeiWorkPlatform_Frontend
11
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

人房统计

shibei_master
jiangyy 3 years ago
parent
8476d9d462
commit
b2d039a090
4 changed files with 139 additions and 45 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 26
      src/assets/scss/modules/visual/houseStatic.scss
  2. 146
      src/views/modules/visual/basicinfo/houseStatic/houseStatic.vue
  3. 6
      src/views/modules/visual/basicinfo/houseStatic/options.js
  4. 6
      src/views/modules/visual/basicinfo/houseStatic/userOptions.js

26
src/assets/scss/modules/visual/houseStatic.scss
View File

@ -1,3 +1,11 @@
.warning-box{
padding: 0 21px 20px 24px
}
.no-data{
margin-top:50px;
display:flex;
justify-content: center;
}
.card-title {
display: flex;
@ -205,7 +213,7 @@
width: 100%;
display: flex;
justify-content: center;
margin-top: 500px;
margin-top: 200px;
}
@ -247,12 +255,16 @@
align-items: center;
display: flex;
justify-content: space-around;
flex-grow:0;
flex-shrink:0;
}
.item_right{
align-items: center;
display: flex;
justify-content: space-around;
flex-grow:0;
flex-shrink:0;
// margin-left:250px;
}
@ -265,8 +277,9 @@
}
.pie-table-total{
margin-left:60px;
margin-left:40px;
.pie-table-total-count{
min-width: 98px;
text-align: center;
font-size: 40px;
font-family: PingFang SC;
@ -295,6 +308,13 @@
color: #2865FA;
}
.colorwhite{
font-size: 35px;
font-family: PingFang SC;
font-weight: bold;
color: #ffffff;
}
.pie-table-title{
margin-top:7px;
text-align: center;
@ -311,7 +331,7 @@
}
.pie-table-line{
margin-left:60px;
margin-left:40px;
height:30px;
width:1px;
background-color: #1797FF;

146
src/views/modules/visual/basicinfo/houseStatic/houseStatic.vue
View File

@ -1,5 +1,17 @@
<template>
<div class="warning-box">
<!-- 组织路由 -->
<div class="div_top">
<div class="router_line"></div>
<div class="div_router">
<span class="router_parents"
v-for="(item,index) in runAgencyArray"
@click="handleClickAgency(index)"
:key="index">{{item.orgName}}<span class="arrow">></span></span>
<span class="router_child">{{orgName}}</span>
</div>
</div>
<cpt-card>
<div class="card-title">
<img class="title-icon"
@ -105,8 +117,7 @@
</div>
</div>
<div v-if="subList.length>0"
class="card-left-title">下级人房概览数据统计</div>
<div class="card-left-title">下级人房概览数据统计</div>
<div v-if="subList.length>0"
class="card-table">
@ -114,7 +125,7 @@
:key="index"
:class="['table_item',index%2 === 0?'item_dark':'']">
<div class="item_name"
@click="hancleToSubAgency(item)">
@click="handleToSubAgency(item)">
<img src="@/assets/img/shuju/logo1.png" />
<span>{{item.orgName}}</span>
</div>
@ -122,40 +133,40 @@
<div class="item_data">
<div class="item_left">
<div class="pie-table-total">
<div class="pie-table-total-count">{{houseData.houseTotal}}</div>
<div class="pie-table-total-count">{{item.houseTotal}}</div>
<div class="pie-table-title">房屋总数</div>
</div>
<div class="pie-table-line"></div>
<div class="pie-table-total ">
<div class="pie-table-total-count zz">{{houseData.zzHouseTotal}}</div>
<div class="pie-table-title table-table-title">0.0%</div>
<div class="pie-table-total-count colorwhite">{{item.zzHouseTotal}}</div>
<div class="pie-table-title table-table-title">{{item.zzHouseRatio+'%'}}</div>
<div class="pie-table-title table-table-title">自住房屋数</div>
</div>
<div class="pie-table-total ">
<div class="pie-table-total-count cz">{{houseData.czHouseTotal}}</div>
<div class="pie-table-title table-table-title">20%</div>
<div class="pie-table-total-count colorwhite">{{item.czHouseTotal}}</div>
<div class="pie-table-title table-table-title">{{item.czHouseRatio+'%'}}</div>
<div class="pie-table-title table-table-title">出租房屋数</div>
</div>
<div class="pie-table-total ">
<div class="pie-table-total-count xz">{{houseData.xzHouseTotal}}</div>
<div class="pie-table-title table-table-title">99.0%</div>
<div class="pie-table-total-count colorwhite">{{item.xzHouseTotal}}</div>
<div class="pie-table-title table-table-title">{{item.xzHouseRatio+'%'}}</div>
<div class="pie-table-title table-table-title">闲置房屋数</div>
</div>
</div>
<div class="item_right">
<div class="pie-table-total">
<div class="pie-table-total-count">{{userData.userTotal}}</div>
<div class="pie-table-total-count">{{item.userTotal}}</div>
<div class="pie-table-title">居民总数</div>
</div>
<div class="pie-table-line"></div>
<div class="pie-table-total ">
<div class="pie-table-total-count zz">{{userData.czUserTotal}}</div>
<div class="pie-table-title table-table-title">0.00%</div>
<div class="pie-table-total-count colorwhite">{{item.czUserTotal}}</div>
<div class="pie-table-title table-table-title">{{item.czUserRatio+'%'}}</div>
<div class="pie-table-title table-table-title">常住人口数</div>
</div>
<div class="pie-table-total ">
<div class="pie-table-total-count cz">{{userData.ldUserTotal}}</div>
<div class="pie-table-title table-table-title">99.99%</div>
<div class="pie-table-total-count colorwhite">{{item.ldUserTotal}}</div>
<div class="pie-table-title table-table-title">{{item.ldUserRatio+'%'}}</div>
<div class="pie-table-title table-table-title">流动人口数</div>
</div>
@ -164,6 +175,14 @@
</div>
</div>
<div v-if="subList.length===0"
class="no-data">
<img src="@/assets/img/modules/visual/noData.png"
class="no-data-img" />
</div>
</cpt-card>
</div>
</template>
@ -192,6 +211,9 @@ export default {
dataLoading: true,
orgId: '',
orgType: '',
orgName: this.$store.state.user.agencyName,
// orgShowName: this.$store.state.user.agencyName,//面包屑显示当前组织名称
housePieChartS: null,
housePieChart: '',
@ -243,11 +265,15 @@ export default {
userColorArray: ['#1B51FF', '#00E5ED'],
userPieData: [],
subList: [
{
orgId: '',
}
]
subList: [],
//下钻层级记录
runNum: 0,
runAgencyArray: [],
selUserId: '',
center: [],
zoom: null,
parentPolygon: [],
};
},
@ -286,15 +312,15 @@ export default {
this.$refs.housePieChart.showLoading()
}
const url = "http://yapi.elinkservice.cn/mock/245/gov/org/house/housechart";
// const url = '/gov/org/house/housechart'
// const url = "http://yapi.elinkservice.cn/mock/245/gov/org/house/housechart";
const url = '/gov/org/house/housechart'
let params = {
orgId: this.orgId,
orgType: this.orgType
};
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
// this.houseData = data
this.houseData = data
if (this.$refs.housePieChart) {
this.$refs.housePieChart.hideLoading()
}
@ -315,6 +341,7 @@ export default {
}, 500)
}
},
assignHousePieChart () {
if (this.houseData) {
@ -330,16 +357,16 @@ export default {
let obj1 = {
name: '自住房屋数',
value: 20.1,
value: this.houseData.zzHouseRatio,
selected: true
}
let obj2 = {
name: '出租房屋数',
value: 20.3
value: this.houseData.czHouseRatio
}
let obj3 = {
name: '闲置房屋数',
value: 20
value: this.houseData.xzHouseRatio
}
this.housePieData.push(obj1)
@ -368,15 +395,15 @@ export default {
if (this.$refs.userPieChart) {
this.$refs.userPieChart.showLoading()
}
const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/icresiuser/userchart";
// const url = '/epmetuser/icresiuser/userchart'
// const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/icresiuser/userchart";
const url = '/epmetuser/icresiuser/userchart'
let params = {
orgId: this.orgId,
orgType: this.orgType
};
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
// this.userData = data
this.userData = data
if (this.$refs.userPieChart) {
this.$refs.userPieChart.hideLoading()
}
@ -395,6 +422,7 @@ export default {
}, 500)
}
},
assignUserPieChart () {
if (this.userData) {
@ -410,12 +438,12 @@ export default {
let obj1 = {
name: '常住人口数',
value: 20.1,
value: this.userData.czUserRatio,
selected: true
}
let obj2 = {
name: '流动人口树',
value: 20.3
value: this.userData.ldUserRatio
}
this.userPieData.push(obj1)
@ -440,8 +468,8 @@ export default {
},
async getSubuserhouselist (node, resolve) {
const url = "http://yapi.elinkservice.cn/mock/245/gov/org/house/subuserhouselist";
// const url = '/gov/org/house/subuserhouselist'
// const url = "http://yapi.elinkservice.cn/mock/245/gov/org/house/subuserhouselist";
const url = '/gov/org/house/subuserhouselist'
let params = {
orgId: this.orgId,
orgType: this.orgType
@ -493,6 +521,7 @@ export default {
},
async clickUserPie (seriesIndex) {
this.userPieData.forEach((element, index) => {
if (index === seriesIndex) {
@ -532,15 +561,55 @@ export default {
// this.getTable()
},
hancleToSubAgency (item) {
handleToSubAgency (item) {
this.toSubAgency(item)
this.getApiData()
},
//下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区） people 点击详情
async toSubAgency (item) {
this.runNum++
let obj = {
orgId: this.orgId,
orgType: this.orgType,
orgName: this.orgName,
}
this.runAgencyArray.push(obj)
this.orgId = item.orgId
this.orgType = item.orgType
this.getApiData()
this.orgName = item.orgName
},
//返回所选组织
handleClickAgency (index) {
const cutNum = this.runAgencyArray.length - index//要减去的长度
this.runNum = this.runNum - cutNum
}
let orgData = this.runAgencyArray[index]
for (let i = 0; i < cutNum; i++) {
this.runAgencyArray.pop()
}
this.orgId = orgData.id
this.orgType = orgData.orgType
this.orgName = orgData.orgName
this.getApiData()
},
},
};
@ -551,6 +620,11 @@ export default {
src="@/assets/scss/modules/visual/warning.scss"
scoped
></style>
<style
lang="scss"
src="@/assets/scss/modules/visual/basicInfoMain.scss"
scoped
></style>
<style
lang="scss"
src="@/assets/scss/modules/visual/houseStatic.scss"

6
src/views/modules/visual/basicinfo/houseStatic/options.js
View File

@ -83,7 +83,7 @@ export function housePieOption (_charts) {
position: 'outside',
alignTo: 'edge',
// formatter: '{a|{c}}\n\n{name|{b}}',
formatter: '{a|{c}}\n{r|}\n{name|{b}}',
formatter: '{name|{b}}\n{r|}\n{a|{c}%}',
minMargin: 5,
edgeDistance: 1,
lineHeight: 15,
@ -95,9 +95,9 @@ export function housePieOption (_charts) {
padding: [0, 6, 0, 6]
},
a: {
fontSize: 25,
fontSize: 20,
color: '#fff',
padding: [0, 6, 6, 6]
padding: [16, 0, 6, 6]
},
r: {
backgroundColor: 'auto',

6
src/views/modules/visual/basicinfo/houseStatic/userOptions.js
View File

@ -85,7 +85,7 @@ export function userPieOption (_charts) {
position: 'outside',
alignTo: 'edge',
// formatter: '{a|{c}}\n\n{name|{b}}',
formatter: '{a|{c}}\n{r|}\n{name|{b}}',
formatter: '{name|{b}}\n{r|}\n{a|{c}%}',
minMargin: 5,
edgeDistance: 1,
lineHeight: 15,
@ -97,9 +97,9 @@ export function userPieOption (_charts) {
padding: [0, 6, 0, 6]
},
a: {
fontSize: 25,
fontSize: 20,
color: '#fff',
padding: [0, 6, 6, 6]
padding: [16, 0, 6, 6]
},
r: {
backgroundColor: 'auto',

Write Preview
Loading…
Cancel
Save