|
|
|
|
@ -104,11 +104,7 @@
|
|
|
|
|
<div class="main__details-msg">
|
|
|
|
|
<div class="main__details-msg--price flex flex-middle">
|
|
|
|
|
<span class="msg-txt">售价</span>
|
|
|
|
|
<strong class="msg-price">{{
|
|
|
|
|
detailData.productActivityVO.isStartActivity
|
|
|
|
|
? detailData.productActivityVO.activityPrice
|
|
|
|
|
: detailData.startingPrice
|
|
|
|
|
}}</strong>
|
|
|
|
|
<strong class="msg-price">{{ getPrice }}</strong>
|
|
|
|
|
<div
|
|
|
|
|
v-if="
|
|
|
|
|
detailData.productActivityVO.isActivity &&
|
|
|
|
|
@ -272,14 +268,17 @@ export default {
|
|
|
|
|
let res1 = await ApiGetGoodsDetail({ id });
|
|
|
|
|
let res2 = await ApiGetGoodsSkus({ productId: id });
|
|
|
|
|
let res3 = await ApiGetGoodsList({
|
|
|
|
|
length: 3,
|
|
|
|
|
pageIndex: 1,
|
|
|
|
|
name: "",
|
|
|
|
|
categoryId: "",
|
|
|
|
|
order: "",
|
|
|
|
|
});
|
|
|
|
|
length: 3,
|
|
|
|
|
pageIndex: 1,
|
|
|
|
|
name: "",
|
|
|
|
|
categoryId: "",
|
|
|
|
|
order: "",
|
|
|
|
|
});
|
|
|
|
|
vm.detailData = res1.result;
|
|
|
|
|
vm.skuData = res2.result;
|
|
|
|
|
vm.skuData = res2.result.map(i => {
|
|
|
|
|
i.attributeSymbolList = i.attributeSymbolList.split(',')
|
|
|
|
|
return i;
|
|
|
|
|
});
|
|
|
|
|
vm.recommendedData = res3.result.records;
|
|
|
|
|
vm.pageLoading = false;
|
|
|
|
|
if (
|
|
|
|
|
@ -311,7 +310,7 @@ export default {
|
|
|
|
|
curSku() {
|
|
|
|
|
return (
|
|
|
|
|
this.skuData.find(
|
|
|
|
|
(i) => i.attributeSymbolList === this.selectedSymbol.join(",")
|
|
|
|
|
(i) => i.attributeSymbolList.join(',') === this.selectedSymbol.join(",")
|
|
|
|
|
) || {}
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
@ -320,9 +319,9 @@ export default {
|
|
|
|
|
return this.detailData.attributeGroupList
|
|
|
|
|
.map((item) => {
|
|
|
|
|
const activeAttr = item.attributes.find((i) => i.active);
|
|
|
|
|
return activeAttr ? activeAttr.symbol : ".";
|
|
|
|
|
return activeAttr?.symbol;
|
|
|
|
|
})
|
|
|
|
|
.filter((i) => i); //.sort();
|
|
|
|
|
.filter((i) => i).sort();
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* 最大可购买数量
|
|
|
|
|
@ -334,6 +333,15 @@ export default {
|
|
|
|
|
const stock = this.curSku.stock;
|
|
|
|
|
return singleBuyLimit ? Math.min(singleBuyLimit, stock || 1) : stock;
|
|
|
|
|
},
|
|
|
|
|
getPrice() {
|
|
|
|
|
if (this.curSku.sellPrice) {
|
|
|
|
|
return this.curSku.sellPrice;
|
|
|
|
|
} else {
|
|
|
|
|
return this.detailData.productActivityVO.isStartActivity
|
|
|
|
|
? this.detailData.productActivityVO.activityPrice
|
|
|
|
|
: this.detailData.startingPrice;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
onShowService() {
|
|
|
|
|
@ -425,26 +433,6 @@ export default {
|
|
|
|
|
vm.activeImg++;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* 设置默认选中规格
|
|
|
|
|
*/
|
|
|
|
|
setDefaultAttr() {
|
|
|
|
|
let vm = this;
|
|
|
|
|
const curSku = vm.skuData.find((i) => i.stock > 0);
|
|
|
|
|
if (!curSku) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
vm.detailData.attributeGroupList.forEach((item, index) => {
|
|
|
|
|
for (let i of item.attributes) {
|
|
|
|
|
if (curSku.attributeSymbolList.includes(i.symbol)) {
|
|
|
|
|
this.$set(i, "active", true);
|
|
|
|
|
this.setDisabledItem(i, index, true);
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
this.$emit("input", this.curSku);
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* 点击属性项，设置选中和禁用项
|
|
|
|
|
*/
|
|
|
|
|
@ -473,26 +461,43 @@ export default {
|
|
|
|
|
setDisabledItem(item, groupIndex) {
|
|
|
|
|
let vm = this;
|
|
|
|
|
vm.detailData.attributeGroupList.forEach((group, idx) => {
|
|
|
|
|
// 拿到已选项数组，这个是按照项组顺序排序好的缓存数组
|
|
|
|
|
let symbolCache = Object.assign([], this.selectedSymbol);
|
|
|
|
|
// 跳过当前属性组
|
|
|
|
|
if (groupIndex === idx) return false;
|
|
|
|
|
// 遍历其他选项组中的选项
|
|
|
|
|
group.attributes.forEach((item) => {
|
|
|
|
|
// 根据选项组下标，补位选项属性
|
|
|
|
|
symbolCache[idx] = item.symbol;
|
|
|
|
|
const reg = new RegExp(symbolCache.join(","));
|
|
|
|
|
// 根据补位选项寻找是否有有效SKU，有则可选，没有则禁用
|
|
|
|
|
const res = vm.skuData
|
|
|
|
|
.filter((i) => reg.test(i.attributeSymbolList))
|
|
|
|
|
.find((i) => i.stock > 0);
|
|
|
|
|
if (res) {
|
|
|
|
|
item.disabled = false;
|
|
|
|
|
} else {
|
|
|
|
|
item.disabled = true;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
// if(groupIndex === idx) return false;
|
|
|
|
|
// 拿到已选项数组
|
|
|
|
|
group.attributes.forEach( item => {
|
|
|
|
|
let symbolCache = Object.assign([],vm.selectedSymbol);
|
|
|
|
|
symbolCache.push(item.symbol);
|
|
|
|
|
symbolCache.sort();
|
|
|
|
|
const res = vm.skuData.filter(item =>
|
|
|
|
|
symbolCache.map(i => item.attributeSymbolList.includes(i.toString())).every(i => i)
|
|
|
|
|
).find(i => i.stock > 0);
|
|
|
|
|
if(res){
|
|
|
|
|
item.disabled = false;
|
|
|
|
|
}else{
|
|
|
|
|
item.disabled = true;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
})
|
|
|
|
|
// vm.detailData.attributeGroupList.forEach((group, idx) => {
|
|
|
|
|
// // 拿到已选项数组，这个是按照项组顺序排序好的缓存数组
|
|
|
|
|
// let symbolCache = Object.assign([], this.selectedSymbol);
|
|
|
|
|
// // 跳过当前属性组
|
|
|
|
|
// if (groupIndex === idx) return false;
|
|
|
|
|
// // 遍历其他选项组中的选项
|
|
|
|
|
// group.attributes.forEach((item) => {
|
|
|
|
|
// // 根据选项组下标，补位选项属性
|
|
|
|
|
// symbolCache[idx] = item.symbol;
|
|
|
|
|
// const reg = new RegExp(symbolCache.join(","));
|
|
|
|
|
// // 根据补位选项寻找是否有有效SKU，有则可选，没有则禁用
|
|
|
|
|
// const res = vm.skuData
|
|
|
|
|
// .filter((i) => reg.test(i.attributeSymbolList))
|
|
|
|
|
// .find((i) => i.stock > 0);
|
|
|
|
|
// if (res) {
|
|
|
|
|
// item.disabled = false;
|
|
|
|
|
// } else {
|
|
|
|
|
// item.disabled = true;
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
// });
|
|
|
|
|
},
|
|
|
|
|
buyNow() {
|
|
|
|
|
if (!this.$isLoginValidate()) {
|
|
|
|
|
|
张征
3 years ago