|
|
|
@ -48,29 +48,32 @@ |
|
|
|
<el-col :span="12"> |
|
|
|
<div class="div_table_title">房屋用途统计</div> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"><div :style="'height:' + TableHeight + 'px;margin-top:20px'"> |
|
|
|
<screen-echarts-frame |
|
|
|
@handelClickMyPei="handelClickMyPei" |
|
|
|
:style="{ width: '100%', height: '100%' }" |
|
|
|
@myChartMethod="pieInitOk" |
|
|
|
ref="pieChart" |
|
|
|
></screen-echarts-frame> |
|
|
|
</div></el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<div :style="'height:' + TableHeight + 'px;margin-top:20px'"> |
|
|
|
<screen-echarts-frame |
|
|
|
@handelClickMyPei="handelClickMyPei" |
|
|
|
:style="{ width: '100%', height: '100%' }" |
|
|
|
@myChartMethod="pieInitOk" |
|
|
|
ref="pieChart" |
|
|
|
></screen-echarts-frame> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"></el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<div class="div_table_title">房屋状态统计</div> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"><div :style="'height:' + TableHeight + 'px;margin-top:20px'"> |
|
|
|
<screen-echarts-frame2 |
|
|
|
@handelClickMyPei="handelClickMyPei2" |
|
|
|
:style="{ width: '100%', height: '100%' }" |
|
|
|
@myChartMethod="pieInitOk2" |
|
|
|
ref="pieChart2" |
|
|
|
></screen-echarts-frame2> |
|
|
|
</div></el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<div :style="'height:' + TableHeight + 'px;margin-top:20px'"> |
|
|
|
<screen-echarts-frame2 |
|
|
|
@handelClickMyPei="handelClickMyPei2" |
|
|
|
:style="{ width: '100%', height: '100%' }" |
|
|
|
@myChartMethod="pieInitOk2" |
|
|
|
ref="pieChart2" |
|
|
|
></screen-echarts-frame2> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"></el-col> |
|
|
|
</el-row> |
|
|
|
</el-col> |
|
|
|
@ -167,10 +170,10 @@ export default { |
|
|
|
checkStrictly: true |
|
|
|
}, |
|
|
|
TableHeight: '', |
|
|
|
pieInitState:false, |
|
|
|
pieInitState2:false, |
|
|
|
pieOption:[], |
|
|
|
pieOption2:[] |
|
|
|
pieInitState: false, |
|
|
|
pieInitState2: false, |
|
|
|
pieOption: [], |
|
|
|
pieOption2: [] |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@ -195,6 +198,7 @@ export default { |
|
|
|
this.getOrgTreeList(); |
|
|
|
this.getTableData(); |
|
|
|
this.getPie(); |
|
|
|
this.getPie2(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
handleSearch(val) { |
|
|
|
@ -260,8 +264,9 @@ export default { |
|
|
|
this.pieInitState = true; |
|
|
|
}, |
|
|
|
pieInitOk2() { |
|
|
|
console.log("2333erwewrwe33333") |
|
|
|
console.log('2333erwewrwe33333', this.pieInitState2); |
|
|
|
this.pieInitState2 = true; |
|
|
|
console.log('2333erwewrwe333335476754765', this.pieInitState2); |
|
|
|
}, |
|
|
|
getPie() { |
|
|
|
if (this.pieInitState) { |
|
|
|
@ -274,7 +279,7 @@ export default { |
|
|
|
}, |
|
|
|
getPie2() { |
|
|
|
if (this.pieInitState2) { |
|
|
|
console.log("233333333") |
|
|
|
console.log('233333333'); |
|
|
|
this.setPieData2(); |
|
|
|
} else { |
|
|
|
setTimeout(() => { |
|
|
|
@ -300,10 +305,9 @@ export default { |
|
|
|
// }); |
|
|
|
console.log('chartData', chartData); |
|
|
|
this.iniPieChart(chartData); |
|
|
|
|
|
|
|
}, |
|
|
|
setPieData2() { |
|
|
|
console.log("dddddddddddd") |
|
|
|
console.log('dddddddddddd'); |
|
|
|
// let data = [...this.pieData]; |
|
|
|
// console.log('data', data); |
|
|
|
let chartData = { |
|
|
|
@ -321,7 +325,6 @@ export default { |
|
|
|
// }); |
|
|
|
console.log('chartData', chartData); |
|
|
|
this.iniPieChart2(chartData); |
|
|
|
|
|
|
|
}, |
|
|
|
// 获取饼状图 |
|
|
|
async iniPieChart(chartData) { |
|
|
|
@ -426,11 +429,10 @@ export default { |
|
|
|
this.$refs.pieChart.setOption(this.pieOption); |
|
|
|
}, |
|
|
|
async iniPieChart2(chartData) { |
|
|
|
console.log("dddddddddddd") |
|
|
|
console.log('dddddddddddd'); |
|
|
|
this.$refs.pieChart2.clear(); |
|
|
|
// 获取pieChart配置 |
|
|
|
this.pieOption2 = { |
|
|
|
|
|
|
|
color: ['#3C94FE', '#A17AFA', '#A19FFF', '#22C1C3', '#6FC364', '#FEB349', '#FE6252'], |
|
|
|
title: { |
|
|
|
text: '12345', |
|
|
|
@ -447,8 +449,28 @@ export default { |
|
|
|
color: '#333333' |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
series: [ |
|
|
|
{ |
|
|
|
type: 'pie', |
|
|
|
radius: ['65%', '80%'], |
|
|
|
avoidLabelOverlap: false, |
|
|
|
label: { |
|
|
|
show: false, |
|
|
|
position: 'center' |
|
|
|
}, |
|
|
|
tooltip: { |
|
|
|
show: true |
|
|
|
}, |
|
|
|
z: 9999, |
|
|
|
data: [ |
|
|
|
{ value: 1048, name: 'Search Engine' }, |
|
|
|
{ value: 735, name: 'Direct' }, |
|
|
|
{ value: 580, name: 'Email' }, |
|
|
|
{ value: 484, name: 'Union Ads' }, |
|
|
|
{ value: 300, name: 'Video Ads' } |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: 'pie', |
|
|
|
radius: ['60%', '85%'], |
|
|
|
@ -475,26 +497,6 @@ export default { |
|
|
|
color: '#f7f7f7' |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
type: 'pie', |
|
|
|
radius: ['65%', '80%'], |
|
|
|
avoidLabelOverlap: false, |
|
|
|
label: { |
|
|
|
show: false, |
|
|
|
position: 'center' |
|
|
|
}, |
|
|
|
tooltip: { |
|
|
|
show: true |
|
|
|
}, |
|
|
|
data: [ |
|
|
|
{ value: 1048, name: 'Search Engine' }, |
|
|
|
{ value: 735, name: 'Direct' }, |
|
|
|
{ value: 580, name: 'Email' }, |
|
|
|
{ value: 484, name: 'Union Ads' }, |
|
|
|
{ value: 300, name: 'Video Ads' } |
|
|
|
] |
|
|
|
} |
|
|
|
] |
|
|
|
}; |
|
|
|
@ -524,7 +526,7 @@ export default { |
|
|
|
if (param.data.level == 'street') { |
|
|
|
this.orgType = 'community'; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
this.orgId = param.data.id; |
|
|
|
this.orgName = param.data.name; |
|
|
|
this.pageNo = 1; |
|
|
|
@ -573,8 +575,9 @@ export default { |
|
|
|
return this.$message.error(res.msg); |
|
|
|
} else { |
|
|
|
console.log('获取组织树成功', res.data); |
|
|
|
this.orgOptions = []; |
|
|
|
this.orgOptions.push(res.data); |
|
|
|
let { agencyList, subAgencyList } = res.data; |
|
|
|
const _arr = [{ ...agencyList, subAgencyList: [...subAgencyList] }]; |
|
|
|
this.orgOptions = this.deepTree(_arr); |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
|