237 lines
8.5 KiB
JavaScript
237 lines
8.5 KiB
JavaScript
"use strict";
|
||
const common_vendor = require("../../../../../common/vendor.js");
|
||
const modules_mall_sheep_index = require("../../index.js");
|
||
const modules_mall_sheep_hooks_useGoods = require("../../hooks/useGoods.js");
|
||
if (!Array) {
|
||
const _easycom_su_number_box2 = common_vendor.resolveComponent("su-number-box");
|
||
const _easycom_su_popup2 = common_vendor.resolveComponent("su-popup");
|
||
(_easycom_su_number_box2 + _easycom_su_popup2)();
|
||
}
|
||
const _easycom_su_number_box = () => "../../ui/su-number-box/su-number-box.js";
|
||
const _easycom_su_popup = () => "../../ui/su-popup/su-popup.js";
|
||
if (!Math) {
|
||
(_easycom_su_number_box + _easycom_su_popup)();
|
||
}
|
||
const _sfc_main = {
|
||
__name: "s-select-groupon-sku",
|
||
props: {
|
||
show: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
goodsInfo: {
|
||
type: Object,
|
||
default() {
|
||
}
|
||
},
|
||
grouponAction: {
|
||
type: String,
|
||
default: "create"
|
||
},
|
||
grouponNum: {
|
||
type: [Number, String],
|
||
default: 0
|
||
}
|
||
},
|
||
emits: ["change", "addCart", "buy", "close", "ladder"],
|
||
setup(__props, { emit: __emit }) {
|
||
common_vendor.useCssVars((_ctx) => ({
|
||
"28b305b2": common_vendor.unref(headerBg)
|
||
}));
|
||
const headerBg = modules_mall_sheep_index.sheep.$url.css("/static/img/shop/goods/groupon-btn-long.png");
|
||
const emits = __emit;
|
||
const props = __props;
|
||
const state = common_vendor.reactive({
|
||
selectedSku: {},
|
||
// 选中的 SKU
|
||
currentPropertyArray: [],
|
||
// 当前选中的属性，实际是个 Map。key 是 property 编号，value 是 value 编号
|
||
grouponNum: props.grouponNum
|
||
});
|
||
const propertyList = modules_mall_sheep_hooks_useGoods.convertProductPropertyList(props.goodsInfo.skus);
|
||
const skuList = common_vendor.computed(() => {
|
||
const skuPrices = props.goodsInfo.skus;
|
||
for (const price of skuPrices) {
|
||
price.value_id_array = price.properties.map((item) => item.valueId);
|
||
}
|
||
return skuPrices;
|
||
});
|
||
common_vendor.watch(
|
||
() => state.selectedSku,
|
||
(newVal) => {
|
||
emits("change", newVal);
|
||
},
|
||
{
|
||
immediate: true,
|
||
// 立即执行
|
||
deep: true
|
||
// 深度监听
|
||
}
|
||
);
|
||
function onNumberChange(e) {
|
||
if (e === 0)
|
||
return;
|
||
if (state.selectedSku.count === e)
|
||
return;
|
||
state.selectedSku.count = e;
|
||
}
|
||
function onBuy() {
|
||
if (!state.selectedSku.id || state.selectedSku.id <= 0) {
|
||
modules_mall_sheep_index.sheep.$helper.toast("请选择规格");
|
||
return;
|
||
}
|
||
if (state.selectedSku.stock <= 0) {
|
||
modules_mall_sheep_index.sheep.$helper.toast("库存不足");
|
||
return;
|
||
}
|
||
emits("buy", state.selectedSku);
|
||
}
|
||
function changeDisabled(isChecked = false, propertyId = 0, valueId = 0) {
|
||
let newSkus = [];
|
||
if (isChecked) {
|
||
for (const price of skuList.value) {
|
||
if (price.stock <= 0) {
|
||
continue;
|
||
}
|
||
if (price.value_id_array.indexOf(valueId) >= 0) {
|
||
newSkus.push(price);
|
||
}
|
||
}
|
||
} else {
|
||
newSkus = getCanUseSkuList();
|
||
}
|
||
let noChooseValueIds = [];
|
||
for (const price of newSkus) {
|
||
noChooseValueIds = noChooseValueIds.concat(price.value_id_array);
|
||
}
|
||
noChooseValueIds = Array.from(new Set(noChooseValueIds));
|
||
if (isChecked) {
|
||
const index = noChooseValueIds.indexOf(valueId);
|
||
noChooseValueIds.splice(index, 1);
|
||
} else {
|
||
state.currentPropertyArray.forEach((currentPropertyId) => {
|
||
if (currentPropertyId.toString() !== "") {
|
||
return;
|
||
}
|
||
const index = noChooseValueIds.indexOf(currentPropertyId);
|
||
if (index >= 0) {
|
||
noChooseValueIds.splice(index, 1);
|
||
}
|
||
});
|
||
}
|
||
let choosePropertyIds = [];
|
||
if (!isChecked) {
|
||
state.currentPropertyArray.forEach((currentPropertyId, currentValueId) => {
|
||
if (currentPropertyId !== "") {
|
||
choosePropertyIds.push(currentValueId);
|
||
}
|
||
});
|
||
} else {
|
||
choosePropertyIds = [propertyId];
|
||
}
|
||
for (const propertyIndex in propertyList) {
|
||
if (choosePropertyIds.indexOf(propertyList[propertyIndex].id) >= 0) {
|
||
continue;
|
||
}
|
||
for (const valueIndex in propertyList[propertyIndex].values) {
|
||
propertyList[propertyIndex].values[valueIndex].disabled = noChooseValueIds.indexOf(propertyList[propertyIndex].values[valueIndex].id) < 0;
|
||
}
|
||
}
|
||
}
|
||
function getCanUseSkuList() {
|
||
const newSkus = [];
|
||
for (const sku of skuList.value) {
|
||
if (sku.stock <= 0) {
|
||
continue;
|
||
}
|
||
let isOk = true;
|
||
state.currentPropertyArray.forEach((propertyId) => {
|
||
if (propertyId.toString() !== "" && sku.value_id_array.indexOf(propertyId) < 0) {
|
||
isOk = false;
|
||
}
|
||
});
|
||
if (isOk) {
|
||
newSkus.push(sku);
|
||
}
|
||
}
|
||
return newSkus;
|
||
}
|
||
function onSelectSku(propertyId, valueId) {
|
||
let isChecked = true;
|
||
if (state.currentPropertyArray[propertyId] !== void 0 && state.currentPropertyArray[propertyId] === valueId) {
|
||
isChecked = false;
|
||
state.currentPropertyArray.splice(propertyId, 1, "");
|
||
} else {
|
||
state.currentPropertyArray[propertyId] = valueId;
|
||
}
|
||
const choosePropertyId = [];
|
||
state.currentPropertyArray.forEach((currentPropertyId) => {
|
||
if (currentPropertyId !== "") {
|
||
choosePropertyId.push(currentPropertyId);
|
||
}
|
||
});
|
||
const newSkuList = getCanUseSkuList();
|
||
if (choosePropertyId.length === propertyList.length && newSkuList.length) {
|
||
newSkuList[0].count = state.selectedSku.count || 1;
|
||
state.selectedSku = newSkuList[0];
|
||
} else {
|
||
state.selectedSku = {};
|
||
}
|
||
changeDisabled(isChecked, propertyId, valueId);
|
||
}
|
||
changeDisabled(false);
|
||
return (_ctx, _cache) => {
|
||
return common_vendor.e({
|
||
a: common_vendor.unref(modules_mall_sheep_index.sheep).$url.cdn(state.selectedSku.picUrl || __props.goodsInfo.picUrl),
|
||
b: common_vendor.unref(modules_mall_sheep_index.sheep).$url.static("/static/img/shop/goods/groupon-tag-white.png"),
|
||
c: common_vendor.t(__props.goodsInfo.name),
|
||
d: common_vendor.t(common_vendor.unref(modules_mall_sheep_hooks_useGoods.fen2yuan)(state.selectedSku.price || __props.goodsInfo.price || state.selectedSku.marketPrice)),
|
||
e: common_vendor.t(state.selectedSku.stock || __props.goodsInfo.stock),
|
||
f: common_vendor.f(common_vendor.unref(propertyList), (property, k0, i0) => {
|
||
return {
|
||
a: common_vendor.t(property.name),
|
||
b: common_vendor.f(property.values, (value, k1, i1) => {
|
||
return {
|
||
a: common_vendor.t(value.name),
|
||
b: common_vendor.n({
|
||
"checked-btn": state.currentPropertyArray[property.id] === value.id
|
||
}),
|
||
c: common_vendor.n({
|
||
"disabled-btn": value.disabled === true
|
||
}),
|
||
d: value.id,
|
||
e: value.disabled === true,
|
||
f: common_vendor.o(($event) => onSelectSku(property.id, value.id), value.id)
|
||
};
|
||
}),
|
||
c: property.id
|
||
};
|
||
}),
|
||
g: common_vendor.o(($event) => onNumberChange($event)),
|
||
h: common_vendor.o(($event) => state.selectedSku.count = $event),
|
||
i: common_vendor.p({
|
||
min: 1,
|
||
max: state.selectedSku.stock,
|
||
step: 1,
|
||
activity: "groupon",
|
||
modelValue: state.selectedSku.count
|
||
}),
|
||
j: common_vendor.t(__props.grouponNum + "人团"),
|
||
k: common_vendor.t(common_vendor.unref(modules_mall_sheep_hooks_useGoods.fen2yuan)(state.selectedSku.price * state.selectedSku.count || __props.goodsInfo.price * state.selectedSku.count || state.selectedSku.marketPrice * state.selectedSku.count || __props.goodsInfo.price)),
|
||
l: __props.grouponAction === "create"
|
||
}, __props.grouponAction === "create" ? {} : __props.grouponAction === "join" ? {} : {}, {
|
||
m: __props.grouponAction === "join",
|
||
n: common_vendor.o(onBuy),
|
||
o: common_vendor.o(($event) => emits("close")),
|
||
p: common_vendor.s(_ctx.__cssVars()),
|
||
q: common_vendor.p({
|
||
show: __props.show,
|
||
round: "10"
|
||
})
|
||
});
|
||
};
|
||
}
|
||
};
|
||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-898bdc77"]]);
|
||
wx.createComponent(Component);
|