|
|
@ -26,7 +26,7 @@
|
|
|
|
clearable
|
|
|
|
clearable
|
|
|
|
v-model="searchParam.state"
|
|
|
|
v-model="searchParam.state"
|
|
|
|
placeholder="请选择"
|
|
|
|
placeholder="请选择"
|
|
|
|
@change="changeChart('gauge')"
|
|
|
|
@change="changeChart"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<el-option
|
|
|
|
<el-option
|
|
|
|
v-for="item in stateList"
|
|
|
|
v-for="item in stateList"
|
|
|
@ -42,7 +42,7 @@
|
|
|
|
clearable
|
|
|
|
clearable
|
|
|
|
v-model="searchParam.area"
|
|
|
|
v-model="searchParam.area"
|
|
|
|
placeholder="全部"
|
|
|
|
placeholder="全部"
|
|
|
|
@change="changeChart('dpie')"
|
|
|
|
@change="areaChange"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<el-option
|
|
|
|
<el-option
|
|
|
|
v-for="item in zhAreaList"
|
|
|
|
v-for="item in zhAreaList"
|
|
|
@ -57,7 +57,11 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="midWrap">
|
|
|
|
<div class="midWrap">
|
|
|
|
<mapWrap></mapWrap>
|
|
|
|
<mapWrap
|
|
|
|
|
|
|
|
:chartObj="dataObj"
|
|
|
|
|
|
|
|
ref="mapChart"
|
|
|
|
|
|
|
|
@mapClick="mapClick"
|
|
|
|
|
|
|
|
></mapWrap>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="btmWrap">
|
|
|
|
<div class="btmWrap">
|
|
|
|
<div
|
|
|
|
<div
|
|
|
@ -72,11 +76,19 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="rightWrap">
|
|
|
|
<div class="rightWrap">
|
|
|
|
<div class="zgHead">各区域整改企业数量</div>
|
|
|
|
<div
|
|
|
|
<div class="zgBody zgBarBody" v-if="chartType == 'bar'">
|
|
|
|
class="zgHead"
|
|
|
|
|
|
|
|
@click="gotoPage('/teamWork/problemRectify/indexTrack')"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
{{ title }}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="zgBody zgBarBody canvasDefault" v-if="chartType == 'bar'">
|
|
|
|
<barWrap :chartObj="qyObj"></barWrap>
|
|
|
|
<barWrap :chartObj="qyObj"></barWrap>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="zgBody zgPieBody" v-if="chartType == 'dpie'">
|
|
|
|
<div
|
|
|
|
|
|
|
|
class="zgBody zgPieBody canvasDefault"
|
|
|
|
|
|
|
|
v-if="chartType == 'dpie'"
|
|
|
|
|
|
|
|
>
|
|
|
|
<div class="topWrap">
|
|
|
|
<div class="topWrap">
|
|
|
|
<div class="label">整改企业总数</div>
|
|
|
|
<div class="label">整改企业总数</div>
|
|
|
|
<div class="value">298</div>
|
|
|
|
<div class="value">298</div>
|
|
|
@ -91,7 +103,7 @@
|
|
|
|
<div class="label">易制毒</div>
|
|
|
|
<div class="label">易制毒</div>
|
|
|
|
<div class="label">重点消防单位</div>
|
|
|
|
<div class="label">重点消防单位</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="midWrap">
|
|
|
|
<div class="midWrap canvasDefault">
|
|
|
|
<gaugeWrap :chartObj="qyObj"></gaugeWrap>
|
|
|
|
<gaugeWrap :chartObj="qyObj"></gaugeWrap>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="btmWrap">
|
|
|
|
<div class="btmWrap">
|
|
|
@ -175,6 +187,85 @@ export default {
|
|
|
|
disableMixinCreated: true,
|
|
|
|
disableMixinCreated: true,
|
|
|
|
timeArr: [],
|
|
|
|
timeArr: [],
|
|
|
|
timeValue: "",
|
|
|
|
timeValue: "",
|
|
|
|
|
|
|
|
title: "各区域整改企业数量",
|
|
|
|
|
|
|
|
dataObj: {
|
|
|
|
|
|
|
|
points: [
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.716889,
|
|
|
|
|
|
|
|
29.964717,
|
|
|
|
|
|
|
|
{ name: "招宝山街道", value: "330211000", yn: 32, zn: 5, wn: 3 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.672319,
|
|
|
|
|
|
|
|
29.961326,
|
|
|
|
|
|
|
|
{ name: "蛟川街道", value: "330211006", yn: 28, zn: 8, wn: 1 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.582491,
|
|
|
|
|
|
|
|
29.97749,
|
|
|
|
|
|
|
|
{ name: "骆驼街道", value: "330211003", yn: 24, zn: 7, wn: 2 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.632643,
|
|
|
|
|
|
|
|
29.932736,
|
|
|
|
|
|
|
|
{ name: "庄市街道", value: "330211004", yn: 21, zn: 10, wn: 4 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.618127,
|
|
|
|
|
|
|
|
29.974399,
|
|
|
|
|
|
|
|
{ name: "贵驷街道", value: "330211005", yn: 18, zn: 11, wn: 5 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.630811,
|
|
|
|
|
|
|
|
30.024586,
|
|
|
|
|
|
|
|
{ name: "澥浦镇", value: "330211002", yn: 27, zn: 9, wn: 3 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.525171,
|
|
|
|
|
|
|
|
30.019719,
|
|
|
|
|
|
|
|
{ name: "九龙湖镇", value: "330211001", yn: 25, zn: 8, wn: 2 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
temp: [
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.716889,
|
|
|
|
|
|
|
|
29.964717,
|
|
|
|
|
|
|
|
{ name: "招宝山街道", value: "330211000", yn: 32, zn: 5, wn: 3 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.672319,
|
|
|
|
|
|
|
|
29.961326,
|
|
|
|
|
|
|
|
{ name: "蛟川街道", value: "330211006", yn: 28, zn: 8, wn: 1 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.582491,
|
|
|
|
|
|
|
|
29.97749,
|
|
|
|
|
|
|
|
{ name: "骆驼街道", value: "330211003", yn: 24, zn: 7, wn: 2 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.632643,
|
|
|
|
|
|
|
|
29.932736,
|
|
|
|
|
|
|
|
{ name: "庄市街道", value: "330211004", yn: 21, zn: 10, wn: 4 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.618127,
|
|
|
|
|
|
|
|
29.974399,
|
|
|
|
|
|
|
|
{ name: "贵驷街道", value: "330211005", yn: 18, zn: 11, wn: 5 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.630811,
|
|
|
|
|
|
|
|
30.024586,
|
|
|
|
|
|
|
|
{ name: "澥浦镇", value: "330211002", yn: 27, zn: 9, wn: 3 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
[
|
|
|
|
|
|
|
|
121.525171,
|
|
|
|
|
|
|
|
30.019719,
|
|
|
|
|
|
|
|
{ name: "九龙湖镇", value: "330211001", yn: 25, zn: 8, wn: 2 },
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
optType: "",
|
|
|
|
|
|
|
|
val: "",
|
|
|
|
|
|
|
|
},
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
mounted() {
|
|
|
@ -188,11 +279,22 @@ export default {
|
|
|
|
timeSelect(val) {
|
|
|
|
timeSelect(val) {
|
|
|
|
this.timeValue = val;
|
|
|
|
this.timeValue = val;
|
|
|
|
},
|
|
|
|
},
|
|
|
|
changeChart(type) {
|
|
|
|
changeChart(val) {
|
|
|
|
this.chartType = type;
|
|
|
|
this.dataObj.optType = "state";
|
|
|
|
|
|
|
|
this.dataObj.val = val;
|
|
|
|
},
|
|
|
|
},
|
|
|
|
areaChange(val) {
|
|
|
|
areaChange(val) {
|
|
|
|
console.log(val);
|
|
|
|
this.chartType = "dpie";
|
|
|
|
|
|
|
|
/* if (!val) {
|
|
|
|
|
|
|
|
this.dataObj.points = this.dataObj.temp;
|
|
|
|
|
|
|
|
return;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
let findIndex = this.dataObj.temp.findIndex((e) => {
|
|
|
|
|
|
|
|
return (e[2]["value"] = val);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
if (findIndex > -1) {
|
|
|
|
|
|
|
|
this.dataObj.points = this.dataObj.temp[findIndex];
|
|
|
|
|
|
|
|
} */
|
|
|
|
},
|
|
|
|
},
|
|
|
|
getLast12Months() {
|
|
|
|
getLast12Months() {
|
|
|
|
const now = new Date();
|
|
|
|
const now = new Date();
|
|
|
@ -210,6 +312,11 @@ export default {
|
|
|
|
path: path,
|
|
|
|
path: path,
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
mapClick(e) {
|
|
|
|
|
|
|
|
console.log(e);
|
|
|
|
|
|
|
|
this.chartType = "gauge";
|
|
|
|
|
|
|
|
this.title = e.name || e.data[2]["name"];
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
@ -246,8 +353,6 @@ export default {
|
|
|
|
center center;
|
|
|
|
center center;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.name {
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.value {
|
|
|
|
.value {
|
|
|
|
font-weight: 400;
|
|
|
|
font-weight: 400;
|
|
|
@ -259,6 +364,9 @@ export default {
|
|
|
|
&:hover {
|
|
|
|
&:hover {
|
|
|
|
opacity: 0.8;
|
|
|
|
opacity: 0.8;
|
|
|
|
cursor: pointer;
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
.name {
|
|
|
|
|
|
|
|
text-decoration: underline;
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
@ -308,11 +416,16 @@ export default {
|
|
|
|
background: url("~@/assets/images/team/screenct.png") no-repeat center
|
|
|
|
background: url("~@/assets/images/team/screenct.png") no-repeat center
|
|
|
|
center;
|
|
|
|
center;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
opacity: 0.8;
|
|
|
|
|
|
|
|
text-decoration: underline;
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.zgBody {
|
|
|
|
.zgBody {
|
|
|
|
margin-top: -10px;
|
|
|
|
margin-top: -10px;
|
|
|
|
margin-left: 9px;
|
|
|
|
margin-left: 9px;
|
|
|
|
height: calc(100% - 40px);
|
|
|
|
height: calc(100% - 30px);
|
|
|
|
background: linear-gradient(
|
|
|
|
background: linear-gradient(
|
|
|
|
177deg,
|
|
|
|
177deg,
|
|
|
|
rgba(165, 200, 199, 0.1) 0%,
|
|
|
|
rgba(165, 200, 199, 0.1) 0%,
|
|
|
|