From f01b5f3625d03cd2ca44fdebcb6e8c728f489d74 Mon Sep 17 00:00:00 2001
From: YeMingfei666 <1619116647@qq.com>
Date: Mon, 15 Dec 2025 17:24:15 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=86=8D=E6=9D=A5=E4=B8=80?=
 =?UTF-8?q?=E5=8D=95=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 groupBuying/index/index.vue | 228 ++++++++++++++++++++++++++++++------
 pages.json                  |   7 +-
 pages/product/index.vue     |   4 +-
 3 files changed, 201 insertions(+), 38 deletions(-)

diff --git a/groupBuying/index/index.vue b/groupBuying/index/index.vue
index 17fdc85..6c924f9 100644
--- a/groupBuying/index/index.vue
+++ b/groupBuying/index/index.vue
@@ -1,36 +1,52 @@
 <template>
 	<view class="min-page bg-f7 u-font-28">
-		<up-navbar bg-color="transparent" :placeholder="false" title="拼团特惠" left-icon-color="#fff"
-			title-color="#fff"></up-navbar>
-		<view class="top" :style="topStyle">
-			<view class="u-flex info u-col-center">
-				<image :src="imgs.map" class="map"></image>
-				<view class="u-line-1 u-m-l-20">这里是店铺名称</view>
+		<up-sticky :offsetTop="0" :customNavHeight="0">
+			<view class="top" :style="topStyle">
+				<up-navbar bg-color="transparent" :fixed="false" :placeholder="false" title="拼团特惠"
+					left-icon-color="#fff" title-color="#fff"></up-navbar>
+				<view class="u-flex info u-col-center">
+					<image :src="imgs.map" class="map"></image>
+					<view class="u-line-1 u-m-l-20">这里是店铺名称</view>
+				</view>
 			</view>
-		</view>
-		<view class="steps">
-			<view class="step" v-for="(item,index) in steps" :key="index">
-				<text class="index">{{index+1}}</text>
-				<text class="text">{{item}}</text>
-				<template v-if="index<steps.length-1">
-					<text class="icon">
-						{{'>'}}
-					</text>
-					<text class="icon icon1">
-						{{'>'}}
-					</text>
-				</template>
+			<view class="translateY20">
+				<view class="steps">
+					<view class="step" v-for="(item,index) in steps" :key="index">
+						<text class="index">{{index+1}}</text>
+						<text class="text">{{item}}</text>
+						<template v-if="index<steps.length-1">
+							<text class="icon">
+								{{'>'}}
+							</text>
+							<text class="icon icon1">
+								{{'>'}}
+							</text>
+						</template>
+					</view>
+				</view>
+				<view class="filters ">
+					<view class="u-flex tabs">
+						<view class="tab" v-for="(item,index) in tabs.list" :class="{'active':tabs.sel==index}"
+							@click="tabs.sel=index">{{item}}</view>
+					</view>
 
+					<view class="u-flex" v-if="tabs.sel==0">
+						<up-search></up-search>
+					</view>
+					<view class="u-flex orderStatus" v-if="tabs.sel==1">
+						<view class="orderState" :class="{'active':orders.sel==index}"
+							v-for="(item,index) in orders.list" :key="index" @click="orders.sel=index">
+							{{item.name}}
+						</view>
+					</view>
+				</view>
 			</view>
-			<view class="step"></view>
-			<view class="step"></view>
-		</view>
-		
-		<up-sticky>
-			<view class="filters"></view>
+
+
 		</up-sticky>
 
-		<view class="lists">
+
+		<view class="lists" v-if="tabs.sel==0">
 			<view class="item" v-for="(item,index) in 10" :key="index">
 
 				<up-image width="218rpx" radius="16rpx" height="218rpx"></up-image>
@@ -46,7 +62,7 @@
 								<text class="u-font-24">拼团到手</text>
 								<text class="u-font-32 font-bold"> ¥333</text>
 							</view>
-							<view  style="opacity: 0.84;">
+							<view style="opacity: 0.84;">
 								<text class="u-font-24">原价</text>
 								<text class=""> ¥333</text>
 							</view>
@@ -58,15 +74,44 @@
 				</view>
 			</view>
 		</view>
+
+		<view class="orders" v-else-if="tabs.sel==1">
+			<view class="item" v-for="(item,index) in 10" :key="index">
+				<view class="u-flex u-col-center u-row-between">
+					<text class="numbers">3人团</text>
+					<text class="status success">待成团</text>
+				</view>
+				<view class="u-m-t-32 u-flex">
+					<up-image width="154rpx" height="154rpx"></up-image>
+					<view class="u-flex-1 u-flex u-p-l-30 u-col-center u-row-between">
+						<view>
+							<view class="">这里是商品名称</view>
+							<view class="u-m-t-34 price">¥999.99</view>
+						</view>
+						<text class="u-font-40 font-bold">x1</text>
+					</view>
+					
+					<view class="u-m-t-32 info">
+						
+					</view>
+				</view>
+
+			</view>
+
+		</view>
 	</view>
 </template>
 
 <script setup>
+	import {
+		reactive
+	} from 'vue';
+
 	const imgs = {
 		bg: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/d21f2dfd7bec44618f2d5e4b88372b08.png',
 		bg1: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/604c3f917daa41af9239145196c6d3f3.png',
 		map: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/0a293f6e1a6a4e7b956379a5b6701104.png',
-		pin:'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/a9a4f8f59a6d4a46abf91141df3531fb.png'
+		pin: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/1/a9a4f8f59a6d4a46abf91141df3531fb.png'
 	}
 
 	const steps = ['发起拼团', '邀请好友', '成团优惠']
@@ -74,6 +119,34 @@
 	const topStyle = {
 		backgroundImage: 'url(' + imgs.bg + ')'
 	}
+	const tabs = reactive({
+		list: ['正在进行中', '我的拼团'],
+		sel: 1
+	})
+	const orders = reactive({
+		list: [{
+				name: '全部',
+				value: ''
+			},
+			{
+				name: '待成团',
+				value: ''
+			},
+			{
+				name: '待核销',
+				value: ''
+			},
+			{
+				name: '已核销',
+				value: ''
+			},
+			{
+				name: '退款',
+				value: ''
+			},
+		],
+		sel: 0
+	})
 </script>
 
 <style lang="scss" scoped>
@@ -82,7 +155,7 @@
 		background-size: cover;
 
 		.info {
-			padding: 190rpx 30rpx 0 30rpx;
+			padding: 32rpx 30rpx 0 30rpx;
 			color: #fff;
 			font-size: 32rpx;
 			font-weight: 700;
@@ -100,7 +173,6 @@
 		gap: 20rpx;
 		border-radius: 14rpx 14rpx 0 0;
 		background: linear-gradient(90deg, #FFF5E6 0%, #FFD2CA 100%);
-		transform: translateY(-20rpx);
 
 		.step {
 			display: flex;
@@ -173,15 +245,18 @@
 				background-size: cover;
 				transform: translateY(-10rpx);
 				display: flex;
+
 				.left {
 					width: 306rpx;
 					color: #fff;
 					padding: 16rpx 22rpx;
 				}
-				.right{
+
+				.right {
 					padding-left: 16rpx;
 					margin-top: 30rpx;
-					.pin{
+
+					.pin {
 						width: 76rpx;
 						height: 54rpx;
 					}
@@ -189,9 +264,96 @@
 			}
 		}
 	}
-	.filters{
+
+	.filters {
 		padding: 16rpx 28rpx;
 		border-radius: 6rpx 6rpx 16rpx 16rpx;
 		background: #FFF;
 	}
+
+	.tabs {
+		display: flex;
+		justify-content: space-between;
+		font-size: 24rpx;
+		color: #999;
+		padding: 32rpx 88rpx;
+
+		.tabs {
+			transition: all .3s linear;
+		}
+
+		.active {
+			color: #ED5A2E;
+			font-size: 32rpx;
+			font-weight: 700;
+			font-weight: 700;
+		}
+	}
+
+	.translateY20 {
+		transform: translateY(-20rpx);
+	}
+
+	.orderStatus {
+		padding: 26rpx 28rpx;
+		justify-content: space-between;
+
+		.orderState {
+			color: #999;
+			transition: all .3s linear;
+
+			&.active {
+				color: #000;
+				font-size: 32rpx;
+				font-weight: 700;
+			}
+		}
+	}
+
+	.orders {
+		padding: 0 26rpx 36rpx;
+
+		.item {
+			padding: 32rpx 24rpx;
+			border-radius: 16rpx;
+			background: #FFF;
+			margin-bottom: 32rpx;
+
+			.numbers {
+				background-color: #ED5A2E;
+				padding: 16rpx 30rpx;
+				border-radius: 12rpx;
+				font-size: 32rpx;
+				color: #fff;
+				font-weight: 700;
+				line-height: 36rpx;
+			}
+			.status{
+				padding: 8rpx 18rpx;
+				border-radius: 8rpx;
+				border: 2rpx solid transparent;
+				&.success{
+					border-color: rgba(123, 209, 54, 1);
+					color: rgba(123, 209, 54, 1);
+					background: rgba(123, 209, 54, 0.12);
+				}
+			}
+			.price{
+				color: #ED5A2E;
+				 font-weight: 700;
+				 line-height: 36rpx;
+				  font-size: 40rpx;
+			}
+			.info{
+				display: flex;
+				padding: 16rpx 34rpx;
+				flex-direction: column;
+				align-items: flex-start;
+				gap: 32rpx;
+				border-radius: 8rpx;
+				background: #F8F8F8;
+			}
+		}
+	}
+	
 </style>
\ No newline at end of file
diff --git a/pages.json b/pages.json
index 6980d60..09976b4 100644
--- a/pages.json
+++ b/pages.json
@@ -354,10 +354,9 @@
 		// 		}
 		// 	]
 		// }
-		,{
+		, {
 			"root": "groupBuying",
-			"pages": [
-				{
+			"pages": [{
 					"path": "index/index",
 					"style": {
 						"navigationBarTitleText": "拼团特惠",
@@ -371,7 +370,7 @@
 						"navigationStyle": "custom"
 					}
 				}
-				
+
 			]
 		}
 	],
diff --git a/pages/product/index.vue b/pages/product/index.vue
index 1a71bae..7fb3568 100644
--- a/pages/product/index.vue
+++ b/pages/product/index.vue
@@ -2170,7 +2170,9 @@
 			...options.initMessage,
 			...extraInitPar
 		}, onMessage);
-		useSocket.chnageInitMessage(options.initMessage)
+		setTimeout(()=>{
+			useSocket.chnageInitMessage(options.initMessage)
+		},500)
 
 		console.log('onLoad:e', e);
 		cartStore.setOldOrder({