101 lines
3.8 KiB
Vue
101 lines
3.8 KiB
Vue
<template>
|
|
<view class="group-purchase-container">
|
|
<!-- 顶部横幅 -->
|
|
<view class="banner">
|
|
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/gp_index_top.png"></image>
|
|
</view>
|
|
|
|
<!-- 商品列表 -->
|
|
<view class="goods-list">
|
|
<!-- 商品项 -->
|
|
<view class="goods-item" v-for="(item, index) in goodsList" :key="index" @click="toDetail(item)">
|
|
<view class="goods-image">
|
|
<image :src="item.image" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="goods-info">
|
|
<view class="goods-name">{{ item.name }}</view>
|
|
<view class="goods-desc">{{ item.desc }}</view>
|
|
<view class="price-container">
|
|
<view class="group-price">
|
|
<view class="group-price1">团购价</view>
|
|
<view class="group-price2">{{ item.groupPrice }}</view>
|
|
</view>
|
|
<view class="quantity-control">
|
|
<view class="decrease-btn" @tap.stop="decreaseQuantity(index)">-</view>
|
|
<view class="quantity">{{ item.quantity }}</view>
|
|
<view class="increase-btn" @tap.stop="increaseQuantity(index)">+</view>
|
|
</view>
|
|
</view>
|
|
<view class="original-price">单买价 {{ item.originalPrice }}</view>
|
|
<view class="countdown">{{ item.countdown }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 购物车按钮 -->
|
|
<view class="shop_car" @click="shopCar">
|
|
<u-badge numberType="limit" type="error" max="99" :value="carNum"></u-badge>
|
|
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/shop_car_num.png"></image>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { picUrl, menuButtonInfo, request, NavgateTo } from "../../../utils";
|
|
export default {
|
|
data() {
|
|
return {
|
|
goodsList: [
|
|
{
|
|
id: 30,
|
|
name: "泰国金枕榴莲泰国金枕榴莲",
|
|
desc: "心形榴莲 软糯香甜",
|
|
image: "/static/logo.png",
|
|
groupPrice: "¥125.9/个",
|
|
originalPrice: "¥200/个",
|
|
countdown: "19天2小时10分钟后结束",
|
|
quantity: 1
|
|
},
|
|
{
|
|
id: 30,
|
|
name: "泰国金枕榴莲泰国金枕榴莲",
|
|
desc: "心形榴莲 软糯香甜",
|
|
image: "/static/logo.png",
|
|
groupPrice: "¥125.9/个",
|
|
originalPrice: "¥200/个",
|
|
countdown: "19天2小时10分钟后结束",
|
|
quantity: 1
|
|
}
|
|
],
|
|
carNum: 5,
|
|
};
|
|
},
|
|
methods: {
|
|
toDetail(item) {
|
|
console.log("🚀 ~ toDetail ~ toDetail:", '跳转......')
|
|
NavgateTo(`/packages/shop/groupPurchaseDetail/index?item=${JSON.stringify(item)}`)
|
|
},
|
|
increaseQuantity(index) {
|
|
this.goodsList[index].quantity++;
|
|
this.cartCount++;
|
|
},
|
|
decreaseQuantity(index) {
|
|
if (this.goodsList[index].quantity > 1) {
|
|
this.goodsList[index].quantity--;
|
|
this.cartCount--;
|
|
}
|
|
},
|
|
goToCart() {
|
|
// 跳转到购物车页面的逻辑
|
|
uni.showToast({
|
|
title: '跳转到购物车',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
@import url("./index.css");
|
|
</style> |