|
@@ -11,11 +11,15 @@
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
<view v-show="currentTab != 3" style="width: 100%;height: 250px;">
|
|
<view v-show="currentTab != 3" style="width: 100%;height: 250px;">
|
|
|
- <l-echart ref="chart" @finished="init"></l-echart>
|
|
|
|
|
|
|
+ <l-echart class="width-100 height-100" ref="chart" @finished="init"></l-echart>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="area-title">
|
|
|
|
|
+ <u-icon name="map-fill" color="#65371b"></u-icon>
|
|
|
|
|
+ <view class="area-title-text">{{currentAreaName || '广东省'}}</view>
|
|
|
</view>
|
|
</view>
|
|
|
<u-tabs ref="tabs" :list="tabList" :scrollable="false" :current="currentTab" @change="tabChange" lineColor="#65371b"
|
|
<u-tabs ref="tabs" :list="tabList" :scrollable="false" :current="currentTab" @change="tabChange" lineColor="#65371b"
|
|
|
:activeStyle="{color:'#65371b'}" inactiveStyle="{color:'#65371b'}"></u-tabs>
|
|
:activeStyle="{color:'#65371b'}" inactiveStyle="{color:'#65371b'}"></u-tabs>
|
|
|
- <u-list @scrolltolower="scrolltolower" :height="currentTab != 3?'calc(100% - 341px)':'calc(100% - 91px)'"
|
|
|
|
|
|
|
+ <u-list @scrolltolower="scrolltolower" :height="currentTab != 3?'calc(100% - 383px)':'calc(100% - 91px)'"
|
|
|
lowerThreshold="10">
|
|
lowerThreshold="10">
|
|
|
|
|
|
|
|
<view class="info-list">
|
|
<view class="info-list">
|
|
@@ -51,6 +55,7 @@
|
|
|
left: 'right'
|
|
left: 'right'
|
|
|
},
|
|
},
|
|
|
tooltip: {
|
|
tooltip: {
|
|
|
|
|
+ show: false,
|
|
|
trigger: 'item',
|
|
trigger: 'item',
|
|
|
formatter: '{b}'
|
|
formatter: '{b}'
|
|
|
},
|
|
},
|
|
@@ -164,6 +169,7 @@
|
|
|
},
|
|
},
|
|
|
keyword: '',
|
|
keyword: '',
|
|
|
areaCode: '',
|
|
areaCode: '',
|
|
|
|
|
+ currentAreaName: '',
|
|
|
list: [],
|
|
list: [],
|
|
|
tabList: [{
|
|
tabList: [{
|
|
|
name: '名店',
|
|
name: '名店',
|
|
@@ -180,7 +186,7 @@
|
|
|
onLoad(options) {},
|
|
onLoad(options) {},
|
|
|
onShow() {
|
|
onShow() {
|
|
|
uni.hideLoading()
|
|
uni.hideLoading()
|
|
|
- // this.doRefresh()
|
|
|
|
|
|
|
+ this.doRefresh()
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
async init() {
|
|
async init() {
|
|
@@ -193,24 +199,26 @@
|
|
|
},
|
|
},
|
|
|
|
|
|
|
|
clickMap(e) {
|
|
clickMap(e) {
|
|
|
- let currentAcode;
|
|
|
|
|
- if (!(e.data && e.data.name)) {
|
|
|
|
|
- currentAcode = '';
|
|
|
|
|
- } else {
|
|
|
|
|
|
|
+ let currentAcode = '',
|
|
|
|
|
+ currentAreaName = '';
|
|
|
|
|
+ if (e.data && e.data.name) {
|
|
|
/** 通过名称匹配 */
|
|
/** 通过名称匹配 */
|
|
|
for (let i = 0; i < mapJson.features.length; i++) {
|
|
for (let i = 0; i < mapJson.features.length; i++) {
|
|
|
let p = mapJson.features[i].properties;
|
|
let p = mapJson.features[i].properties;
|
|
|
if (p.name == e.data.name) {
|
|
if (p.name == e.data.name) {
|
|
|
currentAcode = p.adcode.toString().substring(0, 4);
|
|
currentAcode = p.adcode.toString().substring(0, 4);
|
|
|
|
|
+ currentAreaName = p.name;
|
|
|
break;
|
|
break;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
if (this.currentTab != 3 && this.areaCode != currentAcode) {
|
|
if (this.currentTab != 3 && this.areaCode != currentAcode) {
|
|
|
this.areaCode = currentAcode;
|
|
this.areaCode = currentAcode;
|
|
|
|
|
+ this.currentAreaName = currentAreaName;
|
|
|
this.areaSearch();
|
|
this.areaSearch();
|
|
|
} else if (this.currentTab != 3 && this.areaCode == currentAcode) {
|
|
} else if (this.currentTab != 3 && this.areaCode == currentAcode) {
|
|
|
this.areaCode = '';
|
|
this.areaCode = '';
|
|
|
|
|
+ this.currentAreaName = ''
|
|
|
myChart.dispatchAction({
|
|
myChart.dispatchAction({
|
|
|
type: 'downplay',
|
|
type: 'downplay',
|
|
|
seriesIndex: e.seriesIndex
|
|
seriesIndex: e.seriesIndex
|
|
@@ -337,6 +345,20 @@
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+ .area-title {
|
|
|
|
|
+ width: calc(100% - 40px);
|
|
|
|
|
+ margin: auto;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ padding: 10px 0px;
|
|
|
|
|
+ border-bottom: 2rpx solid #65371b;
|
|
|
|
|
+
|
|
|
|
|
+ .area-title-text {
|
|
|
|
|
+ margin-left: 10px;
|
|
|
|
|
+ color: #65371b;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
.nav-btns {
|
|
.nav-btns {
|
|
|
border-bottom: 1rpx solid #65371b;
|
|
border-bottom: 1rpx solid #65371b;
|
|
|
margin-bottom: 20rpx;
|
|
margin-bottom: 20rpx;
|