1

pages.json

@@ -251,6 +251,12 @@
 					"style": {
 						"navigationBarTitleText": "店铺"
 					}
+				},
+				{
+					"path": "group/index",
+					"style": {
+						"navigationBarTitleText": "团购"
+					}
 				}
 			]
 		}

pages/index/index.vue

@@ -33,7 +33,7 @@
 							data: res,
 							success: function() {
 								uni.redirectTo({
-									url: `/pages/home/index`
+									url: `/pagesHome/group/index`
 								})
 							}
 						});

pagesHome/group/index.vue

@@ -0,0 +1,152 @@
+<template>
+	<mobile-frame>
+		<view class="main">
+			<view class="one">
+				<view class="list" @tap="toView">
+					<image class="image" :src="goodsInfo.file&&goodsInfo.file.length>0?goodsInfo.file[0].url:''"
+						mode="">
+					</image>
+					<view class="list_1_1">
+						<view class="name">
+							{{goodsInfo.name||'暂无'}}
+						</view>
+						<view class="money">
+							<text>￥</text>
+							<text>{{specsInfo.sell_money}}</text>
+						</view>
+						<view class="other">
+							<view class="other_1">
+								{{goodsInfo.view_num||0}}人浏览
+							</view>
+							<view class="other_2">
+								<text @tap.stop="toDel" class="iconfont icon-del"></text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</mobile-frame>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				query: {},
+				user: {},
+				// 商品详情
+				goodsInfo: {},
+				// 规格详情
+				specsInfo: {},
+			};
+		},
+		onLoad: async function(e) {
+			const that = this;
+			that.$set(that, `query`, {
+				goods_id: e.goods_id || '6343878989bdcb128d846990',
+				specs_id: e.specs_id || '634394bc32c3065a80eb14ad'
+			});
+		},
+		onShow: function() {
+			const that = this;
+			that.watchLogin();
+			that.search();
+		},
+		methods: {
+			// 监听用户是否登录
+			watchLogin() {
+				const that = this;
+				uni.getStorage({
+					key: 'token',
+					success: function(res) {
+						let user = that.$jwt(res.data);
+						that.$set(that, `user`, user);
+					},
+					fail: function(err) {}
+				})
+			},
+			// 查询列表
+			async search() {
+				const that = this;
+				let res;
+				res = await that.$api(`/goods/${that.query.goods_id}`, 'GET')
+				if (res.errcode == '0') {
+					that.$set(that, `goodsInfo`, res.data);
+				}
+				res = await that.$api(`/goodsSpec/${that.query.specs_id}`, 'GET')
+				if (res.errcode == '0') {
+					that.$set(that, `specsInfo`, res.data);
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.main {
+		display: flex;
+		flex-direction: column;
+		width: 100vw;
+		height: 100vh;
+
+		.one {
+			.list {
+				display: flex;
+				flex-direction: row;
+				justify-content: space-between;
+				width: 91vw;
+				border: 1px solid var(--f1Color);
+				margin: 2vw 2vw 0 2vw;
+				padding: 2vw;
+				border-radius: 5px;
+
+				.image {
+					width: 25vw;
+					height: 25vw;
+					border-radius: 5px;
+					margin: 0 2vw 0 0;
+				}
+
+				.list_1_1 {
+					display: flex;
+					flex-direction: column;
+					flex-grow: 1;
+					padding: 2vw 0;
+
+					.name {
+						font-size: var(--font16Size);
+						margin: 0 0 1vw 0;
+					}
+
+					.money {
+						color: var(--fFB1Color);
+						font-size: var(--font14Size);
+						margin: 0 0 1vw 0;
+					}
+
+					.other {
+						display: flex;
+						justify-content: space-between;
+
+						.name {
+							font-size: var(--font16Size);
+							font-weight: bold;
+						}
+
+						.other_1 {
+							font-size: var(--font14Size);
+							color: var(--f85Color);
+
+							text {
+								font-weight: bold;
+								padding: 0 2vw;
+								color: var(--ff0Color);
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pagesHome/order/detail.vue

@@ -2,10 +2,12 @@
 	<mobile-frame>
 		<view class="main">
 			<view class="onemain">
-				<scroll-view scroll-y="true" class="scroll-view" scroll-with-animation :scroll-into-view="topItem" @scroll="handleScroll">
+				<scroll-view scroll-y="true" class="scroll-view" scroll-with-animation :scroll-into-view="topItem"
+					@scroll="handleScroll">
 					<view class="list-scroll-view" id="top">
 						<view class="one">
-							<swiper class="swiper" circular :indicator-dots="true" indicator-color="#ffffff" indicator-active-color="#FB1438" :autoplay="true" :interval="3000" :duration="1000">
+							<swiper class="swiper" circular :indicator-dots="true" indicator-color="#ffffff"
+								indicator-active-color="#FB1438" :autoplay="true" :interval="3000" :duration="1000">
 								<swiper-item class="list" v-for="(item,index) in bannerList" :key="index">
 									<image class="image" :src="item.url" mode="">
 									</image>
@@ -68,7 +70,8 @@
 				</scroll-view>
 			</view>
 			<view class="foot">
-				<uni-goods-nav :options="options" :button-group="buttonGroup" @click="onClick" @buttonClick="buttonClick" />
+				<uni-goods-nav :options="options" :button-group="buttonGroup" @click="onClick"
+					@buttonClick="buttonClick" />
 			</view>
 		</view>
 		<view class="collect">
@@ -107,7 +110,12 @@
 				<view class="two">
 					<view class="two_1">规格</view>
 					<view class="two_2">
-						<text v-for="(item,index) in specs" :key="index" @click="toStyle(item,index)" :class="{ 'style': isActive==index}">{{item.name}}</text>
+						<view class="two_2_1" v-for="(item,index) in specs" :key="index">
+							<text @click="toStyle(item,index)" :class="{ 'style': isActive==index}">{{item.name}}
+							</text>
+							<text @click="toGroup(item)">参团</text>
+						</view>
+					<!-- 	v-if="can_group=='0'" -->
 					</view>
 				</view>
 				<view class="thr">
@@ -299,6 +307,14 @@
 					})
 				}
 			},
+			// 参团
+			toGroup(e) {
+				console.log(e);
+				const that = this;
+				uni.navigateTo({
+					url: `/pagesHome/group/index?specs_id=${e._id}&goods_id=${that.id}`
+				})
+			},
 			//主菜单跳转
 			toPath(e) {
 				if (e && e.route) uni.reLaunch({
@@ -801,17 +817,30 @@
 
 			.two_2 {
 				padding: 1vw;
+				display: flex;
 
-				text {
-					margin: 0 2vw 0 0;
-					padding: 1vw;
-					border-radius: 1vw;
-					background-color: var(--f9Color);
-				}
+				.two_2_1 {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
 
-				.style {
-					color: var(--mainColor);
-					background-color: var(--ff0Color);
+					text {
+						margin: 0 2vw 0 0;
+						padding: 1vw;
+						border-radius: 1vw;
+						background-color: var(--f9Color);
+					}
+
+					text:last-child {
+						margin: 1vw 0 0 0;
+						color: var(--mainColor);
+						background-color: #FFD700;
+					}
+
+					.style {
+						color: var(--mainColor);
+						background-color: var(--ff0Color);
+					}
 				}
 			}
 		}