我的店铺，我的商家，区域商家

src/components/lcw-select-address/lcw-select-address.vue

@@ -1,608 +1,557 @@
 <template>
-	<uni-popup type="bottom" ref="selectAddressRef">
-		<view class="select-address-box">
-			<view class="header-box">
-				<view></view>
-				<view class="title-box">选择所在地区</view>
-				<view class="close-icon" @tap="close">
-					<view class="iconfont icon-a-Shutdown-01">x</view>
-				</view>
-			</view>
-			<view class="main-box">
-				<view class="address-info">
-					<view class="address-item" @tap="setSelectStatus(0)">
-						<view class="strip-item">
-							<view
-								:class="{
+    <uni-popup type="bottom" ref="selectAddressRef">
+        <view class="select-address-box">
+            <view class="header-box">
+                <view></view>
+                <view class="title-box">选择所在地区</view>
+                <view class="close-icon" @tap="close">
+                    <view class="iconfont icon-a-Shutdown-01">x</view>
+                </view>
+            </view>
+            <view class="main-box">
+                <view class="address-info">
+                    <view class="address-item" @tap="setSelectStatus(0)">
+                        <view class="strip-item">
+                            <view :class="{
 									'show-line': address.province,
 									active: address.province
-								}"
-							></view>
-						</view>
-						<view
-							class="name-box"
-							:class="{
+								}"></view>
+                        </view>
+                        <view class="name-box" :class="{
 								active: selectStatus == 0
-							}"
-						>
-							<text v-if="address.province">
-								{{ address.province }}
-							</text>
-							<text v-else>请选择所在省份</text>
-						</view>
-						<view class="icon-box">
-							<view class="iconfont icon-xiangyou">
-								{{ '>' }}
-							</view>
-						</view>
-					</view>
-					<view v-if="address.province" class="address-item" @tap="setSelectStatus(1)">
-						<view class="strip-item">
-							<view
-								:class="{
+							}">
+                            <text v-if="address.province">
+                                {{ address.province }}
+                            </text>
+                            <text v-else>请选择所在省份</text>
+                        </view>
+                        <view class="icon-box">
+                            <view class="iconfont icon-xiangyou">
+                                {{ '>' }}
+                            </view>
+                        </view>
+                    </view>
+                    <view v-if="address.province" class="address-item" @tap="setSelectStatus(1)">
+                        <view class="strip-item">
+                            <view :class="{
 									'show-line': address.city,
 									active: address.city
-								}"
-							></view>
-						</view>
-						<view
-							class="name-box"
-							:class="{
+								}"></view>
+                        </view>
+                        <view class="name-box" :class="{
 								active: selectStatus == 1
-							}"
-						>
-							<text v-if="address.city">{{ address.city }}</text>
-							<text v-else>请选择所在城市</text>
-						</view>
-						<view class="icon-box">
-							<view class="iconfont icon-xiangyou">
-								{{ '>' }}
-							</view>
-						</view>
-					</view>
-					<view v-if="address.city" class="address-item" @tap="setSelectStatus(2)">
-						<view class="strip-item last-strip-item">
-							<view
-								:class="{
+							}">
+                            <text v-if="address.city">{{ address.city }}</text>
+                            <text v-else>请选择所在城市</text>
+                        </view>
+                        <view class="icon-box">
+                            <view class="iconfont icon-xiangyou">
+                                {{ '>' }}
+                            </view>
+                        </view>
+                    </view>
+                    <view v-if="address.city" class="address-item" @tap="setSelectStatus(2)">
+                        <view class="strip-item last-strip-item">
+                            <view :class="{
 									'show-line': showStreet,
 									active: address.area
-								}"
-							></view>
-						</view>
-						<view
-							class="name-box"
-							:class="{
+								}"></view>
+                        </view>
+                        <view class="name-box" :class="{
 								active: selectStatus == 2
-							}"
-						>
-							<text v-if="address.area">{{ address.area }}</text>
-							<text v-else>请选择所在区/县</text>
-						</view>
-						<view class="icon-box">
-							<view class="iconfont icon-xiangyou">
-								{{ '>' }}
-							</view>
-						</view>
-					</view>
-					<view v-if="showStreet" class="address-item" @tap="setSelectStatus(3)">
-						<view class="strip-item last-strip-item">
-							<view
-								:class="{
+							}">
+                            <text v-if="address.area">{{ address.area }}</text>
+                            <text v-else>请选择所在区/县</text>
+                        </view>
+                        <view class="icon-box">
+                            <view class="iconfont icon-xiangyou">
+                                {{ '>' }}
+                            </view>
+                        </view>
+                    </view>
+                    <view v-if="showStreet" class="address-item" @tap="setSelectStatus(3)">
+                        <view class="strip-item last-strip-item">
+                            <view :class="{
 									active: address.street
-								}"
-							></view>
-						</view>
-						<view
-							class="name-box"
-							:class="{
+								}"></view>
+                        </view>
+                        <view class="name-box" :class="{
 								active: selectStatus == 3
-							}"
-						>
-							<text v-if="address.street">
-								{{ address.street }}
-							</text>
-							<text v-else>请选择所在乡/镇</text>
-						</view>
-						<view class="icon-box">
-							<view class="iconfont icon-xiangyou">
-								{{ '>' }}
-							</view>
-						</view>
-					</view>
-				</view>
-				<view class="address-select-box">
-					<scroll-view
-						class="content-box"
-						:style="{ height: scrollHeight }"
-						scroll-y="true"
-					>
-						<view v-if="selectStatus === 0">
-							<view class="select-tip">请选择省份</view>
-							<view
-								class="select-item"
-								:class="{
+							}">
+                            <text v-if="address.street">
+                                {{ address.street }}
+                            </text>
+                            <text v-else>请选择所在乡/镇</text>
+                        </view>
+                        <view class="icon-box">
+                            <view class="iconfont icon-xiangyou">
+                                {{ '>' }}
+                            </view>
+                        </view>
+                    </view>
+                </view>
+                <view class="address-select-box">
+                    <scroll-view class="content-box" :style="{ height: scrollHeight }" scroll-y="true">
+                        <view v-if="selectStatus === 0">
+                            <view class="select-tip">请选择省份</view>
+                            <view class="select-item" :class="{
 									active: activeProvinvial.name === i.name
-								}"
-								v-for="i in provinvial"
-								:key="i.code"
-								@tap="changeProvinvial(i)"
-							>
-								{{ i.name }}
-							</view>
-						</view>
-						<view v-else-if="selectStatus === 1">
-							<view class="select-tip">请选择城市</view>
-							<view
-								class="select-item"
-								:class="{
+								}" v-for="i in provinvial" :key="i.code" @tap="changeProvinvial(i)">
+                                {{ i.name }}
+                            </view>
+                        </view>
+                        <view v-else-if="selectStatus === 1">
+                            <view class="select-tip">请选择城市</view>
+                            <view class="select-item" :class="{
 									active: activeCity.name === i.name
-								}"
-								v-for="i in citys"
-								:key="i.code"
-								@tap="changeCity(i)"
-							>
-								{{ i.name }}
-							</view>
-						</view>
-						<view v-else-if="selectStatus === 2">
-							<view class="select-tip">请选择区/县</view>
-							<view
-								class="select-item"
-								:class="{
+								}" v-for="i in citys" :key="i.code" @tap="changeCity(i)">
+                                {{ i.name }}
+                            </view>
+                        </view>
+                        <view v-else-if="selectStatus === 2">
+                            <view class="select-tip">请选择区/县</view>
+                            <view class="select-item" :class="{
 									active: activeArea.name === i.name
-								}"
-								v-for="i in areas"
-								:key="i.code"
-								@tap="changeArea(i)"
-							>
-								{{ i.name }}
-							</view>
-						</view>
-						<view v-else>
-							<view class="select-tip">请选择乡/镇</view>
-							<view
-								class="select-item"
-								:class="{
+								}" v-for="i in areas" :key="i.code" @tap="changeArea(i)">
+                                {{ i.name }}
+                            </view>
+                        </view>
+                        <view v-else>
+                            <view class="select-tip">请选择乡/镇</view>
+                            <view class="select-item" :class="{
 									active: activeStreet.name === i.name
-								}"
-								v-for="i in streets"
-								:key="i.code"
-								@tap="changeStreet(i)"
-							>
-								{{ i.name }}
-							</view>
-						</view>
-					</scroll-view>
-				</view>
-			</view>
-		</view>
-	</uni-popup>
+								}" v-for="i in streets" :key="i.code" @tap="changeStreet(i)">
+                                {{ i.name }}
+                            </view>
+                        </view>
+                    </scroll-view>
+                </view>
+            </view>
+        </view>
+    </uni-popup>
 </template>
-
 <script>
 import { post } from "@/request/api.js"
 export default {
-	emits: ['change'],
-	props: {
-		address: {
-			type: Object,
-			require: true,
-			default: () => ({
-				province: '',
-				city: '',
-				area: '',
-				street: ''
-			})
-		}
-	},
-	data() {
-		return {
-			//全部数据
-			provinvial: [], // 省
-			cityData: [],
-			areaData: [],
-			streetsData: [],
-			// 筛选后的数据
-			citys: [], // 城市
-			areas: [], // 区/县
-			streets: [], // 镇
-			// 选择的省、市、区具体名称
-			activeProvinvial: { name: '' }, // 选择中的省份
-			activeCity: {
-				name: ''
-			}, // 选中的城市
-			activeArea: { name: '' }, // 选中的区县
-			activeStreet: { name: '' }, // 选中的乡镇
-			//  0 1 2 3 当前正在选择 省 市 区 镇
-			selectStatus: 0,
+    emits: ['change'],
+    props: {
+        address: {
+            type: Object,
+            require: true,
+            default: () => ({
+                province: '',
+                city: '',
+                area: '',
+                street: ''
+            })
+        }
+    },
+    data() {
+        return {
+            //全部数据
+            provinvial: [], // 省
+            cityData: [],
+            areaData: [],
+            streetsData: [],
+            // 筛选后的数据
+            citys: [], // 城市
+            areas: [], // 区/县
+            streets: [], // 镇
+            // 选择的省、市、区具体名称
+            activeProvinvial: { name: '' }, // 选择中的省份
+            activeCity: {
+                name: ''
+            }, // 选中的城市
+            activeArea: { name: '' }, // 选中的区县
+            activeStreet: { name: '' }, // 选中的乡镇
+            //  0 1 2 3 当前正在选择 省 市 区 镇
+            selectStatus: 0,
 
-			regional_code: [],
-		};
-	},
-	computed: {
-		// 高度计算
-		scrollHeight() {
-			let height = 920;
+            regional_code: [],
+        };
+    },
+    computed: {
+        // 高度计算
+        scrollHeight() {
+            let height = 920;
 
-			if (this.address.province) {
-				height -= 80;
-			}
-			if (this.address.city) {
-				height -= 80;
-			}
-			if (this.address.area && 'street' in this.address) {
-				height -= 80;
-			}
-			return height + 'rpx';
-		},
-		// 是否展示4级
-		showStreet() {
-			return Boolean(
-				this.selectStatus === 3 ||
-					(this.activeArea.name && 'street' in this.address)
-			);
-		}
-	},
-	watch: {
-		address: {
-			handler(newHandler) {
-				if (newHandler.province && !this.activeProvinvial.code) {
-					this.setActiveProvinvial();
-				}
-				if (newHandler.city && !this.activeCity.code) {
-					this.setActiveCity();
-				}
-				if (newHandler.area && !this.activeArea.code) {
-					this.setActiveArea();
-				}
-				if (newHandler.street && !this.activeStreet.code) {
-					this.setActiveStreet();
-				}
-			},
-			deep: true
-		}
-	},
-	mounted() {
-		this.getProvinvial();
-	},
-	methods: {
-		// 更新正在选择内容的标记
-		setSelectStatus(newSelectStatus) {
-			this.selectStatus = newSelectStatus;
-		},
-		// 关闭 popup
-		close() {
-			this.$refs.selectAddressRef.close();
-		},
-		// 打开  popup
-		open() {
-			this.$refs.selectAddressRef.open();
-		},
-		// 选择省
-		changeProvinvial(i) {
-			if (i.name !== this.address.province) {
-				this.regional_code[0] = i.code
-				this.activeProvinvial = i;
-				this.activeCity = {};
-				this.activeArea = {};
-				this.activeStreet = {};
-				const newAddress = {
-					province: i.name,
-					city: '',
-					area: ''
-				};
-				if ('street' in this.address) {
-					newAddress.street = '';
-				}
-				this.$emit('change', newAddress);
-			}
-			this.citys = this.cityData.filter(
-				item => item.provinceCode === i.code
-			);
-			this.selectStatus = 1;
-		},
-		// 选择市
-		changeCity(i) {
-			if (i.name !== this.address.city) {
-				this.regional_code[1] = i.code
-				this.activeCity = i;
-				this.activeArea = {};
-				this.activeStreet = {};
-				const newAddress = {
-					province: this.address.province,
-					city: i.name,
-					area: ''
-				};
-				if ('street' in this.address) {
-					newAddress.street = '';
-				}
-				this.$emit('change', newAddress);
-			}
-			this.areas = this.areaData.filter(item => item.cityCode === i.code);
-			this.selectStatus = 2;
-		},
-		// 选择区县
-		changeArea(i) {
-			if (i.name !== this.address.area) {
-				this.regional_code[2] = i.code
-				this.activeArea = i;
-				this.activeStreet = {};
-				const newAddress = {
-					province: this.address.province,
-					city: this.address.city,
-					area: i.name,
-					regional_code: this.regional_code.join()
-				};
-				if ('street' in this.address) {
-					newAddress.street = '';
-				}
-				this.$emit('change', newAddress);
-			}
+            if (this.address.province) {
+                height -= 80;
+            }
+            if (this.address.city) {
+                height -= 80;
+            }
+            if (this.address.area && 'street' in this.address) {
+                height -= 80;
+            }
+            return height + 'rpx';
+        },
+        // 是否展示4级
+        showStreet() {
+            return Boolean(
+                this.selectStatus === 3 ||
+                (this.activeArea.name && 'street' in this.address)
+            );
+        }
+    },
+    watch: {
+        address: {
+            handler(newHandler) {
+                if (newHandler.province && !this.activeProvinvial.code) {
+                    this.setActiveProvinvial();
+                }
+                if (newHandler.city && !this.activeCity.code) {
+                    this.setActiveCity();
+                }
+                if (newHandler.area && !this.activeArea.code) {
+                    this.setActiveArea();
+                }
+                if (newHandler.street && !this.activeStreet.code) {
+                    this.setActiveStreet();
+                }
+            },
+            deep: true
+        }
+    },
+    mounted() {
+        this.getProvinvial();
+    },
+    methods: {
+        // 更新正在选择内容的标记
+        setSelectStatus(newSelectStatus) {
+            this.selectStatus = newSelectStatus;
+        },
+        // 关闭 popup
+        close() {
+            this.$refs.selectAddressRef.close();
+        },
+        // 打开  popup
+        open() {
+            this.$refs.selectAddressRef.open();
+        },
+        // 选择省
+        changeProvinvial(i) {
+            if (i.name !== this.address.province) {
+                this.regional_code[0] = i.code
+                this.activeProvinvial = i;
+                this.activeCity = {};
+                this.activeArea = {};
+                this.activeStreet = {};
+                const newAddress = {
+                    province: i.name,
+                    city: '',
+                    area: ''
+                };
+                if ('street' in this.address) {
+                    newAddress.street = '';
+                }
+                this.$emit('change', newAddress);
+            }
+            this.citys = this.cityData.filter(
+                item => item.provinceCode === i.code
+            );
+            this.selectStatus = 1;
+        },
+        // 选择市
+        changeCity(i) {
+            if (i.name !== this.address.city) {
+                this.regional_code[1] = i.code
+                this.activeCity = i;
+                this.activeArea = {};
+                this.activeStreet = {};
+                const newAddress = {
+                    province: this.address.province,
+                    city: i.name,
+                    area: ''
+                };
+                if ('street' in this.address) {
+                    newAddress.street = '';
+                }
+                this.$emit('change', newAddress);
+            }
+            this.areas = this.areaData.filter(item => item.cityCode === i.code);
+            this.selectStatus = 2;
+        },
+        // 选择区县
+        changeArea(i) {
+            if (i.name !== this.address.area) {
+                this.regional_code[2] = i.code
+                this.activeArea = i;
+                this.activeStreet = {};
+                const newAddress = {
+                    province: this.address.province,
+                    city: this.address.city,
+                    area: i.name,
+                    regional_code: this.regional_code.join()
+                };
+                if ('street' in this.address) {
+                    newAddress.street = '';
+                }
+                this.$emit('change', newAddress);
+            }
 
-			if ('street' in this.address) {
-				this.selectStatus = 3;
-				this.streets = this.streetsData.filter(
-					item => item.areaCode === i.code
-				);
-			} else {
-				this.close();
-			}
-		},
-		// 选择乡镇
-		changeStreet(i) {
-			if (i.name !== this.address.street) {
-				this.regional_code[3] = i.code
-				this.activeStreet = i;
-				this.$emit('change', {
-					...this.address,
-					street: i.name,
-					regional_code: this.regional_code.join()
-				});
-			}
-			this.close();
-		},
-		// 省份数据获取
-		getProvinvial() {
-			post("v1/user/areaConfig",{type:'provinces'}).then(res=>{
-				if(res.code == 0){
-					let da = res.data.data
-					// let da = JSON.parse(res.data.data)
-					this.provinvial = da;
-					this.setActiveProvinvial();
-					this.getCity();
-				}
-			})
-		},
-		setActiveProvinvial() {
-			if (this.address.province && !this.activeProvinvial.code) {
-				const provinceIndex = this.provinvial.findIndex(
-					i => i.name == this.address.province
-				);
-				if (provinceIndex !== -1) {
-					this.activeProvinvial = this.provinvial[provinceIndex];
-				}
-			}
-		},
-		// 城市数据获取
-		getCity() {
-			post("v1/user/areaConfig",{type:'cities'}).then(res=>{
-				if(res.code == 0){
-					let da = res.data.data
-					// let da = JSON.parse(res.data.data)
-					this.cityData = da;
-					this.setActiveCity();
-					this.getArea();
-				}
-			})
-		},
-		setActiveCity() {
-			if (this.cityData && this.cityData.length === 0) {
-				return;
-			}
+            if ('street' in this.address) {
+                this.selectStatus = 3;
+                this.streets = this.streetsData.filter(
+                    item => item.areaCode === i.code
+                );
+            } else {
+                this.close();
+            }
+        },
+        // 选择乡镇
+        changeStreet(i) {
+            if (i.name !== this.address.street) {
+                this.regional_code[3] = i.code
+                this.activeStreet = i;
+                this.$emit('change', {
+                    ...this.address,
+                    street: i.name,
+                    regional_code: this.regional_code.join()
+                });
+            }
+            this.close();
+        },
+        // 省份数据获取
+        getProvinvial() {
+            post("v1/user/areaConfig", { type: 'provinces' }).then(res => {
+                if (res.code == 0) {
+                    let da = res.data.data
+                    this.provinvial = da;
+                    this.setActiveProvinvial();
+                    this.getCity();
+                }
+            })
+        },
+        setActiveProvinvial() {
+            if (this.address.province && !this.activeProvinvial.code) {
+                const provinceIndex = this.provinvial.findIndex(
+                    i => i.name == this.address.province
+                );
+                if (provinceIndex !== -1) {
+                    this.activeProvinvial = this.provinvial[provinceIndex];
+                }
+            }
+        },
+        // 城市数据获取
+        getCity() {
+            post("v1/user/areaConfig", { type: 'cities' }).then(res => {
+                if (res.code == 0) {
+                    let da = res.data.data
+                    this.cityData = da;
+                    this.setActiveCity();
+                    this.getArea();
+                }
+            })
+        },
+        setActiveCity() {
+            if (this.cityData && this.cityData.length === 0) {
+                return;
+            }
 
-			this.citys = this.cityData.filter(
-				item => item.provinceCode === this.activeProvinvial.code
-			);
+            this.citys = this.cityData.filter(
+                item => item.provinceCode === this.activeProvinvial.code
+            );
 
-			if (this.address.city && !this.activeCity.code) {
-				const cityIndex = this.cityData.findIndex(
-					i =>
-						i.name == this.address.city &&
-						this.activeProvinvial.code == i.provinceCode
-				);
-				if (cityIndex !== -1) {
-					this.activeCity = this.cityData[cityIndex];
-				}
-			}
-		},
-		// 区县数据
-		getArea() {
-			post("v1/user/areaConfig",{type:'areas'}).then(res=>{
-				if(res.code == 0){
-					let da = res.data.data
-					// let da = JSON.parse(res.data.data)
-					this.areaData = da;
-					this.setActiveArea();
-					if ('street' in this.address) {
-						this.getStreets();
-					}
-				}
-			})
-		},
-		setActiveArea() {
-			if (this.areaData.length === 0) {
-				return;
-			}
-			this.areas = this.areaData.filter(
-				item => item.cityCode === this.activeCity.code
-			);
-			if (this.address.area && !this.activeArea.code) {
-				const areaIndex = this.areaData.findIndex(
-					i =>
-						i.name == this.address.area &&
-						i.cityCode == this.activeCity.code
-				);
-				if (areaIndex !== -1) {
-					this.activeArea = this.areaData[areaIndex];
-				}
-			}
-		},
-		// 镇 社区
-		getStreets() {
-			post("v1/user/areaConfig",{type:'streets'}).then(res=>{
-				if(res.code == 0){
-					let da = res.data.data
-					// let da = JSON.parse(res.data.data)
-					this.streetsData = da;
-					this.setActiveStreet();
-				}
-			})
-		},
-		setActiveStreet() {
-			if (this.streetsData.length === 0) {
-				return;
-			}
-			this.streets = this.streetsData.filter(
-				item => item.areaCode === this.activeArea.code
-			);
-			if (this.address.street && !this.activeStreet.code) {
-				const streetIndex = this.streetsData.findIndex(
-					i => i.name == this.address.street
-				);
-				if (streetIndex !== -1) {
-					this.activeStreet = this.streetsData[streetIndex];
-				}
-			}
-		}
-	}
+            if (this.address.city && !this.activeCity.code) {
+                const cityIndex = this.cityData.findIndex(
+                    i =>
+                    i.name == this.address.city &&
+                    this.activeProvinvial.code == i.provinceCode
+                );
+                if (cityIndex !== -1) {
+                    this.activeCity = this.cityData[cityIndex];
+                }
+            }
+        },
+        // 区县数据
+        getArea() {
+            post("v1/user/areaConfig", { type: 'areas' }).then(res => {
+                if (res.code == 0) {
+                    let da = res.data.data
+                    this.areaData = da;
+                    this.setActiveArea();
+                    if ('street' in this.address) {
+                        this.getStreets();
+                    }
+                }
+            })
+        },
+        setActiveArea() {
+            if (this.areaData.length === 0) {
+                return;
+            }
+            this.areas = this.areaData.filter(
+                item => item.cityCode === this.activeCity.code
+            );
+            if (this.address.area && !this.activeArea.code) {
+                const areaIndex = this.areaData.findIndex(
+                    i =>
+                    i.name == this.address.area &&
+                    i.cityCode == this.activeCity.code
+                );
+                if (areaIndex !== -1) {
+                    this.activeArea = this.areaData[areaIndex];
+                }
+            }
+        },
+        // 镇 社区 街道
+        getStreets() {
+            post("v1/user/areaConfig", { type: 'streets' }).then(res => {
+                if (res.code == 0) {
+                    let da = res.data.data
+                    this.streetsData = da;
+                    this.setActiveStreet();
+                }
+            })
+        },
+        setActiveStreet() {
+            if (this.streetsData.length === 0) {
+                return;
+            }
+            this.streets = this.streetsData.filter(
+                item => item.areaCode === this.activeArea.code
+            );
+            if (this.address.street && !this.activeStreet.code) {
+                const streetIndex = this.streetsData.findIndex(
+                    i => i.name == this.address.street
+                );
+                if (streetIndex !== -1) {
+                    this.activeStreet = this.streetsData[streetIndex];
+                }
+            }
+        }
+    }
 };
 </script>
-
 <style lang="scss">
 .select-address-box {
-	height: 1100rpx;
-	border-top-left-radius: 20rpx;
-	border-top-right-radius: 20rpx;
-	background-color: #fff;
-	// padding: 30rpx 0;
+    height: 1100rpx;
+    border-top-left-radius: 20rpx;
+    border-top-right-radius: 20rpx;
+    background-color: #fff;
+    // padding: 30rpx 0;
+
+    .header-box {
+        display: flex;
+        justify-content: space-between;
+        font-size: 32rpx;
+        font-weight: bold;
+        color: #333;
+        // margin-bottom: 40rpx;
+        height: 80rpx;
+        line-height: 80rpx;
+        padding: 0 20rpx;
+
+        >.title-box {
+            font-size: 36rpx;
+        }
+
+        .iconfont {
+            color: #72899b;
+            padding: 0 20rpx;
+        }
+    }
 
-	.header-box {
-		display: flex;
-		justify-content: space-between;
-		font-size: 32rpx;
-		font-weight: bold;
-		color: #333;
-		// margin-bottom: 40rpx;
-		height: 80rpx;
-		line-height: 80rpx;
-		padding: 0 20rpx;
+    .main-box {
+        height: calc(100% - 80rpx);
 
-		> .title-box {
-			font-size: 36rpx;
-		}
+        .address-info {
+            padding: 0 20rpx;
 
-		.iconfont {
-			color: #72899b;
-			padding: 0 20rpx;
-		}
-	}
+            >.address-item {
+                display: flex;
+                align-items: center;
+                height: 80rpx;
 
-	.main-box {
-		height: calc(100% - 80rpx);
-		.address-info {
-			padding: 0 20rpx;
+                .strip-item {
+                    color: #333;
+                    margin-right: 48rpx;
+                    position: relative;
 
-			> .address-item {
-				display: flex;
-				align-items: center;
-				height: 80rpx;
+                    >view {
+                        width: 12rpx;
+                        height: 12rpx;
+                        border-radius: 50%;
+                        border: 2rpx solid #086df7;
+                        transition: all 0.25s;
+                        box-sizing: border-box;
+                    }
 
-				.strip-item {
-					color: #333;
-					margin-right: 48rpx;
-					position: relative;
+                    .show-line {
+                        &::after {
+                            content: '';
+                            position: absolute;
+                            top: 100%;
+                            left: 50%;
+                            width: 2rpx;
+                            height: 69rpx;
+                            background-color: #086df7;
+                        }
 
-					> view {
-						width: 12rpx;
-						height: 12rpx;
-						border-radius: 50%;
-						border: 2rpx solid #086df7;
-						transition: all 0.25s;
-						box-sizing: border-box;
-					}
+                        /* #ifndef H5*/
+                        &::after {
+                            transform: translateX(-50%);
+                        }
 
-					.show-line {
-						&::after {
-							content: '';
-							position: absolute;
-							top: 100%;
-							left: 50%;
-							width: 2rpx;
-							height: 69rpx;
-							background-color: #086df7;
-						}
+                        /* #endif */
 
-						/* #ifndef H5*/
-						&::after {
-							transform: translateX(-50%);
-						}
-						/* #endif */
+                        /* #ifdef VUE2 */
+                        &::after {
+                            transform: translateX(-50%);
+                        }
 
-						/* #ifdef VUE2 */
-						&::after {
-							transform: translateX(-50%);
-						}
-						/* #endif */
-					}
+                        /* #endif */
+                    }
 
-					.active {
-						background: #086df7;
-					}
-				}
+                    .active {
+                        background: #086df7;
+                    }
+                }
 
-				.name-box {
-					font-size: 28rpx;
-					flex: 1;
-				}
+                .name-box {
+                    font-size: 28rpx;
+                    flex: 1;
+                }
 
-				.active {
-					color: #086df7;
-				}
+                .active {
+                    color: #086df7;
+                }
 
-				.icon-box {
-					.iconfont {
-						font-size: 24rpx;
-						color: #72899b;
-					}
-				}
-			}
-		}
+                .icon-box {
+                    .iconfont {
+                        font-size: 24rpx;
+                        color: #72899b;
+                    }
+                }
+            }
+        }
 
-		.address-select-box {
-			padding: 20rpx 20rpx 0;
-			border-top: 2rpx solid #d4d4d4;
+        .address-select-box {
+            padding: 20rpx 20rpx 0;
+            border-top: 2rpx solid #d4d4d4;
 
-			.content-box {
-				height: 600rpx;
+            .content-box {
+                height: 600rpx;
 
-				.select-tip {
-					font-size: 32rpx;
-					color: #333;
-					font-weight: bold;
-					padding-bottom: 20rpx;
-				}
+                .select-tip {
+                    font-size: 32rpx;
+                    color: #333;
+                    font-weight: bold;
+                    padding-bottom: 20rpx;
+                }
 
-				.select-item {
-					padding: 20rpx 20rpx;
-					font-size: 28rpx;
-					color: #333;
-				}
+                .select-item {
+                    padding: 20rpx 20rpx;
+                    font-size: 28rpx;
+                    color: #333;
+                }
 
-				.active {
-					color: #086df7;
-				}
-			}
-		}
-	}
+                .active {
+                    color: #086df7;
+                }
+            }
+        }
+    }
 }
-</style>
+</style>

src/components/scroll-list/scroll-list.vue

@@ -1,667 +0,0 @@
-<template>
-    <view class="scroll-list-wrap" :style="[scrollListWrapStyle]">
-        <scroll-view
-            class="scroll-view"
-            :class="[elClass]"
-            :style="[listWrapStyle]"
-            scroll-y
-            scroll-anchoring
-            enable-back-to-top
-            :scroll-top="scrollTop"
-            :lower-threshold="defaultOption.lowerThreshold"
-            @scroll="handleScroll"
-            @touchend="handleTouchEnd"
-            @touchmove.prevent.stop="handleTouchMove"
-            @touchstart="handleTouchStart"
-            @scrolltolower="handleScrolltolower"
-        >
-            <view class="scroll-content" :style="[scrollContentStyle]">
-                <view class="pull-down-wrap">
-                    <slot name="pulldown" v-if="$slots.pulldown"></slot>
-                    <view class="refresh-view" :style="[refreshViewStyle]" v-else>
-                        <view class="pull-down-animation" :class="{ refreshing: refreshing }" :style="[pullDownAnimationStyle]"></view>
-                        <text class="pull-down-text" :style="[pullDownTextStyle]">{{ refreshStateText }}</text>
-                    </view>
-                </view>
-                <view class="empty-wrap" v-if="showEmpty">
-                    <slot name="empty" v-if="$slots.empty"></slot>
-                    <view class="empty-view" v-else>
-                        <image class="empty-image" :src="defaultOption.emptyImage || images.empty" mode="aspectFit"></image>
-                        <text class="empty-text" :style="[emptyTextStyle]">{{ emptyText }}</text>
-                    </view>
-                </view>
-                <view class="list-content"><slot></slot></view>
-                <view class="pull-up-wrap" v-if="showPullUp">
-                    <slot name="pullup" v-if="$slots.pullup"></slot>
-                    <view class="load-view" v-else>
-                        <view class="pull-up-animation" v-if="loading" :style="[pullUpAnimationStyle]"></view>
-                        <text class="pull-up-text" :style="[pullUpTextStyle]">{{ loadStateText }}</text>
-                    </view>
-                </view>
-            </view>
-        </scroll-view>
-    </view>
-</template>
-
-<script>
-import images from './images.js';
-export default {
-    name: 'scroll-list',
-    props: {
-        // 配置信息
-        option: {
-            type: Object,
-            default: () => ({})
-        }
-    },
-    data() {
-        return {
-            defaultOption: {
-                page: 1, // 分页
-                size: 15, // 分页大小
-                auto: true, // 自动加载
-                height: null, // 组件高度
-                disabled: false, // 禁用
-                background: '', // 背景颜色属性
-                emptyImage: '', // 空数据提示图片
-                offsetBottom: 0, // 底部高度补偿
-                pullDownSpeed: 0.5, // 下拉速率
-                lowerThreshold: 40, // 距离底部上拉加载距离
-                refresherThreshold: 80, // 距离顶部下拉刷新距离
-                refreshDelayed: 800, // 刷新延迟
-                refreshFinishDelayed: 800, // 刷新完成后的延迟
-                safeArea: false, // 是否开启安全区域适配
-                emptyTextColor: '#82848a', // 空提示文字颜色
-                loadTextColor: '#82848a', // 上拉加载文字颜色
-                loadIconColor: '#82848a', // 上拉加载图标颜色
-                refresherTextColor: '#82848a', // 下拉刷新文字颜色
-                refresherIconColor: '#82848a', // 下拉刷新图标颜色
-                emptyText: '暂无列表~', // 空数据提示文字
-                loadingText: '正在加载中~', // 加载中文字
-                loadFailText: '加载失败啦~', // 加载失败文字
-                noMoreText: '没有更多啦~', // 没有更多文字
-                refreshingText: '正在刷新~', // 正在刷新文字
-                refreshFailText: '刷新失败~', // 刷新失败文字
-                refreshSuccessText: '刷新成功~', // 刷新成功文字
-                pulldownText: '下拉刷新~', // 下拉中的文字
-                pulldownFinishText: '松开刷新~' // 下拉完成的文字
-            },
-            images, // 内置图片
-            elClass: '', // 组件动态class
-            windowInfo: {}, // 窗口信息
-            scrollTop: 0, // 距离顶部滚动高度
-            scrollViewTop: -1, // 滚动视图顶部位置
-            scrollViewHeight: 0, // 滚动视图高度
-            currentPage: 1, // 当前分页页码
-            currentSize: 15, // 当前分页大小
-            currentScrollTop: 0, // 当前滚动高度
-            emptyText: '暂无列表~',
-            loadStateText: '正在加载中~', // 加载状态文字
-            refreshStateText: '下拉刷新~', // 刷新状态文字
-            loadDisabled: false, // 是否禁用上拉加载
-            loading: false, // 是否加载中
-            refreshing: false, // 是否刷新中
-            refreshFinish: false, // 是否刷新完成
-            pulldowning: false, // 是否正在下拉
-            pullDownHeight: 0, // 下拉高度
-            showEmpty: false, // 是否显示空数据提示
-            showPullUp: false, // 是否显示上拉加载
-            showPullDown: false // 是否显示下拉刷新
-        };
-    },
-    methods: {
-        // 组件初始化
-        handleInit() {
-            // 合并配置
-            this.defaultOption = Object.assign(this.defaultOption, this.option);
-            this.showEmpty = !this.defaultOption.auto;
-            this.currentPage = this.defaultOption.page;
-            this.currentSize = this.defaultOption.size;
-            this.emptyText = this.defaultOption.emptyText;
-            this.loadStateText = this.defaultOption.loadingText;
-            this.refreshStateText = this.defaultOption.pulldownText;
-            // 计算高度
-            this.queryRect('.' + this.elClass).then(rect => {
-                // 设置组件顶部位置
-                this.scrollViewTop = rect.top;
-                // 判断是否自动加载
-                if (this.defaultOption.auto) this.load();
-            });
-        },
-        // 加载数据
-        load() {
-            if (this.defaultOption.disabled || this.loading || this.loadDisabled) return;
-            // 开启正在加载
-            this.loading = true;
-            // 设置正在加载状态文字
-            this.loadStateText = this.defaultOption.loadingText;
-            // 显示上拉加载
-            this.showPullUp = true;
-            // 分页参数
-            let paging = { page: this.currentPage, size: this.currentSize };
-            // 触发load事件
-            this.$emit('load', paging);
-        },
-        // 加载成功
-        loadSuccess(data = {}) {
-            // 解构数据
-            const { list, total } = data;
-            // 判断列表是否是数组
-            if (Array.isArray(list)) {
-                // 判断列表长度
-                if (list.length) {
-                    // 判断列表长度和列表总数是否相同
-                    if (list.length >= total) {
-                        // 设置禁用上拉加载
-                        this.loadDisabled = true;
-                        // 加载状态文字
-                        this.loadStateText = this.defaultOption.noMoreText;
-                    } else {
-                        // 关闭禁用上拉加载
-                        this.loadDisabled = false;
-                        // 设置分页参数
-                        this.currentPage++;
-                        // 加载状态为加载中
-                        this.loadStateText = this.defaultOption.loadingText;
-                        // 加载计算
-                        this.loadCompute();
-                    }
-                    // 显示上拉加载
-                    this.showPullUp = true;
-                    // 隐藏空数据提示
-                    this.showEmpty = false;
-                } else {
-                    // 设置禁用上拉加载
-                    this.loadDisabled = true;
-                    // 隐藏上拉加载
-                    this.showPullUp = false;
-                    // 隐藏上拉加载
-                    this.showPullUp = false;
-                    // 显示空数据提示
-                    this.showEmpty = true;
-                }
-                // 关闭正在加载
-                this.loading = false;
-                // 触发加载成功事件
-                this.$emit('loadSuccess', list);
-            } else {
-                // 不是数组类型当作加载失败处理
-                this.loadFail();
-                console.error('the list must be a array');
-            }
-        },
-        // 加载失败
-        loadFail() {
-            // 关闭正在加载
-            this.loading = false;
-            // 关闭空数据提示
-            this.showEmpty = false;
-            // 显示上拉加载
-            this.showPullUp = true;
-            // 加载状态为加载失败
-            this.loadStateText = this.defaultOption.loadFailText;
-            // 触发加载失败事件
-            this.$emit('loadFail');
-        },
-        // 刷新数据
-        refresh() {
-            // 如果是下拉刷新
-            if (this.pullDownHeight == this.defaultOption.refresherThreshold) {
-                // 关闭正在加载
-                this.loading = false;
-                // 隐藏上拉加载
-                this.showPullUp = false;
-            } else {
-                // 开启正在加载
-                this.loading = true;
-                // 隐藏空数据提示
-                this.showEmpty = false;
-                // 显示上拉加载
-                this.showPullUp = true;
-                // 设置正在刷新状态文字
-                this.loadStateText = this.defaultOption.refreshingText;
-            }
-            // 设置刷新未完成
-            this.refreshFinish = false;
-            // 开启正在刷新
-            this.refreshing = true;
-            // 设置正在刷新状态文字
-            this.refreshStateText = this.defaultOption.refreshingText;
-            // 设置分页参数
-            this.currentPage = 1;
-            this.currentSize = this.defaultOption.size;
-            let paging = { page: this.currentPage, size: this.currentSize };
-            // 触发refresh事件
-            setTimeout(() => {
-                this.$emit('refresh', paging);
-            }, this.defaultOption.refreshDelayed);
-        },
-        // 刷新成功
-        refreshSuccess(data) {
-            // 解构数据
-            const { list, total } = data;
-            // 判断列表是否是数组
-            if (Array.isArray(list)) {
-                // 判断列表长度
-                if (list.length) {
-                    // 判断列表长度和列表总数是否相同
-                    if (list.length >= total) {
-                        // 设置禁用上拉加载
-                        this.loadDisabled = true;
-                        // 设置没有更多状态文字
-                        this.loadStateText = this.defaultOption.noMoreText;
-                    } else {
-                        // 设置分页参数
-                        this.currentPage++;
-                        // 关闭禁用上拉加载
-                        this.loadDisabled = false;
-                        // 设置加载中状态文字
-                        this.loadStateText = this.defaultOption.loadingText;
-                        // 开启自动加载
-                        this.defaultOption.auto = true;
-                        // 加载计算
-                        this.loadCompute();
-                    }
-                    // 关闭空数据提示
-                    this.showEmpty = false;
-                    // 显示上拉加载
-                    this.showPullUp = true;
-                } else {
-                    // 设置禁用上拉加载
-                    this.loadDisabled = true;
-                    // 隐藏上拉加载
-                    this.showPullUp = false;
-                    // 显示空数据提示
-                    this.showEmpty = true;
-                    // 设置没有更多状态文字
-                    this.loadStateText = this.defaultOption.noMoreText;
-                }
-                // 关闭正在加载
-                this.loading = false;
-                // 设置刷新成功状态文字
-                this.refreshStateText = this.defaultOption.refreshSuccessText;
-                // 关闭正在刷新
-                this.refreshing = false;
-                // 关闭正在下拉
-                this.pulldowning = false;
-                // 触发刷新成功事件
-                this.$emit('refreshSuccess', list);
-                setTimeout(() => {
-                    // 设置刷新完成
-                    this.refreshFinish = true;
-                    // 重置下拉高度
-                    this.pullDownHeight = 0;
-                    // 隐藏下拉刷新
-                    this.showPullDown = false;
-                    this.$emit('refreshSuccess');
-                }, this.defaultOption.refreshFinishDelayed);
-            } else {
-                // 不是数组类型当作刷新失败处理
-                this.refreshFail();
-                console.error('the list must be a array');
-            }
-        },
-        // 刷新失败
-        refreshFail() {
-            // 设置加载失败状态文字
-            this.loadStateText = this.defaultOption.refreshFailText;
-            // 设置刷新失败状态文字
-            this.refreshStateText = this.defaultOption.refreshFailText;
-            // 关闭正在加载
-            this.loading = false;
-            // 显示下拉加载
-            this.showPullUp = true;
-            // 关闭正在刷新
-            this.refreshing = false;
-            // 关闭正在下拉
-            this.pulldowning = false;
-            // 延迟执行刷新完成后状态
-            setTimeout(() => {
-                // 设置刷新完成
-                this.refreshFinish = true;
-                // 重置下拉高度
-                this.pullDownHeight = 0;
-                // 隐藏下拉刷新
-                this.showPullDown = false;
-                // 触发刷新失败事件
-                this.$emit('refreshError');
-            }, this.defaultOption.refreshFinishDelayed);
-        },
-        // 加载计算
-        loadCompute() {
-            // 判断是否自动加载
-            if (this.defaultOption.auto) {
-                // 延迟执行下否者可能会高度计算错误
-                setTimeout(() => {
-                    this.$nextTick(() => {
-                        this.queryRect('.list-content').then(rect => {
-                            if (rect.height <= this.scrollViewHeight) {
-                                this.load();
-                            }
-                        });
-                    });
-                }, 100);
-            }
-        },
-        // 上拉触底事件
-        handleScrolltolower(e) {
-            if (this.loadDisabled) return;
-            this.$emit('scrolltolower', e);
-            this.load();
-        },
-        // 滚动事件
-        handleScroll(event) {
-            this.currentScrollTop = event.detail.scrollTop;
-            this.$emit('scroll', event.detail);
-        },
-        // 触摸按下处理
-        handleTouchStart(event) {
-            if (this.defaultOption.disabled) return;
-            this.currentTouchStartY = event.touches[0].clientY;
-            this.$emit('touchStart', event);
-        },
-        // 触摸按下滑动处理
-        handleTouchMove(event) {
-            if (this.defaultOption.disabled || this.currentScrollTop) return;
-            if (event.touches[0].clientY >= this.currentTouchStartY) {
-                this.pulldowning = true;
-                this.showPullDown = true;
-                let pullDownDistance = (event.touches[0].clientY - this.currentTouchStartY) * this.defaultOption.pullDownSpeed;
-                this.pullDownHeight = pullDownDistance > this.defaultOption.refresherThreshold ? this.defaultOption.refresherThreshold : pullDownDistance;
-                this.refreshStateText =
-                    this.pullDownHeight >= this.defaultOption.refresherThreshold ? this.defaultOption.pulldownFinishText : this.defaultOption.pulldownText;
-                this.$emit('touchMove', event);
-            }
-        },
-        // 触摸松开处理
-        handleTouchEnd(event) {
-            if (this.defaultOption.disabled) return;
-            // 当下拉高度小于下拉阈值
-            if (this.pullDownHeight < this.defaultOption.refresherThreshold) {
-                // 关闭正在下拉
-                this.pulldowning = false;
-                // 重置下拉高度
-                this.pullDownHeight = 0;
-                // 隐藏下拉刷新
-                this.showPullDown = false;
-                // 触发下拉中断事件
-                this.$emit('refreshStop');
-            } else {
-                this.refresh();
-            }
-            // 触发下拉触摸松开事件
-            this.$emit('touchEnd', event);
-        },
-        // 更新组件
-        updateScrollView() {
-            if (this.defaultOption.height) {
-                this.scrollViewHeight = uni.upx2px(this.defaultOption.height);
-            } else {
-                this.scrollViewHeight = this.windowInfo.windowHeight - this.scrollViewTop;
-            }
-            this.scrollViewObserve();
-        },
-        // 监听列表高度变化
-        listContentObserve() {
-            this.disconnectObserve('_listContentObserve');
-            const listContentObserve = this.createIntersectionObserver({
-                thresholds: [0, 0.5, 1]
-            });
-            listContentObserve.relativeToViewport({
-                // #ifdef H5
-                top: -(this.windowInfo.windowTop + rect.top),
-                // #endif
-                // #ifndef H5
-                top: -rect.top
-                // #endif
-            });
-        },
-        // 监听组件位置变化
-        scrollViewObserve() {
-            this.disconnectObserve('_scrollViewObserve');
-            this.$nextTick(() => {
-                this.queryRect('.' + this.elClass).then(rect => {
-                    const scrollViewObserve = this.createIntersectionObserver({
-                        thresholds: [0, 0.5, 1]
-                    });
-                    scrollViewObserve.relativeToViewport({
-                        // #ifdef H5
-                        top: -(this.windowInfo.windowTop + rect.top),
-                        // #endif
-                        // #ifndef H5
-                        top: -rect.top
-                        // #endif
-                    });
-                    scrollViewObserve.observe('.' + this.elClass, position => {
-                        // #ifdef H5
-                        this.scrollViewTop = position.boundingClientRect.top - this.windowInfo.windowTop;
-                        // #endif
-                        // #ifndef H5
-                        this.scrollViewTop = position.boundingClientRect.top;
-                        // #endif
-                    });
-                    this._scrollViewObserve = scrollViewObserve;
-                });
-            });
-        },
-        // 断开监听组件
-        disconnectObserve(observerName) {
-            const observer = this[observerName];
-            observer && observer.disconnect();
-        },
-        // 查询dom节点信息
-        queryRect(selector, all) {
-            return new Promise(resolve => {
-                uni.createSelectorQuery()
-                    .in(this)
-                    [all ? 'selectAll' : 'select'](selector)
-                    .boundingClientRect(rect => {
-                        if (all && Array.isArray(rect) && rect.length) {
-                            resolve(rect);
-                        }
-                        if (!all && rect) {
-                            resolve(rect);
-                        }
-                    })
-                    .exec();
-            });
-        },
-        // 16进制转RGB
-        hexToRgb(hex) {
-            const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
-            hex = hex.replace(shorthandRegex, (m, r, g, b) => {
-                return r + r + g + g + b + b;
-            });
-            const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-            return result
-                ? {
-                      r: parseInt(result[1], 16),
-                      g: parseInt(result[2], 16),
-                      b: parseInt(result[3], 16)
-                  }
-                : null;
-        }
-    },
-    computed: {
-        scrollListWrapStyle(){
-            let style = {};
-            style.background = this.defaultOption.background;
-            return style;
-        },
-        // 组件容器样式
-        listWrapStyle() {
-            let style = {};
-            const { offsetBottom } = this.defaultOption;
-            style.height = this.scrollViewHeight - uni.upx2px(offsetBottom) + 'px';
-            if (this.defaultOption.safeArea) style.paddingBottom = 'env(safe-area-inset-bottom) !important';
-            return style;
-        },
-        // 滚动内容样式
-        scrollContentStyle() {
-            const style = {};
-            const { pullDownHeight, pulldowning, showPullDown } = this;
-            style.transform = showPullDown ? `translateY(${pullDownHeight}px)` : `translateY(0px)`;
-            style.transition = pulldowning ? `transform 100ms ease-out` : `transform 200ms cubic-bezier(0.19,1.64,0.42,0.72)`;
-            return style;
-        },
-        // 下拉刷新样式
-        refreshViewStyle() {
-            const style = {};
-            const { showPullDown } = this;
-            style.opacity = showPullDown ? 1 : 0;
-            return style;
-        },
-        // 下拉中动画样式
-        pullDownAnimationStyle() {
-            const style = {};
-            const { refresherIconColor, refresherThreshold } = this.defaultOption;
-            const { refreshing, pullDownHeight } = this;
-            const { r, g, b } = this.hexToRgb(refresherIconColor);
-            const rate = pullDownHeight / refresherThreshold;
-            style.borderColor = `rgba(${r},${g},${b},0.2)`;
-            style.borderTopColor = refresherIconColor;
-            if (!refreshing) {
-                style.transform = `rotate(${360 * rate}deg)`;
-                style.transition = 'transform 100ms linear';
-            }
-            return style;
-        },
-        pullDownTextStyle() {
-            const style = {};
-            const { refresherTextColor } = this.defaultOption;
-            style.color = refresherTextColor;
-            return style;
-        },
-        // 上拉中动画样式
-        pullUpAnimationStyle() {
-            const style = {};
-            const { loadIconColor } = this.defaultOption;
-            const { r, g, b } = this.hexToRgb(loadIconColor);
-            style.borderColor = `rgba(${r},${g},${b},0.2)`;
-            style.borderTopColor = loadIconColor;
-            return style;
-        },
-        // 上拉中文字样式
-        pullUpTextStyle() {
-            const style = {};
-            const { loadTextColor } = this.defaultOption;
-            style.color = loadTextColor;
-            return style;
-        },
-        // 空数据提示文字样式
-        emptyTextStyle() {
-            const style = {};
-            const { emptyTextColor } = this.defaultOption;
-            style.color = emptyTextColor;
-            return style;
-        }
-    },
-    watch: {
-        scrollViewTop(val) {
-            this.updateScrollView();
-        }
-    },
-    created() {
-        this.elClass = 'scroll-view-' + this._uid;
-        this.windowInfo = uni.getSystemInfoSync();
-    },
-    mounted() {
-        this.handleInit();
-    }
-};
-</script>
-
-<style scoped lang="scss">
-.scroll-list-wrap {
-    box-sizing: border-box;
-    .scroll-view {
-        position: relative;
-        .scroll-content {
-            height: 100%;
-            display: flex;
-            will-change: transform;
-            flex-direction: column;
-            .pull-down-wrap {
-                left: 0;
-                width: 100%;
-                display: flex;
-                padding: 30rpx 0;
-                position: absolute;
-                align-items: flex-end;
-                justify-content: center;
-                transform: translateY(-100%);
-                .refresh-view {
-                    display: flex;
-                    justify-content: center;
-                    .pull-down-animation {
-                        width: 32rpx;
-                        height: 32rpx;
-                        border-width: 4rpx;
-                        border-style: solid;
-                        border-radius: 50%;
-                        &.refreshing {
-                            animation: spin 0.5s linear infinite;
-                        }
-                        @keyframes spin {
-                            to {
-                                transform: rotate(360deg);
-                            }
-                        }
-                    }
-                    .pull-down-text {
-                        margin-left: 10rpx;
-                    }
-                }
-            }
-            .empty-wrap {
-                top: 0;
-                left: 0;
-                width: 100%;
-                height: 100%;
-                display: flex;
-                position: absolute;
-                align-items: center;
-                flex-direction: column;
-                .empty-view {
-                    margin: auto;
-                    display: flex;
-                    align-items: center;
-                    flex-direction: column;
-                    .empty-image {
-                        width: 200rpx;
-                        height: 200rpx;
-                    }
-                    .empty-text {
-                        color: #606266;
-                        margin-top: 20rpx;
-                    }
-                }
-            }
-            .list-content {
-            }
-            .pull-up-wrap {
-                display: flex;
-                align-items: center;
-                justify-content: center;
-                .load-view {
-                    padding: 20rpx 0;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    .pull-up-animation {
-                        width: 32rpx;
-                        height: 32rpx;
-                        border-width: 4rpx;
-                        border-style: solid;
-                        border-radius: 50%;
-                        animation: spin 0.5s linear infinite;
-                    }
-                    .pull-up-text {
-                        margin-left: 10rpx;
-                    }
-                }
-            }
-        }
-    }
-}
-</style>

src/components/uni-goods-nav/uni-goods-nav.vue

@@ -6,8 +6,7 @@
 			<view class="flex uni-tab__cart-sub-left">
 				<view v-for="(item,index) in options" :key="index" class="flex uni-tab__cart-button-left uni-tab__shop-cart" @click="onClick(index,item)">
 					<view class="uni-tab__icon">
-						<uni-icons :type="item.icon" size="20" color="#646566"></uni-icons>
-						<!-- <image class="image" :src="item.icon" mode="widthFix" /> -->
+						<span class="iconfont">&#xe62a;</span>
 					</view>
 					<text class="uni-tab__text">{{ item.text }}</text>
 					<view class="flex uni-tab__dot-box">
@@ -26,7 +25,6 @@
 </template>
 
 <script>
-	import uniIcons from '../uni-icons/uni-icons.vue'
 	/**
 	 * GoodsNav 商品导航
 	 * @description 商品加入购物车、立即购买等
@@ -40,9 +38,7 @@
 	 */
 	export default {
 		name: 'UniGoodsNav',
-		components: {
-			uniIcons
-		},
+		components: {},
 		props: {
 			options: {
 				type: Array,

src/components/uni-icons/icons.js

@@ -1,132 +0,0 @@
-export default {
-	"pulldown": "\ue588",
-	"refreshempty": "\ue461",
-	"back": "\ue471",
-	"forward": "\ue470",
-	"more": "\ue507",
-	"more-filled": "\ue537",
-	"scan": "\ue612",
-	"qq": "\ue264",
-	"weibo": "\ue260",
-	"weixin": "\ue261",
-	"pengyouquan": "\ue262",
-	"loop": "\ue565",
-	"refresh": "\ue407",
-	"refresh-filled": "\ue437",
-	"arrowthindown": "\ue585",
-	"arrowthinleft": "\ue586",
-	"arrowthinright": "\ue587",
-	"arrowthinup": "\ue584",
-	"undo-filled": "\ue7d6",
-	"undo": "\ue406",
-	"redo": "\ue405",
-	"redo-filled": "\ue7d9",
-	"bars": "\ue563",
-	"chatboxes": "\ue203",
-	"camera": "\ue301",
-	"chatboxes-filled": "\ue233",
-	"camera-filled": "\ue7ef",
-	"cart-filled": "\ue7f4",
-	"cart": "\ue7f5",
-	"checkbox-filled": "\ue442",
-	"checkbox": "\ue7fa",
-	"arrowleft": "\ue582",
-	"arrowdown": "\ue581",
-	"arrowright": "\ue583",
-	"smallcircle-filled": "\ue801",
-	"arrowup": "\ue580",
-	"circle": "\ue411",
-	"eye-filled": "\ue568",
-	"eye-slash-filled": "\ue822",
-	"eye-slash": "\ue823",
-	"eye": "\ue824",
-	"flag-filled": "\ue825",
-	"flag": "\ue508",
-	"gear-filled": "\ue532",
-	"reload": "\ue462",
-	"gear": "\ue502",
-	"hand-thumbsdown-filled": "\ue83b",
-	"hand-thumbsdown": "\ue83c",
-	"hand-thumbsup-filled": "\ue83d",
-	"heart-filled": "\ue83e",
-	"hand-thumbsup": "\ue83f",
-	"heart": "\ue840",
-	"home": "\ue500",
-	"info": "\ue504",
-	"home-filled": "\ue530",
-	"info-filled": "\ue534",
-	"circle-filled": "\ue441",
-	"chat-filled": "\ue847",
-	"chat": "\ue263",
-	"mail-open-filled": "\ue84d",
-	"email-filled": "\ue231",
-	"mail-open": "\ue84e",
-	"email": "\ue201",
-	"checkmarkempty": "\ue472",
-	"list": "\ue562",
-	"locked-filled": "\ue856",
-	"locked": "\ue506",
-	"map-filled": "\ue85c",
-	"map-pin": "\ue85e",
-	"map-pin-ellipse": "\ue864",
-	"map": "\ue364",
-	"minus-filled": "\ue440",
-	"mic-filled": "\ue332",
-	"minus": "\ue410",
-	"micoff": "\ue360",
-	"mic": "\ue302",
-	"clear": "\ue434",
-	"smallcircle": "\ue868",
-	"close": "\ue404",
-	"closeempty": "\ue460",
-	"paperclip": "\ue567",
-	"paperplane": "\ue503",
-	"paperplane-filled": "\ue86e",
-	"person-filled": "\ue131",
-	"contact-filled": "\ue130",
-	"person": "\ue101",
-	"contact": "\ue100",
-	"images-filled": "\ue87a",
-	"phone": "\ue200",
-	"images": "\ue87b",
-	"image": "\ue363",
-	"image-filled": "\ue877",
-	"location-filled": "\ue333",
-	"location": "\ue303",
-	"plus-filled": "\ue439",
-	"plus": "\ue409",
-	"plusempty": "\ue468",
-	"help-filled": "\ue535",
-	"help": "\ue505",
-	"navigate-filled": "\ue884",
-	"navigate": "\ue501",
-	"mic-slash-filled": "\ue892",
-	"search": "\ue466",
-	"settings": "\ue560",
-	"sound": "\ue590",
-	"sound-filled": "\ue8a1",
-	"spinner-cycle": "\ue465",
-	"download-filled": "\ue8a4",
-	"personadd-filled": "\ue132",
-	"videocam-filled": "\ue8af",
-	"personadd": "\ue102",
-	"upload": "\ue402",
-	"upload-filled": "\ue8b1",
-	"starhalf": "\ue463",
-	"star-filled": "\ue438",
-	"star": "\ue408",
-	"trash": "\ue401",
-	"phone-filled": "\ue230",
-	"compose": "\ue400",
-	"videocam": "\ue300",
-	"trash-filled": "\ue8dc",
-	"download": "\ue403",
-	"chatbubble-filled": "\ue232",
-	"chatbubble": "\ue202",
-	"cloud-download": "\ue8e4",
-	"cloud-upload-filled": "\ue8e5",
-	"cloud-upload": "\ue8e6",
-	"cloud-download-filled": "\ue8e9",
-	"headphones":"\ue8bf",
-	"shop":"\ue609"
-}

src/components/uni-transition/uni-transition.vue

@@ -1,279 +0,0 @@
-<template>
-	<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
-	 @click="change">
-		 <slot></slot>
-	</view>
-</template>
-
-<script>
-	// #ifdef APP-NVUE
-	const animation = uni.requireNativePlugin('animation');
-	// #endif
-	/**
-	 * Transition 过渡动画
-	 * @description 简单过渡动画组件
-	 * @tutorial https://ext.dcloud.net.cn/plugin?id=985
-	 * @property {Boolean} show = [false|true] 控制组件显示或隐藏
-     * @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
-     *  @value fade 渐隐渐出过渡
-     *  @value slide-top 由上至下过渡
-     *  @value slide-right 由右至左过渡
-     *  @value slide-bottom 由下至上过渡
-     *  @value slide-left 由左至右过渡
-     *  @value zoom-in 由小到大过渡
-     *  @value zoom-out 由大到小过渡
-	 * @property {Number} duration 过渡动画持续时间
-	 * @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
-	 */
-	export default {
-		name: 'uniTransition',
-		props: {
-			show: {
-				type: Boolean,
-				default: false
-			},
-			modeClass: {
-				type: Array,
-				default () {
-					return []
-				}
-			},
-			duration: {
-				type: Number,
-				default: 300
-			},
-			styles: {
-				type: Object,
-				default () {
-					return {}
-				}
-			}
-		},
-		data() {
-			return {
-				isShow: false,
-				transform: '',
-				ani: { in: '',
-					active: ''
-				}
-			};
-		},
-		watch: {
-			show: {
-				handler(newVal) {
-					if (newVal) {
-						this.open()
-					} else {
-						this.close()
-					}
-				},
-				immediate: true
-			}
-		},
-		computed: {
-			stylesObject() {
-				let styles = {
-					...this.styles,
-					'transition-duration': this.duration / 1000 + 's'
-				}
-				let transfrom = ''
-				for (let i in styles) {
-					let line = this.toLine(i)
-					transfrom += line + ':' + styles[i] + ';'
-				}
-				return transfrom
-			}
-		},
-		created() {
-			// this.timer = null
-			// this.nextTick = (time = 50) => new Promise(resolve => {
-			// 	clearTimeout(this.timer)
-			// 	this.timer = setTimeout(resolve, time)
-			// 	return this.timer
-			// });
-		},
-		methods: {
-			change() {
-				this.$emit('click', {
-					detail: this.isShow
-				})
-			},
-			open() {
-				clearTimeout(this.timer)
-				this.isShow = true
-				this.transform = ''
-				this.ani.in = ''
-				for (let i in this.getTranfrom(false)) {
-					if (i === 'opacity') {
-						this.ani.in = 'fade-in'
-					} else {
-						this.transform += `${this.getTranfrom(false)[i]} `
-					}
-				}
-				this.$nextTick(() => {
-					setTimeout(() => {
-						this._animation(true)
-					}, 50)
-				})
-
-			},
-			close(type) {
-				clearTimeout(this.timer)
-				this._animation(false)
-			},
-			_animation(type) {
-				let styles = this.getTranfrom(type)
-				// #ifdef APP-NVUE
-				if(!this.$refs['ani']) return
-				animation.transition(this.$refs['ani'].ref, {
-					styles,
-					duration: this.duration, //ms
-					timingFunction: 'ease',
-					needLayout: false,
-					delay: 0 //ms
-				}, () => {
-					if (!type) {
-						this.isShow = false
-					}
-					this.$emit('change', {
-						detail: this.isShow
-					})
-				})
-				// #endif
-				// #ifndef APP-NVUE
-				this.transform = ''
-				for (let i in styles) {
-					if (i === 'opacity') {
-						this.ani.in = `fade-${type?'out':'in'}`
-					} else {
-						this.transform += `${styles[i]} `
-					}
-				}
-				this.timer = setTimeout(() => {
-					if (!type) {
-						this.isShow = false
-					}
-					this.$emit('change', {
-						detail: this.isShow
-					})
-
-				}, this.duration)
-				// #endif
-
-			},
-			getTranfrom(type) {
-				let styles = {
-					transform: ''
-				}
-				this.modeClass.forEach((mode) => {
-					switch (mode) {
-						case 'fade':
-							styles.opacity = type ? 1 : 0
-							break;
-						case 'slide-top':
-							styles.transform += `translateY(${type?'0':'-100%'}) `
-							break;
-						case 'slide-right':
-							styles.transform += `translateX(${type?'0':'100%'}) `
-							break;
-						case 'slide-bottom':
-							styles.transform += `translateY(${type?'0':'100%'}) `
-							break;
-						case 'slide-left':
-							styles.transform += `translateX(${type?'0':'-100%'}) `
-							break;
-						case 'zoom-in':
-							styles.transform += `scale(${type?1:0.8}) `
-							break;
-						case 'zoom-out':
-							styles.transform += `scale(${type?1:1.2}) `
-							break;
-					}
-				})
-				return styles
-			},
-			_modeClassArr(type) {
-				let mode = this.modeClass
-				if (typeof(mode) !== "string") {
-					let modestr = ''
-					mode.forEach((item) => {
-						modestr += (item + '-' + type + ',')
-					})
-					return modestr.substr(0, modestr.length - 1)
-				} else {
-					return mode + '-' + type
-				}
-			},
-			// getEl(el) {
-			// 	console.log(el || el.ref || null);
-			// 	return el || el.ref || null
-			// },
-			toLine(name) {
-				return name.replace(/([A-Z])/g, "-$1").toLowerCase();
-			}
-		}
-	}
-</script>
-
-<style>
-	.uni-transition {
-		transition-timing-function: ease;
-		transition-duration: 0.3s;
-		transition-property: transform, opacity;
-	}
-
-	.fade-in {
-		opacity: 0;
-	}
-
-	.fade-active {
-		opacity: 1;
-	}
-
-	.slide-top-in {
-		/* transition-property: transform, opacity; */
-		transform: translateY(-100%);
-	}
-
-	.slide-top-active {
-		transform: translateY(0);
-		/* opacity: 1; */
-	}
-
-	.slide-right-in {
-		transform: translateX(100%);
-	}
-
-	.slide-right-active {
-		transform: translateX(0);
-	}
-
-	.slide-bottom-in {
-		transform: translateY(100%);
-	}
-
-	.slide-bottom-active {
-		transform: translateY(0);
-	}
-
-	.slide-left-in {
-		transform: translateX(-100%);
-	}
-
-	.slide-left-active {
-		transform: translateX(0);
-		opacity: 1;
-	}
-
-	.zoom-in-in {
-		transform: scale(0.8);
-	}
-
-	.zoom-out-active {
-		transform: scale(1);
-	}
-
-	.zoom-out-in {
-		transform: scale(1.2);
-	}
-</style>

src/components/xh-privacy/xh-privacy.vue

@@ -67,8 +67,7 @@
 			wx.getPrivacySetting({
 				success(res) {
 					console.log("PrivacySetting：",res);
-					if (res.errMsg == "getPrivacySetting:ok") {
-						// 弹出隐私授权协议
+					if (res.errMsg == "getPrivacySetting:ok") { // 弹出隐私授权协议
 						_this.show_privacy = res.needAuthorization
 					}
 					_this.PrivacyName = res.privacyContractName

src/pagesB/components/h-address/address.vue

@@ -1,275 +1,329 @@
 <template>
-	<view class="t-index-address">
-		<scroll-view class="t-index-address__scroll-view" :scroll-into-view="scrollview" :scroll-y="true" :enable-flex="true">
-			<div class="keyw">
-				<span class="lico iconfont">&#xe661;</span>
-				<input v-model="keyword" @input="Suggestion" placeholder="城市、地址关键字" class="inp"/>
-				<div class="sugs_list" v-if="sugs.length">
-					<div class="sugs_item" v-for="(i,s) in sugs" :key="s" @click="onsug(i)">
-						<div class="tit">{{ i.title }}</div>
-						<div class="address ellipsis">{{ i.province }} - {{ i.city }}</div>
+	<div class="shade" v-if="visible">
+		<view class="t-index-address">
+			<span class="close iconfont" @click="onclose">&#xe609;</span>
+			<scroll-view class="t-index-address__scroll-view" :scroll-into-view="scrollview" :scroll-y="true" :enable-flex="true">
+				<div class="keyw" id="hot">
+					<span class="lico iconfont">&#xe661;</span>
+					<input v-model="keyword" @input="Suggestion" placeholder="城市、地址关键字" class="inp" />
+					<div class="sugs_list" v-if="isSearch">
+						<div class="sugs_item" v-for="(i,s) in sugs" :key="s" @click="onsug(i)">
+							<div class="tit">{{ i.title }}</div>
+							<div class="address ellipsis">{{ i.province }} - {{ i.city }}</div>
+						</div>
 					</div>
 				</div>
-			</div>
-			<template v-if="!sugs.length">
-				<div class="city_hot">
-					<div class="tit_hot">热门城市</div>
-					<div class="city_box">
-						<div class="hot_item" v-for="(i,s) in hotCitys" :key="s" @click="$emit('select', i)">{{ i.cityName }}</div>
+				<template v-if="!isSearch">
+					<!-- 热门城市 -->
+					<div class="city_hot">
+						<div class="tit_hot">热门城市</div>
+						<div class="city_box">
+							<div class="hot_item" v-for="(i,s) in hotCitys" :key="s" @click="emit(i)">{{ i.cityName }}</div>
+						</div>
 					</div>
-				</div>
-				<view :id="group.initials" v-for="group in cityList" :key="group.initials">
-					<view class="t-index-address__anchor">
-						<text>{{ group.initials }}</text>
-					</view>
-					<view class="t-index-address__list">
-						<view class="t-index-address__cell" v-for="(city, index) in group.list" :key="index" @click="$emit('select', city)">
-							<text>{{ city.cityName }}</text>
+					<!-- 城市列表 -->
+					<view :id="group.initials" v-for="group in cityList" :key="group.initials">
+						<view class="t-index-address__anchor">
+							<text>{{ group.initials }}</text>
 						</view>
+						<view class="t-index-address__list">
+							<view class="t-index-address__cell" v-for="(city, index) in group.list" :key="index" @click="emit(city)">
+								<text>{{ city.cityName }}</text>
+							</view>
+						</view>
+					</view>
+				</template>
+			</scroll-view>
+			<template v-if="!isSearch">
+				<view class="t-index-address__sidebar">
+					<view class="t-index-address__index" @touchstart.stop.prevent="onTouchMove('hot')" @touchend.stop.prevent="onTouchStop" @touchcancel.stop.prevent="onTouchStop">热门</view>
+					<view class="t-index-address__index" v-for="group in cityList" :key="group.initials" @touchstart.stop.prevent="onTouchMove(group.initials)" @touchend.stop.prevent="onTouchStop" @touchcancel.stop.prevent="onTouchStop">
+						<span>{{ group.initials }}</span>
 					</view>
 				</view>
-			</template>
-		</scroll-view>
-		<template v-if="!sugs.length">
-			<view class="t-index-address__sidebar">
-				<view class="t-index-address__index" v-for="group in cityList" :key="group.initials" @touchstart.stop.prevent="onTouchMove(group.initials)" @touchend.stop.prevent="onTouchStop" @touchcancel.stop.prevent="onTouchStop">
-					<span>{{ group.initials }}</span>
+				<view class="t-index-address__alert" v-if="touchmove">
+					<text>{{ activeIndex }}</text>
 				</view>
-			</view>
-			<view class="t-index-address__alert" v-if="touchmove">
-				<text>{{ activeIndex }}</text>
-			</view>
-		</template>
-	</view>
+			</template>
+		</view>
+	</div>
 </template>
 <script>
-import {similar} from '@/pagesB/static/js/similar.js';
+import { similar } from '@/pagesB/static/js/similar.js';
 import QQMapWX from '@/pagesB/static/js/qqmap-wx-jssdk.min.js';
 const showmap = new QQMapWX({ key: 'K7LBZ-RE23Q-JEN5D-4ZNEI-MS54Q-BHF6D' });
 import { post } from "@/request/api.js";
 
 export default {
-	data() {
-		return {
-			keyword: "",
-			sugs: [], //关键词结果，城市列表
-			sugone: {},
-			iscity: false,
-
-			scrollview: "A",
-			hotCitys: [],
-			cityList: [],
-			activeIndex: "A",
-			touchmove: false,
-		};
-	},
-	watch: {
-		activeIndex(value) {
-			this.scrollview = value;
+	props: {
+		visible: {
+			type: Boolean,
+			default: false
 		},
 	},
-	methods: {
-		initCityList() {
-			post("local/hotel/hotCity").then(res => {
-				if (res.code == 0) {
-					this.hotCitys = res.data;
-				}
-			})
-			post("local/hotel/cityList").then(res => {
-				if (res.code == 0) {
-					let json = [];
-					for (const k in res.data) {
-						json.push(res.data[k])
-					}
-					this.cityList = json;
-				}
-			})
-		},
-		onTouchMove(index) {
-			this.activeIndex = index;
-			this.touchmove = true;
-		},
-		onTouchStop() {
-			this.touchmove = false;
-		},
-		Suggestion(va){
-			let that = this;
-			if (!va.detail.value.length)  this.sugs = [];
-			showmap.getSuggestion({
-				keyword: that.keyword,
-				success(res){
-					let da = res.data; that.sugs = da;
-					let s1 = similar(that.keyword,da[0].city);
-					let s2 = similar(that.keyword,da[0].district);
-					that.iscity = s1 > s2;
-					that.sugs.unshift({
-						title: s1 > s2 ? da[0].city : da[0].district,
-						province: da[0].province,
-						city: da[0].city,
-						location: da[0].location
-					})
-				}
-			})
-		},
-		onsug(va){
-			let { lat, lng } = va.location
-			let adres = { longitude: lng, latitude: lat };
+    data() {
+        return {
+            keyword: "",
+            sugs: [], //关键词结果，城市列表
+            sugone: {},
+            iscity: false,
+
+            hotCitys: [],
+            cityList: [],
+            scrollview: "hot",
+            activeIndex: "hot",
+            touchmove: false,
+        };
+    },
+    watch: {
+        activeIndex(value) {
+            this.scrollview = value;
+        },
+    },
+    methods: {
+        initCityList() {
+            post("local/hotel/hotCity").then(res => {
+                if (res.code == 0) {
+                    this.hotCitys = res.data;
+                }
+            })
+            post("local/hotel/cityList").then(res => {
+                if (res.code == 0) {
+                    let json = [];
+                    for (const k in res.data) {
+                        json.push(res.data[k])
+                    }
+                    this.cityList = json;
+                }
+            })
+        },
+        onTouchMove(index) {
+            this.activeIndex = index;
+            this.touchmove = true;
+        },
+        onTouchStop() {
+            this.touchmove = false;
+        },
+        Suggestion(va) {
+            let that = this;
+            if (!va.detail.value.length) this.sugs = [];
+            showmap.getSuggestion({
+                keyword: that.keyword,
+                success(res) {
+                    let da = res.data;
+                    that.sugs = da;
+                    let s1 = similar(that.keyword, da[0].city);
+                    let s2 = similar(that.keyword, da[0].district);
+                    that.iscity = s1 > s2;
+                    that.sugs.unshift({
+                        title: s1 > s2 ? da[0].city : da[0].district,
+                        province: da[0].province,
+                        city: da[0].city,
+                        location: da[0].location
+                    })
+                }
+            })
+        },
+        onsug(va) {
+            let { lat, lng } = va.location
+            let adres = { longitude: lng, latitude: lat };
             post("local/hotel/city", adres).then(res => {
                 if (res.code == 0) {
                     let da = res.data;
-					da.queryText = va.title;
-					if(this.iscity && !va.adcode) delete da.queryText;
-					this.$emit('select', da);
+                    da.queryText = va.title;
+                    if (this.iscity && !va.adcode) delete da.queryText;
+					this.emit(da)
                 }
             })
-		}
-	},
-	mounted() {
+        },
+		emit(da){
+			this.$emit('select', da);
+		},
+		onclose(){
+			this.$emit('update:visible', false)
+		},
+    },
+	created () {
 		this.initCityList();
 	},
+	computed: {
+		isSearch() {
+			return this.sugs.length && this.keyword
+		}
+	},
 };
 </script>
 <style lang="scss" scoped>
 .t-index-address {
-	width: 100%;
-	height: 100vh;
-	background: #fff;
-	position: fixed;
-	left: 0;
-	top: 0;
-	z-index: 888;
+    width: 100%;
+    height: 97vh;
+    background: #fff;
+    position: fixed;
+    left: 0;
+    top: 3vh;
+    z-index: 888;
+	border-radius: 20rpx 20rpx 0 0;
 
-	&__scroll-view {
-		width: 100%;
-		height: 100%;
-		max-height: 100vh;
-	}
+    &__scroll-view {
+        width: 100%;
+        height: 100%;
+		padding: 20rpx 0 50rpx;
+		box-sizing: border-box;
+    }
 
-	&__anchor {
-		padding: 15rpx 30rpx;
-		width: 100%;
-		font-size: 28rpx;
-		font-weight: 500;
-		color: #606266;
-		background-color: rgb(245, 245, 245);
-	}
+    &__anchor {
+        padding: 15rpx 34rpx;
+        width: 100%;
+        font-size: 30rpx;
+    	font-weight: bold;
+        color: #606266;
+        background-color: rgb(245, 245, 245);
+    }
 
-	&__list {
-		padding: 0 70rpx 0 30rpx;
-	}
+    &__list {
+        padding: 0 70rpx 0 34rpx;
+    }
 
-	&__cell {
-		height: 100rpx;
-		line-height: 100rpx;
-		border-bottom: 1rpx solid #f2f2f2;
+    &__cell {
+        height: 100rpx;
+        line-height: 100rpx;
+        border-bottom: 1rpx solid #f2f2f2;
 
-		&:last-child {
-			border: none;
-		}
-	}
+        &:last-child {
+            border: none;
+        }
+    }
 
-	&__sidebar {
-		position: fixed;
-		top: 50%;
-		right: 0;
-		transform: translateY(-50%);
-		z-index: 99;
-	}
+    &__sidebar {
+        position: absolute;
+        top: 50%;
+        right: 0;
+        transform: translateY(-50%);
+    }
 
-	&__index {
-		padding: 10rpx 20rpx;
-		font-size: 22rpx;
-		font-weight: 500;
-		line-height: 1;
-	}
+    &__index {
+        padding: 10rpx 20rpx;
+        font-size: 22rpx;
+        font-weight: 500;
+        line-height: 1;
+    }
 
-	&__alert {
-		position: fixed;
-		top: 50%;
-		right: 90rpx;
-		z-index: 99;
-		margin-top: -60rpx;
-		width: 120rpx;
-		height: 120rpx;
-		font-size: 50rpx;
-		color: #fff;
-		border-radius: 24rpx;
-		background-color: rgba(0, 0, 0, 0.5);
-		display: flex;
-		justify-content: center;
-		align-items: center;
-	}
+    &__alert {
+        position: absolute;
+        top: 50%;
+        right: 90rpx;
+        z-index: 99;
+        margin-top: -60rpx;
+        width: 120rpx;
+        height: 120rpx;
+        font-size: 50rpx;
+        color: #fff;
+        border-radius: 24rpx;
+        background-color: rgba(0, 0, 0, 0.5);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
 }
 
-.keyw{
-	position: relative;
-	padding: 0 32rpx;
-	.lico{
-		position: absolute;
-		height: 32rpx;
-		line-height: 32rpx;
-		top: 13rpx;
-		left: 50rpx;
-	}
-	.inp{
-		height: 58rpx;
-		line-height: 58rpx;
-		font-size: 30rpx;
-		background-color: rgba($color: #000, $alpha: 0.05);
-		border-radius: 8rpx;
-		padding: 0 68rpx;
-	}
-	.sugs_list{
-		margin-bottom: 30rpx;
-		padding-top: 20rpx;
-		.sugs_item{
-			margin-bottom: 16rpx;
-			&:last-child{
-				margin-bottom: 0;
-			}
-		}
-		.tit{
-			font-size: 28rpx;
-			font-weight: 600;
-			.city{
-				font-size: 25rpx;
-				font-weight: 400;
-				margin-left: 16rpx;
-			}
-		}
-		.address{
-			font-size: 24rpx;
-			color: #999;
-		}
-	}
+.close{
+	font-size: 38rpx;
+	font-weight: bold;
+	position: absolute;
+    right: 32rpx;
+    top: 30rpx;
+	z-index: 1000;
+}
+
+.keyw {
+    position: relative;
+    padding: 0 32rpx;
+	width: calc(100% - 70rpx);
+
+    .lico {
+        position: absolute;
+        height: 32rpx;
+        line-height: 32rpx;
+        top: 13rpx;
+        left: 50rpx;
+    }
+
+    .inp {
+        height: 58rpx;
+        line-height: 58rpx;
+        font-size: 30rpx;
+        background-color: rgba($color: #000, $alpha: 0.05);
+        border-radius: 8rpx;
+        padding: 0 68rpx;
+    }
+
+    .sugs_list {
+        margin-bottom: 30rpx;
+        padding-top: 20rpx;
+
+        .sugs_item {
+            margin-bottom: 16rpx;
+
+            &:last-child {
+                margin-bottom: 0;
+            }
+        }
+
+        .tit {
+            font-size: 28rpx;
+            font-weight: 600;
+
+            .city {
+                font-size: 25rpx;
+                font-weight: 400;
+                margin-left: 16rpx;
+            }
+        }
+
+        .address {
+            font-size: 24rpx;
+            color: #999;
+        }
+    }
 }
 
 .city_hot {
-	.tit_hot{
-		font-size: 30rpx;
-		padding: 16rpx 32rpx;
-	}
-	.city_box {
-		padding: 0 32rpx 28rpx;
-		display: grid;
-		justify-content: space-between;
-		// 划分列 功能函数关键字 repeat （auto-fill，100rpx）
-		// 根据子元素的盒子的份额自动计算可以平铺几次
-		grid-template-columns: repeat(auto-fill, 100rpx);
-		// grid-gap 是 row-gap 和 column-gap 的简写形式。
-		margin-bottom: -10rpx;
-		grid-gap: 0 1px;
-	}
+    .tit_hot {
+        font-size: 30rpx;
+        padding: 15rpx 34rpx;
+		font-weight: 600;
+    	background-color: rgb(245, 245, 245);
+		margin-top: 20rpx;
+    }
+
+    .city_box {
+        padding: 28rpx 110rpx 28rpx 32rpx;
+        display: grid;
+        justify-content: space-between;
+        grid-template-columns: repeat(auto-fill, 100rpx);
+        margin-bottom: -10rpx;
+        grid-gap: 0 1px;
+    }
 
-	.hot_item {
-		width: 100rpx;
-		text-align: center;
-		height: 44rpx;
-		line-height: 44rpx;
-		font-size: 24rpx;
-		background-color: rgba($color: #000, $alpha: 0.08);
-		margin-bottom: 10rpx;
-		border-radius: 8rpx;
-	}
+    .hot_item {
+        width: 100rpx;
+        text-align: center;
+        height: 44rpx;
+        line-height: 44rpx;
+        font-size: 24rpx;
+        background-color: rgba($color: #000, $alpha: 0.08);
+        margin-bottom: 10rpx;
+        border-radius: 8rpx;
+    }
+}
+
+.shade{
+    z-index: 887;
+	width: 100%;
+	height: 100vh;
+	background-color: rgba(0, 0, 0, 0.5);
+	position: fixed;
+	top: 0;
+	left: 0;
 }
 </style>

src/pagesB/hotel/index.vue

@@ -39,7 +39,7 @@
         <!-- 日期选择 -->
         <date-picker mode="2" ref="dayPicker" :isShow.sync="showCaledar" @callback="pickerChange" />
         <!-- 城市选择 -->
-        <h-address @select="selectaddress" v-show="showAddress" />
+        <h-address @select="selectaddress" :visible.sync="showAddress" />
 
         <dev class="ni_popup" v-if="popupShow">
             <div class="starLevel">

src/pagesB/scenicSpotTicket/index.vue

@@ -43,7 +43,7 @@
             </div>
         </scroll-view>
         <div class="BackTop iconfont" @click="onBackTop" v-if="oldscrollTop > 500">&#xe632;</div>
-        <h-address @select="selectaddress" v-show="showAddress" />
+        <h-address @select="selectaddress" :visible.sync="showAddress" />
 		<uni-popup ref="popup" :safe-area="false">
             <div class="popup_con">
                 <div class="sort_li">

src/pagesC/settledMerchant/myShop.vue

@@ -143,7 +143,7 @@ export default {
     }
 }
 .list{
-    padding: 30rpx 0;
+    padding: 60rpx 0 30rpx;
     .list-item{
         margin-bottom: 50rpx;
     }