cdwUniapp/pages/deliveryAddress/deliveryAddress.vue

<script setup>
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "vue";
import navv from "@/components/nav/nav.vue";
import topTitle from "@/components/topTitle/topTitle.vue";
import {
  editDefaultAddressApi,
  getMyAreaApi,
  getUserInfoApi,
} from "@/libs/api";
import { gotoBack } from "@/libs/utils";
import useStore from "@/store";

const store = useStore();
/**
 * 下拉列表的数据
 */
const selectData = ref([]);
/**
 * 选择的下拉列表下标
 */
// const index = ref("");
/**
 * 选择的地址
 */
const selectAddress = ref({});// 选择的地址

/**
 * 获取用户信息
 */
async function getUserInfo() {
  const res = await getUserInfoApi();
  if (res.code === "0") {
    if (!res.data.company) {
      uni.showModal({
        title: "提示",
        content: "请先添加企业",
        complete: (res) => {
          if (res.confirm) {
            uni.navigateTo({
              url: "/pages/joinEnterprise/joinEnterprise",
            //         url: "../../enterprise/pages/joinEnterprise/joinEnterprise",
            });
          }
        },
      });
    }
    getMyArea();
  }
  else if (res.code === "4") {
    uni.showModal({
      title: "提示",
      content: "请先登录",
      complete: (res) => {
        if (res.confirm) {
          uni.navigateTo({
            url: "/pages/login/login",
          });
        }
      },
    });
  }
}

/**
 * 获取我的地址
 */
async function getMyArea() {
  const res = await getMyAreaApi({
    warehouseid: "",
    isEnabled: 1,
  });

  if (res.code !== "0")
    return;

  res.data.list = res.data.list.map(each => ({ ...each, telephone: maskMiddle(each.telephone) }));
  selectAddress.value = res.data.list.find(each => each.isLastDefaultAddr) || res.data.list[0];
  uni.setStorageSync("warehousId", selectAddress.value.warehousId);
  uni.setStorageSync("addressId", selectAddress.value.addrId);
  selectData.value = res.data.list;

  if (selectAddress.value.addrId) {
    await editDefaultAddress();
  }
}

/**
 * 修改默认收货地址
 */
async function editDefaultAddress() {
  const res = await editDefaultAddressApi({
    addrId: uni.getStorageSync("addressId"),
  });

  if (res.code !== "0") {
    uni.showToast({
      title: res.message,
      duration: 3000,
    });
  }
  else {
    store.changeCartList([]);
    // store.cartList = [];
  }
}

// 手机号加密
function maskMiddle(phone) {
  if (!phone || typeof phone !== "string")
    return "";
  return phone.replace(/(\d{3})\d{4}(\d{4})/, "$1****$2");
}

/**
 * 选择地址
 */
function optionTap(item) {
  selectAddress.value = item;
  uni.setStorageSync("warehousId", item.warehousId);
  uni.setStorageSync("addressId", item.addrId);

  if (item.addrId) {
    editDefaultAddress();
    gotoBack();
  }
}

/**
 * 跳转添加地址
 */
function onGotoAdd() {
  uni.navigateTo({
    url: "/pages/deliveryAddress/addDeliveryAddress",
  });
}

onLoad(() => {
  getUserInfo();
});
</script>

<template>
  <navv>
    <template #default="{ style, content }">
      <topTitle title="选择地址" :style="style" />
      <view
        class="content"
        :style="{
          height: `${content}px`,
          overflowY: 'auto',
        }"
      >
        <block
          v-for="(item, idx) in selectData"
          :key="idx"
        >
          <view
            v-if="item.addrId != null"
            class="list"
            @tap="() => optionTap(item)"
          >
            <view class="left">
              <view class="top">
                <text class="warehouse">
                  {{ item.warehousName }}
                </text>
                <text class="name">
                  {{ item.receiverName }}
                </text>
                <text class="phone">
                  {{ item.telephone }}
                </text>
              </view>
              <view class="under">
                {{ item.address }}
              </view>
            </view>
            <view class="right">
              <radio
                value="r1"
                :checked="item.addrId == selectAddress.addrId"
                color="#06CA64"
              />
            </view>
          </view>
        </block>
        <view class="padding" />
        <!-- <view
        v-if="selectData?.[0]?.addrId == null"
        class="not-data"
      >
        <image class="icon" src="/static/address/four.png" mode="widthFix" />
        <text class="text">
          您还没有添加收货地址哦！
        </text>
      </view> -->
        <view class="btn-box" @tap="onGotoAdd">
          <view class="btn">
            +添加收货地址
          </view>
        </view>
      </view>
    </template>
  </navv>
</template>

<style scoped lang="scss">
@import "./deliveryAddress.scss";
</style>