完成首页花馍模块
This commit is contained in:
parent
da59430dd9
commit
cc7215d836
@ -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', // 广告货品列表
|
||||||
}
|
}
|
||||||
@ -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) {
|
||||||
|
|||||||
@ -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,
|
// 先判断shopCarList数据中是否包含isAdver且为true
|
||||||
|
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
|
||||||
|
|||||||
@ -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)}`);
|
||||||
},
|
},
|
||||||
|
|
||||||
// 获取购物车列表
|
// 获取购物车列表
|
||||||
|
|||||||
@ -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
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user