elink-star
/
epmet-oper-gov
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

统计legend

jly/task002
tianqian 3 years ago
parent
98be6a386c
commit
f810b5bf8d
3 changed files with 40 additions and 31 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      src/views/modules/census/census-houseList.vue
  2. 47
      src/views/modules/census/census-residentList.vue
  3. 14
      src/views/modules/communityParty/dyhx/party.vue

10
src/views/modules/census/census-houseList.vue
View File

@ -62,7 +62,7 @@
<div class="flex1"> <div class="flex1">
<div class="box"> <div class="box">
<div class="legend"> <div class="legend">
<div class="legend-row" :key="item.name" v-for="(item, index) in chartData.data" @click="handleClickItem(item)"> <div class="legend-row" :key="item.name" v-for="(item, index) in chartDataData" @click="handleClickItem(item)">
<div class="kuai" :style="{ backgroundColor: color1[index] }"></div> <div class="kuai" :style="{ backgroundColor: color1[index] }"></div>
<div class="content"> <div class="content">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
@ -91,7 +91,7 @@
<div class="flex1"> <div class="flex1">
<div class="box"> <div class="box">
<div class="legend2"> <div class="legend2">
<div class="legend-row" :key="item.name" v-for="(item, index) in chartData2.data" @click="handleClickItem2(item)"> <div class="legend-row" :key="item.name" v-for="(item, index) in chartData2Data" @click="handleClickItem2(item)">
<div class="kuai" v-if="item.name == '自住'"><img src="../../../assets/img/census/自住.png" /></div> <div class="kuai" v-if="item.name == '自住'"><img src="../../../assets/img/census/自住.png" /></div>
<div class="kuai" v-if="item.name == '出租'"><img src="../../../assets/img/census/出租.png" /></div> <div class="kuai" v-if="item.name == '出租'"><img src="../../../assets/img/census/出租.png" /></div>
<div class="kuai" v-if="item.name == '闲置'"><img src="../../../assets/img/census/闲置.png" /></div> <div class="kuai" v-if="item.name == '闲置'"><img src="../../../assets/img/census/闲置.png" /></div>
@ -242,7 +242,9 @@ export default {
orgId: '', orgId: '',
purpose: '', purpose: '',
rentFlag: '', rentFlag: '',
orgIdPath: '' orgIdPath: '',
chartDataData:[],
chartData2Data:[]
}; };
}, },
computed: { computed: {
@ -413,6 +415,7 @@ export default {
radio: item.count == 0 ? '0' : ((item.count / this.pieData.total) * 100).toFixed(2) radio: item.count == 0 ? '0' : ((item.count / this.pieData.total) * 100).toFixed(2)
}; };
}); });
this.chartDataData=this.chartData.data ;
this.$forceUpdate(); this.$forceUpdate();
this.iniPieChart(this.chartData); this.iniPieChart(this.chartData);
}, },
@ -433,6 +436,7 @@ export default {
radio: item.count == 0 ? '0' : ((item.count / this.pieData2.total) * 100).toFixed(2) radio: item.count == 0 ? '0' : ((item.count / this.pieData2.total) * 100).toFixed(2)
}; };
}); });
this.chartData2Data=this.chartData2.data ;
this.$forceUpdate(); this.$forceUpdate();
this.iniPieChart2(this.chartData2); this.iniPieChart2(this.chartData2);
}, },

47
src/views/modules/census/census-residentList.vue
View File

@ -40,7 +40,7 @@
<div class="flex1"> <div class="flex1">
<div class="box"> <div class="box">
<div class="legend"> <div class="legend">
<div class="legend-row" :key="item.name" v-for="(item, index) in chartData.data" @click="handleClickItem(item)"> <div class="legend-row" :key="item.name" v-for="(item, index) in chartDataData" @click="handleClickItem(item)">
<div class="kuai" :style="{ backgroundColor: color[index] }"></div> <div class="kuai" :style="{ backgroundColor: color[index] }"></div>
<div class="content"> <div class="content">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
@ -69,7 +69,7 @@
<div class="flex1"> <div class="flex1">
<div class="box"> <div class="box">
<div class="legend"> <div class="legend">
<div class="legend-row" :key="item.name" v-for="(item, index) in chartData2.data" @click="handleClickItem2(item)"> <div class="legend-row" :key="item.name" v-for="(item, index) in chartData2Data" @click="handleClickItem2(item)">
<div class="kuai" :style="{ backgroundColor: color[index] }"></div> <div class="kuai" :style="{ backgroundColor: color[index] }"></div>
<div class="content"> <div class="content">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
@ -211,7 +211,9 @@ export default {
code: '', code: '',
pieDatatotal: 0, pieDatatotal: 0,
pieDatatotal2: 0, pieDatatotal2: 0,
codeType: 'education' codeType: 'education',
chartDataData: [],
chartData2Data: []
}; };
}, },
computed: { computed: {
@ -362,34 +364,35 @@ export default {
} }
}, },
setPieData() { setPieData() {
let data = [...this.pieData]; let data = [...this.pieData.list];
this.pieDatatotal = data // this.pieDatatotal = data
.map(item => item.totalResi) // .map(item => item.totalResi)
.reduce(function(prev, cur, index, arr) { // .reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index); // console.log(prev, cur, index);
return prev + cur; // return prev + cur;
}); // });
this.chartData.name = data.map(item => item.codeName); this.chartData.name = data.map(item => item.codeName);
this.chartData.data = data.map(item => { this.chartData.data = data.map(item => {
return { return {
value: item.totalResi, value: item.totalResi,
name: item.codeName, name: item.codeName,
code: item.code, code: item.code,
radio: item.totalResi == 0 ? '0' : ((item.totalResi / this.pieDatatotal) * 100).toFixed(2) radio: item.totalResi == 0 ? '0' : ((item.totalResi / this.pieData.total) * 100).toFixed(2)
}; };
}); });
this.chartDataData = this.chartData.data;
console.log('chartData', this.chartData); console.log('chartData', this.chartData);
this.iniPieChart(this.chartData); this.iniPieChart(this.chartData);
}, },
setPieData2() { setPieData2() {
let data = [...this.pieData2]; let data = [...this.pieData2.list];
this.pieDatatotal2 = data // this.pieDatatotal2 = data
.map(item => item.totalResi) // .map(item => item.totalResi)
.reduce(function(prev, cur, index, arr) { // .reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index); // console.log(prev, cur, index);
return prev + cur; // return prev + cur;
}); // });
this.chartData2.name = data.map(item => item.codeName); this.chartData2.name = data.map(item => item.codeName);
this.chartData2.data = data.map(item => { this.chartData2.data = data.map(item => {
@ -397,10 +400,10 @@ export default {
value: item.totalResi, value: item.totalResi,
name: item.codeName, name: item.codeName,
code: item.code, code: item.code,
radio: item.totalResi == 0 ? '0' : ((item.totalResi / this.pieDatatotal2) * 100).toFixed(2) radio: item.totalResi == 0 ? '0' : ((item.totalResi / this.pieData2.total) * 100).toFixed(2)
}; };
}); });
this.chartData2Data = this.chartData2.data;
console.log('chartData', this.chartData2); console.log('chartData', this.chartData2);
this.iniPieChart2(this.chartData2); this.iniPieChart2(this.chartData2);
}, },
@ -420,7 +423,7 @@ export default {
}, },
color: this.color, color: this.color,
title: { title: {
text: this.pieDatatotal, text: this.pieData.total,
subtext: '总数', subtext: '总数',
x: 'center', x: 'center',
y: 'center', y: 'center',
@ -530,7 +533,7 @@ export default {
}, },
color: this.color, color: this.color,
title: { title: {
text: this.pieDatatotal2, text: this.pieData2.total,
subtext: '总数', subtext: '总数',
x: 'center', x: 'center',
y: 'center', y: 'center',

14
src/views/modules/communityParty/dyhx/party.vue
View File

@ -37,7 +37,7 @@
<div class="flex1"> <div class="flex1">
<div class="box"> <div class="box">
<div class="legend"> <div class="legend">
<div class="legend-row" :key="item.name" v-for="(item, index) in chartData.data" @click="handleClickItem(item)"> <div class="legend-row" :key="item.name" v-for="(item, index) in chartDataData" @click="handleClickItem(item)">
<div class="kuai" :style="{ backgroundColor: color[index] }"></div> <div class="kuai" :style="{ backgroundColor: color[index] }"></div>
<div class="content"> <div class="content">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
@ -103,7 +103,7 @@
<div class="flex1"> <div class="flex1">
<div class="box"> <div class="box">
<div class="legend"> <div class="legend">
<div class="legend-row" :key="item.name" v-for="(item, index) in chartData2.data" @click="handleClickItem(item)"> <div class="legend-row" :key="item.name" v-for="(item, index) in chartData2Data" @click="handleClickItem(item)">
<div class="kuai" :style="{ backgroundColor: color[index] }"></div> <div class="kuai" :style="{ backgroundColor: color[index] }"></div>
<div class="content"> <div class="content">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
@ -269,7 +269,9 @@ export default {
pieEduOptions: null, pieEduOptions: null,
formData: { formData: {
orgId: '' orgId: ''
} },
chartDataData: [],
chartData2Data: []
}; };
}, },
computed: { computed: {
@ -671,7 +673,7 @@ export default {
console.log(prev, cur, index); console.log(prev, cur, index);
return prev + cur; return prev + cur;
}); });
console.log('this.pieDatatotal',this.pieDatatotal); console.log('this.pieDatatotal', this.pieDatatotal);
this.chartData.name = data.map(item => item.value); this.chartData.name = data.map(item => item.value);
this.chartData.data = data.map(item => { this.chartData.data = data.map(item => {
return { return {
@ -681,6 +683,7 @@ export default {
radio: item.radio radio: item.radio
}; };
}); });
this.chartDataData = this.chartData.data;
console.log('chartData', this.chartData); console.log('chartData', this.chartData);
this.$forceUpdate(); this.$forceUpdate();
this.initAgeCharts(this.chartData); this.initAgeCharts(this.chartData);
@ -705,7 +708,7 @@ export default {
radio: item.radio radio: item.radio
}; };
}); });
this.chartData2Data = this.chartData2.data;
console.log('chartData', this.chartData2); console.log('chartData', this.chartData2);
this.$forceUpdate(); this.$forceUpdate();
this.initEduCharts(this.chartData2); this.initEduCharts(this.chartData2);
@ -1026,5 +1029,4 @@ export default {
} }
} }
} }
</style> </style>

Write Preview
Loading…
Cancel
Save