From 2bd94a1e5ad3f29a8664020004f79966e284d33a Mon Sep 17 00:00:00 2001
From: ZF sun <34314687@qq.com>
Date: Fri, 29 May 2026 14:28:47 +0800
Subject: [PATCH] style(merch/detail): extract inline styles to class selectors

extract inline css styles from template and style block into reusable scoped class selectors, improve code readability and maintainability
---
 pages_promotion/merch/detail.vue | 40 +++++++++++++++++++++++++++-----
 1 file changed, 34 insertions(+), 6 deletions(-)

diff --git a/pages_promotion/merch/detail.vue b/pages_promotion/merch/detail.vue
index 353703c..4f5d148 100644
--- a/pages_promotion/merch/detail.vue
+++ b/pages_promotion/merch/detail.vue
@@ -11,19 +11,19 @@
 				</view>
 				<view class="iconfont" :class="{ 'icon-apps': isList, 'icon-list': !isList }" @click="changeListStyle()"></view> -->
 
-				<view style="width: 100rpx;height: 100rpx;">
-					<image :src="$util.img(merch.merch_image)" mode="widthFix" style="width: 100rpx;height: 100rpx;"  show-menu-by-longpress/>
+				<view class="merch-image-wrap">
+					<image :src="$util.img(merch.merch_image)" mode="widthFix" class="merch-image-wrap"  show-menu-by-longpress/>
 				</view>
-				<view style="margin-left: 20rpx;padding-top: 22rpx;">
-					<view style="line-height: 1;font-size: 32rpx;font-weight: 600;">{{ merch.merch_name }}</view>
-					<view style="color:rgb(255 202 40)">
+				<view class="merch-info">
+					<view class="merch-name">{{ merch.merch_name }}</view>
+					<view class="merch-star">
 						<text class="icox icox-xing"></text>
 						<text class="icox icox-xing"></text>
 						<text class="icox icox-xing"></text>
 						<text class="icox icox-xing"></text>
 						<text class="icox icox-xing"></text>
 					</view>
-					<view style="overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;" @longpress="showFullDesc">{{ merch.desc }}</view>
+					<view class="desc-text" @longpress="showFullDesc">{{ merch.desc }}</view>
 				</view>
 
 			</view>
@@ -367,6 +367,34 @@ export default {
 @import './public/css/list.scss';
 </style>
 <style scoped>
+.merch-image-wrap {
+	width: 100rpx;
+	height: 100rpx;
+}
+
+.merch-info {
+	margin-left: 20rpx;
+	padding-top: 22rpx;
+}
+
+.merch-name {
+	line-height: 1;
+	font-size: 32rpx;
+	font-weight: 600;
+}
+
+.merch-star {
+	color: rgb(255 202 40);
+}
+
+.desc-text {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+}
+
 ::v-deep .uni-tag--primary.uni-tag--inverted {
 	background-color: #f5f5f5 !important;
 }