样式优化

assets/css/page.scss

@@ -1707,9 +1707,18 @@
 	}
 }
 
-// ===== 详情页区块与卡片通用样式（do_anti_rust / 焊口详情页等）=====
+// ===== 区块标题 =====
 .section {
 	margin: 0 24rpx 20rpx;
+	animation: fadeUp 0.5s ease-out both;
+
+	&:nth-child(2) {
+		animation-delay: 0.05s;
+	}
+
+	&:nth-child(3) {
+		animation-delay: 0.15s;
+	}
 
 	&__header {
 		display: flex;
@@ -1722,79 +1731,170 @@
 	&__bar {
 		width: 6rpx;
 		height: 26rpx;
-		background: #2979ff;
+		background: linear-gradient(180deg, $app-primary, #6ba3ff);
 		border-radius: 3rpx;
 		flex-shrink: 0;
+		animation: breathe 2.5s ease-in-out infinite;
 	}
 
 	&__title {
 		font-size: 28rpx;
 		font-weight: 600;
-		color: #0f1724;
+		color: $app-text;
 		letter-spacing: 0.5rpx;
 	}
+
+	.img-box {
+		padding: 20rpx;
+		border-radius: 16rpx;
+		background-color: #ffffff;
+	}
 }
 
+// ===== 信息卡片 =====
+$card-bg: #ffffff;
+$shadow-md: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
+
 .card {
-	background: #fff;
+	background: $card-bg;
-	border-radius: 16rpx;
+	border-radius: $app-radius;
 	overflow: hidden;
-	box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.06);
+	box-shadow: $shadow-md;
 
 	&__row {
 		display: flex;
 		align-items: center;
 		padding: 22rpx 28rpx;
-		border-bottom: 1rpx solid #e8ecf1;
+		border-bottom: 1rpx solid $app-border;
+		transition: background 0.25s ease;
 
 		&:last-child {
 			border-bottom: none;
 		}
 
+		&:active {
+			background: #f5f4f1;
+		}
+
 		&--stack {
 			flex-direction: column;
 			align-items: flex-start;
+
 			.card__label {
-				margin-bottom: 8rpx;
+				width: auto;
+				padding-left: 16rpx;
+				margin-bottom: 12rpx;
+
+				&::before {
+					content: '';
+					position: absolute;
+					left: 0;
+					top: 50%;
+					transform: translateY(-50%);
+					width: 4rpx;
+					height: 16rpx;
+					background: $app-primary-mid;
+					border-radius: 2rpx;
+				}
 			}
+
+			.card__value {
+				width: 100%;
+				text-align: left;
+			}
+
 			.card__value-wrap {
 				width: 100%;
 				justify-content: flex-start;
 			}
+
+			.card__input {
+				text-align: left;
+				min-height: 132rpx;
+			}
+
+			.remark-input {
+				width: 100%;
+				text-align: left;
+				font-size: 28rpx;
+				color: $app-text;
+				padding: 20rpx 24rpx;
+				background: #f7f8fa;
+				border-radius: 12rpx;
+				line-height: 1.6;
+				min-height: 140rpx;
+				box-sizing: border-box;
+
+				&::placeholder {
+					color: #b0bec5;
+				}
+			}
 		}
 	}
 
 	&__label {
 		width: 180rpx;
 		font-size: 26rpx;
-		color: #6b7c93;
+		color: $app-text-secondary;
 		flex-shrink: 0;
+		position: relative;
+		padding-left: 16rpx;
+
+		&::before {
+			content: '';
+			position: absolute;
+			left: 0;
+			top: 50%;
+			transform: translateY(-50%);
+			width: 4rpx;
+			height: 16rpx;
+			background: $app-primary-mid;
+			border-radius: 2rpx;
+		}
+
+		&.required::before {
+			background: #ff0000;
+		}
 	}
 
 	&__value {
 		flex: 1;
+		font-family: "SF Mono", "Menlo", "Consolas", monospace;
 		font-size: 28rpx;
+		font-weight: 500;
 		color: #0f1724;
+		letter-spacing: 0.3rpx;
 		text-align: left;
+
+		&--placeholder {
+			color: #888888;
+			font-weight: 400;
+		}
 	}
 
 	&__value-wrap {
 		flex: 1;
 		display: flex;
 		align-items: center;
+		justify-content: flex-start;
 		gap: 8rpx;
+
+		&--clickable {
+			min-height: 48rpx;
+			justify-content: flex-end;
+		}
 	}
 
 	&__unit {
 		font-size: 24rpx;
-		color: #6b7c93;
+		color: $app-text-secondary;
 		flex-shrink: 0;
 	}
 
 	&__input {
 		flex: 1;
 		font-size: 28rpx;
-		color: #0f1724;
+		color: $app-text;
 		text-align: left;
 		height: 48rpx;
 

components/nbd-anti-record.vue

@@ -87,8 +87,8 @@
 			</view>
 
 			<!-- 弹窗：全部记录 -->
-			<view class="anti-record__overlay" v-if="showPopup" @click="showPopup = false">
+			<u-popup v-model="showPopup" mode="bottom" :safe-area-inset-bottom="true">
-				<view class="anti-record__popup" @click.stop>
+				<view class="anti-record__popup">
 					<view class="anti-record__popup-hd">
 						<text class="anti-record__popup-title">全部防腐记录</text>
 						<text class="anti-record__popup-close" @click="showPopup = false">✕</text>
@@ -162,7 +162,7 @@
 						</view>
 					</scroll-view>
 				</view>
-			</view>
+			</u-popup>
 		</template>
 	</view>
 </template>
@@ -328,16 +328,24 @@ $text-secondary: #8e99a4;
 	}
 
 	&__value {
-		font-size: 26rpx;
 		color: $text;
 		flex: 1;
 		text-align: left;
+		font-family: "SF Mono", "Menlo", "Consolas", monospace;
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #0f1724;
+		letter-spacing: 0.3rpx;
 
 		&--stack {
-			font-size: 24rpx;
 			padding-left: 20rpx;
 			padding-bottom: 8rpx;
 			padding-top: 8rpx;
+			font-family: "SF Mono", "Menlo", "Consolas", monospace;
+			font-size: 28rpx;
+			font-weight: 500;
+			color: #0f1724;
+			letter-spacing: 0.3rpx;
 		}
 	}
 
@@ -386,24 +394,12 @@ $text-secondary: #8e99a4;
 	}
 
 	// ===== 弹窗 =====
-	&__overlay {
-		position: fixed;
-		inset: 0;
-		z-index: 999;
-		background: rgba(0, 0, 0, 0.45);
-		display: flex;
-		align-items: flex-end;
-		justify-content: center;
-	}
-
 	&__popup {
-		width: 100%;
-		height: 80vh;
 		background: #fff;
-		border-radius: 24rpx 24rpx 0 0;
 		display: flex;
 		flex-direction: column;
-		animation: slideUp 0.3s ease-out;
+		height: 80vh;
+		border-radius: 24rpx 24rpx 0 0;
 	}
 
 	&__popup-hd {
@@ -431,7 +427,7 @@ $text-secondary: #8e99a4;
 		box-sizing: border-box;
 		overflow-y: auto;
 		background: #f5f5f5;
-		padding: 12rpx 28rpx 36rpx;
+		padding: 12rpx 20rpx 20rpx;
 	}
 
 	&__card--popup {
@@ -445,14 +441,4 @@ $text-secondary: #8e99a4;
 		margin-bottom: 0;
 	}
 }
-
-@keyframes slideUp {
-	0% {
-		transform: translateY(100%);
-	}
-
-	100% {
-		transform: translateY(0);
-	}
-}
 </style>

scanpages/hj/do_anti_rust.vue

@@ -481,197 +481,6 @@ $shadow-md: 0 2rpx 12rpx rgba(0, 0, 0, 0.04), 0 8rpx 24rpx rgba(0, 0, 0, 0.06);
 	}
 }
 
-// ===== 区块标题 =====
-.section {
-	margin: 0 24rpx 20rpx;
-	animation: fadeUp 0.5s ease-out both;
-
-	&:nth-child(2) {
-		animation-delay: 0.05s;
-	}
-
-	&:nth-child(3) {
-		animation-delay: 0.15s;
-	}
-
-	&__header {
-		display: flex;
-		align-items: center;
-		gap: 12rpx;
-		margin-bottom: 14rpx;
-		padding: 0 6rpx;
-	}
-
-	&__bar {
-		width: 6rpx;
-		height: 26rpx;
-		background: linear-gradient(180deg, $primary, #6ba3ff);
-		border-radius: 3rpx;
-		flex-shrink: 0;
-		animation: breathe 2.5s ease-in-out infinite;
-	}
-
-	&__title {
-		font-size: 28rpx;
-		font-weight: 600;
-		color: $text;
-		letter-spacing: 0.5rpx;
-	}
-
-	.img-box {
-		padding: 20rpx;
-		border-radius: 16rpx;
-		background-color: #ffffff;
-	}
-}
-
-// ===== 信息卡片 =====
-.card {
-	background: $card-bg;
-	border-radius: $radius;
-	overflow: hidden;
-	box-shadow: $shadow-md;
-
-	&__row {
-		display: flex;
-		align-items: center;
-		padding: 22rpx 28rpx;
-		border-bottom: 1rpx solid $border;
-		transition: background 0.25s ease;
-
-		&:last-child {
-			border-bottom: none;
-		}
-
-		&:active {
-			background: #f5f4f1;
-		}
-
-		&--stack {
-			flex-direction: column;
-			align-items: flex-start;
-
-			.card__label {
-				width: auto;
-				padding-left: 16rpx;
-				margin-bottom: 12rpx;
-
-				&::before {
-					content: '';
-					position: absolute;
-					left: 0;
-					top: 50%;
-					transform: translateY(-50%);
-					width: 4rpx;
-					height: 16rpx;
-					background: $primary-mid;
-					border-radius: 2rpx;
-				}
-			}
-
-			.card__value {
-				width: 100%;
-				text-align: left;
-			}
-
-			.card__value-wrap {
-				width: 100%;
-				justify-content: flex-start;
-			}
-
-			.card__input {
-				text-align: left;
-				min-height: 132rpx;
-			}
-
-			.remark-input {
-				width: 100%;
-				text-align: left;
-				font-size: 28rpx;
-				color: $text;
-				padding: 20rpx 24rpx;
-				background: #f7f8fa;
-				border-radius: 12rpx;
-				line-height: 1.6;
-				min-height: 140rpx;
-				box-sizing: border-box;
-
-				&::placeholder {
-					color: #b0bec5;
-				}
-			}
-		}
-	}
-
-	&__label {
-		width: 180rpx;
-		font-size: 26rpx;
-		color: $text-secondary;
-		flex-shrink: 0;
-		position: relative;
-		padding-left: 16rpx;
-
-		&::before {
-			content: '';
-			position: absolute;
-			left: 0;
-			top: 50%;
-			transform: translateY(-50%);
-			width: 4rpx;
-			height: 16rpx;
-			background: $primary-mid;
-			border-radius: 2rpx;
-		}
-
-		&.required::before {
-			background: #ff0000;
-		}
-	}
-
-	&__value {
-		flex: 1;
-		font-size: 28rpx;
-		color: $text;
-		font-weight: 500;
-		text-align: left;
-
-		&--placeholder {
-			color: #888888;
-			font-weight: 400;
-		}
-	}
-
-	&__value-wrap {
-		flex: 1;
-		display: flex;
-		align-items: center;
-		justify-content: flex-start;
-		gap: 8rpx;
-
-		&--clickable {
-			min-height: 48rpx;
-			justify-content: flex-end;
-		}
-	}
-
-	&__unit {
-		font-size: 24rpx;
-		color: $text-secondary;
-		flex-shrink: 0;
-	}
-
-	&__input {
-		flex: 1;
-		font-size: 28rpx;
-		color: $text;
-		text-align: left;
-		height: 48rpx;
-
-		&::placeholder {
-			color: #b0bec5;
-		}
-	}
-}
 
 // ===== 不合格区域切换动画 =====
 .fail-section {

scanpages/hj/make_right.vue

@@ -348,129 +348,36 @@ $shadow-md: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
 	}
 }
 
-// ===== 区块标题 =====
+// ===== 卡片页面覆盖（继承 page.scss 公共 .card 样式）=====
-.section {
+.card__row {
-	margin: 0 24rpx 20rpx;
+	&:active {
-
+		background: #fafbfc;
-	&__header {
-		display: flex;
-		align-items: center;
-		gap: 12rpx;
-		margin-bottom: 14rpx;
-		padding: 0 6rpx;
 	}
 
-	&__bar {
+	&--warn .card__label::before {
-		width: 6rpx;
+		background: #ef4444;
-		height: 26rpx;
-		background: linear-gradient(180deg, $primary, #6ba3ff);
-		border-radius: 3rpx;
-		flex-shrink: 0;
-	}
-
-	&__title {
-		font-size: 28rpx;
-		font-weight: 600;
-		color: $text;
-		letter-spacing: 0.5rpx;
-	}
-
-	.img-box {
-		padding: 20rpx;
-		border-radius: 16rpx;
-		background-color: #ffffff;
 	}
 }
 
-// ===== 信息卡片 =====
+.card__value {
-.card {
+	text-align: right;
-	background: $card-bg;
-	border-radius: $radius;
-	overflow: hidden;
-	box-shadow: $shadow-md;
 
-	&__row {
+	&--placeholder {
-		display: flex;
+		color: #b0bec5;
-		align-items: center;
+		font-weight: 400;
-		padding: 22rpx 28rpx;
-		border-bottom: 1rpx solid $border;
-
-		&:last-child {
-			border-bottom: none;
-		}
-
-		&:active {
-			background: #fafbfc;
-		}
-
-		&--warn .card__label::before {
-			background: #ef4444;
-		}
 	}
+}
 
-	&__label {
+.card__value-wrap {
-		width: 180rpx;
+	justify-content: flex-end;
-		font-size: 26rpx;
+}
-		color: $text-secondary;
-		flex-shrink: 0;
-		position: relative;
-		padding-left: 16rpx;
 
-		&::before {
+.card__input {
-			content: '';
+	text-align: right;
-			position: absolute;
+	padding: 0;
-			left: 0;
-			top: 50%;
-			transform: translateY(-50%);
-			width: 4rpx;
-			height: 16rpx;
-			background: $primary-mid;
-			border-radius: 2rpx;
-		}
-	}
 
-	&__value {
+	&::placeholder {
-		flex: 1;
+		color: #b0bec5;
-		font-size: 28rpx;
-		color: $text;
-		font-weight: 500;
-		text-align: right;
-
-		&--placeholder {
-			color: #b0bec5;
-			font-weight: 400;
-		}
-	}
-
-	&__value-wrap {
-		flex: 1;
-		display: flex;
-		align-items: center;
-		justify-content: flex-end;
-		gap: 8rpx;
-
-		&--clickable {
-			min-height: 48rpx;
-		}
-	}
-
-	&__input {
-		flex: 1;
-		font-size: 28rpx;
-		color: $text;
-		text-align: right;
-		height: 48rpx;
-		padding: 0;
-
-		&::placeholder {
-			color: #b0bec5;
-		}
-	}
-
-	&__unit {
-		font-size: 24rpx;
-		color: $text-secondary;
-		flex-shrink: 0;
 	}
 }
 

scanpages/hj/materials_detail.vue

@@ -156,64 +156,41 @@ const showPrint = ref(false)
 
 	}
 
-	// ===== 区块标题 =====
+	// ===== 区块标题（页面覆盖）=====
 	.section {
-		margin: 0 24rpx 20rpx;
+		// 无动画
+		animation: none;
 
 		&__header {
-			display: flex;
-			align-items: center;
-			gap: 12rpx;
 			margin-bottom: 16rpx;
 			padding: 0 4rpx;
 		}
 
 		&__bar {
-			width: 6rpx;
 			height: 28rpx;
 			background: $primary;
-			border-radius: 3rpx;
+			animation: none;
-			flex-shrink: 0;
-		}
-
-		&__title {
-			font-size: 28rpx;
-			font-weight: 600;
-			color: $text;
 		}
 	}
 
-	// ===== 卡片 =====
+	// ===== 卡片（页面覆盖，继承 page.scss 公共 .card 样式）=====
 	.card {
-		background: $card-bg;
-		border-radius: $radius;
-		overflow: hidden;
 		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
 
 		&__row {
-			display: flex;
-			align-items: center;
 			padding: 24rpx 28rpx;
-			border-bottom: 1rpx solid $border;
-
-			&:last-child {
-				border-bottom: none;
-			}
 		}
 
 		&__label {
 			width: 120rpx;
-			font-size: 26rpx;
+			padding-left: 0;
-			color: $text-secondary;
+
-			flex-shrink: 0;
+			&::before {
+				display: none;
+			}
 		}
 
 		&__value {
-			flex: 1;
-			font-size: 28rpx;
-			color: $text;
-			font-weight: 500;
-
 			&--mono {
 				font-family: monospace;
 				color: $primary-dark;
@@ -221,9 +198,6 @@ const showPrint = ref(false)
 		}
 
 		&__value-wrap {
-			flex: 1;
-			display: flex;
-			align-items: center;
 			gap: 12rpx;
 		}
 	}