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