完善小程序

This commit is contained in:
wwz
2025-03-18 18:29:34 +08:00
parent fc957feb72
commit 9da31e2faa
19 changed files with 594 additions and 352 deletions

View File

@@ -257,54 +257,58 @@
</view>
<!-- 规格 -->
<up-popup :show="showShopsku" :round="20" mode="bottom" @close="showShopsku = false;pagemetashow=false"
:safeAreaInsetBottom='false'>
<view class="shop_sku" style="max-height:70vh;">
<view class="positionabsolute">
<up-icon name="close-circle" @click="showShopsku = false;pagemetashow=false" color="#000"
size="25"></up-icon>
</view>
<up-swiper :list="specifications.item.images" height="250"></up-swiper>
<view class="shop_sku_name"> {{specifications.item.name}} </view>
<view class="shop_sku_description"> {{specifications.item.shortTitle?specifications.item.shortTitle:''}}
</view>
<view v-if="specifications.item.type != 'package'">
<view class="shop_sku_box" v-for="(specOptions,specType) in specifications.item.selectSpecInfo"
:key="specType">
<view class="shop_sku_box_name">
{{specType }}
</view>
<view class="flex-start">
<view class="shop_sku_box_item" v-for="option in specOptions" :key="option"
@click="selectSpec(specType, option)"
:class="{ shop_sku_box_item_selected: selectedSpecs[specType] === option }">
{{option}}
<view class="shop_sku_box_item_tip" v-if="specifications.item.isPauseSale == 1">
<view>售罄</view>
<up-popup :show="showShopsku" :round="20" mode="bottom" @close="showShopsku = false,pagemetashow = false">
<view class="shop_sku">
<scroll-view scroll-y style="max-height:60vh;width: 100%;">
<view class="positionabsolute">
<up-icon name="close-circle" @click="showShopsku = false;pagemetashow=false" color="#000"
size="25"></up-icon>
</view>
<up-swiper :list="specifications.item.images" height="250"></up-swiper>
<view class="shop_sku_name"> {{specifications.item.name}} </view>
<view class="shop_sku_description">
{{specifications.item.shortTitle?specifications.item.shortTitle:''}}
</view>
<view v-if="specifications.item.type != 'package'">
<view class="shop_sku_box" v-for="(specOptions,specType) in specifications.item.selectSpecInfo"
:key="specType">
<view class="shop_sku_box_name">
{{specType }}
</view>
<view class="flex-start">
<view class="shop_sku_box_item" v-for="option in specOptions" :key="option"
@click="selectSpec(specType, option)"
:class="{ shop_sku_box_item_selected: selectedSpecs[specType] === option }">
{{option}}
<view class="shop_sku_box_item_tip" v-if="specifications.item.isPauseSale == 1">
<view>售罄</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 套餐 -->
<view v-else>
<view class="shop_sku_box">
<view class="shop_sku_box_name">
{{specifications.groupSnap.count }} {{specifications.groupSnap.number }}
</view>
<view class="flex-start">
<view class="shop_sku_box_item" v-for="(option,goodsid) in specifications.groupSnap.goods"
:key="goodsid" @click="goodsidClick(option, goodsid)"
:class="{ shop_sku_box_item_selected: isOptionSelected(option)}"
:disabled="isMaxSelected() &&!isOptionSelected(option)">
{{option.proName}}/{{option.skuName}}
<view class="shop_sku_box_item_tip" v-if="specifications.item.isPauseSale == 1">
<view>售罄</view>
<!-- 套餐 -->
<view v-else>
<view class="shop_sku_box">
<view v-for="(setmenu, setmenuindex) in specifications.item.groupSnap" :key='setmenuindex'>
<view class="shop_sku_box_name">
{{setmenu.title}} {{setmenu.count }} {{setmenu.number }}
</view>
<view class="flex-start">
<view class="shop_sku_box_item" v-for="(option, goodsid) in setmenu.goods"
:key="goodsid" @click="goodsidClick(setmenuindex, option, goodsid)"
:class="{ shop_sku_box_item_selected: isOptionSelected(setmenuindex, option)}"
:disabled="isMaxSelected(setmenuindex) &&!isOptionSelected(setmenuindex, option)">
{{option.proName}}/{{option.unitName}}
<view class="shop_sku_box_item_tip" v-if="specifications.item.isPauseSale == 1">
<view>售罄</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
<view class="shop_bottom">
<view class="flex-between">
<view class="price">
@@ -330,7 +334,11 @@
<view class="shop_skuselect flex-start" v-if="selectedSpecsStr">
<view class="shop_skuselectname">{{selectedSpecsStr }}</view>
</view>
<view class="addShopping" :class="(shopCartNumber>0&&canSubmit)?'active':''"
<view v-if="specifications.item.type == 'package'" class="addShopping"
:class="shopCartNumber>0&&allConditionsSatisfied?'active':''" @click="submitSelection()">
{{skuBtnText}}
</view>
<view v-else class="addShopping" :class="shopCartNumber>0&&canSubmit?'active':''"
@click="submitSelection()">
{{skuBtnText}}
</view>
@@ -556,9 +564,9 @@
uni.$u.debounce(navScroll.value = res.scrollTop, 500)
uni.$u.debounce(mainScroll(res), 500)
if (res.scrollTop >= 44) {
store.showSearch = true
// store.showSearch = true
} else {
store.showSearch = false
// store.showSearch = false
}
});
@@ -573,7 +581,10 @@
type: '',
product_id: '',
sku_id: '',
groupSnap: {}
groupSnap: {},
item: {
groupSnap: []
}
})
// 用于判断接口数据是否加载完成
const isDataLoaded = ref(false);
@@ -628,35 +639,71 @@
};
// 存储选中的选项
const selectedOptions = ref([]);
// 选择规格的方法
const goodsidClick = (option, goodsid) => {
if (isOptionSelected(option)) {
// 监听 specifications 的变化
watch(
() => specifications.item.groupSnap,
(newGroupSnap) => {
if (Array.isArray(newGroupSnap)) {
selectedOptions.value = newGroupSnap.map(() => []);
}
}
);
// 存储选中的选项,二维数组
const selectedOptions = ref(
specifications.item.groupSnap.map(() => [])
);
// / 选择规格的方法
const goodsidClick = (setmenuindex, option, goodsid) => {
if (!selectedOptions.value[setmenuindex]) {
// 如果 selectedOptions.value[setmenuindex] 不存在,初始化一个空数组
selectedOptions.value[setmenuindex] = [];
}
if (isOptionSelected(setmenuindex, option)) {
// 如果已经选中,取消选中
selectedOptions.value = selectedOptions.value.filter(item => item.proId !== option.proId);
} else if (!isMaxSelected()) {
selectedOptions.value[setmenuindex] = selectedOptions.value[setmenuindex].filter(item => item.proId !==
option.proId);
} else if (!isMaxSelected(setmenuindex)) {
// 如果未达到最大选择数量,添加到选中列表
selectedOptions.value.push(option);
selectedOptions.value[setmenuindex].push(option);
}
};
// 判断选项是否已选中
const isOptionSelected = (option) => {
return selectedOptions.value.some(item => item.proId == option.proId);
const isOptionSelected = (setmenuindex, option) => {
// 确保 selectedOptions.value[setmenuindex] 存在
if (selectedOptions.value[setmenuindex]) {
return selectedOptions.value[setmenuindex].some(item => item.proId === option.proId);
}
return false;
};
// 判断是否达到最大选择数量
const isMaxSelected = () => {
// 初始他为可点击
if (selectedOptions.value.length >= specifications.groupSnap.number) {
canSubmit.value = true;
} else {
canSubmit.value = false;
const isMaxSelected = (setmenuindex) => {
// 确保 selectedOptions.value[setmenuindex] 存在
if (selectedOptions.value[setmenuindex]) {
return selectedOptions.value[setmenuindex].length >= specifications.item.groupSnap[setmenuindex]
.number;
}
return selectedOptions.value.length >= specifications.groupSnap.number;
return false;
};
// 计算所有选中条件是否都符合
const allConditionsSatisfied = computed(() => {
return specifications.item.groupSnap.every((setmenu, index) => {
const selected = selectedOptions.value[index] || [];
// 检查是否达到最大选择数量
const hasEnoughSelection = selected.length === setmenu.number;
return hasEnoughSelection;
});
});
// 提交选择,套餐选中最后处理的数据
const selectedGroupSnap = ref([]);
// 计算属性,将 selectedSpecs 转换为字符串形式
const selectedSpecsStr = computed(() => {
const values = Object.values(selectedSpecs.value);
@@ -675,25 +722,66 @@
}
}
// 套餐比较两个对象是否相等
function isObjectEqual(obj1, obj2) {
if (typeof obj1 !== 'object' || obj1 === null || typeof obj2 !== 'object' || obj2 === null) {
return obj1 === obj2;
}
const keys1 = Object.keys(obj1);
const keys2 = Object.keys(obj2);
if (keys1.length !== keys2.length) {
return false;
}
for (const key of keys1) {
if (Array.isArray(obj1[key]) && Array.isArray(obj2[key])) {
if (!isArrayEqual(obj1[key], obj2[key])) {
return false;
}
} else if (!isObjectEqual(obj1[key], obj2[key])) {
return false;
}
}
return true;
}
// 比较两个数组是否相等(忽略顺序)
function isArrayEqual(arr1, arr2) {
if (arr1.length !== arr2.length) {
return false;
}
const usedIndices = new Array(arr2.length).fill(false);
for (const item1 of arr1) {
let found = false;
for (let i = 0; i < arr2.length; i++) {
if (!usedIndices[i] && isObjectEqual(item1, arr2[i])) {
usedIndices[i] = true;
found = true;
break;
}
}
if (!found) {
return false;
}
}
return true;
}
// 根据购物车的数据匹配选中的商品查找是否有匹配的数组
const matchingProduct = async (data) => {
console.log(specifications, matchedProducts.value, selectedOptions.value, '11111')
return matchedProducts.value.find((product, index) => {
if (data.type == 'package') {
if (specifications.type == 'package') {
// 套餐
let result = [];
if (product.type == "package") {
JSON.parse(product.cartListinfo.pro_group_info).goods.forEach(item1 => {
selectedOptions.value.forEach(item2 => {
if (item1.proId === item2.proId && item1.skuId === item2
.skuId) {
result.push(item1);
}
});
});
let result = false;
try {
if (product.type == "package") {
let res = JSON.parse(product.cartListinfo.pro_group_info);
result = isArrayEqual(res, selectedGroupSnap.value);
}
} catch (error) {
//TODO handle the exception
}
return result.length > 0 ? result : false;
// 直接返回布尔值
return result;
} else if (specifications.item.type == 'sku') {
// 多规格
return product.skuId == data.id && product.id == data.productId
@@ -704,23 +792,38 @@
});
}
// 提交选择并执行下一步操作的方法
const submitSelection = async () => {
if (shopCartNumber.value > 0 && canSubmit.value) {
// 是否是套餐package
let res = await matchingProduct(specifications.item.type == "package" ? specifications.item :
specifications.item.result)
console.log(res)
if (shopCartNumber.value > 0) {
let res = null
if (specifications.item.type == "package") {
if (!allConditionsSatisfied.value) {
return false
}
// 是否是套餐package
selectedGroupSnap.value = specifications.item.groupSnap.map((setmenu, index) => {
return {
...setmenu,
goods: selectedOptions.value[index]
};
});
res = await matchingProduct(selectedGroupSnap.value)
} else {
if (!canSubmit.value) {
return false
}
res = await matchingProduct(specifications.item.result)
}
if (res) {
await calculateValue(res.cartNumber, '+', shopCartNumber.value)
}
// 是否是套餐 有就传
if (specifications.item.type == "package") {
specifications.groupSnap.goods = selectedOptions.value
} else {
specifications.groupSnap = null
if (specifications.item.type != "package") {
selectedGroupSnap.value = []
}
console.log(specifications.groupSnap, 'specifications.groupSnap.goods')
websocketsendMessage({
id: res ? res.cartListId : '',
type: 'shopping',
@@ -731,10 +834,12 @@
sku_id: specifications.sku_id,
number: res ? await calculateValue(res.cartNumber, '+', shopCartNumber.value) :
shopCartNumber.value,
pro_group_info: specifications.groupSnap,
goods_type: specifications.item.type == "package" ? 'package' : ''
pro_group_info: selectedGroupSnap.value,
goods_type: specifications.item.type == "package" ? 'package' : '',
is_print: 1
})
// 清空有无无清空套餐
// 清空套餐选中
selectedGroupSnap.value = []
showShopsku.value = false
}
@@ -742,6 +847,9 @@
//获取多规格数据
const clickspecifications = async (item, index, indexs, type) => {
if (item.isSoldStock == 1 || item.isSaleTime == 0) {
return false;
}
// 数量清零
shopCartNumber.value = 0
// 初始化
@@ -763,7 +871,6 @@
selectedOptions.value = []
specifications.product_id = res.id
specifications.sku_id = item.skuId
specifications.groupSnap = res.groupSnap[0]
}
// 购物车是否有商品
specifications.type = res.type
@@ -779,13 +886,6 @@
const singleclick = async (item, i) => {
// 判断购物车是否有该选中商品
let res = await matchingProduct(item)
// 是否是套餐 有就传
console.log(specifications, '单规格')
if (specifications.item.type == "package") {
specifications.groupSnap.goods = selectedOptions.value
} else {
specifications.groupSnap = null
}
websocketsendMessage({
id: res ? item.cartListId : '',
type: 'shopping',
@@ -794,10 +894,8 @@
operate_type: await calculateValue(item.cartNumber, i) == 'del' ? 'del' : res ? 'edit' : 'add',
product_id: item.id,
sku_id: item.skuId,
number: await calculateValue(item.cartNumber, i)
// pro_group_info: specifications.groupSnap,
// goods_type: specifications.item.type == "package" ? 'package' : ''
// pro_group_info: specifications.groupSnap
number: await calculateValue(item.cartNumber, i),
is_print: 1
})
}
@@ -900,30 +998,30 @@
return false
}
// 检查消息是否已经处理过
if (processedMessageIds.has(Message.msg_id)) {
return;
}
processedMessageIds.add(Message.msg_id);
// 初始化
if (Message.operate_type == "shopping_init") {
if (Message.operate_type == "init") {
cartList.value = Message.data
}
// 清空购物车
if (Message.operate_type == 'shopping_cleanup') {
if (Message.operate_type == 'cleanup') {
cartList.value = []
showCart.value = false
}
// 初始化购物车数据
if (Message.operate_type == "shopping_init") {
cartList.value = Message.data
}
// 删除除购物车
if (Message.operate_type == 'shopping_del' && Message.status == 1) {
if (Message.operate_type == 'del' && Message.status == 1) {
cartList.value = cartList.value.filter(item => item.id != Message.data.id);
}
// 添加或者减少购物后返回
if (Message.operate_type == 'shopping_add' || Message.operate_type == 'sopping_edit' || Message
.type == 'bc') {
if (Message.operate_type == 'add' || Message.operate_type == 'edit') {
[Message.data].forEach((objA) => {
const index = cartList.value.findIndex((objB) => objB.id == objA.id);
if (index !== -1) {
@@ -935,8 +1033,8 @@
}
// 购物车数据更新从新请求
if (Message.type == 'product') {
cartList.value = []
if (Message.type == 'product' && Message.data_type == 'product_update' && Message
.operate_type == 'product_update') {
isDataLoaded.value = false;
productqueryProduct()
}
@@ -947,12 +1045,6 @@
msg_id: Message.msg_id
})
// 检查消息是否已经处理过
if (processedMessageIds.has(Message.msg_id)) {
return;
}
processedMessageIds.add(Message.msg_id);
// 初始化商品数量
await updateProductQuantities()
@@ -975,7 +1067,7 @@
Specialstop = shopProductList.productInfo
//TODO handle the exception
}
return cartList.value.map((cartItem) => {
return cartList.value.flatMap((cartItem) => {
for (const group of Specialstop) {
for (const product of group.productList) {
if (product.id == cartItem.product_id) {
@@ -990,6 +1082,59 @@
}
}
}
if (cartItem.is_temporary === 1) {
return [{
// cartListId: 5309
// cartListinfo: Proxy {id: 5309, shop_id: 203, table_code: "40309814459", sku_id: 2863, product_id: 1273, …}
// cartNumber: "2.00"
// coverImg: "https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/490de935cc9042bfa56d0c392f806484.jpg"
// groupType: null
// id: "1273"
// isHot: 1
// isSaleTime: 1
// isSoldStock: 0
// memberPrice: 0.88
// name: "连衣裙"
// originPrice: 0.88
// packFee: 0
// salePrice: 2.88
// skuId: "2863"
// skuList: Proxy {0: {…}}
// stockNumber: 0
// suitNum: 1
// type: "single"
// unitName: "个"
// cartListId: 5324
// cartListinfo: Proxy {id: 5324, shop_id: 203, table_code: "40309814459", sku_id: 0, product_id: -74982031, …}
// cartNumber: "25.00"
// create_time: "2025-03-18 15:05:37"
// discount_sale_amount: "357.00"
// discount_sale_note: ""
// id: 5324
// is_gift: 0
// is_print: 0
// is_temporary: 1
// is_wait_call: 0
// number: "25.00"
// pack_number: "0.00"
// pro_group_info: ""
// product_id: -74982031
// product_name: "零食吃"
// remark: ""
// shop_id: 203
// sku_id: 0
// sku_name: "VB宝贝"
// table_code: "40309814459"
// update_time: null
...cartItem,
memberPrice: cartItem.discount_sale_amount,
salePrice: cartItem.discount_sale_amount,
cartListinfo: cartItem,
cartListId: cartItem.id, // 购物车id
cartNumber: cartItem.number // 增加一个数量算法
}];
}
// 如果没找到匹配的商品,返回 null 或者其他默认值,这里返回 null
return null;
}).filter(item => item !== null);
@@ -1111,27 +1256,33 @@
shopProductList.hots = await productminiApphotsquery()
shopProductList.productInfo = await APIgroupquery()
} catch (error) {}
// 如果商品报错就返回上一页
if (!shopProductList.productInfo || !shopProductList.hots) {
uni.navigateBack()
if (shopProductList.productInfo.length > 0 || shopProductList.hots.length > 0) {
//TODO handle the exception
//第一步:将所有商品的 cartNumber 初始化为 0
shopProductList.productInfo.forEach((group) => {
group.productList.forEach((product) => {
product.cartNumber = 0;
});
});
shopProductList.hots.forEach((i) => {
i.cartNumber = 0
})
scrollTopSize.value = 0
topArr.value = []
// userStore.actionsAPIuser()
// 数据可以更新
isDataLoaded.value = true;
} else {
uni.showToast({
title: '错误二维码'
});
isDataLoaded.value = false;
setTimeout(() => {
uni.navigateBack()
}, 1000)
return false;
}
//TODO handle the exception
//第一步:将所有商品的 cartNumber 初始化为 0
shopProductList.productInfo.forEach((group) => {
group.productList.forEach((product) => {
product.cartNumber = 0;
});
});
shopProductList.hots.forEach((i) => {
i.cartNumber = 0
})
scrollTopSize.value = 0
topArr.value = []
// userStore.actionsAPIuser()
// 数据可以更新
isDataLoaded.value = true;
}
@@ -1157,18 +1308,18 @@
// 获取页面参数
const options = currentPage.options;
// #ifdef MP-WEIXIN
if (options.q) {
console.log(options.q)
const store = productStore();
await store.scanCodeactions(options.q)
}
// #endif
// #ifdef MP-ALIPAY
if (getApp().globalData.tableCode) {
await store.scanCodeactions(getApp().globalData.tableCode)
}
// #endif
// // #ifdef MP-WEIXIN
// if (options.q) {
// console.log(options.q)
// const store = productStore();
// await store.scanCodeactions(options.q)
// }
// // #endif
// // #ifdef MP-ALIPAY
// if (getApp().globalData.tableCode) {
// await store.scanCodeactions(getApp().globalData.tableCode)
// }
// // #endif
await productqueryProduct()
setTimeout(() => {
@@ -1732,21 +1883,16 @@
position: relative;
border-radius: 20rpx;
background: #fff;
overflow-y: auto;
padding-bottom: 320rpx;
box-sizing: border-box;
padding-bottom: 250rpx;
.positionabsolute {
position: absolute;
top: 30rpx;
z-index: 999;
right: 30rpx;
}
.shop_skucimage {
width: 100%;
height: 500rpx !important;
border-radius: 20rpx 20rpx 0 0;
}
.shop_sku_name {
padding: 0 28rpx;
@@ -1776,7 +1922,7 @@
.shop_sku_box {
padding: 0 28rpx;
padding: 20rpx 28rpx;
.shop_sku_box_name {
margin-top: 20rpx;
@@ -1800,7 +1946,6 @@
.shop_sku_box_item_tip {
width: 62rpx;
height: 47rpx;
// background-color: #CECECE;
text-align: right;
position: absolute;
top: 0;