2、接收到的規格數組
"product_sku": [
{
"prod_id": "6d85a2b962c55aa90ee369061d16c305",
"sku_name": "全托班",
"sku_price": 4888,
"sku_properties": ["餐飲:午餐 晚餐", "休息:午休", "其他:作業輔導"],
"sku_stock": 16,
"sku_price": 32,
"_id": "b69f67c062cf7d120b0a37880f7add15"
},
{
"prod_id": "6d85a2b962c55aa90ee369061d16c305",
"sku_default": true,
"sku_name": "午托班",
"sku_price": 3800,
"sku_properties": ["餐飲:午餐", "休息:午休", "其他:無"],
"sku_stock": 18,
"sku_price": 24,
"_id": "f6e08a6462cf76490c4326ad233eb96d"
}
1、全部的SKU對象(包含所有的規格名和對應的屬性值集合): skuGroup
let skuGroup = {}//全部的SKU對象(包含所有的規格名和對應的屬性值集合),循環顯示的依據
/**{
* 休息:["午休"],
* 餐飲:["午餐 晚餐","午餐"],
* 其他:["作業輔導","無"]
* },
*/
let propKeys = []//SKU規格名數組,
/**
* ["餐飲","休息","其他"]
*/
let allProperties = []//SKU規格值(屬性)數組,
/**
* ["餐飲:午餐 晚餐","休息:午休","其他:作業輔導","餐飲:午餐","休息:午休","其他:無"]
*/
let selectedPropObj={} //選中的SKU對象,就是獲取的sku數組的第一個sku
/**
* {餐飲: "午餐 晚餐", 休息: "午休", 其他: "作業輔導"}
*/
let selectedProp = [] //選中的SKU值數組
/**
* ["午餐 晚餐", "午休", "作業輔導"]
*/
let selectedSku={} //選中的SKU完整數據對象(帶價格)
/**
* {
* _id: "b69f67c062cf7d120b0a37880f7add15",
* prod_id: "6d85a2b962c55aa90ee369061d16c305",
* sku_name: "全托班",
* sku_price: 4888,
* sku_properties: Array(3),
* sku_stock: 18,
* sku_total: 24
* }
*/)
findSku: true, //是否有選中的sku
data: {
autoplay:true,
currentSwiper:0, //當前幻燈片序号
currentTab: 0, // tab選項卡(商家詳情、規格參數)
product: null, //商品詳情
//規格對應參數
skuList: [], //商品規格數組
skuGroup:{},// 全部的SKU對象(包含所有的規格名和對應的屬性值集合)
propKeys:[],//SKU規格值(屬性)數組 ["餐飲:午餐 晚餐","休息:午休","其他:作業輔導","餐飲:午餐","休息:午休","其他:無"]
allProperties:[],// SKU規格值(屬性)數組
selectedPropObj: {}, //選中的SKU對象
selectedProp:[] ,// 選中的SKU值數組
selectedSku:{}, //選中的SKU完整數據對象(帶價格,庫存數量,總量)
findSku: true, //是否有選中的sku
prodNum:1, //已選擇商品數量,默認為1
skuShow: false, //是否顯示sku規格彈窗
},
/**
* 根據skuList進行數據組裝
*/
_groupSkuProp: function() {
const skuList = this.data.skuList; //sku數組
let skuGroup = {}//全部的SKU對象(包含所有的規格名和對應的屬性值集合),循環顯示的依據
/**{
* 休息:["午休"],
* 餐飲:["午餐 晚餐","午餐"],
* 其他:["作業輔導","無"]
* },
*/
let allProperties = []//SKU規格值(屬性)數組,
/**
*["餐飲:午餐 晚餐","休息:午休","其他:作業輔導","餐飲:午餐","休息:午休","其他:無"]
*/
let propKeys = []//SKU規格名數組,
/**
* ["餐飲","休息","其他"]
*/
let selectedPropObj={} //選中的sku對象,就是獲取的sku數組的第一個sku
/**
* {餐飲: "午餐 晚餐", 休息: "午休", 其他: "作業輔導"}
*/
for (var i = 0; i < skuList.length; i ) {
let properties = skuList[i].sku_properties //該sku的屬性值,是一個數組
/**
* ["餐飲:午餐 晚餐","休息:午休","其他:作業輔導"]
*/
allProperties.push(...properties) //ES6數組拼接
//處理屬性值數組
let propList = properties
for (var j = 0; j < propList.length; j ) {
let propval = propList[j].split(":"); //字符串分隔 為key,value
let props = skuGroup[propval[0]]; //先取出 規格名 "餐飲"
//選中的sku對象,就是sku數組的sku_default屬性為true的那個個sku,把對應的屬性值 組裝到selectedProp
if (skuList[i].sku_default) {
const key=propval[0]
const value= propval[1]
selectedPropObj[key] = value
}
//如果規格名數組中沒有當前規格名,将其加入規格名數組
const index=propKeys.findIndex(item=>item==propval[0])
if (index<0){
propKeys.push(propval[0]); //propKeys:SKU規格名數組
}
if (props == undefined) {
props = []; //還沒有,新建個新的空數組
props.push(propval[1]); //把規格的值 "午餐" 放進空數組
} else {
if (!this.array_contain(props, propval[1])) { //如果數組裡面沒有"午餐"
props.push(propval[1]); //把 "午餐" 放進數組
}
}
skuGroup[propval[0]] = props; //最後把數據 放回規格對象對應的值
}
}
this.setData({
skuGroup,//全部的SKU對象(包含所有的規格名和對應的屬性值集合)
propKeys, //SKU規格值(屬性)數組 ["餐飲:午餐 晚餐","休息:午休","其他:作業輔導","餐飲:午餐","休息:午休","其他:無"]
allProperties,// SKU規格值(屬性)數組
selectedPropObj,//選中的SKU對象
})
console.log('skuGroup=',skuGroup)
console.log('propKeys=',propKeys)
console.log('allProperties=',allProperties)
console.log('selectedPropObj=',selectedPropObj)
this._parseSelectedObjToVals();
},
将選中的 {key:val,key2:val2}轉換成 [val,val2]
2、并找出選中的SKU完整數據對象:根據選中的SKU字符串,在skuList中找到SKU完整數據對象
/**
* 将選中的SKU對象進行處理
* 1、轉換為SKU值數組:
* 将選中的 {key:val,key2:val2}轉換成 [val,val2]
* 2、并找出選中的SKU完整數據對象:
* 根據選中的SKU字符串,在skuList中找到SKU完整數據對象
*/
_parseSelectedObjToVals: function() {
let selectedPropObj = this.data.selectedPropObj; //選中的SKU對象
let selectedProperties = "" //選中的SKU字符串,臨時變量
/**
* 餐飲:午餐 晚餐;休息:午休;其他:作業輔導
*/
let selectedProp = [] //選中的SKU值數組
/**
* ["午餐 晚餐", "午休", "作業輔導"]
*/
for (var key in selectedPropObj) {
selectedProp.push(selectedPropObj[key]);
selectedProperties = key ":" selectedPropObj[key] ";";
}
selectedProperties = selectedProperties.substring(0, selectedProperties.length - 1); //去讀最後一個分号;
console.log('selectedProp=',selectedProp)
this.setData({
selectedProp: selectedProp
});
//将選中的SKU字符串和skuList中的SKU進行比對,查找出選中的SKUSKU完整數據對象
let selectedSku={} //選中的SKU完整數據對象(帶價格)
/**
* {
* _id: "b69f67c062cf7d120b0a37880f7add15",
* prod_id: "6d85a2b962c55aa90ee369061d16c305",
* sku_name: "全托班",
* sku_price: 4888,
* sku_properties: Array(3)
* }
*/
let findSku = false;
for (var i = 0; i < this.data.skuList.length; i ) {
const sku_properties=this.data.skuList[i].sku_properties
//sku數組轉成字符串
let sku_properties_str=sku_properties.join(";")
if (sku_properties_str == selectedProperties) {
findSku = true
selectedSku= this.data.skuList[i] //選中的SKU完整數據對象(帶價格,數量)
let product=this.data.product
//修改數量,庫存和總數
product.product_stock=selectedSku.sku_stock
product.product_total=selectedSku.sku_total
//修改商品價格
product.product_price=selectedSku.sku_price
this.setData({
selectedSku,
product
});
break;
}
}
this.setData({
findSku
});
console.log('selectedSku=',selectedSku)
console.log('findSku=',findSku)
},
/**
* 判斷數組是否包含某對象
*/
array_contain: function(array, obj) {
for (var i = 0; i < array.length; i ) {
if (array[i] == obj)
return true;
}
return false;
},