优化价格显示

src/views/Orders.vue

@@ -73,11 +73,15 @@
                   <h4 class="item-name">{{ item.product.name }}</h4>
                   <p class="item-desc">{{ truncateText(item.product.description, 40) }}</p>
                   <div class="item-price">
-                    <div class="price-group">
-                      <span class="price">
-                        <el-icon><Coin /></el-icon>
-                        {{ item.points }}
-                      </span>
+                    <div class="item-price-container">
+                      <div class="item-main-price">
+                        <img src="/imgs/profile/融豆.png" alt="融豆" class="item-rongdou-icon" />
+                        <span class="item-rongdou-price">{{ item.rongdouPrice }}</span>
+                      </div>
+                      <div class="item-sub-price">
+                        <el-icon class="item-points-icon"><Coin /></el-icon>
+                        <span class="item-points-price">{{ item.points }}</span>
+                      </div>
                     </div>
                     <span class="quantity">x{{ item.quantity }}</span>
                   </div>
@@ -92,8 +96,9 @@
               <div class="total-price">
                 <span>总计：</span>
                 <div class="total-price-group">
-                  <span class="total-points">
-                    <el-icon><Coin /></el-icon>{{ order.totalPoints }}
+                  <span class="total-rongdou">
+                    <img src="/imgs/profile/融豆.png" alt="融豆" class="total-rongdou-icon" />
+                    {{ order.totalRongdou }}
                   </span>
                 </div>
               </div>
@@ -248,8 +253,15 @@
               <p>{{ item.product.description }}</p>
               <p v-if="item.specInfo" class="spec-info">规格：{{ item.specInfo }}</p>
               <div class="product-price">
-                <div class="detail-item-price-group">
-                  <span><el-icon><Coin /></el-icon>{{ item.points }}</span>
+                <div class="detail-item-price-container">
+                  <div class="detail-item-main-price">
+                    <img src="/imgs/profile/融豆.png" alt="融豆" class="detail-rongdou-icon" />
+                    <span class="detail-rongdou-price">{{ item.rongdouPrice }}</span>
+                  </div>
+                  <div class="detail-item-sub-price">
+                    <el-icon class="detail-points-icon"><Coin /></el-icon>
+                    <span class="detail-points-price">{{ item.points }}</span>
+                  </div>
                 </div>
                 <span class="quantity-text">x {{ item.quantity }}</span>
               </div>
@@ -271,7 +283,8 @@
             <span class="label">商品总计：</span>
             <div class="value">
               <span class="detail-price-group">
-                <span><el-icon><Coin /></el-icon>{{ orderDetail.totalPoints }}</span>
+                <img src="/imgs/profile/融豆.png" alt="融豆" class="cost-rongdou-icon" />
+                <span>{{ orderDetail.totalRongdou }}</span>
               </span>
             </div>
           </div>
@@ -279,7 +292,8 @@
             <span class="label">实付：</span>
             <div class="value">
               <span class="detail-price-group">
-                <span><el-icon><Coin /></el-icon>{{ orderDetail.totalPoints }}</span>
+                <img src="/imgs/profile/融豆.png" alt="融豆" class="cost-rongdou-icon" />
+                <span>{{ orderDetail.totalRongdou }}</span>
               </span>
             </div>
           </div>
@@ -1045,6 +1059,11 @@ onMounted(() => {
   font-size: 14px;
 }
 
+.detail-item-price-group img {
+  width: 12px !important;
+  height: 12px !important;
+}
+
 .quantity-text {
   color: #999;
   font-size: 12px;
@@ -1058,6 +1077,11 @@ onMounted(() => {
   font-weight: 600;
 }
 
+.detail-price-group img {
+  width: 14px !important;
+  height: 14px !important;
+}
+
 .spec-info {
   font-size: 12px;
   color: #666;
@@ -1068,6 +1092,113 @@ onMounted(() => {
   display: inline-block;
 }
 
+/* 商品价格显示样式 */
+.item-price-container {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 2px;
+  margin-bottom: 4px;
+}
+
+.item-main-price {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+
+.item-rongdou-icon {
+  width: 12px;
+  height: 12px;
+}
+
+.item-rongdou-price {
+  font-size: 12px;
+  font-weight: 500;
+  color: #333;
+}
+
+.item-sub-price {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+
+.item-points-icon {
+  font-size: 10px;
+  color: #ffae00;
+}
+
+.item-points-price {
+  font-size: 10px;
+  color: #666;
+}
+
+/* 订单总计融豆图标样式 */
+.total-rongdou-icon {
+  width: 14px;
+  height: 14px;
+  margin-right: 2px;
+}
+
+/* 订单详情商品价格样式 */
+.detail-item-price-container {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 2px;
+}
+
+.detail-item-main-price {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+
+.detail-rongdou-icon {
+  width: 12px !important;
+  height: 12px !important;
+}
+
+.detail-item-price-container .detail-rongdou-icon {
+  width: 12px !important;
+  height: 12px !important;
+}
+
+.detail-rongdou-price {
+  font-size: 12px;
+  font-weight: 500;
+  color: #333;
+}
+
+.detail-item-sub-price {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+
+.detail-points-icon {
+  font-size: 10px;
+  color: #ffae00;
+}
+
+.detail-points-price {
+  font-size: 10px;
+  color: #666;
+}
+
+/* 费用明细融豆图标样式 */
+.cost-rongdou-icon {
+  width: 14px !important;
+  height: 14px !important;
+  margin-right: 2px;
+}
+
+.detail-price-group .cost-rongdou-icon {
+  width: 14px !important;
+  height: 14px !important;
+}
+
 /* 响应式设计 */
 @media (max-width: 480px) {
   .order-header {