继续优化第二阶段溯源页面

pages/trace/detail.vue

@@ -89,12 +89,12 @@
 				</view>
 			</view>
 
-			<!-- 农场信息（合并为单卡：图片+名称+地区+介绍连续表达） -->
+				<!-- 农场信息（合并为单卡：图片+名称+地区+介绍连续表达） -->
 			<view v-if="traceDetail.farm?.name" class="card cardLevel2 cardFarm">
 				<view class="sectionHeader">
 					<view class="sectionHeaderLeft">
-						<text class="sectionEn">Farm</text>
-						<text class="sectionTitle">农场信息</text>
+						<text class="sectionEn">Origin</text>
+						<text class="sectionTitle">源头农场</text>
 					</view>
 				</view>
 
@@ -102,19 +102,24 @@
 				<view class="farmBody">
 					<view class="farmImageWrap">
 						<image class="farmImage" :src="traceDetail.farm.image" mode="aspectFill" />
+						<view class="farmImageVignette" />
 					</view>
 					<view class="farmMeta">
 						<text class="farmName">{{ traceDetail.farm.name }}</text>
+						<view class="farmTags">
+							<text class="farmTag">真实种植</text>
+							<text class="farmTag">可追溯来源</text>
+						</view>
 						<view v-if="traceDetail.farm.location" class="farmLocation">
 							<svg class="locationIcon" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
 								<path d="M10 2C7.24 2 5 4.24 5 7c0 4 5 11 5 11s5-7 5-11c0-2.76-2.24-5-5-5zm0 6.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z" fill="rgba(39,113,76,0.6)"/>
 							</svg>
-							<text class="locationText">{{ traceDetail.farm.location }}</text>
+							<text class="locationText">产地：{{ traceDetail.farm.location }}</text>
 						</view>
 					</view>
 				</view>
 				<view v-if="traceDetail.farm?.intro" class="farmIntro">
-					<text>{{ traceDetail.farm.intro }}</text>
+					<text class="farmIntroOrigin">{{ traceDetail.farm.intro }}</text>
 				</view>
 			</view>
 
@@ -552,6 +557,11 @@
 				</view>
 			</view>
 
+			<!-- 安心收口文案 -->
+			<view class="pageEndHint">
+				<text>本产品已完成全流程溯源记录，信息真实可查，请放心食用。</text>
+			</view>
+
 			<!-- 底部柔和收口渐变 -->
 			<view class="footerFade" />
 			<!-- 轻量页脚 -->
@@ -2210,7 +2220,7 @@ function previewDoc(kind, index) {
 
 .heroBrandAnchorText {
 	font-size: 164rpx;
-	font-weight: 760;
+	font-weight: 700;
 	letter-spacing: 0.1em;
 	line-height: 1;
 	color: rgba(248, 241, 227, 0.045);
@@ -2275,7 +2285,7 @@ function previewDoc(kind, index) {
 .infoPanelName {
 	display: block;
 	font-size: 30rpx;
-	font-weight: 680;
+	font-weight: 600;
 	line-height: 1.4;
 	letter-spacing: 0.01em;
 	color: rgba(27, 41, 33, 0.92);
@@ -2301,7 +2311,7 @@ function previewDoc(kind, index) {
 
 .specText {
 	font-size: 20rpx;
-	font-weight: 500;
+	font-weight: 400;
 	color: rgba(54, 66, 57, 0.85);
 }
 
@@ -2399,8 +2409,8 @@ function previewDoc(kind, index) {
 
 .conclusionLead {
 	display: block;
-	font-size: 32rpx;
-	font-weight: 680;
+	font-size: 30rpx;
+	font-weight: 600;
 	line-height: 1.5;
 	letter-spacing: 0.01em;
 	color: rgba(24, 38, 30, 0.96);
@@ -2472,11 +2482,11 @@ function previewDoc(kind, index) {
 
 .timelineTitle {
 	display: block;
-	font-size: 27rpx;
-	font-weight: 600;
+	font-size: 25rpx;
+	font-weight: 500;
 	color: rgba(27, 41, 33, 0.88);
 	margin-bottom: 6rpx;
-	line-height: 1.3;
+	line-height: 1.35;
 }
 
 .timelineDesc {
@@ -2504,7 +2514,7 @@ function previewDoc(kind, index) {
 }
 
 .timelineItem.is-current .timelineTitle {
-	font-weight: 700;
+	font-weight: 600;
 	color: rgba(20, 60, 40, 0.95);
 }
 
@@ -2674,7 +2684,7 @@ function previewDoc(kind, index) {
 }
 
 .environmentSummary {
-	font-size: 28rpx;
+	font-size: 26rpx;
 	font-weight: 500;
 	color: rgba(27, 41, 33, 0.8);
 	line-height: 1.6;
@@ -2696,8 +2706,8 @@ function previewDoc(kind, index) {
 
 .environmentChartTitle {
 	display: block;
-	font-size: 26rpx;
-	font-weight: 600;
+	font-size: 24rpx;
+	font-weight: 500;
 	color: rgba(27, 41, 33, 0.75);
 }
 
@@ -2852,13 +2862,13 @@ function previewDoc(kind, index) {
 }
 
 .environmentLabel {
-	font-size: 20rpx;
+	font-size: 18rpx;
 	color: rgba(84, 106, 93, 0.45);
 }
 
 .environmentValue {
-	font-size: 30rpx;
-	font-weight: 600;
+	font-size: 26rpx;
+	font-weight: 500;
 	color: rgba(27, 41, 33, 0.8);
 	line-height: 1.2;
 }
@@ -3033,7 +3043,7 @@ function previewDoc(kind, index) {
 .reportCardValue {
 	font-size: 16rpx;
 	color: rgba(68, 82, 72, 0.85);
-	font-weight: 460;
+	font-weight: 400;
 	text-align: right;
 	word-break: break-all;
 }
@@ -3103,14 +3113,14 @@ function previewDoc(kind, index) {
 }
 
 .sectionTitle {
-	font-size: 27rpx;
-	font-weight: 620;
+	font-size: 26rpx;
+	font-weight: 600;
 	color: rgba(60, 72, 64, 0.72);
 }
 
 .statusBadge {
 	font-size: 18rpx;
-	font-weight: 620;
+	font-weight: 600;
 	padding: 9rpx 15rpx;
 	border-radius: 999rpx;
 	white-space: nowrap;
@@ -3175,7 +3185,7 @@ function previewDoc(kind, index) {
 /* 文案：品牌深绿，字重略降，视觉权重低于图标 */
 .trustBadgeText {
 	font-size: 18rpx;
-	font-weight: 500;
+	font-weight: 400;
 	letter-spacing: 0.05em;
 	color: rgba(27, 71, 42, 0.68);
 }
@@ -3200,8 +3210,8 @@ function previewDoc(kind, index) {
 }
 
 .kvVal {
-	font-size: 24rpx;
-	font-weight: 660;
+	font-size: 23rpx;
+	font-weight: 400;
 	text-align: right;
 	color: rgba(27, 41, 33, 0.92);
 }
@@ -3233,6 +3243,18 @@ function previewDoc(kind, index) {
 	background: linear-gradient(160deg, rgba(234, 245, 240, 0.9), rgba(220, 238, 228, 0.85));
 }
 
+/* 图片暗角效果：增强真实场景感 */
+.farmImageVignette {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	border-radius: 22rpx;
+	background: radial-gradient(ellipse at 50% 50%, transparent 60%, rgba(24, 41, 30, 0.12) 100%);
+	pointer-events: none;
+}
+
 .farmMeta {
 	flex: 1;
 	display: flex;
@@ -3243,9 +3265,9 @@ function previewDoc(kind, index) {
 }
 
 .farmName {
-	font-size: 28rpx;
-	font-weight: 680;
-	line-height: 1.45;
+	font-size: 30rpx;
+	font-weight: 600;
+	line-height: 1.4;
 	letter-spacing: 0.01em;
 	color: rgba(27, 41, 33, 0.94);
 }
@@ -3255,6 +3277,26 @@ function previewDoc(kind, index) {
 	display: flex;
 	align-items: flex-start;
 	gap: 8rpx;
+	margin-top: 8rpx;
+}
+
+/* 轻量标签：真实种植、可追溯来源 */
+.farmTags {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 8rpx;
+	margin-top: 6rpx;
+}
+
+.farmTag {
+	padding: 4rpx 12rpx;
+	font-size: 18rpx;
+	font-weight: 400;
+	color: rgba(39, 113, 76, 0.85);
+	background: rgba(39, 113, 76, 0.08);
+	border-radius: 8rpx;
+	line-height: 1.4;
+	letter-spacing: 0.01em;
 }
 
 /* 定位小图标：略弱、与首行文字视觉对齐 */
@@ -3277,10 +3319,20 @@ function previewDoc(kind, index) {
 
 /* 农场介绍：融入主体，使用分隔线区分，与商品简介风格统一 */
 .farmIntro {
+	display: flex;
+	flex-direction: column;
+	gap: 10rpx;
 	padding-top: 18rpx;
 	border-top: 1rpx solid rgba(39, 75, 57, 0.06);
 	font-size: 23rpx;
-	line-height: 1.86;
+	line-height: 2;
+	color: rgba(54, 68, 58, 0.76);
+}
+
+/* 原始农场简介 */
+.farmIntroOrigin {
+	font-size: 23rpx;
+	line-height: 2;
 	color: rgba(54, 68, 58, 0.76);
 }
 
@@ -3316,7 +3368,7 @@ function previewDoc(kind, index) {
 .certSummaryRow {
 	display: flex;
 	flex-direction: column;
-	gap: 4rpx;
+	gap: 2rpx;
 }
 
 .certSummaryLabel {
@@ -3327,9 +3379,9 @@ function previewDoc(kind, index) {
 }
 
 .certSummaryValue {
-	font-size: 25rpx;
-	font-weight: 580;
-	color: rgba(27, 41, 33, 0.9);
+	font-size: 23rpx;
+	font-weight: 400;
+	color: rgba(27, 41, 33, 0.8);
 	line-height: 1.4;
 }
 
@@ -3338,18 +3390,17 @@ function previewDoc(kind, index) {
 	display: flex;
 	flex-direction: column;
 	align-items: center;
-	gap: 4rpx;
+	gap: 6rpx;
 }
 
 .certThumbContainer .certThumbWrap {
-	/* 与左侧两行摘要区总高约齐平：缩略图 + gap + 提示行 */
-	width: 88rpx;
-	height: 120rpx;
-	border-radius: 8rpx;
+	width: 100rpx;
+	height: 136rpx;
+	border-radius: 10rpx;
 	overflow: hidden;
 	background: #fff;
-	border: 1rpx solid rgba(200, 180, 140, 0.22);
-	box-shadow: 0 2rpx 8rpx rgba(30, 36, 26, 0.06);
+	border: 1rpx solid rgba(200, 180, 140, 0.18);
+	box-shadow: 0 2rpx 8rpx rgba(30, 36, 26, 0.05);
 }
 
 .certThumbContainer .certThumbImage {
@@ -3359,9 +3410,9 @@ function previewDoc(kind, index) {
 }
 
 .certPreviewHint {
-	font-size: 16rpx;
-	line-height: 1.15;
-	color: rgba(39, 75, 57, 0.4);
+	font-size: 15rpx;
+	line-height: 1.2;
+	color: rgba(39, 75, 57, 0.38);
 	letter-spacing: 0.01em;
 }
 
@@ -3424,7 +3475,7 @@ function previewDoc(kind, index) {
 	display: block;
 	margin-bottom: 10rpx;
 	font-size: 22rpx;
-	font-weight: 620;
+	font-weight: 600;
 	color: rgba(45, 87, 64, 0.84);
 }
 
@@ -3469,27 +3520,41 @@ function previewDoc(kind, index) {
 .batchRowValue {
 	flex: 1;
 	min-width: 0;
-	font-size: 25rpx;
-	font-weight: 580;
+	font-size: 23rpx;
+	font-weight: 400;
 	line-height: 1.4;
 	letter-spacing: 0.01em;
-	color: rgba(27, 41, 33, 0.9);
+	color: rgba(0, 0, 0, 0.85);
 }
 
 .cardCredential .certSummary {
 	margin-top: 4rpx;
 }
 
+/* 安心收口文案 */
+.pageEndHint {
+	padding: 28rpx 32rpx 20rpx;
+	text-align: center;
+}
+
+.pageEndHint text {
+	font-size: 20rpx;
+	font-weight: 400;
+	line-height: 1.65;
+	color: rgba(88, 100, 92, 0.45);
+	letter-spacing: 0.03em;
+}
+
 /* 底部柔和收口渐变 */
 .footerFade {
 	position: relative;
 	height: 1rpx;
-	margin: 0 80rpx;
+	margin: 0 100rpx;
 	background: linear-gradient(90deg,
 		transparent 0%,
-		rgba(39, 75, 57, 0.15) 30%,
-		rgba(39, 75, 57, 0.2) 50%,
-		rgba(39, 75, 57, 0.15) 70%,
+		rgba(39, 75, 57, 0.1) 30%,
+		rgba(39, 75, 57, 0.14) 50%,
+		rgba(39, 75, 57, 0.1) 70%,
 		transparent 100%
 	);
 }
@@ -3500,32 +3565,32 @@ function previewDoc(kind, index) {
 	top: 0;
 	left: 50%;
 	transform: translateX(-50%);
-	width: 60%;
-	height: 80rpx;
-	background: radial-gradient(ellipse at 50% 100%, rgba(39, 75, 57, 0.06), transparent 70%);
+	width: 50%;
+	height: 32rpx;
+	background: radial-gradient(ellipse at 50% 100%, rgba(39, 75, 57, 0.04), transparent 70%);
 }
 
 /* 轻量页脚 */
 .traceFooter {
-	padding: 36rpx 32rpx 52rpx;
+	padding: 20rpx 32rpx 64rpx;
 	display: flex;
 	flex-direction: column;
 	align-items: center;
-	gap: 14rpx;
+	gap: 10rpx;
 }
 
 .traceFooterHint {
-	font-size: 20rpx;
+	font-size: 19rpx;
 	font-weight: 400;
-	color: rgba(88, 100, 92, 0.45);
-	letter-spacing: 0.03em;
+	color: rgba(88, 100, 92, 0.4);
+	letter-spacing: 0.04em;
 }
 
 .traceFooterPhone {
 	display: flex;
 	align-items: center;
 	gap: 6rpx;
-	padding: 8rpx 16rpx;
+	padding: 6rpx 14rpx;
 	border-radius: 6rpx;
 	transition: opacity 0.2s ease;
 }
@@ -3535,24 +3600,24 @@ function previewDoc(kind, index) {
 }
 
 .traceFooterPhoneIcon {
-	width: 22rpx;
-	height: 22rpx;
-	opacity: 0.55;
+	width: 20rpx;
+	height: 20rpx;
+	opacity: 0.45;
 }
 
 .traceFooterPhoneNum {
-	font-size: 22rpx;
+	font-size: 21rpx;
 	font-weight: 400;
-	color: rgba(39, 75, 57, 0.6);
+	color: rgba(39, 75, 57, 0.52);
 	letter-spacing: 0.04em;
 }
 
 .traceFooterBrand {
-	font-size: 17rpx;
+	font-size: 16rpx;
 	font-weight: 400;
 	letter-spacing: 0.1em;
-	color: rgba(88, 100, 92, 0.3);
-	margin-top: 8rpx;
+	color: rgba(88, 100, 92, 0.26);
+	margin-top: 6rpx;
 }
 /* 视频预览区域 */
 	.video-section {