Dining_Hall/pages/mine/me/myAddress.vue

<template>
  <view class="address-list">
    <Navbar title="我的地址" :showRightText="true" :isBack="false" :text="'新增地址'" @clickIcon="addAddress"/>
    <view v-for="(item, index) in addressList" :key="index" class="address-item">
      <view class="address-info">
        <text class="address-text">{{ item.addrFullName }} {{item.detailAddr}}</text>
        <view class="contact-info">
		  <view @click="changeDefault(item)" style="margin-right: 20rpx;font-size: 24rpx;border: 1px solid #ff8ba0;color: #ff8ba0;padding: 4rpx;border-radius: 8rpx;background: #fff2f8;">
			   {{item.ifDefault=="1"?"默认":"设为默认"}}
		  </view>
          <text class="contact-text">{{ item.custName }}</text>
          <text class="contact-text">{{ item.mobile }}</text>
        </view>
      </view>
      <u-icon name="edit-pen-fill" color="#c8c9cc" size="22" @click="handleEdit(item)"></u-icon>
    </view>
  </view>
</template>

<script>
	import { queryCustAddrApi,updateDefaultAddrApi } from '@/api/mine/information.js';
export default {
  data() {
    return {
      addressList: [
    //     {
    //       address: '府前西街与站前北街交叉口南200米',
    //       name: '冯先生1',id: '1',
    //       phone: '153****5876',
		  // ifDefault:"1"
    //     },
    //     {
    //       address: '怡馨家园30号楼(近达人街商城)',
    //       name: '冯先生',id: '2',ifDefault:"0",
    //       phone: '153****5876'
    //     },
    //     {
    //       address: '西辛南区46号楼2单元101室',
    //       name: '冯先生',id: '3',ifDefault:"0",
    //       phone: '153****5876'
    //     }
      ]
    }
  },
  onLoad() {
  	
  },
  onShow(){
	  this.queryCustAddrList()
  },
  methods: {
	  async queryCustAddrList() {
		try {
				let param = {
					"custId": uni.getStorageSync('custId'),
					"openid": uni.getStorageSync('openId'),
					"sourceType": "7",
				}
				const res = await queryCustAddrApi(param)
				console.log('🚀 ~ getList ~ res:', res) 
				this.addressList = res.data;
		} catch (error) {
				console.log(error)
		}
	  },
	  changeDefault(item){
		  console.log(item)
		  if(item.ifDefault==2){
			  this.updateDefaultAddr(item.addrId)
		  }
		  
	  },
	  async updateDefaultAddr(addrId) {
	  		try {
	  				let param = {
	  					"custId": uni.getStorageSync('custId'),
	  					"openid": uni.getStorageSync('openId'),
	  					"sourceType": "7",
						"addrId":addrId
	  				}
	  				const res = await updateDefaultAddrApi(param)
	  				console.log('🚀 ~ getList ~ res:', res) 
	  				if(res.code==200){
						uni.$u.toast(`操作成功！`)
						this.queryCustAddrList()
					}else{
						uni.$u.toast(`操作失败！`)
					}
	  		} catch (error) {
	  				console.log(error)
	  		}
	  },
    handleEdit(address) {
      // 处理编辑事件
      // uni.$u.toast(`编辑第${index + 1}个地址`)
	  console.log('🚀 ==='+address)
		uni.navigateTo({
		  // url: `/pages/mine/me/upAddress?address=${encodeURIComponent(JSON.stringify(address))}`
		  url: `/pages/mine/me/upAddress?address=${JSON.stringify(address)}`
		})
    },
    addAddress() {
      uni.navigateTo({
        url: `/pages/mine/me/upAddress`
      })
    },
	
  }
}
</script>

<style lang="scss" scoped>
.address-list {
  min-height: 100vh;
  background-color: #f8f8f8;
  padding: 30rpx;
}

.address-item {
  background-color: #ffffff;
  border-radius: 8rpx;
  padding: 30rpx;
  margin-bottom: 20rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.address-info {
  flex: 1;

  .address-text {
    font-size: 26rpx;
    color: #333333;
    line-height: 1.5;
   
  }

  .contact-info {
	margin-top: 10rpx;
    display: flex;
    align-items: center;

    .contact-text {
      font-size: 24rpx;
      color: #999999;

      &:first-child {
        margin-right: 20rpx;
      }
    }
  }
}
</style>