applet/components/ldAddress/ldAddress.vue

<template>
  <view class="container">
    <view
      class="courierAddress u-flex-center-sb u-plr30"
      @click="chonseAddress"
    >
      <view class="leftAddress u-flex-center">
        <text class="iconfont u-02331F" style="color: #fa6138; font-size: 70rpx"
          >&#xe6da;</text
        >
        <!-- 有地址 -->
        <view
          class="u-font30 u-ml20 u-flex-column-start"
          v-if="
            props.value &&
            (props.value.id ||
              props.value.userAddressId ||
              props.value.orderSelfPickupAddressId)
          "
        >
          <view class="u-flex-center u-font32">
            <view class="lname u-font32">
              <!-- <text>收货人：</text> -->
              <text>{{
                props.value.receiverName || props.value.receiver
              }}</text>
            </view>
            <text
              class="u-ml20"
              v-if="props.value.receiverPhone || props.value.phone"
              >{{ props.value.receiverPhone || props.value.phone }}</text
            >
            <!-- <text class="u-ml20" v-if="props.value.phone">{{
              props.value.phone
            }}</text> -->
          </view>
          <view class="u-font28 u-999">
            <text v-if="showProvinces"
              >{{ props.value.provinceName }}{{ props.value.cityName
              }}{{ props.value.areaName }}</text
            >
            <text>{{ props.value.address || props.value.addressDetail }}</text>
          </view>
        </view>
        <!-- 默认没有地址 -->
        <view class="u-font30 u-ml20" v-else>
          暂无收货地址~
          <view class="u-999 u-mt5"> 立即添加收货地址 </view>
        </view>
      </view>
      <text class="iconfont u-font24 u-CCC u-ml20" v-if="props.link"
        >&#xe6c7;</text
      >
    </view>
  </view>
</template>
<script setup name="ldAddress">
const props = defineProps({
  link: {
    type: Boolean,
    default: true,
  },
  value: {
    type: Object,
    default: function () {
      return {};
    },
  },
  // 是否显示省市区
  showProvinces: {
    type: Boolean,
    default: true,
  },
});
const chonseAddress = () => {
  if (props.link) {
    uni.navigateTo({
      url: "/pages/user/address/addressList",
    });
  }
};
</script>

<style lang="scss">
.courierAddress {
  background-color: #fff;
  padding: 36rpx 30rpx;
}
</style>