From 1c71006dc53856e8e052c2bc220588a3322276de Mon Sep 17 00:00:00 2001
From: unknown <staryou@126.com>
Date: Wed, 12 Jun 2024 00:32:45 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=95=86=E5=93=81=E5=B1=9E=E6=80=A7):=20?=
 =?UTF-8?q?=E5=A4=9A=20sku?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/product/js/sku.js | 405 +++++++++++++++++++++-------------------
 1 file changed, 214 insertions(+), 191 deletions(-)

diff --git a/pages/product/js/sku.js b/pages/product/js/sku.js
index 9560202..4784d51 100644
--- a/pages/product/js/sku.js
+++ b/pages/product/js/sku.js
@@ -1,125 +1,136 @@
-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, SKU_RULE_CONFIG } from './config'
+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, SKU_RULE_CONFIG } from "./config";
 
-const pickerRef = ref(null)
+const pickerRef = ref(null);
 
 // 多属性商品 sku 列表
-const skus = ref([])
+const skus = ref([]);
 
-const propertyList = ref([])
+const propertyList = ref([]);
 
-const goodsPropertyList = ref([])
+const goodsPropertyList = ref([]);
 
-const propertyListRef = ref(null)
+const propertyListRef = ref(null);
 
-const canEdit = computed(() => peach.$store('trade').canEdit)
+const canEdit = computed(() => peach.$store("trade").canEdit);
 
 const formData = ref({
-    specType: true,
-    specText: SPEC_TYPE[0].label,
-})
+  specType: true,
+  specText: SPEC_TYPE[0].label,
+});
 
 async function showPropertyList() {
-    await getGoodsProperty()
-    propertyListRef.value.onOpen()
+  await getGoodsProperty();
+  propertyListRef.value.onOpen();
 }
 
 function onRDPickerConfirm(e) {
-    formData.value.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;
+  formData.value.specText = SPEC_TYPE[e.value[0]].label;
 
-    // 如果商品规格不一致，则需要重新初始化 sku 列表
-    initSku()
+  // 如果商品规格不一致，则需要重新初始化 sku 列表
+  initSku();
 
-    peach.$store('trade').specType = SPEC_TYPE[e.value[0]].value
+  peach.$store("trade").specType = SPEC_TYPE[e.value[0]].value;
 }
 
 function pickerProperty() {
-    if (canEdit.value) {
-        let index = formData.value.specType ? 1 : 0
+  if (canEdit.value) {
+    let index = formData.value.specType ? 1 : 0;
 
-        console.log(index)
+    console.log(index);
 
-        pickerRef.value.onOpen([index])
-    }
+    pickerRef.value.onOpen([index]);
+  }
 }
 
 async function onPropertyConfirm(e) {
-    await getGoodsProperty()
-    console.log(e)
+  await getGoodsProperty();
+  console.log(e);
 }
 
 function onConfirm() {
-    console.log(skus.value)
+  console.log(skus.value);
 }
 
 async function getGoodsProperty() {
-    let { data } = await GoodsApi.getHistoryProperty()
+  let { data } = await GoodsApi.getHistoryProperty();
 
-    // 把 propertyList 中 id 相同的属性合并，并去重
-    propertyList.value = peach.$store('trade').selectedProperty
+  // 把 propertyList 中 id 相同的属性合并，并去重
+  propertyList.value = peach.$store("trade").selectedProperty;
 
-    console.log(propertyList.value)
+  console.log(propertyList.value);
 
+  if (propertyList.value) {
     // 根据已经选择数据，设置默认选中
     data.forEach((item) => {
-        // 判断属性是否已经选中
-        let propertyParent = propertyList.value.find((sitem) => sitem?.id === item.id)
+      // 判断属性是否已经选中
+      let propertyParent = propertyList.value.find(
+        (sitem) => sitem?.id === item.id
+      );
 
-        item.checked = propertyParent ? true : false
+      item.checked = propertyParent ? true : false;
 
-        // 如果属性已经选中，查询子类中是否有选中
-        if (item.checked) {
-            item.propertyValues.forEach((child) => {
-                let childResult = propertyParent?.children.some((schild) => schild === child.id)
-                child.checked = childResult ? true : false
-            })
-        }
-    })
+      // 如果属性已经选中，查询子类中是否有选中
+      if (item.checked) {
+        item.propertyValues.forEach((child) => {
+          let childResult = propertyParent?.children.some(
+            (schild) => schild === child.id
+          );
+          child.checked = childResult ? true : false;
+        });
+      }
+    });
 
-    goodsPropertyList.value = data
-    console.log(goodsPropertyList.value)
+    goodsPropertyList.value = data;
+  } else {
+    goodsPropertyList.value = [];
+  }
+
+  console.log(goodsPropertyList.value);
 }
 
 function changeSubProperty() {
-    // 修改子属性状态，需要同步更新 skus 的显示
-    console.log(goodsPropertyList.value)
-    // 过滤父属性 checked 选项，深拷贝避免后面循环改变元数据内容
-    let temp = JSON.parse(JSON.stringify(goodsPropertyList.value.filter((item) => item.checked)))
-    temp.forEach((item) => {
-        item.propertyValues = item.propertyValues.filter((child) => child.checked)
-    })
+  // 修改子属性状态，需要同步更新 skus 的显示
+  console.log(goodsPropertyList.value);
+  // 过滤父属性 checked 选项，深拷贝避免后面循环改变元数据内容
+  let temp = JSON.parse(
+    JSON.stringify(goodsPropertyList.value.filter((item) => item.checked))
+  );
+  temp.forEach((item) => {
+    item.propertyValues = item.propertyValues.filter((child) => child.checked);
+  });
 
-    let result = temp.map((item) => {
-        return item.propertyValues.map((child) => ({
-            propertyId: item.id,
-            propertyName: item.name,
-            valueId: child.id,
-            valueName: child.name,
-        }))
-    })
+  let result = temp.map((item) => {
+    return item.propertyValues.map((child) => ({
+      propertyId: item.id,
+      propertyName: item.name,
+      valueId: child.id,
+      valueName: child.name,
+    }));
+  });
 
-    let tempSkus = []
+  let tempSkus = [];
 
-    for (let item of reduceArr(result)) {
-        let obj = {
-            picUrl: '',
-            barCode: '',
-            price: 0,
-            marketPrice: 0,
-            costPrice: 0,
-            stock: 0,
-            weight: 0,
-            volume: 0,
-            properties: item,
-        }
-        tempSkus.push(obj)
-    }
+  for (let item of reduceArr(result)) {
+    let obj = {
+      picUrl: "",
+      barCode: "",
+      price: 0,
+      marketPrice: 0,
+      costPrice: 0,
+      stock: 0,
+      weight: 0,
+      volume: 0,
+      properties: item,
+    };
+    tempSkus.push(obj);
+  }
 
-    skus.value = tempSkus
+  skus.value = tempSkus;
 }
 
 /**
@@ -129,32 +140,32 @@ function changeSubProperty() {
  * @returns {Type}
  */
 function initSku() {
-    // 单规格
-    if (!formData.value.specType) {
-        let obj = {
-            picUrl: '',
-            barCode: '',
-            price: 0,
-            marketPrice: 0,
-            costPrice: 0,
-            stock: 0,
-            weight: null,
-            volume: null,
-            properties: [
-                {
-                    propertyId: 0,
-                    propertyName: '默认',
-                    valueId: 0,
-                    valueName: '默认',
-                },
-            ],
-        }
+  // 单规格
+  if (!formData.value.specType) {
+    let obj = {
+      picUrl: "",
+      barCode: "",
+      price: 0,
+      marketPrice: 0,
+      costPrice: 0,
+      stock: 0,
+      weight: null,
+      volume: null,
+      properties: [
+        {
+          propertyId: 0,
+          propertyName: "默认",
+          valueId: 0,
+          valueName: "默认",
+        },
+      ],
+    };
 
-        skus.value = [obj]
-    } else {
-        // 多规格
-        skus.value = []
-    }
+    skus.value = [obj];
+  } else {
+    // 多规格
+    skus.value = [];
+  }
 }
 
 /**
@@ -164,114 +175,126 @@ function initSku() {
  * @returns {Type}
  */
 function submitProperty() {
-    try {
-        validateSku(skus.value)
-        peach.$store('trade').skus = skus.value
-        peach.$router.back()
-    } catch (e) {
-        console.log(skus.value)
-        console.log(e, '校验失败')
-    }
+  try {
+    validateSku(skus.value);
+    peach.$store("trade").skus = skus.value;
+    peach.$router.back();
+  } catch (e) {
+    console.log(skus.value);
+    console.log(e, "校验失败");
+  }
 }
 
 function validateSku(skus) {
-    let warningInfo = '请检查商品各行相关属性配置，'
-    let validateStatue = true
-    let skusValue = skus ?? peach.$store('trade').skus
-    for (const sku of skusValue) {
-        for (const rule of SKU_RULE_CONFIG) {
-            const arg = getValue(sku, rule.name)
-            if (!rule.rule(arg)) {
-                validateStatue = false
-                warningInfo += rule.message
-                break
-            }
-        }
-        if (!validateStatue) {
-            uni.showToast({
-                title: warningInfo,
-                icon: 'none',
-                duration: 4000,
-            })
-            throw new Error(warningInfo)
-        }
+  let warningInfo = "请检查商品各行相关属性配置，";
+  let validateStatue = true;
+  let skusValue = skus ?? peach.$store("trade").skus;
+
+  // 判断如果是多规格，并且 skusValue 为空 []，则提示
+  if (formData.value.specType && skusValue.length < 1) {
+    uni.showToast({
+      title: "请选择商品规格",
+      icon: "none",
+      duration: 4000,
+    });
+    throw new Error("请选择商品规格");
+  }
+  for (const sku of skusValue) {
+    for (const rule of SKU_RULE_CONFIG) {
+      const arg = getValue(sku, rule.name);
+      if (!rule.rule(arg)) {
+        validateStatue = false;
+        warningInfo += rule.message;
+        break;
+      }
     }
+    if (!validateStatue) {
+      uni.showToast({
+        title: warningInfo,
+        icon: "none",
+        duration: 4000,
+      });
+      throw new Error(warningInfo);
+    }
+  }
 }
 
 function getValue(obj, arg) {
-    const keys = arg.split('.')
-    let value = obj
-    for (const key of keys) {
-        if (value && typeof value === 'object' && key in value) {
-            value = value[key]
-        } else {
-            value = undefined
-            break
-        }
+  const keys = arg.split(".");
+  let value = obj;
+  for (const key of keys) {
+    if (value && typeof value === "object" && key in value) {
+      value = value[key];
+    } else {
+      value = undefined;
+      break;
     }
-    return value
+  }
+  return value;
 }
 
 function reduceArr(arr) {
-    return arr.reduce((acc, cur) => {
-        let tempAcc = []
+  return arr.reduce((acc, cur) => {
+    let tempAcc = [];
 
-        if (acc.length < 1) {
-            cur.forEach((item, index) => {
-                if (tempAcc[index]) {
-                    tempAcc[index].push(item)
-                } else {
-                    tempAcc[index] = [item]
-                }
-            })
+    if (acc.length < 1) {
+      cur.forEach((item, index) => {
+        if (tempAcc[index]) {
+          tempAcc[index].push(item);
         } else {
-            acc.forEach((item, index) => {
-                cur.forEach((sitem, sindex) => {
-                    tempAcc.push([...item, sitem])
-                })
-            })
-
-            if (cur.length < 1) {
-                tempAcc = acc
-            }
+          tempAcc[index] = [item];
         }
-        return tempAcc
-    }, [])
+      });
+    } else {
+      acc.forEach((item, index) => {
+        cur.forEach((sitem, sindex) => {
+          tempAcc.push([...item, sitem]);
+        });
+      });
+
+      if (cur.length < 1) {
+        tempAcc = acc;
+      }
+    }
+    return tempAcc;
+  }, []);
 }
 
-const specType = computed(() => peach.$store('trade').goodsInfo?.specType || false)
+const specType = computed(
+  () => peach.$store("trade").goodsInfo?.specType || false
+);
 
 function initial() {
-    onLoad(() => {
-        formData.value.specType = specType.value ? true : false
-        formData.value.specText = SPEC_TYPE[specType.value ? 1 : 0].label
-        skus.value = JSON.parse(JSON.stringify(peach.$store('trade').skus))
-        // 如果新增商品 sku，并且是单规格，初始化 sku
+  onLoad(() => {
+    formData.value.specType = specType.value ? true : false;
+    formData.value.specText = SPEC_TYPE[specType.value ? 1 : 0].label;
+    skus.value = JSON.parse(JSON.stringify(peach.$store("trade").skus));
+    // 如果新增商品 sku，并且是单规格，初始化 sku
 
-        if (!skus.value) {
-            initSku()
-        }
-        if (specType.value) {
-            getGoodsProperty()
-        }
-    })
+    if (!skus.value) {
+      initSku();
+    }
+    if (specType.value) {
+      getGoodsProperty();
+    }
+  });
 }
 
 export {
-    initial,
-    canEdit,
-    skus,
-    pickerRef,
-    pickerProperty,
-    validateSku,
-    onConfirm,
-    submitProperty,
-    propertyListRef,
-    formData,
-    onRDPickerConfirm,
-    onPropertyConfirm,
-    propertyList,
-    showPropertyList,
-    goodsPropertyList,
-    changeSubProperty,
-}
+  initial,
+  canEdit,
+  skus,
+  pickerRef,
+  pickerProperty,
+  validateSku,
+  onConfirm,
+  submitProperty,
+  propertyListRef,
+  formData,
+  onRDPickerConfirm,
+  onPropertyConfirm,
+  propertyList,
+  showPropertyList,
+  goodsPropertyList,
+  changeSubProperty,
+};