feat 加入购物车弹窗 公告删除取消
This commit is contained in:
Cxpller
parent
75243c9db1
commit
a4e2dc786c
@ -1,4 +1,13 @@
|
|||||||
import { goodsList } from "~/model/goods";
|
import Toast from 'tdesign-miniprogram/toast/index';
|
||||||
|
import {
|
||||||
|
goodsList
|
||||||
|
} from "~/model/goods";
|
||||||
|
import {
|
||||||
|
fetchGood
|
||||||
|
} from '~/services/good/fetchGood';
|
||||||
|
import {
|
||||||
|
addOrUpdateCart
|
||||||
|
} from '~/services/cart/addOrUpdateCart';
|
||||||
|
|
||||||
Component({
|
Component({
|
||||||
externalClasses: ['wr-class'],
|
externalClasses: ['wr-class'],
|
||||||
@ -19,7 +28,7 @@ Component({
|
|||||||
type: Array,
|
type: Array,
|
||||||
value: [],
|
value: [],
|
||||||
},
|
},
|
||||||
type:{
|
type: {
|
||||||
type: String,
|
type: String,
|
||||||
value: "card"
|
value: "card"
|
||||||
}
|
}
|
||||||
@ -27,6 +36,16 @@ Component({
|
|||||||
|
|
||||||
data: {
|
data: {
|
||||||
independentID: '',
|
independentID: '',
|
||||||
|
isSpuSelectPopupShow: false,
|
||||||
|
details: {},
|
||||||
|
specImg: "",
|
||||||
|
primaryImage: "",
|
||||||
|
skuArray: [],
|
||||||
|
selectSkuQuantity: 0,
|
||||||
|
isStock: false,
|
||||||
|
isAllSelectedSku: false,
|
||||||
|
selectSkuSellsPrice: 0,
|
||||||
|
details: {},
|
||||||
},
|
},
|
||||||
|
|
||||||
lifetimes: {
|
lifetimes: {
|
||||||
@ -37,34 +56,257 @@ Component({
|
|||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
onClickGoods(e) {
|
onClickGoods(e) {
|
||||||
const { index } = e.currentTarget.dataset;
|
const {
|
||||||
this.triggerEvent('click', { ...e.detail, index });
|
index
|
||||||
|
} = e.currentTarget.dataset;
|
||||||
|
this.triggerEvent('click', {
|
||||||
|
...e.detail,
|
||||||
|
index
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
onAddCart(e) {
|
onAddCart(e) {
|
||||||
const { index } = e.currentTarget.dataset;
|
const {
|
||||||
this.triggerEvent('addcart', { ...e.detail, index });
|
index
|
||||||
|
} = e.currentTarget.dataset;
|
||||||
|
this.setData({
|
||||||
|
isSpuSelectPopupShow: true
|
||||||
|
})
|
||||||
|
|
||||||
|
// 请求商品详情接口
|
||||||
|
this.getDetail(e.detail.goods.spuId)
|
||||||
|
},
|
||||||
|
|
||||||
|
addCartFun() {
|
||||||
|
const {
|
||||||
|
isAllSelectedSku,
|
||||||
|
buyNum,
|
||||||
|
selectedSkuId
|
||||||
|
} = this.data;
|
||||||
|
const {
|
||||||
|
specList,
|
||||||
|
shopGuid,
|
||||||
|
spuId,
|
||||||
|
} = this.data.details;
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
shopGuid: shopGuid,
|
||||||
|
goodsGuid: spuId,
|
||||||
|
goodsSkuId: selectedSkuId,
|
||||||
|
cartGoodsNum: buyNum
|
||||||
|
}
|
||||||
|
console.log(data, '加入购物车的数据');
|
||||||
|
|
||||||
|
// 添加购物车接口
|
||||||
|
addOrUpdateCart(data).then((res) => {
|
||||||
|
if (res.code == 200) {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
selector: '#t-toast',
|
||||||
|
message: res.data,
|
||||||
|
icon: '',
|
||||||
|
duration: 1000,
|
||||||
|
});
|
||||||
|
this.setData({
|
||||||
|
isSpuSelectPopupShow: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
selectSpecsName(selectSpecsName) {
|
||||||
|
if (selectSpecsName) {
|
||||||
|
this.setData({
|
||||||
|
selectedAttrStr: selectSpecsName,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.setData({
|
||||||
|
selectedAttrStr: '',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
normalizeSkuTree(skuTree) {
|
||||||
|
const normalizedTree = {};
|
||||||
|
skuTree.forEach((treeItem) => {
|
||||||
|
normalizedTree[treeItem.specId] = treeItem.specValueList;
|
||||||
|
});
|
||||||
|
return normalizedTree;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取已选择的sku名称
|
||||||
|
getSelectedSkuValues(skuTree, selectedSku) {
|
||||||
|
const normalizedTree = this.normalizeSkuTree(skuTree);
|
||||||
|
return Object.keys(selectedSku).reduce((selectedValues, skuKeyStr) => {
|
||||||
|
const skuValues = normalizedTree[skuKeyStr];
|
||||||
|
const skuValueId = selectedSku[skuKeyStr];
|
||||||
|
if (skuValueId !== '') {
|
||||||
|
const skuValue = skuValues.filter((value) => {
|
||||||
|
return value.specValueId === skuValueId;
|
||||||
|
})[0];
|
||||||
|
skuValue && selectedValues.push(skuValue);
|
||||||
|
}
|
||||||
|
return selectedValues;
|
||||||
|
}, []);
|
||||||
|
},
|
||||||
|
|
||||||
|
getSkuItem(specList, selectedSku) {
|
||||||
|
const {
|
||||||
|
skuArray,
|
||||||
|
primaryImage
|
||||||
|
} = this.data;
|
||||||
|
const selectedSkuValues = this.getSelectedSkuValues(specList, selectedSku);
|
||||||
|
let selectedAttrStr = ` 件 `;
|
||||||
|
selectedSkuValues.forEach((item) => {
|
||||||
|
selectedAttrStr += `，${item.specValue} `;
|
||||||
|
});
|
||||||
|
// eslint-disable-next-line array-callback-return
|
||||||
|
const skuItem = skuArray.filter((item) => {
|
||||||
|
let status = true;
|
||||||
|
(item.specInfo || []).forEach((subItem) => {
|
||||||
|
if (
|
||||||
|
!selectedSku[subItem.specId] ||
|
||||||
|
selectedSku[subItem.specId] !== subItem.specValueId
|
||||||
|
) {
|
||||||
|
status = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (status) return item;
|
||||||
|
});
|
||||||
|
this.selectSpecsName(selectedSkuValues.length > 0 ? selectedAttrStr : '');
|
||||||
|
if (skuItem) {
|
||||||
|
this.setData({
|
||||||
|
selectedSkuId: skuItem[0]?.skuId,
|
||||||
|
selectItem: skuItem,
|
||||||
|
selectSkuSellsPrice: skuItem[0]?.priceInfo[0]?.price || 0,
|
||||||
|
selectSkuLinePrice: skuItem[0]?.priceInfo[1]?.price || 0,
|
||||||
|
selectSkuQuantity: skuItem[0]?.quantity
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.setData({
|
||||||
|
selectItem: null,
|
||||||
|
selectSkuSellsPrice: 0,
|
||||||
|
selectSkuLinePrice: 0,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.setData({
|
||||||
|
specImg: skuItem && skuItem[0]?.skuImage ? skuItem[0]?.skuImage : primaryImage,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
chooseSpecItem(e) {
|
||||||
|
console.log(e);
|
||||||
|
const {
|
||||||
|
specList
|
||||||
|
} = this.data.details;
|
||||||
|
const {
|
||||||
|
selectedSku,
|
||||||
|
isAllSelectedSku
|
||||||
|
} = e.detail;
|
||||||
|
if (!isAllSelectedSku) {
|
||||||
|
this.setData({
|
||||||
|
selectSkuSellsPrice: 0,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.setData({
|
||||||
|
isAllSelectedSku,
|
||||||
|
});
|
||||||
|
this.getSkuItem(specList, selectedSku);
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 加入购物车 */
|
||||||
|
addCart() {
|
||||||
|
const {
|
||||||
|
isAllSelectedSku,
|
||||||
|
} = this.data;
|
||||||
|
const {
|
||||||
|
specList,
|
||||||
|
} = this.data.details;
|
||||||
|
|
||||||
|
if (specList.length != 0) {
|
||||||
|
if (isAllSelectedSku) {
|
||||||
|
this.addCartFun()
|
||||||
|
} else {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
selector: '#t-toast',
|
||||||
|
message: '请选择规格',
|
||||||
|
icon: '',
|
||||||
|
duration: 1000,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.addCartFun()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
onClickGoodsThumb(e) {
|
onClickGoodsThumb(e) {
|
||||||
const { index } = e.currentTarget.dataset;
|
const {
|
||||||
this.triggerEvent('thumb', { ...e.detail, index });
|
index
|
||||||
|
} = e.currentTarget.dataset;
|
||||||
|
this.triggerEvent('thumb', {
|
||||||
|
...e.detail,
|
||||||
|
index
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
console.log(this.properties.goodsList);
|
console.log(this.properties.goodsList);
|
||||||
this.genIndependentID(this.id || '');
|
this.genIndependentID(this.id || '');
|
||||||
this.setData({ type: this.properties.type });
|
this.setData({
|
||||||
|
type: this.properties.type
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
genIndependentID(id) {
|
genIndependentID(id) {
|
||||||
if (id) {
|
if (id) {
|
||||||
this.setData({ independentID: id });
|
this.setData({
|
||||||
|
independentID: id
|
||||||
|
});
|
||||||
} else {
|
} else {
|
||||||
this.setData({
|
this.setData({
|
||||||
independentID: `goods-list-${~~(Math.random() * 10 ** 8)}`,
|
independentID: `goods-list-${~~(Math.random() * 10 ** 8)}`,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// 商品规格js方法（搬运商品详情页的相关方法）
|
||||||
|
getDetail(spuId) {
|
||||||
|
Promise.all([fetchGood(spuId)]).then((res) => {
|
||||||
|
const [details] = res;
|
||||||
|
const skuArray = [];
|
||||||
|
const {
|
||||||
|
skuList,
|
||||||
|
primaryImage,
|
||||||
|
} = details;
|
||||||
|
|
||||||
|
// details.desc = details.desc.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ');
|
||||||
|
// details.desc = details.desc.replace(/<img[^>]*style\s*=\s*(['"])[^'"]*\1[^>]*>/gi, '<img style="max-width:100%;height:auto;" ');
|
||||||
|
// details.desc = details.desc.replace(/<img[^>]*>/gi, '<img style="max-3999999996width:100%;height:auto;" >');
|
||||||
|
|
||||||
|
skuList.forEach((item) => {
|
||||||
|
skuArray.push({
|
||||||
|
skuId: item.skuId,
|
||||||
|
quantity: item.quantity ? item.quantity : 0,
|
||||||
|
specInfo: item.specInfo,
|
||||||
|
priceInfo: item.priceInfo,
|
||||||
|
skuImage: item.skuImage,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
this.setData({
|
||||||
|
details,
|
||||||
|
isStock: details.spuStockQuantity > 0,
|
||||||
|
skuArray: skuArray,
|
||||||
|
primaryImage,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
handlePopupHide() {
|
||||||
|
this.setData({
|
||||||
|
isSpuSelectPopupShow: false,
|
||||||
|
});
|
||||||
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@ -1,6 +1,8 @@
|
|||||||
{
|
{
|
||||||
"component": true,
|
"component": true,
|
||||||
"usingComponents": {
|
"usingComponents": {
|
||||||
"goods-card": "/components/goods-card/index"
|
"t-toast": "tdesign-miniprogram/toast/toast",
|
||||||
}
|
"goods-card": "/components/goods-card/index",
|
||||||
|
"specs-popup": "/components/specs-popup/index"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@ -1,17 +1,16 @@
|
|||||||
<view class="goods-list-wrap wr-class" id="{{independentID}}">
|
<view class="goods-list-wrap wr-class" id="{{independentID}}">
|
||||||
<block wx:for="{{goodsList}}" wx:for-item="item" wx:key="index">
|
<block wx:for="{{goodsList}}" wx:for-item="item" wx:key="index">
|
||||||
<goods-card
|
<goods-card id="{{independentID}}-gd-{{index}}" data="{{item}}" currency="{{item.currency || '¥'}}" thresholds="{{thresholds}}" class="goods-card-inside" data-index="{{index}}" type="{{type}}" bind:thumb="onClickGoodsThumb" bind:click="onClickGoods" bind:add-cart="onAddCart" />
|
||||||
id="{{independentID}}-gd-{{index}}"
|
</block>
|
||||||
data="{{item}}"
|
|
||||||
currency="{{item.currency || '¥'}}"
|
|
||||||
thresholds="{{thresholds}}"
|
|
||||||
class="goods-card-inside"
|
|
||||||
data-index="{{index}}"
|
|
||||||
type="{{type}}"
|
|
||||||
bind:thumb="onClickGoodsThumb"
|
|
||||||
bind:click="onClickGoods"
|
|
||||||
bind:add-cart="onAddCart"
|
|
||||||
/>
|
|
||||||
</block>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- 弹窗 -->
|
||||||
|
<specs-popup id="goodsSpecsPopup" show="{{isSpuSelectPopupShow}}" title="{{details.title || ''}}" src="{{specImg ? specImg : primaryImage}}" specList="{{details.specList || []}}" skuList="{{skuArray}}" limitBuyInfo="{{details.limitInfo[0].text || ''}}" limitMaxCount="{{ selectSkuQuantity || details.spuStockQuantity }}" quantity="{{ details.spuStockQuantity }}" bind:closeSpecsPopup="handlePopupHide" bind:change="chooseSpecItem" bind:changeNum="changeNum" bind:addCart="addCart" bind:specsConfirm="specsConfirm" isStock="{{isStock}}" outOperateStatus="{{outOperateStatus}}">
|
||||||
|
<view slot="goods-price">
|
||||||
|
<view class="popup-sku__price">
|
||||||
|
<price wx:if="{{!isAllSelectedSku || (!promotionSubCode && isAllSelectedSku)}}" price="{{selectSkuSellsPrice ? selectSkuSellsPrice : minSalePrice }}" priceUnit="yuan" wr-class="popup-sku__price-num" symbol-class="popup-sku__price-symbol" />
|
||||||
|
<price wx:if="{{selectSkuLinePrice !== 0}}" price="{{selectSkuLinePrice ? selectSkuLinePrice : maxLinePrice }}" priceUnit="yuan" wr-class="popup-sku__price-del" type="delthrough" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</specs-popup>
|
||||||
|
<t-toast id="t-toast" />
|
||||||
@ -5,3 +5,7 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.t-toast__content {
|
||||||
|
z-index: 12001 !important;
|
||||||
|
}
|
||||||
371
components/specs-popup/index.js
Normal file
371
components/specs-popup/index.js
Normal file
@ -0,0 +1,371 @@
|
|||||||
|
import Toast from 'tdesign-miniprogram/toast/index';
|
||||||
|
|
||||||
|
Component({
|
||||||
|
options: {
|
||||||
|
multipleSlots: true,
|
||||||
|
addGlobalClass: true,
|
||||||
|
},
|
||||||
|
|
||||||
|
properties: {
|
||||||
|
src: {
|
||||||
|
type: String,
|
||||||
|
},
|
||||||
|
title: String,
|
||||||
|
show: {
|
||||||
|
type: Boolean,
|
||||||
|
value: false,
|
||||||
|
},
|
||||||
|
limitBuyInfo: {
|
||||||
|
type: String,
|
||||||
|
value: '',
|
||||||
|
},
|
||||||
|
isStock: {
|
||||||
|
type: Boolean,
|
||||||
|
value: true,
|
||||||
|
},
|
||||||
|
limitMaxCount: {
|
||||||
|
type: Number,
|
||||||
|
value: 999,
|
||||||
|
},
|
||||||
|
limitMinCount: {
|
||||||
|
type: Number,
|
||||||
|
value: 1,
|
||||||
|
},
|
||||||
|
quantity: {
|
||||||
|
type: Number,
|
||||||
|
value: 0,
|
||||||
|
},
|
||||||
|
skuList: {
|
||||||
|
type: Array,
|
||||||
|
value: [],
|
||||||
|
observer(skuList) {
|
||||||
|
if (skuList && skuList.length > 0) {
|
||||||
|
if (this.initStatus) {
|
||||||
|
this.initData();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
specList: {
|
||||||
|
type: Array,
|
||||||
|
value: [],
|
||||||
|
observer(specList) {
|
||||||
|
if (specList && specList.length > 0) {
|
||||||
|
this.initData();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
outOperateStatus: {
|
||||||
|
type: Boolean,
|
||||||
|
value: false,
|
||||||
|
},
|
||||||
|
hasAuth: {
|
||||||
|
type: Boolean,
|
||||||
|
value: false,
|
||||||
|
},
|
||||||
|
count: {
|
||||||
|
type: Number,
|
||||||
|
value: 1,
|
||||||
|
observer(count) {
|
||||||
|
this.setData({
|
||||||
|
buyNum: count,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
initStatus: false,
|
||||||
|
selectedSku: {},
|
||||||
|
selectSpecObj: {},
|
||||||
|
|
||||||
|
data: {
|
||||||
|
buyNum: 1,
|
||||||
|
isAllSelectedSku: false,
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
initData() {
|
||||||
|
const {
|
||||||
|
skuList
|
||||||
|
} = this.properties;
|
||||||
|
const {
|
||||||
|
specList
|
||||||
|
} = this.properties;
|
||||||
|
specList.forEach((item) => {
|
||||||
|
if (item.specValueList.length > 0) {
|
||||||
|
item.specValueList.forEach((subItem) => {
|
||||||
|
const obj = this.checkSkuStockQuantity(subItem.specValueId, skuList);
|
||||||
|
subItem.hasStockObj = obj;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const selectedSku = {};
|
||||||
|
specList.forEach((item) => {
|
||||||
|
selectedSku[item.specId] = '';
|
||||||
|
});
|
||||||
|
this.setData({
|
||||||
|
specList,
|
||||||
|
});
|
||||||
|
this.selectSpecObj = {};
|
||||||
|
this.selectedSku = {};
|
||||||
|
this.initStatus = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
checkSkuStockQuantity(specValueId, skuList) {
|
||||||
|
let hasStock = false;
|
||||||
|
const array = [];
|
||||||
|
skuList.forEach((item) => {
|
||||||
|
(item.specInfo || []).forEach((subItem) => {
|
||||||
|
if (subItem.specValueId === specValueId && item.quantity > 0) {
|
||||||
|
const subArray = [];
|
||||||
|
(item.specInfo || []).forEach((specItem) => {
|
||||||
|
subArray.push(specItem.specValueId);
|
||||||
|
});
|
||||||
|
array.push(subArray);
|
||||||
|
hasStock = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
return {
|
||||||
|
hasStock,
|
||||||
|
specsArray: array,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
chooseSpecValueId(specValueId, specId) {
|
||||||
|
const {
|
||||||
|
selectSpecObj
|
||||||
|
} = this;
|
||||||
|
const {
|
||||||
|
skuList,
|
||||||
|
specList
|
||||||
|
} = this.properties;
|
||||||
|
if (selectSpecObj[specId]) {
|
||||||
|
selectSpecObj[specId] = [];
|
||||||
|
this.selectSpecObj = selectSpecObj;
|
||||||
|
} else {
|
||||||
|
selectSpecObj[specId] = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
const itemAllSpecArray = [];
|
||||||
|
const itemUnSelectArray = [];
|
||||||
|
const itemSelectArray = [];
|
||||||
|
specList.forEach((item) => {
|
||||||
|
if (item.specId === specId) {
|
||||||
|
const subSpecValueItem = item.specValueList.find((subItem) => subItem.specValueId === specValueId);
|
||||||
|
let specSelectStatus = false;
|
||||||
|
item.specValueList.forEach((n) => {
|
||||||
|
itemAllSpecArray.push(n.hasStockObj.specsArray);
|
||||||
|
if (n.isSelected) {
|
||||||
|
specSelectStatus = true;
|
||||||
|
}
|
||||||
|
if (n.hasStockObj.hasStock) {
|
||||||
|
itemSelectArray.push(n.specValueId);
|
||||||
|
} else {
|
||||||
|
itemUnSelectArray.push(n.specValueId);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (specSelectStatus) {
|
||||||
|
selectSpecObj[specId] = this.flatten(subSpecValueItem?.hasStockObj.specsArray.concat(itemSelectArray));
|
||||||
|
} else {
|
||||||
|
const subSet = function (arr1, arr2) {
|
||||||
|
const set2 = new Set(arr2);
|
||||||
|
const subset = [];
|
||||||
|
arr1.forEach((val) => {
|
||||||
|
if (!set2.has(val)) {
|
||||||
|
subset.push(val);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return subset;
|
||||||
|
};
|
||||||
|
selectSpecObj[specId] = subSet(this.flatten(itemAllSpecArray), this.flatten(itemUnSelectArray));
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 未点击规格的逻辑
|
||||||
|
const itemSelectArray = [];
|
||||||
|
let specSelectStatus = false;
|
||||||
|
item.specValueList.map(
|
||||||
|
// 找到有库存的规格数组
|
||||||
|
(n) => {
|
||||||
|
itemSelectArray.push(n.hasStockObj.specsArray);
|
||||||
|
if (n.isSelected) {
|
||||||
|
specSelectStatus = true;
|
||||||
|
}
|
||||||
|
n.hasStockObj.hasStock = true;
|
||||||
|
return n;
|
||||||
|
},
|
||||||
|
);
|
||||||
|
if (specSelectStatus) {
|
||||||
|
selectSpecObj[item.specId] = this.flatten(itemSelectArray);
|
||||||
|
} else {
|
||||||
|
delete selectSpecObj[item.specId];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.selectSpecObj = selectSpecObj;
|
||||||
|
});
|
||||||
|
const combatArray = Object.values(selectSpecObj);
|
||||||
|
if (combatArray.length > 0) {
|
||||||
|
const showArray = combatArray.reduce((x, y) => this.getIntersection(x, y));
|
||||||
|
const lastResult = Array.from(new Set(showArray));
|
||||||
|
specList.forEach((item) => {
|
||||||
|
item.specValueList.forEach((subItem) => {
|
||||||
|
if (lastResult.includes(subItem.specValueId)) {
|
||||||
|
subItem.hasStockObj.hasStock = true;
|
||||||
|
} else {
|
||||||
|
subItem.hasStockObj.hasStock = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
specList.forEach((item) => {
|
||||||
|
if (item.specValueList.length > 0) {
|
||||||
|
item.specValueList.forEach((subItem) => {
|
||||||
|
const obj = this.checkSkuStockQuantity(subItem.specValueId, skuList);
|
||||||
|
subItem.hasStockObj = obj;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.setData({
|
||||||
|
specList,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
flatten(input) {
|
||||||
|
const stack = [...input];
|
||||||
|
const res = [];
|
||||||
|
while (stack.length) {
|
||||||
|
const next = stack.pop();
|
||||||
|
if (Array.isArray(next)) {
|
||||||
|
stack.push(...next);
|
||||||
|
} else {
|
||||||
|
res.push(next);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return res.reverse();
|
||||||
|
},
|
||||||
|
|
||||||
|
getIntersection(array, nextArray) {
|
||||||
|
return array.filter((item) => nextArray.includes(item));
|
||||||
|
},
|
||||||
|
|
||||||
|
toChooseItem(e) {
|
||||||
|
const {
|
||||||
|
isStock
|
||||||
|
} = this.properties;
|
||||||
|
if (!isStock) return;
|
||||||
|
const {
|
||||||
|
id
|
||||||
|
} = e.currentTarget.dataset;
|
||||||
|
const specId = e.currentTarget.dataset.specid;
|
||||||
|
const hasStock = e.currentTarget.dataset.hasstock;
|
||||||
|
if (!hasStock) {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
selector: '#t-toast',
|
||||||
|
message: '该规格已售罄',
|
||||||
|
icon: '',
|
||||||
|
duration: 1000,
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let {
|
||||||
|
selectedSku
|
||||||
|
} = this;
|
||||||
|
const {
|
||||||
|
specList
|
||||||
|
} = this.properties;
|
||||||
|
selectedSku =
|
||||||
|
selectedSku[specId] === id ? {
|
||||||
|
...this.selectedSku,
|
||||||
|
[specId]: ''
|
||||||
|
} : {
|
||||||
|
...this.selectedSku,
|
||||||
|
[specId]: id
|
||||||
|
};
|
||||||
|
specList.forEach((item) => {
|
||||||
|
item.specValueList.forEach((valuesItem) => {
|
||||||
|
if (item.specId === specId) {
|
||||||
|
valuesItem.isSelected = valuesItem.specValueId === selectedSku[specId];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
this.chooseSpecValueId(id, specId);
|
||||||
|
const isAllSelectedSku = this.isAllSelected(specList, selectedSku);
|
||||||
|
if (!isAllSelectedSku) {
|
||||||
|
this.setData({
|
||||||
|
selectSkuSellsPrice: 0,
|
||||||
|
selectSkuImg: '',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.setData({
|
||||||
|
specList,
|
||||||
|
isAllSelectedSku,
|
||||||
|
});
|
||||||
|
this.selectedSku = selectedSku;
|
||||||
|
this.triggerEvent('change', {
|
||||||
|
specList,
|
||||||
|
selectedSku,
|
||||||
|
isAllSelectedSku,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 判断是否所有的sku都已经选中
|
||||||
|
isAllSelected(skuTree, selectedSku) {
|
||||||
|
const selected = Object.keys(selectedSku).filter((skuKeyStr) => selectedSku[skuKeyStr] !== '');
|
||||||
|
return skuTree.length === selected.length;
|
||||||
|
},
|
||||||
|
|
||||||
|
handlePopupHide() {
|
||||||
|
this.triggerEvent('closeSpecsPopup', {
|
||||||
|
show: false,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
specsConfirm() {
|
||||||
|
const {
|
||||||
|
isStock
|
||||||
|
} = this.properties;
|
||||||
|
if (!isStock) return;
|
||||||
|
this.triggerEvent('specsConfirm');
|
||||||
|
},
|
||||||
|
|
||||||
|
addCart() {
|
||||||
|
const {
|
||||||
|
isStock
|
||||||
|
} = this.properties;
|
||||||
|
if (!isStock) return;
|
||||||
|
this.triggerEvent('addCart');
|
||||||
|
},
|
||||||
|
|
||||||
|
// buyNow() {
|
||||||
|
// const { isAllSelectedSku } = this.data;
|
||||||
|
// const { isStock } = this.properties;
|
||||||
|
// if (!isStock) return;
|
||||||
|
// this.triggerEvent('buyNow', {
|
||||||
|
// isAllSelectedSku,
|
||||||
|
// });
|
||||||
|
// },
|
||||||
|
|
||||||
|
// 总处理
|
||||||
|
setBuyNum(buyNum) {
|
||||||
|
this.setData({
|
||||||
|
buyNum,
|
||||||
|
});
|
||||||
|
this.triggerEvent('changeNum', {
|
||||||
|
buyNum,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
handleBuyNumChange(e) {
|
||||||
|
const {
|
||||||
|
value
|
||||||
|
} = e.detail;
|
||||||
|
this.setData({
|
||||||
|
buyNum: value,
|
||||||
|
});
|
||||||
|
this.setBuyNum(value)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
10
components/specs-popup/index.json
Normal file
10
components/specs-popup/index.json
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
{
|
||||||
|
"component": true,
|
||||||
|
"usingComponents": {
|
||||||
|
"t-popup": "tdesign-miniprogram/popup/popup",
|
||||||
|
"t-icon": "tdesign-miniprogram/icon/icon",
|
||||||
|
"t-image": "/components/webp-image/index",
|
||||||
|
"t-stepper": "tdesign-miniprogram/stepper/stepper",
|
||||||
|
"t-toast": "tdesign-miniprogram/toast/toast"
|
||||||
|
}
|
||||||
|
}
|
||||||
65
components/specs-popup/index.wxml
Normal file
65
components/specs-popup/index.wxml
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
<t-popup visible="{{show}}" placement="bottom" bind:visible-change="handlePopupHide">
|
||||||
|
<view class="popup-container">
|
||||||
|
<view class="popup-close" bindtap="handlePopupHide">
|
||||||
|
<t-icon name="close" size="36rpx" />
|
||||||
|
</view>
|
||||||
|
<view class="popup-sku-header">
|
||||||
|
<!-- <t-image t-class="popup-sku-header__img" src="{{src}}" /> -->
|
||||||
|
<image class="popup-sku-header__img" src="{{src}}" mode="aspectFill" />
|
||||||
|
<view class="popup-sku-header__goods-info">
|
||||||
|
<view class="popup-sku__goods-name">{{title}}</view>
|
||||||
|
<view class="goods-price-container">
|
||||||
|
<slot name="goods-price" />
|
||||||
|
</view>
|
||||||
|
<view class="goods-inventory">库存 {{ limitMaxCount != 0 ? limitMaxCount : quantity }} 件</view>
|
||||||
|
<!-- 已选规格 -->
|
||||||
|
<view class="popup-sku__selected-spec">
|
||||||
|
<view wx:if="{{specList.length != 0}}">选择：</view>
|
||||||
|
<view wx:for="{{specList}}" wx:key="specId">
|
||||||
|
<view class="popup-sku__selected-item" wx:for="{{item.specValueList}}" wx:for-item="selectedItem" wx:if="{{selectedItem.isSelected}}" wx:key="specValueId">
|
||||||
|
{{selectedItem.specValue}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="popup-sku-body">
|
||||||
|
<view class="popup-sku-group-container">
|
||||||
|
<view class="popup-sku-row" wx:for="{{specList}}" wx:key="specId">
|
||||||
|
<view class="popup-sku-row__title">{{item.title}}</view>
|
||||||
|
<block wx:for="{{item.specValueList}}" wx:for-item="valuesItem" wx:for-index="valuesIndex" wx:key="specValueId">
|
||||||
|
<view class="popup-sku-row__item {{valuesItem.isSelected ? 'popup-sku-row__item--active' : ''}} {{!valuesItem.hasStockObj.hasStock || !isStock ? 'disabled-sku-selected' : ''}}" data-specid="{{item.specId}}" data-id="{{valuesItem.specValueId}}" data-val="{{valuesItem.specValue}}" data-hasStock="{{valuesItem.hasStockObj.hasStock}}" bindtap="toChooseItem">
|
||||||
|
{{valuesItem.specValue}}
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="popup-sku-stepper-stock">
|
||||||
|
<view class="popup-sku-stepper-container">
|
||||||
|
<view class="popup-sku__stepper-title">
|
||||||
|
购买数量
|
||||||
|
<view class="limit-text" wx:if="{{limitBuyInfo}}"> ({{limitBuyInfo}}) </view>
|
||||||
|
</view>
|
||||||
|
<t-stepper value="{{buyNum}}" min="{{1}}" max="{{limitMaxCount}}" theme="filled" bind:change="handleBuyNumChange" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view wx:if="{{outOperateStatus}}" class="single-confirm-btn {{!isStock ? 'disabled' : ''}}" bindtap="specsConfirm">
|
||||||
|
确定
|
||||||
|
</view>
|
||||||
|
<view class="popup-sku-actions flex flex-between {{!isStock ? 'popup-sku-disabled' : ''}}" wx:if="{{!outOperateStatus}}">
|
||||||
|
<view class="sku-operate">
|
||||||
|
<view class="selected-sku-btn sku-operate-addCart {{!isStock ? 'disabled' : ''}}" bindtap="addCart">
|
||||||
|
加入购物车
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="sku-operate">
|
||||||
|
<view class="selected-sku-btn sku-operate-buyNow {{!isStock ? 'disabled' : ''}}" bindtap="buyNow">
|
||||||
|
立即购买
|
||||||
|
</view>
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
<slot name="bottomSlot" />
|
||||||
|
</view>
|
||||||
|
</t-popup>
|
||||||
|
<t-toast id="t-toast" />
|
||||||
250
components/specs-popup/index.wxss
Normal file
250
components/specs-popup/index.wxss
Normal file
@ -0,0 +1,250 @@
|
|||||||
|
.popup-container {
|
||||||
|
background-color: #ffffff;
|
||||||
|
position: relative;
|
||||||
|
z-index: 100;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-container .popup-close {
|
||||||
|
position: absolute;
|
||||||
|
right: 30rpx;
|
||||||
|
top: 30rpx;
|
||||||
|
z-index: 9;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-header {
|
||||||
|
display: flex;
|
||||||
|
padding: 30rpx 28rpx 0 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-header .popup-sku-header__img {
|
||||||
|
width: 176rpx;
|
||||||
|
height: 176rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
background: #d8d8d8;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-header .popup-sku-header__goods-info {
|
||||||
|
position: relative;
|
||||||
|
width: 500rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-header .popup-sku-header__goods-info .popup-sku__goods-name {
|
||||||
|
font-size: 28rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
white-space: normal;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 430rpx;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-header .popup-sku-header__goods-info .popup-sku__selected-spec {
|
||||||
|
display: flex;
|
||||||
|
color: #333333;
|
||||||
|
font-size: 26rpx;
|
||||||
|
line-height: 36rpx;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-header .popup-sku-header__goods-info .popup-sku__selected-spec .popup-sku__selected-item {
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body {
|
||||||
|
margin: 0 30rpx 40rpx;
|
||||||
|
max-height: 600rpx;
|
||||||
|
overflow-y: scroll;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-group-container .popup-sku-row {
|
||||||
|
padding: 32rpx 0;
|
||||||
|
border-bottom: 1rpx solid #f5f5f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-group-container .popup-sku-row .popup-sku-row__title {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-group-container .popup-sku-row .popup-sku-row__item {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
min-width: 128rpx;
|
||||||
|
height: 56rpx;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
border: 2rpx solid #f5f5f5;
|
||||||
|
margin: 19rpx 26rpx 0 0;
|
||||||
|
padding: 0 16rpx;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-group-container .popup-sku-row .popup-sku-row__item.popup-sku-row__item--active {
|
||||||
|
border: 2rpx solid #1989fa;
|
||||||
|
color: #1989fa;
|
||||||
|
background: rgba(255, 95, 21, 0.04);
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-group-container .popup-sku-row .disabled-sku-selected {
|
||||||
|
background: #f5f5f5 !important;
|
||||||
|
color: #cccccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin: 40rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-sku__stepper-title {
|
||||||
|
display: flex;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-sku__stepper-title .limit-text {
|
||||||
|
margin-left: 10rpx;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row nowrap;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 28px;
|
||||||
|
height: 48rpx;
|
||||||
|
line-height: 62rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .input-btn,
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .input-num-wrap {
|
||||||
|
position: relative;
|
||||||
|
height: 100%;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .input-num-wrap {
|
||||||
|
color: #282828;
|
||||||
|
display: flex;
|
||||||
|
max-width: 76rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .input-num-wrap .input-num {
|
||||||
|
height: 100%;
|
||||||
|
width: auto;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .input-btn {
|
||||||
|
width: 48rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .popup-stepper__minus {
|
||||||
|
margin-right: 4rpx;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
color: #9a979b;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .popup-stepper__plus {
|
||||||
|
margin-left: 4rpx;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
color: #9a979b;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .popup-stepper__plus::after {
|
||||||
|
width: 24rpx;
|
||||||
|
height: 3rpx;
|
||||||
|
background-color: #999999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-body .popup-sku-stepper-stock .popup-sku-stepper-container .popup-stepper .popup-stepper__plus::before {
|
||||||
|
width: 3rpx;
|
||||||
|
height: 24rpx;
|
||||||
|
background-color: #999999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions {
|
||||||
|
font-size: 32rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 80rpx;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions .sku-operate {
|
||||||
|
height: 80rpx;
|
||||||
|
width: 100%;
|
||||||
|
/* color: #1989fa; */
|
||||||
|
border-radius: 48rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions .sku-operate .sku-operate-addCart {
|
||||||
|
background-color: #1989fa;
|
||||||
|
color: #f8f8f8;
|
||||||
|
border-radius: 48rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions .sku-operate .sku-operate-addCart.disabled {
|
||||||
|
background: rgb(221, 221, 221);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions .sku-operate .sku-operate-buyNow {
|
||||||
|
background-color: #1989fa;
|
||||||
|
border-radius: 0 48rpx 48rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions .sku-operate .sku-operate-buyNow.disabled {
|
||||||
|
color: #fff;
|
||||||
|
background: rgb(198, 198, 198);
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-sku-actions .sku-operate .selected-sku-btn {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-container .single-confirm-btn {
|
||||||
|
border-radius: 48rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
margin: 0 32rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 88rpx;
|
||||||
|
background-color: #1989fa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-container .single-confirm-btn.disabled {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #fff;
|
||||||
|
background-color: #dddddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-inventory {
|
||||||
|
color: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
.t-toast__content {
|
||||||
|
z-index: 12000 !important;
|
||||||
|
}
|
||||||
@ -197,7 +197,7 @@ Page({
|
|||||||
});
|
});
|
||||||
this.selectSpecsName(selectedSkuValues.length > 0 ? selectedAttrStr : '');
|
this.selectSpecsName(selectedSkuValues.length > 0 ? selectedAttrStr : '');
|
||||||
if (skuItem) {
|
if (skuItem) {
|
||||||
console.log(skuItem[0],'选中的item');
|
console.log(skuItem[0], '选中的item');
|
||||||
this.setData({
|
this.setData({
|
||||||
selectedSkuId: skuItem[0]?.skuId,
|
selectedSkuId: skuItem[0]?.skuId,
|
||||||
selectItem: skuItem,
|
selectItem: skuItem,
|
||||||
@ -221,7 +221,7 @@ Page({
|
|||||||
getSelectedSkuValues(skuTree, selectedSku) {
|
getSelectedSkuValues(skuTree, selectedSku) {
|
||||||
const normalizedTree = this.normalizeSkuTree(skuTree);
|
const normalizedTree = this.normalizeSkuTree(skuTree);
|
||||||
return Object.keys(selectedSku).reduce((selectedValues, skuKeyStr) => {
|
return Object.keys(selectedSku).reduce((selectedValues, skuKeyStr) => {
|
||||||
console.log(selectedSku,'sku啊');
|
console.log(selectedSku, 'sku啊');
|
||||||
const skuValues = normalizedTree[skuKeyStr];
|
const skuValues = normalizedTree[skuKeyStr];
|
||||||
const skuValueId = selectedSku[skuKeyStr];
|
const skuValueId = selectedSku[skuKeyStr];
|
||||||
if (skuValueId !== '') {
|
if (skuValueId !== '') {
|
||||||
@ -275,13 +275,12 @@ Page({
|
|||||||
duration: 1000,
|
duration: 1000,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
} else {
|
||||||
else{
|
|
||||||
this.addCartFun()
|
this.addCartFun()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
addCartFun(){
|
addCartFun() {
|
||||||
const {
|
const {
|
||||||
isAllSelectedSku,
|
isAllSelectedSku,
|
||||||
buyNum,
|
buyNum,
|
||||||
@ -359,7 +358,7 @@ Page({
|
|||||||
thumb: this.data.details.primaryImage,
|
thumb: this.data.details.primaryImage,
|
||||||
title: this.data.details.title,
|
title: this.data.details.title,
|
||||||
};
|
};
|
||||||
console.log(query,'从立刻购买来的');
|
console.log(query, '从立刻购买来的');
|
||||||
let urlQueryStr = obj2Params({
|
let urlQueryStr = obj2Params({
|
||||||
goodsRequestList: JSON.stringify([query]),
|
goodsRequestList: JSON.stringify([query]),
|
||||||
});
|
});
|
||||||
|
|||||||
@ -38,7 +38,11 @@ Page({
|
|||||||
swiperImageProps: {
|
swiperImageProps: {
|
||||||
mode: 'scaleToFill',
|
mode: 'scaleToFill',
|
||||||
},
|
},
|
||||||
categoryGuid: 0
|
categoryGuid: 0,
|
||||||
|
// 加入购物车
|
||||||
|
buyType: 0,
|
||||||
|
outOperateStatus: false, // 是否外层加入购物车
|
||||||
|
isSpuSelectPopupShow: false,
|
||||||
},
|
},
|
||||||
|
|
||||||
goodListPagination: {
|
goodListPagination: {
|
||||||
@ -104,20 +108,20 @@ Page({
|
|||||||
});
|
});
|
||||||
this.loadGoodsList(true);
|
this.loadGoodsList(true);
|
||||||
});
|
});
|
||||||
// 获取公告列表
|
// 获取公告列表
|
||||||
getNoticeList().then((res) => {
|
getNoticeList().then((res) => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
const _noticeData = res.data.map((v) => {
|
const _noticeData = res.data.map((v) => {
|
||||||
return {
|
return {
|
||||||
...v,
|
...v,
|
||||||
visible: true
|
visible: true
|
||||||
};
|
};
|
||||||
});
|
|
||||||
this.setData({
|
|
||||||
noticeList: _noticeData,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
this.setData({
|
||||||
|
noticeList: _noticeData,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
tabChangeHandle(e) {
|
tabChangeHandle(e) {
|
||||||
@ -183,11 +187,13 @@ Page({
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
goodListAddCartHandle() {
|
// 加入购物车
|
||||||
Toast({
|
goodListAddCartHandle(type) {
|
||||||
context: this,
|
console.log(type);
|
||||||
selector: '#t-toast',
|
this.setData({
|
||||||
message: '点击加入购物车',
|
buyType: 0,
|
||||||
|
outOperateStatus: 1,
|
||||||
|
isSpuSelectPopupShow: true,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@ -19,12 +19,12 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="notice-container ">
|
<view class="notice-container ">
|
||||||
<view wx:for="{{noticeList}}">
|
<view wx:for="{{noticeList}}">
|
||||||
<t-notice-bar class="notice-bar" visible="{{item.visible}}" prefixIcon="null" marquee="{{marquee}}" content="{{item.noticeContent}}" suffixIcon="close" bind:click="closeNotice">
|
<t-notice-bar class="notice-bar" visible="{{item.visible}}" prefixIcon="null" marquee="{{marquee}}" content="{{item.noticeContent}}">
|
||||||
<view slot="prefix-icon" class="notice-title">{{item.noticeTitle}}</view>
|
<view slot="prefix-icon" class="notice-title">{{item.noticeTitle}}</view>
|
||||||
</t-notice-bar>
|
</t-notice-bar>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<goods-list wr-class="goods-list-container" goodsList="{{goodsList}}" bind:click="goodListClickHandle" bind:addcart="goodListAddCartHandle" />
|
<goods-list wr-class="goods-list-container" goodsList="{{goodsList}}" bind:click="goodListClickHandle" bind:addcart="goodListAddCartHandle" />
|
||||||
<load-more list-is-empty="{{!goodsList.length}}" status="{{goodsListLoadStatus}}" bind:retry="onReTry" />
|
<load-more list-is-empty="{{!goodsList.length}}" status="{{goodsListLoadStatus}}" bind:retry="onReTry" />
|
||||||
<t-toast id="t-toast" />
|
|
||||||
</view>
|
</view>
|
||||||
|
<t-toast id="t-toast" />
|
||||||
Loading…
Reference in New Issue
Block a user