dingdong-master/pages/my/shop-list.vue

<template>
	<view>
		<!-- 顶部操作条 -->
		<cu-custom :bgColor="'bg-main-color'" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">店铺管理</block>
		</cu-custom>
		<!-- 店铺管理列表 -->
		<view class="margin-bottom-with-bar">
			<view class="padding margin-lr-sm margin-top-sm bg-white flex justify-between align-center" v-for="(item, index) in myAddressList" :key="index">
				<view class="flex flex-sub align-center">
					<image class="bg-img-container" :src="item.imageUrl.split(',')[0]" mode="aspectFill"></image>
					<view class="flex-sub">
						<view class="flex justify-start align-center">
							<view class="text-gray margin-right-xs">{{item.provinceName}}</view>
							<view class="text-gray margin-right-xs">{{item.cityName}}</view>
							<view class="text-gray margin-right-xs">{{item.countryName}}</view>
							<view class="text-gray margin-right-xs">{{item.streetName || ''}}</view>
						</view>
						<view class="text-lg margin-tb-sm">{{item.address}}</view>
						<view class="text-gray">
							<text class="margin-right">门店名称：</text>
							<text>{{item.shopName}}</text>
						</view>
						<view class="text-gray">
							<text class="margin-right">门店电话：</text>
							<text>{{item.phone}}</text>
						</view>
					</view>
				</view>
				<view class="oper-column text-xl flex justify-end flex-direction">
					<view class="cuIcon-edit padding-lr-xs padding-tb-xs" @click="addEditAddress(item)"></view>
					<view class="cuIcon-close padding-lr-xs padding-tb-xs" @click="confirm2DelAddress(item)"></view>
				</view>
			</view>
		</view>
		<!-- 底部新增地址按钮 -->
		<view class="cu-bar tabbar border shop fixed-bottom-bar bg-back">
			<button class="cu-btn bg-main-color long-btn margin-lr-sm shadow-blur" @click="addEditAddress(null)">新增店铺</button>
		</view>
		<!-- 模态框 -->
		<confirm-modal ref="confirmModal" :content="'是否确定删除？'" @confirm="delAddress"></confirm-modal>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				myAddressList: [],
				modalName: '',
				delAddressInfo: {},
			}
		},
		onLoad(options) {
			
		},
		onShow() {
			this.loadData();
		},
		methods: {
			async loadData() {
				let res = await this.$request.getMasterShopAddressList(this.$request.getCurUserInfo().workerId);
				this.myAddressList = res.data;
			},
			addEditAddress(addressInfo) {
				let url = null;
				let params = null;
				if (addressInfo) {
					// 修改
					addressInfo.area = [
						{
							areaId: addressInfo.cityId,
							areaName: addressInfo.cityName
						},{
						areaId: addressInfo.provinceId,
						areaName: addressInfo.provinceName
					},{
						areaId: addressInfo.countryId,
						areaName: addressInfo.countryName
					},{
						areaId: addressInfo.streetId || 0,
						areaName: addressInfo.streetName
					}]
					params = {
						addressInfo: addressInfo,
						mode: 0
					}
				} else {
					// 新增
					params = {
						mode: 1
					}
				}
				uni.navigateTo({
					url: '/pages/my/edit-shop-address?params=' + encodeURIComponent(JSON.stringify(params))
				})
			},
			confirm2DelAddress(addressInfo) {
				this.delAddressInfo = addressInfo;
				this.$refs.confirmModal.showModal();
			},
			async delAddress() {
				let res = await this.$request.delShopAddressList(this.delAddressInfo.shopId);
				if (res.code === 0) {
					this.loadData();
					uni.showToast({
						title: '删除成功',
						icon: 'success',
						mask: true
					})
				} else {
					uni.showToast({
						title: '删除失败',
						icon: 'error',
						mask: true
					})
				}
			}
		}
	}
</script>

<style scoped>
	.bg-img-container{
		width: 140rpx;
		height: 140rpx;
		margin-right: 14rpx;
	}
</style>