SPU商品下的SKU单品选择

1. SKU介绍

{
    "id": 4,
    "price": 88.00,
    "discount_price": null,
    "online": true,
    "img": "http://i1.sleeve.7yue.pro/assets/c6b52c90-5b10-4823-baef-6c37d3d3532f.png",
    "title": "青芒色·圣斗士",
    "spu_id": 2,
    "category_id": 17,
    "root_category_id": 3,
    "specs": [{    //规格数组
      "key_id": 1,
      "key": "颜色",
      "value_id": 42,
      "value": "青芒色"
    }, {
      "key_id": 3,
      "key": "图案",
      "value_id": 11,
      "value": "圣斗士"
    }, {
      "key_id": 4,
      "key": "尺码",
      "value_id": 16,
      "value": "大号  L"
    }
}

sku 是由多种不同的规格名的组成的

图1 - SKU

2. 分析

sku核心: 每一次选择sku的规格值就重新计算所有规格值

从sku的核心入手我们就可以开始下面的分析了

2.1. 规格名与规格值的说明

规格名: 一个规格名包含一组规格值 例如 颜色 / 图案 / 尺码 都代表的是规格名
规格值: 表示一个规格名下的属性 例如 规格名颜色下有 金属灰 / 青芒色 / 橘黄色 三种规格值

2.2. sku规格值得三种状态 可选 / 选中 / 禁用

图1 所有sku都是默认可选的状态

2.3. 第一次选中一个规格值
图2 - 选中规格值青芒色
  1. 例如我们第一次选中青芒色的规格值时, 我们需要判断青芒色与不同规格名 (图案 / 尺码) 下所有规格值分别组合看是否能够组合为对应的sku, 如果可以组合为对应的sku则是可选状态, 不能则是禁用状态
  2. 上面我们说了sku核心是每一次选择sku的规格值就重新计算所有规格值, 但是在1中我们只计算了不同规格名的所有规格值没有计算同种规格名的规格值
  3. 我们可以想象在实际情况中, 在第一次选中规格值时它同种规格名下所有规格值都应该为可选状态的, 并且只能选中其中一个 例如: 图-2 , 图-3
  4. 这样我们就可以得出: 第一次选择sku规格值时, 同种规格名下的所有规格值为可选状态, 不同种规格名下的规格值与选中的规格值组合如果能够组合为对应的sku则为可选状态
图 - 3
2.4. 第二次选中一个规格值
  1. 我们再从sku核心入手: 每一次选择sku的规格值就重新计算所有规格值 也就是说我们不要去思考到底是第二次选中还是第几次选中 我们每一次选中一个规格值全部都当做它是第一次选中来计算
  2. 例如 我们选中了 青芒色与灌篮高手
  3. 图 - 2 选中青芒色时 可选规格值:
[金属灰, 青芒色, 橘黄色, 灌篮高手, 圣斗士, 中号M, 大号L]
  1. 图 - 3 选中灌篮高手时 可选规格值:
[青芒色, 七龙珠, 灌篮高手, 圣斗士, 中号M]
  1. 因为我们这是第二次选中, 所以可选规格值必须同时存在选中规格值可选规格值中, 也就是说最后的可选规格值是 青芒色的可选规格值与灌篮高手的可选规格值的交集
  2. 第二次选中后的可选规格值 图-2/图-3 取交集
[青芒色, 灌篮高手, 圣斗士, 中号M]
图 - 4 第二次选中一个规格值
2.5 第n次选中一个规格

逻辑思想与第二次一致

3. 实现思路

3.1 sku_list 数据

"sku_list": [{
    "id": 2,
    "price": 77.76,
    "discount_price": null,
    "online": true,
    "img": "http://i1.sleeve.7yue.pro/assets/2d22ffec-b1c1-43e0-ad21-25aa5c26ab34.png",
    "title": "金属灰·七龙珠",
    "spu_id": 2,
    "category_id": 17,
    "root_category_id": 3,
    "specs": [{
      "key_id": 1,
      "key": "颜色",
      "value_id": 45,
      "value": "金属灰"
    }, {
      "key_id": 3,
      "key": "图案",
      "value_id": 9,
      "value": "七龙珠"
    }, {
      "key_id": 4,
      "key": "尺码",
      "value_id": 14,
      "value": "小号 S"
    }],
    "code": "2$1-45#3-9#4-14",
    "stock": 5
  }, {
    "id": 3,
    "price": 66.00,
    "discount_price": 59.00,
    "online": true,
    "img": "http://i1.sleeve.7yue.pro/assets/c6b52c90-5b10-4823-baef-6c37d3d3532f.png",
    "title": "青芒色·灌篮高手",
    "spu_id": 2,
    "category_id": 17,
    "root_category_id": 3,
    "specs": [{
      "key_id": 1,
      "key": "颜色",
      "value_id": 42,
      "value": "青芒色"
    }, {
      "key_id": 3,
      "key": "图案",
      "value_id": 10,
      "value": "灌篮高手"
    }, {
      "key_id": 4,
      "key": "尺码",
      "value_id": 15,
      "value": "中号 M"
    }],
    "code": "2$1-42#3-10#4-15",
    "stock": 999
  }, {
    "id": 4,
    "price": 88.00,
    "discount_price": null,
    "online": true,
    "img": "http://i1.sleeve.7yue.pro/assets/c6b52c90-5b10-4823-baef-6c37d3d3532f.png",
    "title": "青芒色·圣斗士",
    "spu_id": 2,
    "category_id": 17,
    "root_category_id": 3,
    "specs": [{
      "key_id": 1,
      "key": "颜色",
      "value_id": 42,
      "value": "青芒色"
    }, {
      "key_id": 3,
      "key": "图案",
      "value_id": 11,
      "value": "圣斗士"
    }, {
      "key_id": 4,
      "key": "尺码",
      "value_id": 16,
      "value": "大号  L"
    }],
    "code": "2$1-42#3-11#4-16",
    "stock": 8
  }, {
    "id": 5,
    "price": 77.00,
    "discount_price": 59.00,
    "online": true,
    "img": "http://i1.sleeve.7yue.pro/assets/09f32ac8-1af4-4424-b221-44b10bd0986e.png",
    "title": "橘黄色·七龙珠",
    "spu_id": 2,
    "category_id": 17,
    "root_category_id": 3,
    "specs": [{
      "key_id": 1,
      "key": "颜色",
      "value_id": 44,
      "value": "橘黄色"
    }, {
      "key_id": 3,
      "key": "图案",
      "value_id": 9,
      "value": "七龙珠"
    }, {
      "key_id": 4,
      "key": "尺码",
      "value_id": 14,
      "value": "小号 S"
    }],
    "code": "2$1-44#3-9#4-14",
    "stock": 7
  }]
3.2 将所有组成sku的规格值取出放入到list中 skuList
skuList = [
    [金属灰, 七龙珠, 小号S],
    [青芒色, 灌篮高手, 中号M],
    [青芒色, 圣斗士, 大号L],
    [橘黄色, 七龙珠, 小号S]
]
3.3 将所有同种规格名的规格值取出放入到list中 specList
specList = [
    [金属灰, 青芒色, 橘黄色],
    [小号S, 中号M, 大号L],
    [七龙珠, 圣斗士, 灌篮高手]
]
3.4 第一次选中时 例如选中青芒色
  1. 在skuList找包含青芒色的数组(这样就可以找到不同种规格名所有可选规格值), 并将数组所有值加入到新数组 arr_1 中并去重
arr_1 = [青芒色, 灌篮高手, 中号M, 圣斗士, 大号]
  1. 在specList找包含青芒色的数组(这样可找到同种规格名下所有可选规格值), 并将数组所有值加入到新数组 arr_1 中并去重
arr_1 = [青芒色, 灌篮高手, 中号M, 圣斗士, 大号, 金属灰, 橘黄色]
  1. arr_1数组的规格值就为选中青芒色后可选规格
3.5 第二次选中时 例如选中青芒色, 灌篮高手
  1. 根据第一次选中时一样的方式得出灌篮高手的可选规格为
arr_2 = [青芒色, 灌篮高手, 中号M, 七龙珠, 圣斗士]
  1. 再将灌篮高手(arr_2)与青芒色(arr_1)的可选规格取交集 并去重放入 arr_3
arr_3 = [青芒色, 灌篮高手, 圣斗士, 中号M]
  1. 则 arr_3 中的规格值就为 第二次选中(青芒色,灌篮高手)后的可选规格
3.6 第n次选中

逻辑概念与计算方式和第二次选中相同

你可能感兴趣的:(SPU商品下的SKU单品选择)