From aa91bc7958be73c749d43533337647c4a7ebef02 Mon Sep 17 00:00:00 2001
From: wangfukang <15630117759@163.com>
Date: Tue, 12 May 2026 11:43:36 +0800
Subject: [PATCH] 1

---
 pages/index/index.vue | 306 ++++++++++++++++++++++--------------------
 1 file changed, 159 insertions(+), 147 deletions(-)

diff --git a/pages/index/index.vue b/pages/index/index.vue
index 8dfa6b4..00e3e1b 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -459,161 +459,35 @@
 				</view>
 			</view>
 		</uni-popup>
-		<uni-popup ref="productPopup" background-color="#fff">
-			<view class="popup-area-content" style="width: 700rpx;overflow: scroll;">
-				<view class="popup-area-title">
-					<text>订单详情</text>
+		<uni-popup ref="productPopup" background-color="transparent">
+			<view class="product-popup-content">
+				<view class="product-popup-header">
+					<view class="product-popup-title">商品详情</view>
+					<view class="product-popup-subtitle">请核对商品规格和数量</view>
 				</view>
-				<view>
-					<view class="box1">
-						<view style="height: 160rpx;line-height: 80rpx;">
-							<view style="flex: 1;color: #777;font-weight: 700;">
-								取货地址
-							</view>
-							<view style="color: #000;font-weight: 700;">
-								{{productData.shopAddress}}
-							</view>
+				<view class="product-popup-list" v-if="productData.goodsList != null && productData.goodsList.length > 0">
+					<view class="product-popup-card" v-for="(item1,index1) in productData.goodsList" :key="index1">
+						<view class="product-popup-img">
+							<img :src="item1.productPicture" alt="">
 						</view>
-						<view style="height: 160rpx;line-height: 80rpx;">
-							<view style="flex: 1;color: #777;font-weight: 700;">
-								收货地址
+						<view class="product-popup-info">
+							<view class="product-popup-name">
+								{{item1.productName}}
 							</view>
-							<view style="color: #000;font-weight: 700;">
-								{{productData.receiverAddress}}
+							<view class="product-popup-spec">
+								<text class="product-popup-label">规格</text>
+								<text class="product-popup-spec-text">{{item1.specs | delNode}}</text>
 							</view>
 						</view>
-					</view>
-					<view class="box1">
-						
-						<view style="width: 100%;line-height: 70rpx;font-size: 28rpx;font-weight: 700;display: flex;"
-							v-if="productData.shopName != null">
-							<text style="flex:1">{{productData.shopName}}</text>
-							<img @tap="makeCall(productData.shopPhone)"
-								src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/869a7af6a1c24bf3a0d523c4a18b55c6.png"
-								alt="" style="width: 40rpx;height: 40rpx;margin-top: 14rpx;" />
-						</view>
-					
-						<view v-for="(item1,index1) in productData.goodsList" :key="index1"
-							v-if="productData.goodsList != null && productData.goodsList.length > 0"
-							style="display: flex;padding: 20rpx;background: rgba(247, 248, 248, 0.6);border-radius: 20rpx;">
-							<view class="goods-img">
-								<img :src="item1.productPicture" alt="">
-							</view>
-							<view class="goods-content">
-								<view class="goods-name">
-									{{item1.productName}}
-								</view>
-								<view class="goods-content-center">
-									{{item1.specs | delNode}}
-								</view>
-								<view class="goods-content-bottom">
-									<view style="width: 50%;">
-										X{{item1.quantity}}
-									</view>
-									<view class="pintuan-left-price">
-										￥{{item1.price}}
-									</view>
-								</view>
-							</view>
-						</view>
-						<view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.packageFee != null && productData.packageFee > 0">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									打包费
-								</view>
-								<view style="color: #000;font-weight:700;">
-									￥{{productData.packageFee}}
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.deliveryType == 1">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									配送费
-								</view>
-								<view style="color: #000;font-weight:700;">
-									￥{{productData.deliveryFee}}
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.userCouponNum > 0">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									优惠券
-								</view>
-								<view style="color: #000;font-weight:700;">
-									-￥{{productData.userCouponNum}}
-								</view>
-							</view>
-						</view>
-						<view
-							style="display: flex;height: 80rpx;line-height: 100rpx;border-top: 1px solid #eee;font-size: 32rpx;font-weight: 700;">
-							<view style="flex: 1;">
-								实付
-							</view>
-							<view class="">
-								￥{{productData.totalAmount}}
-							</view>
-						</view>
-					</view>
-					
-					<view class="box1">
-						<view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.otherOrder == 1">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									取件地址
-								</view>
-								<view style="color: #000;font-weight: 700;">
-									{{productData.shopAddress}}
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.otherOrder == 1">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									收件地址
-								</view>
-								<view style="color: #000;font-weight: 700;">
-									{{productData.receiverAddress}}
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.otherOrder == 1">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									件数
-								</view>
-								<view style="color: #000;font-weight: 700;">
-									{{productData.deliveryInfo.allCount}}
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.otherOrder == 1">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									服务类型
-								</view>
-								<view style="color: #000;font-weight: 700;">
-									快递/跑腿
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;"
-								v-if="productData.numberCode != null">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									订单号
-								</view>
-								<view style="color: #000;font-weight: 700;">
-									{{productData.numberCode}}
-								</view>
-							</view>
-							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
-								<view style="flex: 1;color: #777;font-weight: 700;">
-									下单时间
-								</view>
-								<view style="color: #000;font-weight: 700;">
-									{{productData.createTime | formatHourMinute}}
-								</view>
-							</view>
+						<view class="product-popup-quantity">
+							<view class="product-popup-quantity-num">x{{item1.quantity}}</view>
+							<view class="product-popup-quantity-label">数量</view>
 						</view>
 					</view>
 				</view>
+				<view class="product-popup-empty" v-else>
+					暂无商品详情
+				</view>
 			</view>
 		</uni-popup>
 
@@ -2486,6 +2360,144 @@
 		line-height: 38rpx;
 	}
 
+	.product-popup-content {
+		width: 680rpx;
+		max-height: 880rpx;
+		padding: 34rpx 28rpx 30rpx;
+		box-sizing: border-box;
+		overflow: scroll;
+		border-radius: 36rpx;
+		background:
+			radial-gradient(circle at 92% 4%, rgba(166, 255, 234, 0.38) 0, rgba(166, 255, 234, 0) 180rpx),
+			linear-gradient(180deg, #ffffff 0%, #f8fffc 100%);
+		box-shadow: 0 24rpx 56rpx rgba(0, 35, 28, 0.18);
+	}
+
+	.product-popup-header {
+		margin-bottom: 26rpx;
+		text-align: center;
+	}
+
+	.product-popup-title {
+		color: #143d35;
+		font-size: 36rpx;
+		font-weight: 900;
+		line-height: 48rpx;
+	}
+
+	.product-popup-subtitle {
+		margin-top: 8rpx;
+		color: #7b8a85;
+		font-size: 24rpx;
+		line-height: 34rpx;
+	}
+
+	.product-popup-list {
+		display: flex;
+		flex-direction: column;
+		gap: 20rpx;
+	}
+
+	.product-popup-card {
+		display: flex;
+		align-items: center;
+		padding: 22rpx;
+		border: 1px solid rgba(166, 255, 234, 0.58);
+		border-radius: 28rpx;
+		background: rgba(255, 255, 255, 0.88);
+		box-shadow: 0 12rpx 28rpx rgba(0, 35, 28, 0.06);
+	}
+
+	.product-popup-img {
+		width: 128rpx;
+		height: 128rpx;
+		flex-shrink: 0;
+		overflow: hidden;
+		border-radius: 22rpx;
+		background: #f0f5f3;
+
+		img {
+			width: 100%;
+			height: 100%;
+			background-size: 100%;
+		}
+	}
+
+	.product-popup-info {
+		flex: 1;
+		min-width: 0;
+		padding: 0 22rpx;
+	}
+
+	.product-popup-name {
+		color: #172f2a;
+		font-size: 30rpx;
+		font-weight: 900;
+		line-height: 42rpx;
+	}
+
+	.product-popup-spec {
+		display: flex;
+		align-items: flex-start;
+		margin-top: 16rpx;
+	}
+
+	.product-popup-label {
+		flex-shrink: 0;
+		height: 34rpx;
+		padding: 0 14rpx;
+		border-radius: 999rpx;
+		background: rgba(166, 255, 234, 0.72);
+		color: #126255;
+		font-size: 20rpx;
+		font-weight: 800;
+		line-height: 34rpx;
+	}
+
+	.product-popup-spec-text {
+		flex: 1;
+		margin-left: 12rpx;
+		color: #65736f;
+		font-size: 24rpx;
+		line-height: 34rpx;
+		word-break: break-all;
+	}
+
+	.product-popup-quantity {
+		width: 92rpx;
+		height: 92rpx;
+		flex-shrink: 0;
+		border-radius: 28rpx;
+		background: linear-gradient(135deg, #fff4ce 0%, #a6ffea 100%);
+		color: #103f36;
+		text-align: center;
+		box-shadow: 0 10rpx 20rpx rgba(0, 35, 28, 0.08);
+	}
+
+	.product-popup-quantity-num {
+		padding-top: 16rpx;
+		font-size: 30rpx;
+		font-weight: 900;
+		line-height: 34rpx;
+	}
+
+	.product-popup-quantity-label {
+		margin-top: 2rpx;
+		color: #52736b;
+		font-size: 20rpx;
+		line-height: 28rpx;
+	}
+
+	.product-popup-empty {
+		padding: 80rpx 20rpx;
+		border-radius: 28rpx;
+		background: rgba(247, 255, 251, 0.9);
+		color: #7b8a85;
+		font-size: 28rpx;
+		font-weight: 700;
+		text-align: center;
+	}
+
 	@keyframes stickyPanelIn {
 		0% {
 			opacity: 0.88;