完成首页花馍模块

This commit is contained in:
赵毅 2025-09-24 11:23:32 +08:00
parent da59430dd9
commit cc7215d836
5 changed files with 74 additions and 143 deletions

View File

@ -21,4 +21,7 @@ export const apiArr = {
goodsSearch: '/api/v2/wechat/commodity/search', // 商品搜索 goodsSearch: '/api/v2/wechat/commodity/search', // 商品搜索
cancelPay: '/api/v2/wechat/commodity/order/cancel_pay', // 用户取消支付 cancelPay: '/api/v2/wechat/commodity/order/cancel_pay', // 用户取消支付
adverGoodsList: '/api/v2/wechat/commodity/adver-goods-list', // 广告货品列表
} }

View File

@ -4,88 +4,27 @@
<view class="goods-list"> <view class="goods-list">
<!-- 商品项 --> <!-- 商品项 -->
<view v-for="(item, index) in goodsList" :key="index"> <view v-for="(item, index) in goodsList" :key="index">
<!-- 有多个货品 --> <view>
<view class="goods-item" v-if="item.group_buy_goods_list.length > 1">
<view class="goods-image">
<image :src="item.commodity_pic" mode="aspectFill"></image>
</view>
<view class="goods-info">
<view class="goods-name">{{ item.commodity_name }}</view>
<view class="goods-desc">{{ item.commodity_intro }}</view>
<view class="goods-price"> {{ getPriceRange(item.group_buy_goods_list) }} </view>
<!-- 选择规格标签 -->
<view class="specification-tag" @click.stop="toggleSkuList(index)">
<text>{{ item.showSkuList ? '收起' : '选择规格' }}</text>
<u-icon name="arrow-down" size="26rpx" color="#FF370B" v-if="!item.showSkuList"></u-icon>
<u-icon name="arrow-up" size="26rpx" color="#FF370B" v-else></u-icon>
</view>
<!-- 货品列表 -->
<view class="sku-list" v-if="item.showSkuList">
<view v-for="(sku, skuIndex) in item.group_buy_goods_list" :key="skuIndex">
<view class="sku-item" @click="toDetail(sku)">
<view class="sku-info">
<view class="sku-image">
<image :src="sku.commodity_pic" mode="aspectFill"></image>
</view>
<view class="goods-info">
<view class="goods-name">{{ sku.goods_name }}</view>
<view class="goods-desc">{{ sku.goods_spec }}</view>
</view>
</view>
<view class="price-container">
<view class="sku-price">
<view class="sku-price1">团购价</view>
<view class="sku-price2">{{ sku.group_buy_price }}/{{ sku.goods_unit }}
</view>
</view>
<view class="sku-control">
<view class="decrease-btn" @tap.stop="decreaseQuantity(index, skuIndex)">-
</view>
<view class="quantity">{{ sku.quantity }}</view>
<view class="increase-btn" @tap.stop="increaseQuantity(index, skuIndex)">+
</view>
</view>
</view>
<view class="original-price">单买价 {{ sku.sales_price }}/{{ sku.goods_unit }}</view>
<view class="sku-countdown">
{{
getEndTheCountdown(sku.group_buy_activity_info.end_time)
}}
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 只有一个货品 -->
<view v-else>
<view class="goods-item2" @click="toDetail(item)"> <view class="goods-item2" @click="toDetail(item)">
<view class="goods-image"> <view class="goods-image">
<image :src="item.commodity_pic" mode="aspectFill"></image> <image :src="item.commodity_pic" mode="aspectFill"></image>
</view> </view>
<view class="goods-info"> <view class="goods-info">
<view class="goods-name">{{ item.commodity_name }}</view> <view class="goods-name">{{ item.goods_name }}</view>
<view class="goods-desc">{{ item.commodity_intro }}</view> <view class="goods-desc">{{ item.goods_spec }}</view>
<view class="price-container"> <view class="price-container">
<view class="group-price"> <view class="group-price">
<view class="group-price1">团购</view> <view class="group-price1">活动价</view>
<view class="group-price2">{{ item.group_buy_goods_list[0].group_buy_price }}/{{ <view class="group-price2">{{ item.promotional_price }}/{{ item.goods_unit }}
item.group_buy_goods_list[0].goods_unit }}</view> </view>
</view> </view>
<view class="quantity-control"> <view class="quantity-control">
<view class="decrease-btn" @tap.stop="decreaseQuantity(index, 0)">-</view> <view class="decrease-btn" @tap.stop="decreaseQuantity(index)">-</view>
<view class="quantity">{{ item.group_buy_goods_list[0].quantity }}</view> <view class="quantity">{{ item.quantity }}</view>
<view class="increase-btn" @tap.stop="increaseQuantity(index, 0)">+</view> <view class="increase-btn" @tap.stop="increaseQuantity(index)">+</view>
</view> </view>
</view> </view>
<view class="original-price">单买价 {{ item.group_buy_goods_list[0].sales_price }}/{{ <view class="original-price">零售价 {{ item.retail_price }}/{{ item.goods_unit }}</view>
item.group_buy_goods_list[0].goods_unit }}</view>
<view class="countdown">
{{ getEndTheCountdown(item.group_buy_goods_list[0].group_buy_activity_info.end_time) }}
</view>
</view> </view>
</view> </view>
</view> </view>
@ -155,18 +94,12 @@ export default {
adver_id: this.idVal, adver_id: this.idVal,
} }
return request(shopApi.adverGoodsList, 'POST', params).then(res => { return request(shopApi.adverGoodsList, 'POST', params).then(res => {
const list = res.data.adver_goods_list.map(item => { const list = res.adver_goods_list.map(item => {
// quantity // quantity
const group_buy_goods_list = item.group_buy_goods_list.map(sku => ({
...sku,
commodity_pic: picUrl + sku.commodity_pic,
quantity: 0
}));
return { return {
...item, ...item,
commodity_pic: picUrl + item.commodity_pic, commodity_pic: picUrl + item.goods_pic,
showSkuList: false, quantity: 0
group_buy_goods_list
} }
}) })
this.goodsList = list this.goodsList = list
@ -175,7 +108,7 @@ export default {
}, },
getShopdetail() { getShopdetail() {
const params = { const params = {
is_group_buy: 1, is_adver: 1,
} }
return request(shopApi.getCar, "POST", params).then((res) => { return request(shopApi.getCar, "POST", params).then((res) => {
this.carNum = res.total; this.carNum = res.total;
@ -189,95 +122,82 @@ export default {
if (!this.goodsDetail || !this.goodsList || this.goodsList.length === 0) { if (!this.goodsDetail || !this.goodsList || this.goodsList.length === 0) {
return; return;
} }
// // item
this.goodsList.forEach(goods => { this.goodsList.forEach(goods => {
// //
goods.group_buy_goods_list.forEach(sku => { const matchedItem = this.goodsDetail.find(item => item.goods_id === goods.goods_id);
//
const matchedItem = this.goodsDetail.find(item => item.goods_id === sku.goods_id);
// quantity // quantity
if (matchedItem) { if (matchedItem) {
sku.quantity = matchedItem.count; goods.quantity = matchedItem.count;
} else { } else {
// 0 // 0
sku.quantity = 0; goods.quantity = 0;
} }
}); });
});
}, },
toDetail(itemObj) { toDetail(itemObj) {
const item = { // const item = {
...itemObj, // ...itemObj,
groupById: itemObj.group_buy_activity_info.id // groupById: itemObj.group_buy_activity_info ? itemObj.group_buy_activity_info.id : ''
}; // };
NavgateTo(`/packages/shop/groupPurchaseDetail/index?item=${JSON.stringify(item)}`) // NavgateTo(`/packages/shop/groupPurchaseDetail/index?item=${JSON.stringify(item)}`)
}, },
// //
getPriceRange(goodsList) { increaseQuantity(index) {
if (!goodsList || goodsList.length === 0) return '¥0'; const item = this.goodsList[index]
const prices = goodsList.map(item => Number(item.sales_price)); if (item.quantity == 0) {
const minPrice = Math.min(...prices); item.quantity += item.min_order_quantity || 1
const maxPrice = Math.max(...prices); this.carNum += item.min_order_quantity || 1
return minPrice === maxPrice ? `${minPrice}` : `${minPrice} ~ ¥${maxPrice}`;
},
// /
toggleSkuList(index) {
this.goodsList[index].showSkuList = !this.goodsList[index].showSkuList;
},
//
increaseQuantity(goodsIndex, skuIndex) {
if (this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity == 0) {
this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity += this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].min_order_quantity
this.carNum += this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].min_order_quantity
} else { } else {
if (this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity == this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].total_stock) { if (item.quantity == item.total_stock) {
uni.showToast({ uni.showToast({
title: '库存不足', title: '库存不足',
icon: 'none' icon: 'none'
}); });
return return
} }
if (this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity == this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].max_limit_quantity) { if (item.quantity == item.max_limit_quantity) {
uni.showToast({ uni.showToast({
title: '一次最多购买' + this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].max_limit_quantity + '件', title: '一次最多购买' + item.max_limit_quantity + '件',
icon: 'none' icon: 'none'
}); });
return return
} }
this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity++; item.quantity++;
this.carNum++; this.carNum++;
} }
const params = { const params = {
goods_id_and_count: [ goods_id_and_count: [
{ {
goods_id: this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].id, goods_id: item.goods_id,
count: this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity, count: item.quantity,
}, },
], ],
group_buy_id: this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].group_buy_activity_info.id adver_id: item.adver_id
} }
this.updateCar(params); this.updateCar(params);
}, },
// //
decreaseQuantity(goodsIndex, skuIndex) { decreaseQuantity(index) {
if (this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity > 0) { const item = this.goodsList[index]
if (this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity == this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].min_order_quantity) { if (item.quantity > 0) {
this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity = 0 if (item.quantity == (item.min_order_quantity || 1)) {
item.quantity = 0
this.carNum = 0 this.carNum = 0
} else { } else {
this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity--; item.quantity--;
this.carNum--; this.carNum--;
} }
const params = { const params = {
goods_id_and_count: [ goods_id_and_count: [
{ {
goods_id: this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].id, goods_id: item.goods_id,
count: this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].quantity, count: item.quantity,
}, },
], ],
group_buy_id: this.goodsList[goodsIndex].group_buy_goods_list[skuIndex].group_buy_activity_info.id adver_id: item.adver_id
} }
this.updateCar(params); this.updateCar(params);
} else { } else {
@ -300,9 +220,9 @@ export default {
// //
shopCar() { shopCar() {
const item = { const item = {
is_group_buy: 1, is_adver: 1,
} }
NavgateTo("../shopCar/index?item=" + JSON.stringify(item)); NavgateTo("/packages/shop/shopCar/index?item=" + JSON.stringify(item));
}, },
// //
getEndTheCountdown(endTime) { getEndTheCountdown(endTime) {

View File

@ -338,7 +338,6 @@ export default {
}, },
onLoad(options) { onLoad(options) {
this.carList = JSON.parse(options.shopCarList) this.carList = JSON.parse(options.shopCarList)
console.log("🚀 ~ onLoad ~ JSON.parse(options.shopCarList):", JSON.parse(options.shopCarList))
}, },
onShow() { onShow() {
this.getUserAddress() this.getUserAddress()
@ -425,7 +424,6 @@ export default {
} }
}, },
increaseQuantity(item) { increaseQuantity(item) {
console.log("🚀 ~ increaseQuantity ~ item:", item)
const currentTime = new Date().getTime(); const currentTime = new Date().getTime();
const startTime = new Date(item.commodity_goods_info.group_buy_activity_info?.start_time).getTime(); const startTime = new Date(item.commodity_goods_info.group_buy_activity_info?.start_time).getTime();
const endTime = new Date(item.commodity_goods_info.group_buy_activity_info?.end_time).getTime(); const endTime = new Date(item.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
@ -600,7 +598,8 @@ export default {
// //
const params = { const params = {
user_id: uni.getStorageSync('userId'), user_id: uni.getStorageSync('userId'),
is_group_buy: isGroupBuyValid, // shopCarListisAdvertrue
is_group_buy: this.carList.some(item => item.isAdver === true) ? 3 : (isGroupBuyValid ? 2 : 1),
goods_list: Object.keys(this.supplierGroups).map(supplierId => { goods_list: Object.keys(this.supplierGroups).map(supplierId => {
const group = this.supplierGroups[supplierId]; const group = this.supplierGroups[supplierId];
const firstItem = group[0]; const firstItem = group[0];
@ -662,8 +661,9 @@ export default {
success: (payRes) => { success: (payRes) => {
const params = { const params = {
order_id: orderId, order_id: orderId,
from: 2, from: this.carList.some(item => item.isAdver === true) ? 3 : (isGroupBuyValid ? 2 : 1),
group_buy_activity_id: this.group_buy_activity_id, group_buy_activity_id: this.group_buy_activity_id,
adver_id: this.carList.some(item => item.isAdver === true) ? this.carList.find(item => item.isAdver === true).adver_id : ''
} }
request(apiArr.queryOrder, "POST", params).then(res => { request(apiArr.queryOrder, "POST", params).then(res => {
this.verifyCode = res.verification_code this.verifyCode = res.verification_code

View File

@ -297,8 +297,13 @@ export default {
this.$u.toast("请选择商品"); this.$u.toast("请选择商品");
return; return;
} }
// isAdver=true
const updatedArr = arr.map(item => ({
...item,
isAdver: item.adver_id ? true : ''
}));
// NavgateTo(`../submitOrder/index?shopCarList=${JSON.stringify(arr)}`); // NavgateTo(`../submitOrder/index?shopCarList=${JSON.stringify(arr)}`);
NavgateTo(`../groupPurchaseSubmit/index?shopCarList=${JSON.stringify(arr)}`); NavgateTo(`../groupPurchaseSubmit/index?shopCarList=${JSON.stringify(updatedArr)}`);
}, },
// //

View File

@ -93,7 +93,7 @@
<!-- 广告横幅 --> <!-- 广告横幅 -->
<view class="serverList1"> <view class="serverList1">
<view class="serverList1_left" @click="toAdvertisingView"> <view class="serverList1_left" @click="toAdvertisingView(serverLeftList)">
<image :src="serverLeft" mode="aspectFill" /> <image :src="serverLeft" mode="aspectFill" />
</view> </view>
<view class="serverList1_right"> <view class="serverList1_right">
@ -308,6 +308,7 @@ export default {
// 1广 // 1广
serverLeft: '', serverLeft: '',
serverLeftList: [],
// 1广 // 1广
serverRightList: [], serverRightList: [],
@ -351,8 +352,9 @@ export default {
}, },
// 广 // 广
toAdvertisingView(item) { toAdvertisingView(itemArry) {
NavgateTo('/packages/advertising/index/index') const item = itemArry[0]
NavgateTo('/packages/advertising/index/index?id=' + item.id)
}, },
async goToWuye() { async goToWuye() {
@ -679,6 +681,7 @@ export default {
}, { silent: false }); }, { silent: false });
if (res.rows.length) { if (res.rows.length) {
this.serverLeftList = res.rows
let filterRes = this.filterShowList(res?.rows, 1); let filterRes = this.filterShowList(res?.rows, 1);
filterRes.forEach(item => { filterRes.forEach(item => {
item.pic_src = picUrl + item.pic_src item.pic_src = picUrl + item.pic_src