Browse Source

Merge branch 'dev-shuju' into prod

shibei_master
13176889840 4 years ago
parent
commit
49022d7c85
  1. 261
      src/views/modules/visual/measure/volunteer.vue

261
src/views/modules/visual/measure/volunteer.vue

@ -1,97 +1,114 @@
<template>
<div class="warning-box">
<cpt-card class="card-wr">
<cpt-card >
<div class="card-title">
<img class="title-icon"
src="../../../../assets/img/shuju/title-tip.png" />
<img class="title-icon" src="../../../../assets/img/shuju/title-tip.png" />
<div class="title-label">
志愿者服务情况
<el-cascader
v-model="selectAgency"
:options="propTree"
:props="{ checkStrictly: true }"
:show-all-levels="false"
clearable
@change="handleCascader">
</el-cascader>
</div>
</div>
<div class="box-wr">
<cpt-card class="card-wr">
<div class="card-title">
<img class="title-icon"
src="../../../../assets/img/shuju/title-tip.png" />
<div class="title-label">
志愿者服务情况
</div>
</div>
<div class="card-echart">
<div class="card-left">
<div class="card-count">
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.partyTotal || 0 }}</div>
<div class="card-count-label">党员数量</div>
<div class="card-echart">
<div class="card-left">
<div class="card-count">
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.partyTotal || 0 }}</div>
<div class="card-count-label">党员数量</div>
</div>
</div>
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.resiTotal || 0 }}</div>
<div class="card-count-label">居民数量</div>
</div>
</div>
</div>
</div>
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.resiTotal || 0 }}</div>
<div class="card-count-label">居民数量</div>
<div class="echart-wr">
<!-- <div class="echart-cicle"></div> -->
<div id="echartService"
class="echart-org"></div>
</div>
</div>
</div>
<div class="echart-wr">
<!-- <div class="echart-cicle"></div> -->
<div id="echartService"
class="echart-org"></div>
</div>
</div>
</div>
</div>
</div>
<div class="card-echart">
<div class="card-left">
<div class="card-count">
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.partyServiceTotal || 0 }}</div>
<div class="card-count-label">党员数量</div>
<div class="card-echart">
<div class="card-left">
<div class="card-count">
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.partyServiceTotal || 0 }}</div>
<div class="card-count-label">党员数量</div>
</div>
</div>
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.resiServiceTotal || 0 }}</div>
<div class="card-count-label">居民数量</div>
</div>
</div>
</div>
</div>
<div class="card-count-item">
<div class="card-count-content">
<div class="card-count-num">{{ vInfo.resiServiceTotal || 0 }}</div>
<div class="card-count-label">居民数量</div>
<div class="echart-wr">
<!-- <div class="echart-cicle"></div> -->
<div id="echartCount"
class="echart-org"></div>
</div>
</div>
</div>
<div class="echart-wr">
<!-- <div class="echart-cicle"></div> -->
<div id="echartCount"
class="echart-org"></div>
</div>
</div>
</div>
</div>
</cpt-card>
<cpt-card class="card-wr card-wr-map">
<div class="card-title">
<img class="title-icon"
src="../../../../assets/img/shuju/title-tip.png" />
<div class="title-label">
多元化治理平面图
</div>
</div>
</cpt-card>
<cpt-card class="card-wr card-wr-map">
<div class="card-title">
<img class="title-icon"
src="../../../../assets/img/shuju/title-tip.png" />
<div class="title-label">
多元化治理平面图
</div>
</div>
<div class="card-map">
<screen-map class="map"
ref="map"
@clickFeature="clickMapVolunteer"
:showIconLayer="true"
:clickType="'popup'"
:isAddOpenlay="true"></screen-map>
</div>
<div class="map-tips">
<div class="card-map">
<screen-map class="map"
ref="map"
@clickFeature="clickMapVolunteer"
:showIconLayer="true"
:clickType="'popup'"
:isAddOpenlay="true"></screen-map>
</div>
<div class="map-tips">
<div class="map-tips-item"
v-for="item in legendArray"
:key="item.optionValue">
<div class="map-tips-item"
v-for="item in legendArray"
:key="item.optionValue">
<img class="title-icon"
:src="item.url" />
<div class="map-tips-label">{{item.optionLabel}}</div>
</div>
<img class="title-icon"
:src="item.url" />
<div class="map-tips-label">{{item.optionLabel}}</div>
</div>
</div>
</cpt-card>
</div>
</cpt-card>
</div>
</template>
@ -129,6 +146,8 @@ export default {
// [1,'','','2',''],
],
value2: '',
selectAgency: '',
propTree: [],
visibleLoading: true,
pageNo: 1,
pageSize: 10,
@ -163,12 +182,13 @@ export default {
},
async mounted () {
await nextTick(100);
this.getPie()
await this.getAgencyList()
this.getPie(this.$store.state.user.agencyId)
// this.initCharts()
// this.initCount()
await this.getWorkUserInfo()
await this.getMapUnitList()
await this.getMapUnitList(this.$store.state.user.agencyId)
},
methods: {
initCharts (total, data) {
@ -286,12 +306,12 @@ export default {
option && _charts.setOption(option);
},
async getPie () {
async getPie (agencyId) {
const url = "/data/report/heart/demand/volunteer/service";
// let params = {
// agencyId: this.$store.state.user.agencyId,
// };
const { data, code, msg } = await requestPost(url);
let params = {
agencyId,
};
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
console.log('data-ddd', data)
this.vInfo = data
@ -317,7 +337,7 @@ export default {
}, {
name: '居民数量',
value: data.resiServiceTotal,
temStyle: {
itemStyle: {
color: 'rgba(250, 193, 38, 1)'
}
}]
@ -331,6 +351,52 @@ export default {
this.$message.error(msg)
}
},
async getAgencyList() {
// const url = "/gov/org/customeragency/staffinagencylist";
const url = '/gov/org/customeragency/agencygridtree'
// let params = {
// agencyId: this.$store.state.user.agencyId,
// };
const { data, code, msg } = await requestPost(url);
if (code === 0) {
console.log('data-org----o', data)
this.selectAgency = [`${data.agencyId}-${data.level}`]
let arr = []
arr.push(data)
this.propTree = arr && this.getTreeData(arr)
} else {
this.$message.error(msg)
}
},
getTreeData(data){
if (!Array.isArray(data)) return []
let arr = data.map(item => {
let _item = {}
if (item.subAgencyList) {
if (item.subAgencyList.length === 0) {
_item = {
label: item.agencyName,
value: item.agencyId + '-' + item.level,
level: item.level,
children: undefined
}
} else _item = {
label: item.agencyName,
value: item.agencyId + '-' + item.level,
level: item.level,
children: this.getTreeData(item.subAgencyList)}
} else {
_item = {
label: item.agencyName,
value: item.agencyId + '-' + item.level,
level: item.level,
}
}
return _item
})
return arr
},
//
pageSizeChangeHandleNew (val) {
this.pageNo = 1;
@ -370,12 +436,13 @@ export default {
//
async getMapUnitList () {
async getMapUnitList (agencyId) {
const url = "/epmetuser/volunteer/distribution"
// const url = "http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/distribution"
let params = {
customerId: this.$store.state.user.customerId
customerId: this.$store.state.user.customerId,
agencyId
}
const { data, code, msg } = await requestPost(url, params)
@ -427,7 +494,17 @@ export default {
},
handleCascader(val) {
console.log('val-vvv', val)
if (val.length > 0) {
const _arr = val[val.length - 1].split('-')
const orgType = _arr[1] !== 'grid' ? 'agency': 'grid'
// this.getServicePie(_arr[0], orgType)
this.getPie(_arr[0])
this.getMapUnitList(_arr[0])
}
},
//
loadMap () {
if (this.isfirstInit) {
@ -534,7 +611,10 @@ export default {
></style>
<style lang="scss" scoped>
.warning-box {
display: flex;
// display: flex;
.box-wr {
display: flex;
}
.card-wr {
flex: 1;
}
@ -547,6 +627,7 @@ export default {
display: flex;
align-items: center;
cursor: pointer;
margin-bottom: 10px;
.title-icon {
display: block;
width: 36px;
@ -557,6 +638,20 @@ export default {
.title-label {
font-size: 16px;
font-weight: 800;
::v-deep .el-input {
width: 180px;
.el-input__inner {
font-size: 20px;
font-weight: 800;
color: #fff;
background: transparent;
border: 0;
}
.el-icon-arrow-down::before {
content: "\e790";
}
}
}
::v-deep .el-dropdown {
font-size: 16px;

Loading…
Cancel
Save