[bugfix] 修复sku默认选中逻辑与sku是否选中的判断逻辑 (#752)

packages/sku/Sku.vue

@@ -113,10 +113,11 @@ import SkuMessages from './components/SkuMessages';
 import SkuActions from './components/SkuActions';
 import {
   isAllSelected,
+  isSkuChoosable,
   getSkuComb,
   getSelectedSkuValues
 } from './utils/skuHelper';
-import { LIMIT_TYPE } from './constants';
+import { LIMIT_TYPE, UNSELECTED_SKU_VALUE_ID } from './constants';
 import create from '../utils/create';
 
 const { QUOTA_LIMIT } = LIMIT_TYPE;
@@ -292,12 +293,19 @@ export default create({
   methods: {
     resetSelectedSku(skuTree) {
       this.selectedSku = {};
+      // 重置selectedSku
       skuTree.forEach(item => {
-        // 只有一个sku规格值时默认选中
-        if (item.v.length === 1) {
-          this.selectedSku[item.k_s] = item.v[0].id;
-        } else {
-          this.selectedSku[item.k_s] = this.initialSku[item.k_s] || '';
+        this.selectedSku[item.k_s] = this.initialSku[item.k_s] || UNSELECTED_SKU_VALUE_ID;
+      });
+      // 只有一个sku规格值时默认选中
+      skuTree.forEach(item => {
+        const key = item.k_s;
+        const valueId = item.v[0].id;
+        if (
+          item.v.length === 1 &&
+          isSkuChoosable(this.sku.list, this.selectedSku, { key, valueId })
+        ) {
+          this.selectedSku[key] = valueId;
         }
       });
     },
@@ -338,7 +346,7 @@ export default create({
       // 点击已选中的sku时则取消选中
       this.selectedSku =
         this.selectedSku[skuValue.skuKeyStr] === skuValue.id
-          ? { ...this.selectedSku, [skuValue.skuKeyStr]: '' }
+          ? { ...this.selectedSku, [skuValue.skuKeyStr]: UNSELECTED_SKU_VALUE_ID }
           : { ...this.selectedSku, [skuValue.skuKeyStr]: skuValue.id };
 
       this.$emit('sku-selected', {

packages/sku/components/SkuRowItem.vue

@@ -13,6 +13,7 @@
 
 <script>
 import create from '../../utils/create';
+import { isSkuChoosable } from '../utils/skuHelper';
 
 export default create({
   name: 'sku-row-item',
@@ -31,19 +32,10 @@ export default create({
     },
 
     isChoosable() {
-      const matchedSku = Object.assign({}, this.selectedSku, {
-        [this.skuKeyStr]: this.skuValue.id
+      return isSkuChoosable(this.skuList, this.selectedSku, {
+        key: this.skuKeyStr,
+        valueId: this.skuValue.id
       });
-      const skusToCheck = Object.keys(matchedSku).filter(skuKey => matchedSku[skuKey] !== '');
-      const filteredSku = this.skuList.filter(sku => {
-        return skusToCheck.every(skuKey => {
-          // 后端给的skuValue.id有时候是数字有时候是字符串，全等会匹配不上
-          return matchedSku[skuKey] == sku[skuKey]; // eslint-disable-line
-        });
-      });
-
-      const stock = filteredSku.reduce((total, sku) => (total += sku.stock_num), 0);
-      return stock > 0;
     }
   },
 

packages/sku/constants.js

@@ -3,6 +3,9 @@ export const LIMIT_TYPE = {
   STOCK_LIMIT: 1
 };
 
+export const UNSELECTED_SKU_VALUE_ID = '';
+
 export default {
-  LIMIT_TYPE
+  LIMIT_TYPE,
+  UNSELECTED_SKU_VALUE_ID
 };

packages/sku/utils/skuHelper.js

@@ -1,3 +1,5 @@
+import { UNSELECTED_SKU_VALUE_ID } from '../constants';
+
 /*
   normalize sku tree
 
@@ -43,7 +45,7 @@ export const normalizeSkuTree = (skuTree) => {
 // 判断是否所有的sku都已经选中
 export const isAllSelected = (skuTree, selectedSku) => {
   // 筛选selectedSku对象中key值不为空的值
-  const selected = Object.keys(selectedSku).filter(skuKeyStr => selectedSku[skuKeyStr]);
+  const selected = Object.keys(selectedSku).filter(skuKeyStr => selectedSku[skuKeyStr] !== UNSELECTED_SKU_VALUE_ID);
   return skuTree.length === selected.length;
 };
 
@@ -64,7 +66,7 @@ export const getSelectedSkuValues = (skuTree, selectedSku) => {
     const skuValues = normalizedTree[skuKeyStr];
     const skuValueId = selectedSku[skuKeyStr];
 
-    if (skuValueId) {
+    if (skuValueId !== UNSELECTED_SKU_VALUE_ID) {
       const skuValue = skuValues.filter(skuValue => skuValue.id === skuValueId)[0];
       skuValue && selectedValues.push(skuValue);
     }
@@ -72,9 +74,29 @@ export const getSelectedSkuValues = (skuTree, selectedSku) => {
   }, []);
 };
 
+// 判断sku是否可选
+export const isSkuChoosable = (skuList, selectedSku, skuToChoose) => {
+  const { key, valueId } = skuToChoose;
+  // 先假设sku已选中，拼入已选中sku对象中
+  const matchedSku = Object.assign({}, selectedSku, {
+    [key]: valueId
+  });
+  // 再判断剩余sku是否全部不可选，若不可选则当前sku不可选中
+  const skusToCheck = Object.keys(matchedSku).filter(skuKey => matchedSku[skuKey] !== UNSELECTED_SKU_VALUE_ID);
+  const filteredSku = skuList.filter(sku => {
+    return skusToCheck.every(skuKey => {
+      return String(matchedSku[skuKey]) === String(sku[skuKey]);
+    });
+  });
+
+  const stock = filteredSku.reduce((total, sku) => (total += sku.stock_num), 0);
+  return stock > 0;
+};
+
 export default {
   normalizeSkuTree,
-  isAllSelected,
   getSkuComb,
-  getSelectedSkuValues
+  getSelectedSkuValues,
+  isAllSelected,
+  isSkuChoosable
 };