|
@@ -3,33 +3,35 @@
|
|
|
<zj-page-container>
|
|
|
<map-data-statistics />
|
|
|
<zj-page-fill>
|
|
|
- <div style="
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- position: relative;
|
|
|
- ">
|
|
|
+ <div style="width: 100%; height: 100%; overflow: hidden; position: relative">
|
|
|
<div id="chart_7" class="chart t_btn9" style="width: 100%; height: 100%"></div>
|
|
|
<div class="leixingxianshi">
|
|
|
<div class="viewfilediv">
|
|
|
- <div class="zfx" style="width:60px; background: linear-gradient(to right, #6ada40,#ebe24a,#d73921);">
|
|
|
- </div>
|
|
|
+ <div
|
|
|
+ class="zfx"
|
|
|
+ style="width: 60px; background: linear-gradient(to right, #6ada40, #ebe24a, #d73921)"
|
|
|
+ ></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="pingtaixianshisheng" v-if="shengData">
|
|
|
<div class="shengbiaoti">
|
|
|
{{ isSelectBool }}
|
|
|
- <i @click="() => {
|
|
|
- shengData = null
|
|
|
- if (isSelectBool) {
|
|
|
- myChart.dispatchAction({
|
|
|
- type: 'unselect',
|
|
|
- name: [isSelectBool]
|
|
|
- })
|
|
|
- isSelectBool = ''
|
|
|
- }
|
|
|
-
|
|
|
- }" style="float: right;color: #fff;margin-top: 12px; margin-right: -8px;" class="el-icon-circle-close"></i>
|
|
|
+ <i
|
|
|
+ @click="
|
|
|
+ () => {
|
|
|
+ shengData = null
|
|
|
+ if (isSelectBool) {
|
|
|
+ myChart.dispatchAction({
|
|
|
+ type: 'unselect',
|
|
|
+ name: [isSelectBool]
|
|
|
+ })
|
|
|
+ isSelectBool = ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ "
|
|
|
+ style="float: right; color: #fff; margin-top: 12px; margin-right: -8px"
|
|
|
+ class="el-icon-circle-close"
|
|
|
+ ></i>
|
|
|
</div>
|
|
|
<div class="shengshujukuang">
|
|
|
<div>商户数:{{ shengData.companyNum }}</div>
|
|
@@ -42,35 +44,54 @@
|
|
|
<div>增值订单:{{ shengData.increOrderNum }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div v-if="list_.length" class="pingtaixianshisheng" style="width: 100%;height: auto;min-height: 100px;">
|
|
|
- <div class="shengbiaoti"
|
|
|
- style="font-size: 14px;border-bottom: 1px solid #50C9FD; line-height: 38px; margin-bottom: 8px;display: flex;justify-content: space-between;align-items: center;box-sizing: border-box;position: relative;padding-right: 30px;">
|
|
|
+ <div v-if="list_.length" class="pingtaixianshisheng" style="width: 100%; height: auto; min-height: 100px">
|
|
|
+ <div
|
|
|
+ class="shengbiaoti"
|
|
|
+ style="
|
|
|
+ font-size: 14px;
|
|
|
+ border-bottom: 1px solid #50c9fd;
|
|
|
+ line-height: 38px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: relative;
|
|
|
+ padding-right: 30px;
|
|
|
+ "
|
|
|
+ >
|
|
|
<!-- <span>{{ isSelectBool }}</span> -->
|
|
|
<span>{{ userInfo && userInfo.city }}</span>
|
|
|
- <span>总已完工 {{ cityInfo.num }}单/台 总未完工 <span>{{ cityInfo.numWwg }}</span>单/台</span>
|
|
|
- <i @click="guanbitanchuang2" style="position: absolute; top: 10px; right: -8px;color: #fff;"
|
|
|
- class="el-icon-circle-close"></i>
|
|
|
+ <span
|
|
|
+ >总已完工 {{ cityInfo.num }}单/台 总未完工 <span>{{ cityInfo.numWwg }}</span
|
|
|
+ >单/台</span
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ @click="guanbitanchuang2"
|
|
|
+ style="position: absolute; top: 10px; right: -8px; color: #fff"
|
|
|
+ class="el-icon-circle-close"
|
|
|
+ ></i>
|
|
|
</div>
|
|
|
- <div style="width:100%;">
|
|
|
- <table style="width:100%;">
|
|
|
- <thead style="width:100%;">
|
|
|
+ <div style="width: 100%">
|
|
|
+ <table style="width: 100%">
|
|
|
+ <thead style="width: 100%">
|
|
|
<tr>
|
|
|
- <th style="color: #50C9FD;font-size:12px;width: 17.5%;text-align: left;">
|
|
|
+ <th style="color: #50c9fd; font-size: 12px; width: 17.5%; text-align: left">
|
|
|
<div align="left">街道</div>
|
|
|
</th>
|
|
|
- <th style="color: #50C9FD;font-size:12px;width: 16.5%;text-align: left;">
|
|
|
+ <th style="color: #50c9fd; font-size: 12px; width: 16.5%; text-align: left">
|
|
|
<div align="left">安装完工/未完工(台)</div>
|
|
|
</th>
|
|
|
- <th style="color: #50C9FD;font-size:12px;width: 16.5%;text-align: left;">
|
|
|
+ <th style="color: #50c9fd; font-size: 12px; width: 16.5%; text-align: left">
|
|
|
<div align="left">维修完工/未完工(台)</div>
|
|
|
</th>
|
|
|
- <th style="color: #50C9FD;font-size:12px;width: 16.5%;text-align: left;">
|
|
|
+ <th style="color: #50c9fd; font-size: 12px; width: 16.5%; text-align: left">
|
|
|
<div align="left">清洗完工/未完工(台)</div>
|
|
|
</th>
|
|
|
- <th style="color: #50C9FD;font-size:12px;width: 16.5%;text-align: left;">
|
|
|
+ <th style="color: #50c9fd; font-size: 12px; width: 16.5%; text-align: left">
|
|
|
<div align="left">增值完工/未完工(台)</div>
|
|
|
</th>
|
|
|
- <th style="color: #50C9FD;font-size:12px;width: 16.5%;text-align: left;">
|
|
|
+ <th style="color: #50c9fd; font-size: 12px; width: 16.5%; text-align: left">
|
|
|
<div align="left">维保完工/未完工(台)</div>
|
|
|
</th>
|
|
|
</tr>
|
|
@@ -78,49 +99,59 @@
|
|
|
<tbody>
|
|
|
<tr v-for="(item, index) in list_" :key="index">
|
|
|
<td>
|
|
|
- <div class="bkiuybhlinjm left" style="font-size: 14px;">{{ item.streetName }}</div>
|
|
|
+ <div class="bkiuybhlinjm left" style="font-size: 14px">{{ item.streetName }}</div>
|
|
|
</td>
|
|
|
<td>
|
|
|
<div class="bkiuybhlinjm">
|
|
|
- <span style="font-size: 14px;">{{ item.azgd }}</span>
|
|
|
- <span style="padding: 0 2px;">/</span>
|
|
|
- <span style="font-size: 14px;"><span style="color:#50C9FD">{{ item.azgdwwg }}</span></span>
|
|
|
+ <span style="font-size: 14px">{{ item.azgd }}</span>
|
|
|
+ <span style="padding: 0 2px">/</span>
|
|
|
+ <span style="font-size: 14px"
|
|
|
+ ><span style="color: #50c9fd">{{ item.azgdwwg }}</span></span
|
|
|
+ >
|
|
|
</div>
|
|
|
</td>
|
|
|
<td>
|
|
|
<div class="bkiuybhlinjm">
|
|
|
- <span style="font-size: 14px;">{{ item.wxgd }}</span>
|
|
|
- <span style="padding: 0 2px;">/</span>
|
|
|
- <span style="font-size: 14px;"><span style="color:#50C9FD">{{ item.wxgdwwg }}</span></span>
|
|
|
+ <span style="font-size: 14px">{{ item.wxgd }}</span>
|
|
|
+ <span style="padding: 0 2px">/</span>
|
|
|
+ <span style="font-size: 14px"
|
|
|
+ ><span style="color: #50c9fd">{{ item.wxgdwwg }}</span></span
|
|
|
+ >
|
|
|
</div>
|
|
|
</td>
|
|
|
<td>
|
|
|
<div class="bkiuybhlinjm">
|
|
|
- <span style="font-size: 14px;">{{ item.qxgd }}</span>
|
|
|
- <span style="padding: 0 2px;">/</span>
|
|
|
- <span style="font-size: 14px;"><span style="color:#50C9FD">{{ item.qxgdwwg }}</span></span>
|
|
|
+ <span style="font-size: 14px">{{ item.qxgd }}</span>
|
|
|
+ <span style="padding: 0 2px">/</span>
|
|
|
+ <span style="font-size: 14px"
|
|
|
+ ><span style="color: #50c9fd">{{ item.qxgdwwg }}</span></span
|
|
|
+ >
|
|
|
</div>
|
|
|
</td>
|
|
|
<td>
|
|
|
<div class="bkiuybhlinjm">
|
|
|
- <span style="font-size: 14px;">{{ item.zzgd }}</span>
|
|
|
- <span style="padding: 0 2px;">/</span>
|
|
|
- <span style="font-size: 14px;"><span style="color:#50C9FD">{{ item.zzgdwwg }}</span></span>
|
|
|
+ <span style="font-size: 14px">{{ item.zzgd }}</span>
|
|
|
+ <span style="padding: 0 2px">/</span>
|
|
|
+ <span style="font-size: 14px"
|
|
|
+ ><span style="color: #50c9fd">{{ item.zzgdwwg }}</span></span
|
|
|
+ >
|
|
|
</div>
|
|
|
</td>
|
|
|
<td>
|
|
|
<div class="bkiuybhlinjm">
|
|
|
- <span style="font-size: 14px;">{{ item.wbgd }}</span>
|
|
|
- <span style="padding: 0 2px;">/</span>
|
|
|
- <span style="font-size: 14px;"><span style="color:#50C9FD">{{ item.wbgdwwg }}</span></span>
|
|
|
+ <span style="font-size: 14px">{{ item.wbgd }}</span>
|
|
|
+ <span style="padding: 0 2px">/</span>
|
|
|
+ <span style="font-size: 14px"
|
|
|
+ ><span style="color: #50c9fd">{{ item.wbgdwwg }}</span></span
|
|
|
+ >
|
|
|
</div>
|
|
|
</td>
|
|
|
</tr>
|
|
|
</tbody>
|
|
|
</table>
|
|
|
- <div style="width:100%;display: flex;justify-content: center;align-items: center">
|
|
|
+ <div style="width: 100%; display: flex; justify-content: center; align-items: center">
|
|
|
<el-button type="text" :disabled="!(pageNum > 1)" @click="shangyiye">上一页</el-button>
|
|
|
- <div style="width:50px;text-align: center;color:#50C9FD">{{ pageNum }}</div>
|
|
|
+ <div style="width: 50px; text-align: center; color: #50c9fd">{{ pageNum }}</div>
|
|
|
<el-button type="text" :disabled="!(parseInt(total / 5) > pageNum)" @click="xiayiye">下一页</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -132,45 +163,48 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import zhejiang from './js/zhejiang.js';
|
|
|
-import moduleEnclosure from '@/components/moduleEnclosure.vue';
|
|
|
-import mapDataStatistics from './mapDataStatistics.vue';
|
|
|
-import * as echarts from 'echarts';
|
|
|
-import { bigGetRegion, bigGetLarge9, bigGetLarge10, bigList, bigGetLarge1, bigGetLarge11 } from '@/api/common.js';
|
|
|
+import zhejiang from './js/zhejiang.js'
|
|
|
+import moduleEnclosure from '@/components/moduleEnclosure.vue'
|
|
|
+import mapDataStatistics from './mapDataStatistics.vue'
|
|
|
+import * as echarts from 'echarts'
|
|
|
+import { bigGetRegion, bigGetLarge9, bigGetLarge10, bigList, bigGetLarge1, bigGetLarge11 } from '@/api/common.js'
|
|
|
// 计算 GeoJSON 数据的边界框
|
|
|
function calculateBoundingBox(geoJsonData) {
|
|
|
- let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
|
|
|
- geoJsonData.features.forEach((feature) => {
|
|
|
- const coordinates = feature.geometry.coordinates;
|
|
|
- const type = feature.geometry.type;
|
|
|
+ let minX = Infinity,
|
|
|
+ minY = Infinity,
|
|
|
+ maxX = -Infinity,
|
|
|
+ maxY = -Infinity
|
|
|
+ geoJsonData.features.forEach(feature => {
|
|
|
+ const coordinates = feature.geometry.coordinates
|
|
|
+ const type = feature.geometry.type
|
|
|
if (type === 'Polygon') {
|
|
|
- coordinates.forEach((polygon) => {
|
|
|
- polygon.forEach((coord) => {
|
|
|
- minX = Math.min(minX, coord[0]);
|
|
|
- minY = Math.min(minY, coord[1]);
|
|
|
- maxX = Math.max(maxX, coord[0]);
|
|
|
- maxY = Math.max(maxY, coord[1]);
|
|
|
- });
|
|
|
- });
|
|
|
+ coordinates.forEach(polygon => {
|
|
|
+ polygon.forEach(coord => {
|
|
|
+ minX = Math.min(minX, coord[0])
|
|
|
+ minY = Math.min(minY, coord[1])
|
|
|
+ maxX = Math.max(maxX, coord[0])
|
|
|
+ maxY = Math.max(maxY, coord[1])
|
|
|
+ })
|
|
|
+ })
|
|
|
} else if (type === 'MultiPolygon') {
|
|
|
- coordinates.forEach((multiPolygon) => {
|
|
|
- multiPolygon.forEach((polygon) => {
|
|
|
- polygon.forEach((coord) => {
|
|
|
- minX = Math.min(minX, coord[0]);
|
|
|
- minY = Math.min(minY, coord[1]);
|
|
|
- maxX = Math.max(maxX, coord[0]);
|
|
|
- maxY = Math.max(maxY, coord[1]);
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
+ coordinates.forEach(multiPolygon => {
|
|
|
+ multiPolygon.forEach(polygon => {
|
|
|
+ polygon.forEach(coord => {
|
|
|
+ minX = Math.min(minX, coord[0])
|
|
|
+ minY = Math.min(minY, coord[1])
|
|
|
+ maxX = Math.max(maxX, coord[0])
|
|
|
+ maxY = Math.max(maxY, coord[1])
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
}
|
|
|
- });
|
|
|
- return { minX, minY, maxX, maxY };
|
|
|
+ })
|
|
|
+ return { minX, minY, maxX, maxY }
|
|
|
}
|
|
|
export default {
|
|
|
components: {
|
|
|
moduleEnclosure,
|
|
|
- mapDataStatistics,
|
|
|
+ mapDataStatistics
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
@@ -178,13 +212,13 @@ export default {
|
|
|
geoCoordMap: zhejiang.features.map(function (item) {
|
|
|
return {
|
|
|
name: item.properties.name,
|
|
|
- value: item.properties.center,
|
|
|
- };
|
|
|
+ value: item.properties.center
|
|
|
+ }
|
|
|
}),
|
|
|
data: zhejiang.features.map(function (item) {
|
|
|
return {
|
|
|
- name: item.properties.name,
|
|
|
- };
|
|
|
+ name: item.properties.name
|
|
|
+ }
|
|
|
}),
|
|
|
cIndex: 0,
|
|
|
oldcIndex: 0,
|
|
@@ -192,25 +226,25 @@ export default {
|
|
|
getLarge9: [],
|
|
|
getLarge10: [],
|
|
|
shengData: null,
|
|
|
- isSelectBool: "",
|
|
|
+ isSelectBool: '',
|
|
|
pageNum: 1,
|
|
|
total: 0,
|
|
|
list_: [],
|
|
|
cityInfo: {}
|
|
|
- };
|
|
|
+ }
|
|
|
},
|
|
|
computed: {
|
|
|
userInfo() {
|
|
|
return JSON.parse(localStorage.getItem('greemall_user'))
|
|
|
- },
|
|
|
+ }
|
|
|
},
|
|
|
watch: {
|
|
|
- "userInfo.type": {
|
|
|
+ 'userInfo.type': {
|
|
|
handler(newVal, oldVal) {
|
|
|
this.init(true)
|
|
|
},
|
|
|
deep: true,
|
|
|
- immediate: true,
|
|
|
+ immediate: true
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
@@ -240,9 +274,9 @@ export default {
|
|
|
init() {
|
|
|
if (this.userInfo) {
|
|
|
if (this.userInfo.type == 2) {
|
|
|
- this.getbigGetLarge9({ country: 100000 });
|
|
|
+ this.getbigGetLarge9({ country: 100000 })
|
|
|
} else {
|
|
|
- this.getbigGetLarge10({ province: this.userInfo.province, city: this.userInfo.city });
|
|
|
+ this.getbigGetLarge10({ province: this.userInfo.province, city: this.userInfo.city })
|
|
|
}
|
|
|
}
|
|
|
},
|
|
@@ -250,41 +284,39 @@ export default {
|
|
|
bigGetLarge9().then(res => {
|
|
|
this.getLarge9 = res.data
|
|
|
this.getLarge10 = []
|
|
|
- this.echart_7(pam);
|
|
|
+ this.echart_7(pam)
|
|
|
})
|
|
|
},
|
|
|
getbigGetLarge10(pam) {
|
|
|
bigGetLarge10(pam).then(res => {
|
|
|
this.getLarge9 = []
|
|
|
this.getLarge10 = res.data
|
|
|
- this.echart_7({ province: this.userInfo.province, city: this.userInfo.city });
|
|
|
+ this.echart_7({ province: this.userInfo.province, city: this.userInfo.city })
|
|
|
})
|
|
|
},
|
|
|
echart_7(pam) {
|
|
|
- var that = this;
|
|
|
+ var that = this
|
|
|
if (that.myChart) {
|
|
|
- that.myChart.dispose();
|
|
|
+ that.myChart.dispose()
|
|
|
}
|
|
|
bigGetRegion(pam).then(res => {
|
|
|
// 初始化 ECharts 实例
|
|
|
- that.myChart = echarts.init(document.getElementById('chart_7'));
|
|
|
- const geoJsonData = JSON.parse(res.data);
|
|
|
+ that.myChart = echarts.init(document.getElementById('chart_7'))
|
|
|
+ const geoJsonData = JSON.parse(res.data)
|
|
|
// 计算边界框
|
|
|
- const boundingBox = calculateBoundingBox(geoJsonData);
|
|
|
+ const boundingBox = calculateBoundingBox(geoJsonData)
|
|
|
// 计算中心点
|
|
|
- const center = [
|
|
|
- (boundingBox.minX + boundingBox.maxX) / 2,
|
|
|
- (boundingBox.minY + boundingBox.maxY) / 2
|
|
|
- ];
|
|
|
- echarts.registerMap('china', geoJsonData);
|
|
|
+ const center = [(boundingBox.minX + boundingBox.maxX) / 2, (boundingBox.minY + boundingBox.maxY) / 2]
|
|
|
+ echarts.registerMap('china', geoJsonData)
|
|
|
// 指定城市和颜色
|
|
|
- var cityColors = {};
|
|
|
+ var cityColors = {}
|
|
|
this.getLarge9.map(name => {
|
|
|
- cityColors[name] = "#009eff";
|
|
|
- });
|
|
|
+ cityColors[name] = '#009eff'
|
|
|
+ })
|
|
|
this.getLarge10.map(item => {
|
|
|
- cityColors[item.area] = item.num <= 2 ? "#6ada40" : item.num <= 4 ? "#ebe24a" : item.num > 4 ? "#d73921" : "none"
|
|
|
- });
|
|
|
+ cityColors[item.area] =
|
|
|
+ item.num <= 2 ? '#6ada40' : item.num <= 4 ? '#ebe24a' : item.num > 4 ? '#d73921' : 'none'
|
|
|
+ })
|
|
|
// 构建 series 数据
|
|
|
var seriesData = Object.keys(cityColors).map(function (city) {
|
|
|
return {
|
|
@@ -292,23 +324,23 @@ export default {
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
areaColor: cityColors[city],
|
|
|
- borderColor: cityColors[city],
|
|
|
+ borderColor: cityColors[city]
|
|
|
},
|
|
|
emphasis: {
|
|
|
- label: { show: true, color: "#ffffff", },
|
|
|
+ label: { show: true, color: '#ffffff' },
|
|
|
areaColor: 'none',
|
|
|
borderColor: 1
|
|
|
}
|
|
|
- },
|
|
|
- };
|
|
|
- });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
var mapcon = {
|
|
|
label: {
|
|
|
emphasis: {
|
|
|
textStyle: {
|
|
|
- color: '#beecff',
|
|
|
- },
|
|
|
- },
|
|
|
+ color: '#beecff'
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
@@ -322,26 +354,26 @@ export default {
|
|
|
colorStops: [
|
|
|
{
|
|
|
offset: 0,
|
|
|
- color: 'rgba(0,144,255, 0)', // 0% 处的颜色
|
|
|
+ color: 'rgba(0,144,255, 0)' // 0% 处的颜色
|
|
|
},
|
|
|
{
|
|
|
offset: 1,
|
|
|
- color: 'rgba(0,144,255, .1)', // 100% 处的颜色
|
|
|
+ color: 'rgba(0,144,255, .1)' // 100% 处的颜色
|
|
|
},
|
|
|
{
|
|
|
offset: 1,
|
|
|
- color: 'rgba(0,144,255, 1)', // 100% 处的颜色
|
|
|
- },
|
|
|
+ color: 'rgba(0,144,255, 1)' // 100% 处的颜色
|
|
|
+ }
|
|
|
],
|
|
|
- globalCoord: false, // 缺省为 false
|
|
|
+ globalCoord: false // 缺省为 false
|
|
|
},
|
|
|
shadowColor: 'rgba(0,144,255, 1)',
|
|
|
shadowOffsetX: -1,
|
|
|
shadowOffsetY: 1,
|
|
|
- shadowBlur: 10,
|
|
|
+ shadowBlur: 10
|
|
|
},
|
|
|
emphasis: {
|
|
|
- label: { show: true, color: "#ffffff", },
|
|
|
+ label: { show: true, color: '#ffffff' },
|
|
|
areaColor: 'none',
|
|
|
borderColor: 1
|
|
|
}
|
|
@@ -350,15 +382,15 @@ export default {
|
|
|
// 地图选中区域样式
|
|
|
label: {
|
|
|
// 选中区域的label(文字)样式
|
|
|
- color: '#fff',
|
|
|
+ color: '#fff'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
// 选中区域的默认样式
|
|
|
- areaColor: '#7024fb',
|
|
|
- },
|
|
|
+ areaColor: '#7024fb'
|
|
|
+ }
|
|
|
},
|
|
|
- animation: false,
|
|
|
- };
|
|
|
+ animation: false
|
|
|
+ }
|
|
|
// 配置项
|
|
|
var option = {
|
|
|
tooltip: {
|
|
@@ -375,10 +407,10 @@ export default {
|
|
|
regions: [
|
|
|
...seriesData,
|
|
|
{
|
|
|
- name: "南海诸岛",
|
|
|
+ name: '南海诸岛',
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
- opacity: 0,
|
|
|
+ opacity: 0
|
|
|
}
|
|
|
},
|
|
|
label: {
|
|
@@ -387,25 +419,27 @@ export default {
|
|
|
}
|
|
|
]
|
|
|
},
|
|
|
- series: [{
|
|
|
- type: 'map',
|
|
|
- map: 'china',
|
|
|
- ...mapcon,
|
|
|
- geoIndex: 0,
|
|
|
- data: seriesData,
|
|
|
- emphasis: {
|
|
|
- label: { show: true, color: "#ffffff", },
|
|
|
- areaColor: 'none',
|
|
|
- borderColor: 1
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ type: 'map',
|
|
|
+ map: 'china',
|
|
|
+ ...mapcon,
|
|
|
+ geoIndex: 0,
|
|
|
+ data: seriesData,
|
|
|
+ emphasis: {
|
|
|
+ label: { show: true, color: '#ffffff' },
|
|
|
+ areaColor: 'none',
|
|
|
+ borderColor: 1
|
|
|
+ }
|
|
|
}
|
|
|
- }]
|
|
|
- };
|
|
|
+ ]
|
|
|
+ }
|
|
|
// 使用配置项生成图表
|
|
|
- that.myChart.setOption(option);
|
|
|
+ that.myChart.setOption(option)
|
|
|
var bool_i = false
|
|
|
that.myChart.on('selectchanged', function (params) {
|
|
|
bool_i = !!params.selected.length
|
|
|
- });
|
|
|
+ })
|
|
|
// 监听点击事件
|
|
|
that.myChart.on('click', function (params) {
|
|
|
if (bool_i) {
|
|
@@ -430,7 +464,7 @@ export default {
|
|
|
bigGetLarge11({
|
|
|
// area: that.isSelectBool,
|
|
|
city: that.userInfo.city,
|
|
|
- province: that.userInfo.province,
|
|
|
+ province: that.userInfo.province
|
|
|
}).then(res => {
|
|
|
that.cityInfo = res.data
|
|
|
})
|
|
@@ -442,8 +476,8 @@ export default {
|
|
|
that.guanbitanchuang()
|
|
|
that.guanbitanchuang2()
|
|
|
}
|
|
|
- });
|
|
|
- });
|
|
|
+ })
|
|
|
+ })
|
|
|
},
|
|
|
pagedatalist() {
|
|
|
if (this.isSelectBool) {
|
|
@@ -464,7 +498,6 @@ export default {
|
|
|
this.pageNum++
|
|
|
this.pagedatalist()
|
|
|
} else {
|
|
|
-
|
|
|
}
|
|
|
},
|
|
|
shangyiye() {
|
|
@@ -472,11 +505,10 @@ export default {
|
|
|
this.pageNum--
|
|
|
this.pagedatalist()
|
|
|
} else {
|
|
|
-
|
|
|
}
|
|
|
}
|
|
|
- },
|
|
|
-};
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
@@ -486,7 +518,7 @@ export default {
|
|
|
left: 0;
|
|
|
width: 467px;
|
|
|
height: 120px;
|
|
|
- background: #04418F;
|
|
|
+ background: #04418f;
|
|
|
border-radius: 5px;
|
|
|
opacity: 0.8;
|
|
|
z-index: 999;
|
|
@@ -497,7 +529,7 @@ export default {
|
|
|
font-family: Source Han Sans CN;
|
|
|
font-weight: 500;
|
|
|
font-size: 18px;
|
|
|
- color: #50C9FD;
|
|
|
+ color: #50c9fd;
|
|
|
line-height: 49px;
|
|
|
}
|
|
|
|
|
@@ -510,7 +542,7 @@ export default {
|
|
|
font-family: Source Han Sans CN;
|
|
|
font-weight: 400;
|
|
|
font-size: 13px;
|
|
|
- color: #FFFFFF;
|
|
|
+ color: #ffffff;
|
|
|
line-height: 26px;
|
|
|
|
|
|
div {
|
|
@@ -602,4 +634,4 @@ export default {
|
|
|
justify-content: flex-start;
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|