mall-app-t/pages/product/js/sku.js

import { ref, computed } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import peach from "@/peach";
import GoodsApi from "@/peach/api/trade/goods";
import { SPEC_TYPE } from "./config";

const pickerRef = ref(null);

// 多属性商品 sku 列表
const skus = ref([]);

const propertyList = ref([]);

const goodsPropertyList = ref([]);

const propertyListRef = ref(null);

const formData = ref({
  specType: true,
  specText: SPEC_TYPE[0].label,
});

async function showPropertyList() {
  await getGoodsProperty();
  propertyListRef.value.onOpen();
}

function onRDPickerConfirm(e) {
  peach.$store("trade").specType = SPEC_TYPE[e.value[0]].value;
  formData.value.specText = SPEC_TYPE[e.value[0]].label;
  formData.value.specType = SPEC_TYPE[e.value[0]].value;
}

function pickerProperty() {
  let index = specType.value ? 1 : 0;
  pickerRef.value.onOpen([index]);
}

async function onPropertyConfirm(e) {
  await getGoodsProperty();
  console.log(e);
}

async function getGoodsProperty() {
  let { data } = await GoodsApi.getHistoryProperty();

  // 把 propertyList 中 id 相同的属性合并，并去重
  propertyList.value = peach.$store("trade").selectedProperty;

  console.log(propertyList.value);

  // 根据已经选择数据，设置默认选中
  data.forEach((item) => {
    // 判断属性是否已经选中
    let propertyParent = propertyList.value.find(
      (sitem) => sitem?.id === item.id
    );

    item.checked = propertyParent ? true : false;

    // 如果属性已经选中，查询子类中是否有选中
    if (item.checked) {
      item.propertyValues.forEach((child) => {
        let childResult = propertyParent?.children.some(
          (schild) => schild === child.id
        );
        console.log(childResult);
        child.checked = childResult ? true : false;
      });
    }
  });

  goodsPropertyList.value = data;
}

const specType = computed(() => peach.$store("trade").goodsInfo.specType);

function initial() {
  onLoad(() => {
    formData.value.specType = specType.value ? true : false;
    formData.value.specText = SPEC_TYPE[specType.value ? 1 : 0].label;
    skus.value = peach.$store("trade").skus;
    if (specType.value) {
      getGoodsProperty();
    }
  });
}

export {
  initial,
  skus,
  pickerRef,
  pickerProperty,
  propertyListRef,
  formData,
  onRDPickerConfirm,
  onPropertyConfirm,
  propertyList,
  showPropertyList,
  goodsPropertyList,
};