382 lines
11 KiB
JavaScript
382 lines
11 KiB
JavaScript
// packageI/groupWork/components/yz_specsV2/yz_specs.js
|
||
var specsManage = []; //选择池 用于排序
|
||
var optionsId = 0; //选择后的 规格ID
|
||
const app = getApp();
|
||
Component({
|
||
/**
|
||
* 组件的属性列表
|
||
*/
|
||
options: {
|
||
multipleSlots: true // 在组件定义时的选项中启用多slot支持
|
||
},
|
||
properties: {
|
||
show: {
|
||
type: Boolean,
|
||
value: false
|
||
},
|
||
isRent: {
|
||
type: Boolean,
|
||
value: false
|
||
},
|
||
//主题色
|
||
themeColor: {
|
||
type: String,
|
||
value: "#f14e4e"
|
||
},
|
||
goods: {
|
||
type: Object,
|
||
value: () => ({})
|
||
},
|
||
goodSpecs: {
|
||
type: Array,
|
||
value: () => []
|
||
},
|
||
options: {
|
||
type: Array,
|
||
value: () => []
|
||
},
|
||
disableStepperInput: {
|
||
type: Boolean, //是否禁用步进器输入
|
||
value: false
|
||
},
|
||
quota: {
|
||
type: Number,
|
||
value: -1 //限购数，-1按库存设置限购数，0不限购
|
||
},
|
||
startSaleNum: {
|
||
type: Number,
|
||
value: 1 //起售数量
|
||
},
|
||
hiddenBuyBtn: {
|
||
type: Boolean, //是否隐藏默认购买按钮
|
||
value: false
|
||
},
|
||
},
|
||
|
||
/**
|
||
* 组件的初始数据
|
||
*/
|
||
data: {
|
||
popThumb: "", //顶部商品图片
|
||
popPrice: "", //顶部商品价格
|
||
popStock: "", //顶部商品库存
|
||
popDescription: "", //顶部商品描述
|
||
popUnit: "", //单位
|
||
optionsMaxCount: 0, //库存
|
||
selectedNum: 1, // 选择的商品数量
|
||
|
||
skuImages: [],
|
||
specs: []
|
||
},
|
||
observers: {
|
||
show(newV,oldV) {
|
||
if (newV) {
|
||
this.initPopView();
|
||
}
|
||
},
|
||
},
|
||
|
||
/**
|
||
* 组件的方法列表
|
||
*/
|
||
methods: {
|
||
initPopView() {
|
||
//初始化顶部商品信息
|
||
console.log("初始化顶部商品信息", this.data.goods);
|
||
this.setData({
|
||
popThumb: this.data.goods.hasOwnProperty("thumb") ? this.data.goods.thumb : "",
|
||
popPrice: this.data.goods.hasOwnProperty("price") ? this.data.goods.price : "",
|
||
popStock: this.data.goods.hasOwnProperty("stock") ? this.data.goods.stock : null,
|
||
popUnit: this.data.goods.hasOwnProperty("unit") ? this.data.goods.unit : "",
|
||
specs: this.data.goodSpecs,
|
||
popDescription: null
|
||
});
|
||
|
||
specsManage = [];
|
||
optionsId = 0;
|
||
|
||
this.initSkuIMG();
|
||
this.initSku();
|
||
},
|
||
initSku() {
|
||
//默认选择第一个
|
||
if (this.data.goods.has_option == 1) {
|
||
console.log("00000000000",this.data.specs,this.data.options);
|
||
if (this.data.specs.length==0 || this.data.options.length==0) return;
|
||
console.log("sssssssssss");
|
||
this.data.options.forEach((val, index) => {
|
||
let _thumb = !app._isTextEmpty(val.thumb) ? val.thumb : this.data.goods.thumb;
|
||
this.data.skuImages.push(_thumb);
|
||
});
|
||
// 默认选择第一个
|
||
for (let i = 0; i < this.data.specs.length; i++) {
|
||
this.data.specs[i].description = this.data.specs[i].specitem[0];
|
||
console.log("1111111111111111111");
|
||
// this.selectSpecs(this.data.specs[i].specitem[0]);
|
||
this.selectSpecs(this.data.specs[i].specitem[0], 'first', i);
|
||
}
|
||
} else {
|
||
this.data.goods.thumb&&this.data.skuImages.push(this.data.goods.thumb);
|
||
}
|
||
this.setData({
|
||
skuImages: this.data.skuImages,
|
||
specs: this.data.specs,
|
||
optionsMaxCount: this.data.popStock
|
||
});
|
||
},
|
||
getSkuData() {
|
||
let skuData = {
|
||
price: this.data.popPrice,
|
||
stock: this.data.popStock,
|
||
selectedNum: this.data.selectedNum,
|
||
has_option: this.data.goods.has_option,
|
||
optionsId: optionsId
|
||
};
|
||
return skuData;
|
||
},
|
||
buyClicked() {
|
||
//点击购买触发
|
||
this.triggerEvent("buy-clicked", this.getSkuData());
|
||
},
|
||
stepperPlus() {
|
||
this.triggerEvent("stepper-plus", this.getSkuData());
|
||
},
|
||
stepperMinus() {
|
||
this.triggerEvent("stepper-minus", this.getSkuData());
|
||
},
|
||
stepperChange() {
|
||
this.triggerEvent("stepper-change", this.getSkuData());
|
||
},
|
||
setPrice(e) {
|
||
//设置价格
|
||
if (e) {
|
||
this.setData({
|
||
popPrice: e
|
||
});
|
||
}
|
||
},
|
||
setStock(e) {
|
||
//设置库存
|
||
if (e) {
|
||
this.setData({
|
||
popStock: e
|
||
});
|
||
}
|
||
},
|
||
|
||
//界面选择规格触发事件
|
||
selectSpecs(e, str, i) {
|
||
let data = {};
|
||
let specsIdex = 0;
|
||
if (str == 'first') {
|
||
specsIdex = i;
|
||
data = e;
|
||
} else if(str =="sku_swiper"){
|
||
data = e;
|
||
} else {
|
||
specsIdex = e.currentTarget.dataset.specsidex;
|
||
data = e.currentTarget.dataset.specitem;
|
||
}
|
||
|
||
if (data.c) {
|
||
return false;
|
||
}
|
||
this.setData({
|
||
["specs[" + specsIdex + "].description"]: data.id
|
||
});
|
||
this.manageSpecs(data); //处理选择池
|
||
this.setGoodsSpecs(data); //处理规格组合选择状态
|
||
this.setGoodsSpecsChangeInfo(); //设置选择规格后的 价格、照片、库存
|
||
this.getMaxCount(); //判断当前购买总量与库存的关系
|
||
},
|
||
//处理选择池
|
||
manageSpecs(data) {
|
||
var specsObject = {};
|
||
specsObject.id = data.id;
|
||
specsObject.specid = data.specid;
|
||
specsObject.title = data.title;
|
||
|
||
if (specsManage.length > 0) {
|
||
for (let i = 0; i < specsManage.length; i++) {
|
||
if (specsManage[i].specid == specsObject.specid) {
|
||
specsManage.splice(i, 1);
|
||
}
|
||
}
|
||
specsManage.push(specsObject);
|
||
} else {
|
||
specsManage.push(specsObject);
|
||
}
|
||
|
||
//排序
|
||
if (specsManage.length == this.data.specs.length) {
|
||
var newSpecsManage = [];
|
||
for (let i = 0; i < this.data.specs.length; i++) {
|
||
for (let j = 0; j < specsManage.length; j++) {
|
||
if (this.data.specs[i].id == specsManage[j].specid) {
|
||
newSpecsManage.push(specsManage[j]);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
specsManage = newSpecsManage;
|
||
}
|
||
this.setGoodsDescription();
|
||
},
|
||
|
||
//处理goodsDescription 数据
|
||
setGoodsDescription() {
|
||
var description = "";
|
||
//相等代表全选了 体现语句
|
||
if (specsManage.length == this.data.specs.length) {
|
||
description = "已选择 ";
|
||
for (let i = 0; i < specsManage.length; i++) {
|
||
description += specsManage[i].title + " ";
|
||
}
|
||
} else {
|
||
description = "请选择 ";
|
||
for (let i = 0; i < this.data.specs.length; i++) {
|
||
for (let j = 0; j < specsManage.length; j++) {
|
||
if (this.data.specs[i].id != specsManage[j].specid) {
|
||
description += this.data.specs[i].title + " ";
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
this.setData({
|
||
popDescription: description
|
||
});
|
||
},
|
||
//处理规格组合选择状态 过滤数据
|
||
setGoodsSpecs(specs) {
|
||
for (let i = 0; i < this.data.specs.length; i++) {
|
||
if (specs.specid != this.data.specs[i].id) {
|
||
this.setGoodsSpecsStatus(this.data.specs[i].specitem, specs.id);
|
||
}
|
||
}
|
||
},
|
||
//处理规格组合选择状态 处理状态 specitem 组合数组(未选中的) id当前选中的ID 根据ID 组合算是否有当前组合
|
||
setGoodsSpecsStatus(specitem, id) {
|
||
// console.log(specitem);
|
||
// console.log(id);
|
||
let options = []; //数据池
|
||
|
||
for (let i = 0; i < this.data.options.length; i++) {
|
||
// console.log(this.options[i].specs);
|
||
let _specs = this.data.options[i].specs.split("_");
|
||
//console.log(_specs);
|
||
//判断是否包含
|
||
for (let j = 0; j < _specs.length; j++) {
|
||
if (_specs[j] == id) {
|
||
options.push(this.data.options[i]);
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
|
||
//关键处理方式 后期要优化 效率低
|
||
for (let m = 0; m < options.length; m++) {
|
||
let _specs = options[m].specs.split("_");
|
||
for (let y = 0; y < _specs.length; y++) {
|
||
if (_specs[y] != id && options[m].stock == 0) {
|
||
for (let n = 0; n < specitem.length; n++) {
|
||
if (_specs[y] == specitem[n].id) {
|
||
specitem[n].c = true;
|
||
return;
|
||
}
|
||
}
|
||
} else if (_specs[y] != id && options[m].stock > 0) {
|
||
for (let n = 0; n < specitem.length; n++) {
|
||
if (_specs[y] == specitem[n].id) {
|
||
specitem[n].c = false;
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
console.log(options);
|
||
},
|
||
//设置选择规格后的 价格、照片、库存
|
||
setGoodsSpecsChangeInfo() {
|
||
//根据ID 排序 specsManage.sort();
|
||
specsManage.sort(function(a, b) {
|
||
return a.id - b.id;
|
||
});
|
||
if (specsManage.length == this.data.specs.length) {
|
||
let goodsSpecs = "";
|
||
for (let j = 0; j < specsManage.length; j++) {
|
||
goodsSpecs += specsManage[j].id + "_";
|
||
}
|
||
goodsSpecs = goodsSpecs.substring(0, goodsSpecs.length - 1); //处理"_"
|
||
// console.log('goodsSpecs', goodsSpecs)
|
||
for (let i = 0; i < this.data.options.length; i++) {
|
||
if (goodsSpecs == this.setGoodsSpecsBySort(this.data.options[i].specs)) {
|
||
this.setData({
|
||
activeSkuIndex: i,
|
||
popPrice: this.data.options[i].product_price, //设置价格
|
||
popThumb: app._isTextEmpty(this.data.options[i].thumb) ? this.data.goods.thumb : this.data.options[i].thumb, //设置图片
|
||
popStock: this.data.options[i].stock, //设置库存
|
||
optionsMaxCount: this.data.options[i].stock//库存最大数 用于切换更改买家购买数量
|
||
});
|
||
optionsId = this.data.options[i].id; //设置规格ID，用于生成订单
|
||
|
||
if (this.data.optionsMaxCount > 0) {
|
||
this.setData({
|
||
popNum: 1,
|
||
goodsCount: 1
|
||
});
|
||
}
|
||
console.log("=================",optionsId);
|
||
this.triggerEvent("sku-selected", optionsId);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
},
|
||
//处理商品goodsSpecs 并排序 新方法
|
||
setGoodsSpecsBySort(specs) {
|
||
let _specs = specs.split("_"); //先变成数组
|
||
//_specs.sort();//排序
|
||
_specs.sort(function(a, b) {
|
||
return a - b;
|
||
});
|
||
|
||
// 在组装回去
|
||
let goodsSpecs = "";
|
||
for (let j = 0; j < _specs.length; j++) {
|
||
goodsSpecs += _specs[j] + "_";
|
||
}
|
||
goodsSpecs = goodsSpecs.substring(0, goodsSpecs.length - 1); //处理"_"
|
||
|
||
return goodsSpecs;
|
||
},
|
||
|
||
//判断当前购买总量与库存的关系
|
||
getMaxCount() {
|
||
if (specsManage.length == this.data.specs.length) {
|
||
// console.log(optionsMaxCount);
|
||
// console.log(this.goodsCount);
|
||
if (this.data.optionsMaxCount == 0) {
|
||
//库存不足
|
||
this.data.goodsCount = 0;
|
||
}
|
||
if (this.data.goodsCount > this.data.optionsMaxCount) {
|
||
this.data.goodsCount = this.data.optionsMaxCount;
|
||
}
|
||
this.setData({
|
||
goodsCount: this.data.goodsCount
|
||
});
|
||
}
|
||
},
|
||
close() {
|
||
this.setData({
|
||
show: false
|
||
});
|
||
},
|
||
|
||
initSkuIMG(){}
|
||
}
|
||
});
|