|
@@ -2,6 +2,7 @@
|
|
|
<div class="centermap">
|
|
|
<div class="mapwrap" v-if="pageflag">
|
|
|
<dv-border-box-12>
|
|
|
+ <div class="loading" v-if="loading"><a-spin /></div>
|
|
|
<div class="quanguo" @click="getData('china')" v-if="code !== 'china'">
|
|
|
返回
|
|
|
</div>
|
|
@@ -25,7 +26,8 @@ export default {
|
|
|
echartBindClick: false,
|
|
|
isSouthChinaSea: false, // 是否要展示南海群岛 修改此值请刷新页面
|
|
|
pageflag: true,
|
|
|
- timer: null
|
|
|
+ timer: null,
|
|
|
+ loading: false
|
|
|
}
|
|
|
},
|
|
|
created () {},
|
|
@@ -53,6 +55,7 @@ export default {
|
|
|
this.timer = setInterval(looper, this.$store.state.setting.echartsAutoTime)
|
|
|
},
|
|
|
getData (code) {
|
|
|
+ this.loading = true
|
|
|
queryMapSaleData().then((res) => {
|
|
|
console.log('地图', res)
|
|
|
if (res.status == 200) {
|
|
@@ -63,6 +66,7 @@ export default {
|
|
|
} else {
|
|
|
this.$Message.warning(res.msg)
|
|
|
}
|
|
|
+ this.loading = false
|
|
|
})
|
|
|
},
|
|
|
/**
|
|
@@ -102,12 +106,12 @@ export default {
|
|
|
if (cityCenter[item.provinceName]) {
|
|
|
newData.push({
|
|
|
name: item.provinceName,
|
|
|
- value: cityCenter[item.provinceName].concat(item.resultQty)
|
|
|
+ value: cityCenter[item.provinceName].concat(item.resultAmount)
|
|
|
})
|
|
|
}
|
|
|
retData.push({
|
|
|
name: item.provinceName,
|
|
|
- value: item.resultQty
|
|
|
+ value: item.resultAmount
|
|
|
})
|
|
|
})
|
|
|
this.init(name, retData, newData)
|
|
@@ -128,22 +132,22 @@ export default {
|
|
|
left: 20,
|
|
|
bottom: 20,
|
|
|
pieces: [
|
|
|
- { gte: 1000000, label: '100万元以上' }, // 不指定 max,表示 max 为无限大(Infinity)。
|
|
|
+ { gte: 10000000, label: '1000万元以上' }, // 不指定 max,表示 max 为无限大(Infinity)。
|
|
|
+ { gte: 5000000, lte: 9999999, label: '500万元-1000万元' },
|
|
|
+ { gte: 1000000, lte: 4999999, label: '100万元-500万元' },
|
|
|
{ gte: 500000, lte: 999999, label: '50万元-100万元' },
|
|
|
- { gte: 100000, lte: 499999, label: '10万元-50万元' },
|
|
|
- { gte: 50000, lte: 99999, label: '5万元-10万元' },
|
|
|
- { gte: 10000, lte: 49999, label: '1万元-5万元' },
|
|
|
- { lte: 9999, label: '1-1万元' } // 不指定 min,表示 min 为无限大(-Infinity)。
|
|
|
+ { gte: 50000, lte: 499999, label: '5万元-50万元' },
|
|
|
+ { lte: 49999, label: '1-5万元' } // 不指定 min,表示 min 为无限大(-Infinity)。
|
|
|
],
|
|
|
inRange: {
|
|
|
// 渐变颜色,从小到大
|
|
|
color: [
|
|
|
- '#1781b5',
|
|
|
- '#2f90b9',
|
|
|
- '#5cb3cc',
|
|
|
- '#66a9c9',
|
|
|
- '#8abcd1',
|
|
|
- '#c3d7df'
|
|
|
+ '#aaffff',
|
|
|
+ '#aaaaff',
|
|
|
+ '#00aa7f',
|
|
|
+ '#00aaff',
|
|
|
+ '#ffaa00',
|
|
|
+ '#ff5500'
|
|
|
]
|
|
|
},
|
|
|
textStyle: {
|
|
@@ -174,7 +178,7 @@ export default {
|
|
|
show: true,
|
|
|
formatter: function (params) {
|
|
|
if (params.data) {
|
|
|
- return params.name + ':' + params.data['value'] + '元'
|
|
|
+ return params.name + ':' + (params.data['value'] / 10000).toFixed(2) + '万元'
|
|
|
} else {
|
|
|
return params.name
|
|
|
}
|
|
@@ -334,9 +338,20 @@ export default {
|
|
|
line-height: 26px;
|
|
|
letter-spacing: 6px;
|
|
|
cursor: pointer;
|
|
|
- box-shadow: 0 2px 4px rgba(0, 237, 237, 0.5),
|
|
|
- 0 0 6px rgba(0, 237, 237, 0.4);
|
|
|
- z-index: 10000;
|
|
|
+ box-shadow: 0 2px 4px rgba(0, 237, 237, 0.5), 0 0 6px rgba(0, 237, 237, 0.4);
|
|
|
+ z-index: 10000;
|
|
|
+ }
|
|
|
+ .loading{
|
|
|
+ position:absolute;
|
|
|
+ z-index: 1000;
|
|
|
+ left:0;
|
|
|
+ top:0;
|
|
|
+ width:100%;
|
|
|
+ height:100%;
|
|
|
+ background:rgba(0,0,0,0.5);
|
|
|
+ display:flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
}
|
|
|
}
|