陶杰
2025-01-13 efa9bfe98ba906e4c9b8f49c89f5da162a46bb0f
components/common-address-select/common-address-select.vue
@@ -1,115 +1,122 @@
<template>
  <!-- 改动的默认地址通过全局变量来控制吧 -->
  <view class="flex location-select" @click="goToAddress">
    <uni-icons type="location" size="24" style="padding-top: 16rpx;margin-right: 8rpx;"></uni-icons>
    <view class="info">
      <view class="name" v-if="!address.id">请前往设置地址信息</span>
      </view>
      <view class="name">{{ address.name || '-' }}<span class="tel">{{ address.tel || '-' }}</span>
      </view>
      <view class="address">{{ address.schoolAreaStr || '' }} {{ address.blockStr || '' }} {{ address.room || '' }}
        {{ address.address || '' }}
      </view>
    </view>
    <view class="right-icon" style="padding-top: 16rpx;">
      <uni-icons type="right" size="18" color="#B3B3B3"></uni-icons>
    </view>
   <!-- 改动的默认地址通过全局变量来控制吧 -->
   <view class="flex location-select" @click="goToAddress">
      <uni-icons type="location" size="24" style="padding-top: 16rpx;margin-right: 8rpx;"></uni-icons>
      <view class="info">
         <view class="name" v-if="!address.id">请前往设置地址信息</span>
         </view>
         <view class="name">{{ address.name || '-' }}<span class="tel">{{ address.tel || '-' }}</span>
         </view>
         <view class="address">
            {{ address['province'] || '' }}{{ address['city'] && ('/' + address['city']) || '' }}{{
       address['region'] && ('/' + address['region']) || ''
     }}
            {{ address.address || '' }}
         </view>
      </view>
      <view class="right-icon" style="padding-top: 16rpx;">
         <uni-icons type="right" size="18" color="#B3B3B3"></uni-icons>
      </view>
  </view>
   </view>
</template>
<script>
import {
  mapState
} from 'vuex'
   import {
      mapState
   } from 'vuex'
export default {
  computed: {
    ...mapState({
      address: state => {
        return state.defaultaddress || {}
      },
      currentInfo: state => {
        return state.currentInfo || {}
      },
    }),
  },
  name: "common-address-select",
  data() {
    return {};
  },
  async mounted() {
    await this.init()
  },
  methods: {
    async init() {
      //获取默认地址并且填充
      if (!this.address.id && this.currentInfo.id) {
        this.$message.showLoading()
        const {data} = await this.$http.request('get', '/api/address/default/detail')
        this.$message.hideLoading()
        if (data) {
          //提交更新默认地址
          this.$store.commit('setDefaultAddress', {...data})
        }
      }
   export default {
      computed: {
         ...mapState({
            address: state => {
               return state.defaultaddress || {}
            },
            currentInfo: state => {
               return state.currentInfo || {}
            },
         }),
      },
      name: "common-address-select",
      data() {
         return {};
      },
      async mounted() {
         await this.init()
      },
      methods: {
         async init() {
            //获取默认地址并且填充
            if (!this.address.id && this.currentInfo.id) {
               this.$message.showLoading()
               const {
                  data
               } = await this.$http.request('get', '/api/address/default/detail')
               this.$message.hideLoading()
               if (data) {
                  //提交更新默认地址
                  this.$store.commit('setDefaultAddress', {
                     ...data
                  })
               }
            }
    },
    goToAddress() {
      if (!this.currentInfo.id) {
        this.$message.showToast('请先前往登录')
        return
      }
      uni.navigateTo({
        url: '/pages/user/address/address?source=select'
      })
    }
  },
  props: {
    // address:{
    //    type:Object,
    //    default(){
    //       return {}
    //    }
    // }
  }
}
         },
         goToAddress() {
            if (!this.currentInfo.id) {
               this.$message.showToast('请先前往登录')
               return
            }
            uni.navigateTo({
               url: '/pages/user/address/address?source=select'
            })
         }
      },
      props: {
         // address:{
         //    type:Object,
         //    default(){
         //       return {}
         //    }
         // }
      }
   }
</script>
<style lang="scss">
   .location-select {
      .info {
.location-select {
  .info {
    // margin-bottom: 16rpx;
    .name {
      font-weight: 400;
      font-size: 32rpx;
      color: #000000;
      margin-left: 6rpx;
         // margin-bottom: 16rpx;
         .name {
            font-weight: 400;
            font-size: 32rpx;
            color: #000000;
            margin-left: 6rpx;
      .tel {
        margin-left: 6rpx;
        font-size: 28rpx;
        color: #666666;
      }
    }
            .tel {
               margin-left: 6rpx;
               font-size: 28rpx;
               color: #666666;
            }
         }
    .address {
      font-size: 24rpx;
      color: #666666;
      line-height: 28rpx;
      margin-top: 6rpx;
      max-width: 580rpx;
      margin-left: 6rpx;
      word-wrap: break-word;
    }
         .address {
            font-size: 24rpx;
            color: #666666;
            line-height: 28rpx;
            margin-top: 6rpx;
            max-width: 580rpx;
            margin-left: 6rpx;
            word-wrap: break-word;
         }
  }
      }
  .right-icon {
    margin-left: auto;
    margin-right: 0rpx;
  }
}
      .right-icon {
         margin-left: auto;
         margin-right: 0rpx;
      }
   }
</style>