fix bug 接口对接和样式调整

xuxueyang

2024-07-26 2d5090c2b215a5ea7e489d4b50fbf30aae569324

 components/common-address-select/common-address-select.vue

@@ -1,110 +1,115 @@
<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>
  <!-- 改动的默认地址通过全局变量来控制吧 -->
  <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>
</template>

<script>
   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 onShow(){
			
      },
      methods:{
         async init(){
            //获取默认地址并且填充
            if(!this.address.id){
               this.$message.showLoading()
               const {data} = await this.$http.request('get','/api/address/customer/default/get')
               this.$message.hideLoading()
               if(data){
                  //提交更新默认地址
                  this.$store.commit('setDefaultAddress',{...data})
               }
            }
				
         },
         goToAddress(){
            if(!this.currentInfo.id){
               this.$message.showToast('请先前往登录')
               return
            }
            uni.navigateTo({
               url:'/pages/address/address?source=select'
            })
         }
      },
      props:{
         // address:{
         //    type:Object,
         //    default(){
         //       return {}
         //    }
         // }
      }
   }
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})
        }
      }

    },
    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{
      // margin-bottom: 16rpx;
      .name{
         font-weight: 400;
         font-size: 32rpx;
         color: #000000;
         margin-left: 6rpx;
         .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;
      }
		
   }
   .right-icon{
      margin-left: auto;
      margin-right: 0rpx;
   }
.location-select {
  .info {
    // margin-bottom: 16rpx;
    .name {
      font-weight: 400;
      font-size: 32rpx;
      color: #000000;
      margin-left: 6rpx;

      .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;
    }

  }

  .right-icon {
    margin-left: auto;
    margin-right: 0rpx;
  }
}
</style>