From b02732fccdac42c6cbed6886344c0cbee220fd57 Mon Sep 17 00:00:00 2001
From: wangfukang <15630117759@163.com>
Date: Mon, 11 May 2026 17:21:05 +0800
Subject: [PATCH] 1

---
 package1/myCenter/myFriend.vue | 640 ++++++++++++++++++++++++++++++++-
 package1/order/orderDetail.vue | 250 +++++++++++--
 2 files changed, 851 insertions(+), 39 deletions(-)

diff --git a/package1/myCenter/myFriend.vue b/package1/myCenter/myFriend.vue
index 9006274..fd6151c 100644
--- a/package1/myCenter/myFriend.vue
+++ b/package1/myCenter/myFriend.vue
@@ -1,9 +1,645 @@
 <template>
-	<!-- 我的朋友 -->
+	<view class="lottery-page">
+		<view class="nav" :style="{ paddingTop: menuButtonInfo.top + 'px' }">
+			<view class="nav-back" @tap="back">‹</view>
+			<view class="nav-tabs">
+				<text class="nav-tab active">抽奖</text>
+				<text class="nav-tab">开奖记录</text>
+				<text class="nav-tab">分享</text>
+			</view>
+		</view>
+
+		<view class="machine-wrap">
+			<view class="time-tag">本期开奖时间 2026.03.18 20:00</view>
+			<view class="machine-light left-light"></view>
+			<view class="machine-light right-light"></view>
+
+			<view class="machine">
+				<view class="machine-ear left"></view>
+				<view class="machine-ear right"></view>
+				<view class="screen">
+					<view class="prize-grid">
+						<view class="prize-cell" v-for="item in prizeBoxes" :key="item">
+							<view class="box-icon">
+								<view class="box-top"></view>
+								<view class="box-body">{{ item }}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+
+				<view class="draw-button" @tap="draw">我要抽奖</view>
+				<view class="machine-base">
+					<view class="countdown-card">
+						<view class="card-title">保护中 23:12:06</view>
+						<view class="card-sub">80户儿保站大奖池</view>
+						<view class="cash-row">
+							<view class="coin">奖</view>
+							<view>
+								<view class="small-text">我的奖金</view>
+								<view class="cash">¥30</view>
+							</view>
+						</view>
+					</view>
+					<view class="ticket-card">
+						<view class="join-text">投入 <text>3</text> 张券参与中</view>
+						<view class="ticket">我的抽奖券 <text>12</text></view>
+					</view>
+				</view>
+				<view class="lever">
+					<view class="lever-stick"></view>
+					<view class="lever-ball"></view>
+				</view>
+			</view>
+		</view>
+
+		<view class="quick-area">
+			<view class="benefit">
+				<view class="benefit-bubble">优秀商品</view>
+			</view>
+			<view class="quick-item" v-for="item in quickEntries" :key="item.name" @tap="noop">
+				<view class="quick-icon">
+					<text>{{ item.icon }}</text>
+				</view>
+				<view class="quick-name">{{ item.name }}</view>
+			</view>
+		</view>
+
+		<view class="amount-card">
+			<view class="amount-title">奖池金额</view>
+			<view class="amount-panel">¥ 737489</view>
+		</view>
+	</view>
 </template>
 
 <script>
+	export default {
+		data() {
+			return {
+				menuButtonInfo: {
+					top: 24
+				},
+				prizeBoxes: ['01', '02', '03', '04', '05', '06', '07', '08', '09'],
+				quickEntries: [{
+					name: '拿来主义',
+					icon: '拿'
+				}, {
+					name: '排行榜',
+					icon: '榜'
+				}, {
+					name: '道具',
+					icon: '具'
+				}]
+			}
+		},
+		onLoad() {
+			if (uni.getMenuButtonBoundingClientRect) {
+				this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
+			}
+		},
+		methods: {
+			back() {
+				uni.navigateBack()
+			},
+			draw() {
+				uni.showToast({
+					title: '抽奖券准备中',
+					icon: 'none'
+				})
+			},
+			noop() {}
+		}
+	}
 </script>
 
-<style>
+<style lang="scss" scoped>
+	page {
+		background: #fff4d8;
+	}
+
+	.lottery-page {
+		min-height: 100vh;
+		padding: 0 28rpx 48rpx;
+		box-sizing: border-box;
+		color: #fff;
+		background:
+			radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.72) 0, rgba(255, 255, 255, 0) 210rpx),
+			radial-gradient(circle at 86% 26%, rgba(255, 116, 135, 0.24) 0, rgba(255, 116, 135, 0) 260rpx),
+			linear-gradient(180deg, #ffbf5f 0%, #ff7c6e 46%, #8f63ff 100%);
+		overflow: hidden;
+		position: relative;
+	}
+
+	.lottery-page::before {
+		content: '';
+		width: 520rpx;
+		height: 520rpx;
+		border-radius: 50%;
+		background: rgba(255, 255, 255, 0.14);
+		position: absolute;
+		right: -260rpx;
+		top: 160rpx;
+	}
+
+	.lottery-page::after {
+		content: '';
+		width: 360rpx;
+		height: 360rpx;
+		border-radius: 50%;
+		background: rgba(255, 231, 93, 0.22);
+		position: absolute;
+		left: -190rpx;
+		bottom: 120rpx;
+	}
+
+	.nav {
+		height: 88rpx;
+		display: flex;
+		align-items: center;
+		position: relative;
+		z-index: 5;
+	}
+
+	.nav-back {
+		width: 54rpx;
+		height: 54rpx;
+		line-height: 48rpx;
+		font-size: 56rpx;
+		font-weight: 300;
+		color: #fff;
+		text-shadow: 0 4rpx 10rpx rgba(136, 55, 36, 0.24);
+	}
+
+	.nav-tabs {
+		flex: 1;
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+		gap: 44rpx;
+		font-size: 26rpx;
+		font-weight: 700;
+	}
+
+	.nav-tab {
+		opacity: 0.92;
+		color: #fff;
+		text-shadow: 0 4rpx 10rpx rgba(136, 55, 36, 0.22);
+	}
+
+	.nav-tab.active {
+		font-size: 30rpx;
+		opacity: 1;
+		position: relative;
+	}
+
+	.nav-tab.active::after {
+		content: '';
+		width: 44rpx;
+		height: 8rpx;
+		border-radius: 999rpx;
+		background: #fff15f;
+		position: absolute;
+		left: 50%;
+		bottom: -16rpx;
+		transform: translateX(-50%);
+	}
+
+	.machine-wrap {
+		margin-top: 18rpx;
+		position: relative;
+	}
+
+	.time-tag {
+		width: fit-content;
+		margin: 0 auto -8rpx;
+		padding: 8rpx 18rpx;
+		border-radius: 8rpx;
+		background: linear-gradient(135deg, #7a3cff 0%, #ff5c88 100%);
+		border: 2rpx solid rgba(255, 255, 255, 0.74);
+		font-size: 18rpx;
+		font-weight: 800;
+		position: relative;
+		z-index: 3;
+	}
+
+	.machine-light {
+		width: 70rpx;
+		height: 34rpx;
+		border-radius: 50%;
+		background: linear-gradient(90deg, rgba(255, 241, 95, 0.12), rgba(255, 255, 255, 0.88));
+		position: absolute;
+		top: 6rpx;
+		filter: blur(1rpx);
+		animation: lightWiggle 2.4s ease-in-out infinite;
+	}
+
+	.left-light {
+		left: 104rpx;
+		transform: rotate(42deg);
+	}
+
+	.right-light {
+		right: 98rpx;
+		transform: rotate(-36deg);
+		animation-delay: 0.45s;
+	}
+
+	.machine {
+		width: 560rpx;
+		margin: 0 auto;
+		padding-top: 20rpx;
+		position: relative;
+	}
+
+	.machine-ear {
+		width: 46rpx;
+		height: 220rpx;
+		border-radius: 36rpx;
+		background: linear-gradient(180deg, #ffd56a, #ff7d47);
+		position: absolute;
+		top: 118rpx;
+		z-index: 0;
+	}
+
+	.machine-ear.left {
+		left: -18rpx;
+	}
+
+	.machine-ear.right {
+		right: -18rpx;
+	}
+
+	.screen {
+		width: 448rpx;
+		height: 350rpx;
+		margin: 0 auto;
+		padding: 38rpx 32rpx;
+		box-sizing: border-box;
+		border-radius: 30rpx;
+		background: linear-gradient(180deg, #fff5c8 0%, #ffcf67 100%);
+		border: 8rpx solid #fff0a6;
+		box-shadow:
+			inset 0 0 0 6rpx rgba(255, 120, 79, 0.34),
+			0 24rpx 36rpx rgba(136, 55, 36, 0.25);
+		position: relative;
+		z-index: 1;
+	}
+
+	.screen::before {
+		content: '';
+		width: 100%;
+		height: 100%;
+		border-radius: 20rpx;
+		background:
+			linear-gradient(110deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.38) 50%, rgba(255, 255, 255, 0) 100%),
+			radial-gradient(circle at 30% 10%, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0));
+		animation: screenShine 3.6s ease-in-out infinite;
+		position: absolute;
+		left: 0;
+		top: 0;
+		pointer-events: none;
+	}
+
+	.prize-grid {
+		display: flex;
+		flex-wrap: wrap;
+		position: relative;
+		z-index: 2;
+	}
+
+	.prize-cell {
+		width: 33.33%;
+		height: 88rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		border-bottom: 8rpx solid rgba(255, 255, 255, 0.48);
+		box-sizing: border-box;
+	}
+
+	.box-icon {
+		width: 62rpx;
+		height: 64rpx;
+		position: relative;
+		animation: boxFloat 2.5s ease-in-out infinite;
+	}
+
+	.prize-cell:nth-child(2n) .box-icon {
+		animation-delay: 0.35s;
+	}
+
+	.box-top {
+		width: 56rpx;
+		height: 18rpx;
+		border-radius: 6rpx;
+		background: linear-gradient(135deg, #fff8db, #ff9d5d);
+		transform: skewX(-18deg);
+		position: absolute;
+		top: 0;
+		left: 4rpx;
+	}
+
+	.box-body {
+		width: 58rpx;
+		height: 50rpx;
+		line-height: 50rpx;
+		text-align: center;
+		border-radius: 8rpx;
+		background: linear-gradient(135deg, #fff7d8 0%, #ff6d8a 100%);
+		color: #fff;
+		font-size: 20rpx;
+		font-weight: 900;
+		position: absolute;
+		left: 2rpx;
+		bottom: 0;
+		box-shadow: inset -6rpx -6rpx 12rpx rgba(129, 36, 54, 0.12), 0 8rpx 14rpx rgba(129, 36, 54, 0.14);
+	}
+
+	.draw-button {
+		width: 440rpx;
+		height: 82rpx;
+		line-height: 82rpx;
+		text-align: center;
+		margin: -10rpx auto 0;
+		border-radius: 18rpx 18rpx 0 0;
+		background: linear-gradient(180deg, #ff6f5f 0%, #e73563 100%);
+		font-size: 34rpx;
+		font-weight: 900;
+		letter-spacing: 4rpx;
+		position: relative;
+		z-index: 2;
+		box-shadow: 0 16rpx 28rpx rgba(181, 39, 78, 0.34), inset 0 6rpx 0 rgba(255, 255, 255, 0.2);
+		animation: drawPulse 1.8s ease-in-out infinite;
+	}
+
+	.machine-base {
+		width: 560rpx;
+		height: 180rpx;
+		padding: 28rpx;
+		box-sizing: border-box;
+		border-radius: 16rpx;
+		background: linear-gradient(180deg, #ffbc57 0%, #ff7b52 100%);
+		border-bottom: 10rpx solid #d74c3b;
+		display: flex;
+		gap: 20rpx;
+		position: relative;
+		z-index: 1;
+	}
+
+	.machine-base::before {
+		content: '';
+		width: 100%;
+		height: 16rpx;
+		background: repeating-radial-gradient(circle, #fff7b3 0 4rpx, transparent 5rpx 18rpx);
+		position: absolute;
+		left: 0;
+		top: 12rpx;
+		opacity: 0.9;
+	}
+
+	.countdown-card,
+	.ticket-card {
+		flex: 1;
+		border-radius: 12rpx;
+		background: rgba(255, 255, 255, 0.88);
+		color: #7a3a17;
+		box-shadow: inset 0 0 0 2rpx rgba(255, 255, 255, 0.7), 0 8rpx 18rpx rgba(148, 55, 33, 0.12);
+		position: relative;
+		z-index: 2;
+	}
+
+	.countdown-card {
+		padding: 8rpx 10rpx;
+		box-sizing: border-box;
+	}
+
+	.card-title {
+		font-size: 22rpx;
+		font-weight: 900;
+	}
+
+	.card-sub,
+	.small-text,
+	.join-text {
+		font-size: 16rpx;
+		color: rgba(122, 58, 23, 0.68);
+	}
+
+	.cash-row {
+		display: flex;
+		align-items: center;
+		margin-top: 8rpx;
+	}
+
+	.coin {
+		width: 56rpx;
+		height: 56rpx;
+		line-height: 56rpx;
+		text-align: center;
+		margin-right: 10rpx;
+		border-radius: 50%;
+		background: linear-gradient(135deg, #fff4a8, #ff8a5d);
+		color: #fff;
+		font-weight: 900;
+	}
+
+	.cash {
+		font-size: 28rpx;
+		font-weight: 900;
+	}
+
+	.ticket-card {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.join-text text,
+	.ticket text {
+		font-weight: 900;
+		color: #e73563;
+	}
+
+	.ticket {
+		margin-top: 18rpx;
+		padding: 12rpx 18rpx;
+		border-radius: 8rpx;
+		background: linear-gradient(135deg, #fff7d8, #fff);
+		color: #7a3a17;
+		font-size: 22rpx;
+		font-weight: 900;
+	}
+
+	.lever {
+		width: 110rpx;
+		height: 150rpx;
+		position: absolute;
+		right: -28rpx;
+		bottom: 68rpx;
+		z-index: 3;
+	}
+
+	.lever-stick {
+		width: 14rpx;
+		height: 96rpx;
+		border-radius: 999rpx;
+		background: linear-gradient(180deg, #7a3cff, #3b1a9f);
+		transform: rotate(-28deg);
+		position: absolute;
+		left: 38rpx;
+		bottom: 16rpx;
+	}
+
+	.lever-ball {
+		width: 44rpx;
+		height: 44rpx;
+		border-radius: 50%;
+		background: linear-gradient(135deg, #fff176, #ff6d8a);
+		position: absolute;
+		top: 0;
+		right: 24rpx;
+		box-shadow: 0 8rpx 16rpx rgba(0, 0, 0, 0.22);
+	}
+
+	.quick-area {
+		width: 100%;
+		margin: 26rpx auto 0;
+		display: flex;
+		justify-content: space-around;
+		position: relative;
+	}
+
+	.benefit {
+		position: absolute;
+		right: 2rpx;
+		top: -38rpx;
+	}
+
+	.benefit-bubble {
+		padding: 12rpx 14rpx;
+		border-radius: 999rpx;
+		background: rgba(255, 255, 255, 0.86);
+		color: #e73563;
+		font-size: 20rpx;
+		font-weight: 900;
+	}
+
+	.quick-item {
+		width: 30%;
+		text-align: center;
+	}
+
+	.quick-icon {
+		width: 92rpx;
+		height: 92rpx;
+		margin: 0 auto 14rpx;
+		border-radius: 50%;
+		background: linear-gradient(135deg, #fff 0%, #fff6d8 100%);
+		box-shadow: 0 14rpx 24rpx rgba(122, 58, 23, 0.18);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		color: #e73563;
+		font-size: 34rpx;
+		font-weight: 900;
+	}
+
+	.quick-name {
+		font-size: 28rpx;
+		font-weight: 900;
+		color: #fff;
+		text-shadow: 0 4rpx 10rpx rgba(122, 58, 23, 0.24);
+	}
+
+	.amount-card {
+		margin-top: 42rpx;
+		padding: 16rpx 18rpx 22rpx;
+		border-radius: 28rpx;
+		background: linear-gradient(180deg, #fff 0%, #fff3cf 100%);
+		box-shadow: 0 14rpx 0 rgba(191, 75, 49, 0.22), inset 0 0 0 6rpx rgba(255, 177, 87, 0.28);
+		color: #7a3a17;
+		position: relative;
+	}
+
+	.amount-card::before {
+		content: 'CENTRE  POO';
+		width: 100%;
+		text-align: center;
+		position: absolute;
+		left: 0;
+		top: -6rpx;
+		color: rgba(255, 122, 82, 0.1);
+		font-size: 52rpx;
+		font-weight: 900;
+		letter-spacing: 8rpx;
+	}
+
+	.amount-title {
+		text-align: center;
+		font-size: 24rpx;
+		font-weight: 900;
+		position: relative;
+		z-index: 1;
+	}
+
+	.amount-panel {
+		height: 96rpx;
+		line-height: 96rpx;
+		margin-top: 10rpx;
+		border-radius: 10rpx;
+		border: 4rpx solid #ffd171;
+		background: linear-gradient(180deg, #fff 0%, #fffaf0 100%);
+		text-align: center;
+		font-size: 48rpx;
+		font-weight: 900;
+		position: relative;
+		z-index: 1;
+	}
+
+	@keyframes lightWiggle {
+		0%,
+		100% {
+			opacity: 0.55;
+		}
+
+		50% {
+			opacity: 1;
+		}
+	}
+
+	@keyframes screenShine {
+		0%,
+		100% {
+			opacity: 0.55;
+			transform: translateX(-24rpx);
+		}
+
+		50% {
+			opacity: 1;
+			transform: translateX(24rpx);
+		}
+	}
+
+	@keyframes boxFloat {
+		0%,
+		100% {
+			transform: translateY(0);
+		}
+
+		50% {
+			transform: translateY(-8rpx);
+		}
+	}
+
+	@keyframes drawPulse {
+		0%,
+		100% {
+			transform: scale(1);
+		}
+
+		50% {
+			transform: scale(1.03);
+		}
+	}
 </style>
\ No newline at end of file
diff --git a/package1/order/orderDetail.vue b/package1/order/orderDetail.vue
index 9e0eddb..58d7bac 100644
--- a/package1/order/orderDetail.vue
+++ b/package1/order/orderDetail.vue
@@ -169,6 +169,27 @@
 						</view> -->
 					</view>
 				</view>
+				<view class="order-flow">
+					<view class="flow-item active">
+						<view class="flow-dot"></view>
+						<view class="flow-name">已下单</view>
+					</view>
+					<view class="flow-line" :class="{'active': orderDetail.status >= 3 || orderDetail.status == 5}"></view>
+					<view class="flow-item" :class="{'active': orderDetail.status >= 3 || orderDetail.status == 5}">
+						<view class="flow-dot"></view>
+						<view class="flow-name">{{orderDetail.deliveryType == 1 ? '已接单' : '待消费'}}</view>
+					</view>
+					<view class="flow-line" :class="{'active': orderDetail.status >= 4 || orderDetail.status == 5}"></view>
+					<view class="flow-item" :class="{'active': orderDetail.status >= 4 || orderDetail.status == 5}">
+						<view class="flow-dot"></view>
+						<view class="flow-name">{{orderDetail.deliveryType == 1 ? '配送中' : '核销中'}}</view>
+					</view>
+					<view class="flow-line" :class="{'active': orderDetail.status == 5 || orderDetail.status == 8 || orderDetail.status == 12}"></view>
+					<view class="flow-item" :class="{'active': orderDetail.status == 5 || orderDetail.status == 8 || orderDetail.status == 12}">
+						<view class="flow-dot"></view>
+						<view class="flow-name">已完成</view>
+					</view>
+				</view>
 				<view class="btn-box">
 					<view class="btn"
 						v-if="orderDetail.status == 3 && orderDetail.deliveryType == 2 &&orderDetail.userRequireMake == null"
@@ -486,7 +507,7 @@
 							</view>
 						</view>
 						<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-							v-if="orderDetail.deliveryType == 1">
+							>
 							<view style="flex: 1;color: #777;font-weight: 700;">
 								我的评价
 							</view>
@@ -1067,10 +1088,10 @@
 				this.$refs.returnPopupBuy.open('bottom');
 			},
 			returnOrder() {
-				if(sellTime == 5 && remark == ""){
+				/* if(this.sellTime == 5 && this.remark == ""){
 					that.tui.toast("请填写备注");
 					return
-				}
+				} */
 				this.$refs.returnPopup.close();
 				let item = this.payData
 				let that = this
@@ -1366,27 +1387,35 @@
 		width: 100%;
 		height: 100%;
 		font-size: 24rpx;
-		background: #F5F8F5;
+		background: linear-gradient(180deg, #ecfff7 0%, #f7fbf6 38%, #f9faf7 100%);
 		color: #00231C;
 	}
 
 	.page1 {
 		width: 100%;
-		height: 100%;
+		min-height: 100%;
 		font-size: 24rpx;
 		position: relative;
+		background:
+			radial-gradient(circle at 12% 8%, rgba(166, 255, 234, 0.48) 0, rgba(166, 255, 234, 0) 260rpx),
+			radial-gradient(circle at 92% 18%, rgba(255, 221, 176, 0.26) 0, rgba(255, 221, 176, 0) 300rpx);
 	}
 
 	.title {
-		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
+		background:
+			linear-gradient(135deg, rgba(166, 255, 234, 0.86) 0%, rgba(245, 255, 249, 0.94) 52%, rgba(255, 246, 225, 0.9) 100%);
 		width: 100%;
-		height: 54%;
+		height: 360rpx;
+		border-bottom-left-radius: 46rpx;
+		border-bottom-right-radius: 46rpx;
+		box-shadow: 0 18rpx 44rpx rgba(0, 35, 28, 0.06);
 	}
 
 	.content {
 		position: absolute;
-		top: 220rpx;
+		top: 150rpx;
 		width: 100%;
+		padding-bottom: 60rpx;
 	}
 
 	.title-sreach {
@@ -1400,25 +1429,48 @@
 		position: absolute;
 		bottom: 0;
 		left: 0;
+		width: 64rpx;
+		height: 64rpx;
+		margin-left: 14rpx;
+		border-radius: 50%;
+		background: rgba(255, 255, 255, 0.64);
+		box-shadow: 0 10rpx 24rpx rgba(0, 35, 28, 0.08);
+		text-align: center;
+		line-height: 64rpx;
 	}
 
 	.box1 {
 		width: 95%;
-		margin: 0 auto 20rpx;
-		background: #fff;
-		border-radius: 20rpx;
-		padding: 20rpx;
+		margin: 0 auto 22rpx;
+		background: rgba(255, 255, 255, 0.94);
+		border: 1px solid rgba(255, 255, 255, 0.86);
+		border-radius: 32rpx;
+		padding: 24rpx;
+		box-shadow: 0 18rpx 42rpx rgba(0, 35, 28, 0.07);
+		box-sizing: border-box;
+		overflow: hidden;
+	}
+
+	.content > .box1:first-child {
+		background:
+			radial-gradient(circle at 94% 4%, rgba(255, 221, 176, 0.2) 0, rgba(255, 221, 176, 0) 170rpx),
+			linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 255, 251, 0.96) 100%);
+		border-radius: 36rpx;
 	}
 
 	.goods-img {
 		width: 160rpx;
 		height: 160rpx;
 		position: relative;
+		border-radius: 24rpx;
+		overflow: hidden;
+		box-shadow: 0 12rpx 24rpx rgba(0, 35, 28, 0.08);
 
 		img {
 			width: 100%;
 			background-size: 100%;
 			height: 100%;
+			border-radius: 24rpx;
 		}
 	}
 
@@ -1430,34 +1482,41 @@
 	.goods-name {
 		font-size: 32rpx;
 		font-weight: 900;
+		color: #243f38;
 	}
 
 	.goods-content-center {
 		display: flex;
 		margin: 16rpx 0;
-		color: #777;
+		color: #7b8883;
 	}
 
 	.goods-content-bottom {
 		display: flex;
 		line-height: 56rpx;
-		color: #777;
+		color: #6b7773;
 	}
 
 	.pintuan-left-price {
 		width: 50%;
 		text-align: right;
 		font-weight: 700;
-		color: #000;
+		color: #00231C;
 	}
 
 	.status-img {
-		width: 84rpx;
-		height: 84rpx;
+		width: 96rpx;
+		height: 96rpx;
+		border-radius: 50%;
+		background: linear-gradient(135deg, rgba(166, 255, 234, 0.72), rgba(255, 247, 215, 0.78));
+		box-shadow: 0 12rpx 26rpx rgba(0, 35, 28, 0.08);
+		display: flex;
+		align-items: center;
+		justify-content: center;
 
 		img {
-			width: 84rpx;
-			height: 84rpx;
+			width: 72rpx;
+			height: 72rpx;
 			background-size: 100%;
 		}
 	}
@@ -1469,50 +1528,167 @@
 	}
 
 	.status-zhu {
-		font-size: 32rpx;
-		font-weight: 700;
+		font-size: 36rpx;
+		font-weight: 900;
+		color: #243f38;
 	}
 
 	.status-fu {
 		height: 50rpx;
 		line-height: 50rpx;
+		color: #52625d;
 	}
 
 	.status-address {
 		font-weight: 700;
+		color: #243f38;
 	}
 
 	.status-btn {
 		position: absolute;
 		top: 20rpx;
 		right: 0;
-		background: rgba(247, 248, 248, 0.6);
-		width: 130rpx;
-		height: 50rpx;
+		background: rgba(255, 255, 255, 0.72);
+		width: 136rpx;
+		height: 54rpx;
 		text-align: center;
-		line-height: 50rpx;
-		border-radius: 16rpx;
-		color: #777;
-		border: 1px solid rgba(0, 35, 28, 0.16);
+		line-height: 54rpx;
+		border-radius: 999rpx;
+		color: #60706c;
+		border: 1px solid rgba(0, 35, 28, 0.1);
 		font-size: 20rpx;
+		font-weight: 800;
+		box-shadow: 0 8rpx 18rpx rgba(0, 35, 28, 0.05);
+	}
+
+	.order-flow {
+		width: 95%;
+		margin: -4rpx auto 22rpx;
+		padding: 22rpx 20rpx;
+		border-radius: 30rpx;
+		background: rgba(255, 255, 255, 0.78);
+		box-shadow: 0 14rpx 34rpx rgba(0, 35, 28, 0.05);
+		display: flex;
+		align-items: center;
+		box-sizing: border-box;
+	}
+
+	.flow-item {
+		width: 92rpx;
+		text-align: center;
+		color: #9aa6a2;
+		font-size: 20rpx;
+		font-weight: 800;
+	}
+
+	.flow-dot {
+		width: 24rpx;
+		height: 24rpx;
+		margin: 0 auto 8rpx;
+		border-radius: 50%;
+		background: #dfe7e3;
+		box-shadow: inset 0 0 0 4rpx #fff;
+	}
+
+	.flow-item.active {
+		color: #125e50;
+	}
+
+	.flow-item.active .flow-dot {
+		background: linear-gradient(135deg, #a6ffea, #ffdf75);
+		box-shadow: 0 6rpx 14rpx rgba(0, 191, 160, 0.18);
+	}
+
+	.flow-line {
+		flex: 1;
+		height: 6rpx;
+		border-radius: 999rpx;
+		background: #e5ece9;
+		margin: 0 4rpx 34rpx;
+	}
+
+	.flow-line.active {
+		background: linear-gradient(90deg, #a6ffea, #ffdf75);
 	}
 
 	.btn-box {
 		height: auto;
 		display: flex;
-		margin-bottom: 10px;
+		width: 95%;
+		margin: 0 auto 20rpx;
+		gap: 18rpx;
+		flex-wrap: wrap;
 	}
 
 	.btn {
-		width: 90%;
-		height: 100rpx;
-		line-height: 100rpx;
-		background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
-		font-size: 32rpx;
-		border-radius: 120rpx;
+		flex: 1;
+		min-width: 260rpx;
+		height: 92rpx;
+		line-height: 92rpx;
+		background: linear-gradient(135deg, #fff7d7 0%, #a6ffea 100%);
+		font-size: 30rpx;
+		border-radius: 999rpx;
 		text-align: center;
-		margin: 0 10px;
-		font-weight: 700;
+		margin: 0;
+		font-weight: 900;
+		box-shadow: 0 14rpx 28rpx rgba(0, 191, 160, 0.12);
+	}
+
+	.box1 > view[style*="rgba(247, 248, 248"] {
+		background: linear-gradient(180deg, rgba(250, 255, 252, 0.96) 0%, rgba(255, 255, 255, 0.9) 100%) !important;
+		border: 1px solid rgba(166, 255, 234, 0.34);
+		box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
+	}
+
+	.box1 > view[style*="line-height: 70rpx"] {
+		color: #243f38;
+	}
+
+	.box1 > view[style*="height: 80rpx"] {
+		border-bottom: 1px solid rgba(0, 35, 28, 0.045);
+	}
+
+	.box1 > view[style*="height: 80rpx"]:last-child {
+		border-bottom: 0;
+	}
+
+	.box1 view[style*="color: #777"] {
+		color: #87938f !important;
+	}
+
+	.box1 view[style*="color: #000"] {
+		color: #243f38 !important;
+	}
+
+	.box1 view[style*="border-top: 1px solid #eee"] {
+		border-top: 1px solid rgba(0, 35, 28, 0.08) !important;
+	}
+
+	.box1 view[style*="font-size: 32rpx"][style*="font-weight: 700"] {
+		color: #0d4d42;
+	}
+
+	.box1 image,
+	.box1 img {
+		object-fit: cover;
+	}
+
+	.evaluate-content,
+	.car-content,
+	.guize-list,
+	.pay-popup {
+		border-radius: 36rpx 36rpx 0 0 !important;
+		box-shadow: 0 -18rpx 44rpx rgba(0, 35, 28, 0.12);
+	}
+
+	.evaluate-content {
+		background: linear-gradient(180deg, #ffffff 0%, #f7fffb 100%);
+	}
+
+	.evaluate-list {
+		padding: 20rpx;
+		border-radius: 28rpx;
+		background: rgba(247, 255, 251, 0.8);
 	}
 
 	.img-popup-content {