xuxueyang
2024-08-31 32526e5bddb7b14328b2467cd18783f480b33f3b
components/common-address-select/common-address-select.vue
@@ -1,19 +1,24 @@
<template>
   <!-- 改动的默认地址通过全局变量来控制吧 -->
   <view class="flex location-select" @click="goToAddress" >
   <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 class="name">{{ address.name || '-' }}<span class="tel">{{ address.tel || '-' }}</span>
         </view>
         <view class="address">{{address.schoolAreaStr || ''}} {{address.blockStr || ''}} {{address.room || ''}} {{address.address || ''}}</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>
</template>
@@ -21,6 +26,7 @@
   import {
      mapState
   } from 'vuex'
   export default {
      computed: {
         ...mapState({
@@ -32,39 +38,42 @@
            },
         }),
      },
      name:"common-address-select",
      name: "common-address-select",
      data() {
         return {
         };
         return {};
      },
      async onShow(){
      async mounted() {
         await this.init()
      },
      methods:{
         async init(){
      methods: {
         async init() {
            //获取默认地址并且填充
            if(!this.address.id){
            if (!this.address.id && this.currentInfo.id) {
               this.$message.showLoading()
               const {data} = await this.$http.request('get','/api/address/default/detail')
               const {
                  data
               } = await this.$http.request('get', '/api/address/default/detail')
               this.$message.hideLoading()
               if(data){
               if (data) {
                  //提交更新默认地址
                  this.$store.commit('setDefaultAddress',{...data})
                  this.$store.commit('setDefaultAddress', {
                     ...data
                  })
               }
            }
         },
         goToAddress(){
            if(!this.currentInfo.id){
         goToAddress() {
            if (!this.currentInfo.id) {
               this.$message.showToast('请先前往登录')
               return
            }
            uni.navigateTo({
               url:'/pages/user/address/address?source=select'
               url: '/pages/user/address/address?source=select'
            })
         }
      },
      props:{
      props: {
         // address:{
         //    type:Object,
         //    default(){
@@ -76,35 +85,38 @@
</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;
         .tel{
         // margin-bottom: 16rpx;
         .name {
            font-weight: 400;
            font-size: 32rpx;
            color: #000000;
            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>