zfb选择地址

src/components/area-picker/area-picker.vue

@@ -1,7 +1,29 @@
 <template>
 	<view>
+		<!-- #ifdef MP-ALIPAY -->
+		<u-popup :show="areaShow" @close="cancel">
+			<view class="flex warp">
+				<view class="warp-left" @click="cancel"> 取消 </view>
+				<view class="warp-right" @click="setArea"> 确定 </view>
+			</view>
+			<picker-view indicator-style="" :value="value" @change="bindChange">
+				<picker-view-column>
+					<view v-for="(item,index) in provinceRes" :key="index">{{item.areaName}}</view> 
+				</picker-view-column>
+				<picker-view-column>
+					<view v-for="(item,index) in cityRes" :key="index">{{item.areaName}}</view> 
+				</picker-view-column>
+				<picker-view-column>
+					<view v-for="(item,index) in areaRes" :key="index">{{item.areaName}}</view> 
+				</picker-view-column>
+			</picker-view>
+		</u-popup>
+		<!-- #endif -->
+		<!-- #ifndef MP-ALIPAY -->
 		<u-picker ref="uPicker" :show="areaShow" :defaultIndex="[1, 0, 0]" :columns="columns" @change="changeHandler"
 			@confirm="confirm" @cancel="cancel" keyName="areaName"></u-picker>
+		<!-- #endif -->
+		
 	</view>
 </template>
 
@@ -17,10 +39,56 @@
 		},
 		data() {
 			return {
-				columns: []
+				columns: [],
+				
+				value: [0,0,0],//所选下标
+				provinceRes: [],//省
+				cityRes: [],//市
+				areaRes: [],//区
+				
 			};
 		},
 		methods: {
+			//zfb切换
+			async bindChange(e){
+				if(e.detail.value[0] != this.value[0]){
+					let cityRes = await $http.post('/api/v1/mp/area/listByPid', {
+						pid: this.provinceRes[e.detail.value[0]].areaId
+					})
+					let areaRes = await $http.post('/api/v1/mp/area/listByPid', {
+						pid: cityRes && cityRes.data && cityRes.data[0].areaId
+					})
+					this.cityRes = cityRes.data
+					this.areaRes = areaRes.data
+					this.value = [e.detail.value[0],0,0]
+					return
+				}
+				if(e.detail.value[1] != this.value[1]){
+					let areaRes = await $http.post('/api/v1/mp/area/listByPid', {
+						pid: this.cityRes[e.detail.value[1]].areaId
+					})
+					this.areaRes = areaRes.data
+					this.value = [e.detail.value[0],e.detail.value[1],0]
+					return
+				}else{
+					this.value = e.detail.value
+					return
+				}
+			},
+			//zfb确定修改
+			setArea() {
+				let confirmObj = {
+					province: this.provinceRes[this.value[0]].areaName,
+					provinceId: this.provinceRes[this.value[0]].areaId,
+					city: this.cityRes[this.value[1]].areaName,
+					cityId:this.cityRes[this.value[1]].areaId,
+					area: this.areaRes[this.value[2]].areaName,
+					areaId: this.areaRes[this.value[2]].areaId,
+					cityShow: `${ this.provinceRes[this.value[0]].areaName }-${ this.cityRes[this.value[1]].areaName }-${ this.areaRes[this.value[2]].areaName }`
+				}
+				this.$emit('confirmArea', confirmObj)
+			},
+			
 			async getArea() {
 				const picker = this.$refs.uPicker
 				let provinceRes = await $http.post('/api/v1/mp/area/listByPid', {
@@ -32,9 +100,16 @@
 				let areaRes = await $http.post('/api/v1/mp/area/listByPid', {
 					pid: cityRes && cityRes.data && cityRes.data[0].areaId
 				})
+				// #ifdef MP-ALIPAY
+				this.provinceRes = provinceRes.data
+				this.cityRes = cityRes.data
+				this.areaRes = areaRes.data
+				// #endif
+				// #ifndef MP-ALIPAY
 				picker.setColumnValues(0, provinceRes.data)
 				picker.setColumnValues(1, cityRes.data)
 				picker.setColumnValues(2, areaRes.data)
+				// #endif
 			},
 
 			async changeHandler(e) {
@@ -61,8 +136,6 @@
 					})
 					picker.setColumnValues(2, areaRes.data)
 				}
-
-
 			},
 
 			// 回调参数为包含columnIndex、value、values
@@ -71,7 +144,6 @@
 				const {
 					value
 				} = e
-				// console.log(value);
 				let confirmObj = {
 					province: value[0].areaName,
 					provinceId: value[0].areaId,
@@ -95,5 +167,17 @@
 </script>
 
 <style lang="scss">
-
+	.warp {
+		justify-content: space-between;
+		padding: 15px;
+		
+		&-left {
+			 color: #909193;
+			 font-size: 30rpx;
+		}
+		&-right {
+			 color: #3c9cff;
+			 font-size: 30rpx;
+		}
+	}
 </style>

src/pages/index/index.vue

@@ -158,7 +158,6 @@
 			};
 		},
 		onLoad(opthios) {
-			console.log(opthios);
 			if (opthios.userId) {
 				uni.setStorageSync('shareUid', opthios.userId)
 			}