feat: 优化商品详情与购物车功能

- 更新 ShowGoods.vue 和 ShowGoodsDetail.vue 中的按钮样式，统一使用 goods-action-btn 类。
- 在 Cart.vue 中实现商品收藏状态的同步与处理，优化收藏功能的用户体验。
- 调整 GoodsDetail.vue 中的店铺收藏按钮样式，提升视觉一致性。
- 在多个评价组件中引入主题色，增强评分组件的视觉效果。

buyer/src/components/goodsDetail/ShowGoods.vue

@@ -278,7 +278,7 @@
             <div class="item-select-column">
               <div class="add-buy-car">
                 <el-button
-                  type="danger"
+                  class="goods-action-btn"
                   v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
                   :loading="loading"
                   :disabled="skuDetail.quantity === 0"
@@ -286,7 +286,7 @@
                   >加入购物车</el-button
                 >
                 <el-button
-                  class="confirm-receipt-btn"
+                  class="goods-action-btn"
                   :loading="loading1"
                   :disabled="skuDetail.quantity === 0"
                   @click="buyNow"
@@ -986,6 +986,28 @@ export default {
   > *:last-child {
     margin-right: 0;
   }
+
+  .goods-action-btn {
+    background-color: #ff475d !important;
+    border-color: #ff475d !important;
+    color: #fff !important;
+
+    &:hover,
+    &:focus {
+      background-color: #e63e52 !important;
+      border-color: #e63e52 !important;
+      color: #fff !important;
+    }
+
+    &.is-disabled,
+    &.is-disabled:hover,
+    &.is-disabled:focus {
+      background-color: #ff475d !important;
+      border-color: #ff475d !important;
+      color: #fff !important;
+      opacity: 0.5;
+    }
+  }
 }
 
 .goodsConfig {
@@ -1003,7 +1025,7 @@ export default {
 
     &.is-collected {
       .collect-icon {
-        color: #ffc107;
+        color: $theme_color;
       }
     }
   }

buyer/src/components/goodsDetail/ShowGoodsDetail.vue

@@ -38,7 +38,13 @@
                   </div>
                   <div class="remarks-content-box">
                     <p>
-                      <el-rate disabled :value="Number(item.descriptionScore)" allow-half class="remarks-star"></el-rate>
+                      <el-rate
+                        disabled
+                        :model-value="Number(item.descriptionScore) || 0"
+                        allow-half
+                        class="remarks-star"
+                        :colors="['var(--theme-color)', 'var(--theme-color)', 'var(--theme-color)']"
+                      ></el-rate>
                     </p>
                     <p class="remarks-content">{{item.content}}</p>
                     <div class="comment-img" v-if="item.images">
@@ -546,8 +552,12 @@ export default {
     background-color: transparent;
   }
 }
-:deep(.el-rate__icon) {
+:deep(.remarks-star.el-rate) {
-  color: $theme_color;
+  --el-rate-fill-color: #{$theme_color};
+  --el-rate-disabled-fill-color: #{$theme_color};
+}
+:deep(.remarks-star .el-rate__icon.is-active) {
+  color: $theme_color !important;
 }
 table{
   border-color:#efefef;

buyer/src/pages/Cart.vue

@@ -186,8 +186,9 @@
                   <el-button
                     size="small"
                     class="cart-collect-btn"
-                    @click="collectGoods(goods.goodsSku.id)"
+                    :class="{ 'is-collected': goods.isCollected }"
-                    >收藏</el-button
+                    @click="handleCollect(goods)"
+                    >{{ goods.isCollected ? "已收藏" : "收藏" }}</el-button
                   >
                 </div>
               </div>
@@ -288,16 +289,69 @@ export default {
       });
       window.open(routeUrl.href, "_blank");
     },
-    // 收藏商品
+    // 同步购物车商品收藏状态
-    collectGoods(id) {
+    async syncCartCollectionStatus() {
+      if (!this.Cookies.getItem("userInfo") || !this.cartList.length) return;
+      const skuIds = [];
+      this.cartList.forEach((shop) => {
+        (shop.skuList || []).forEach((goods) => {
+          goods.isCollected = false;
+          if (goods.goodsSku && goods.goodsSku.id) {
+            skuIds.push(goods.goodsSku.id);
+          }
+        });
+      });
+      const uniqueSkuIds = [...new Set(skuIds)];
+      await Promise.all(
+        uniqueSkuIds.map(async (skuId) => {
+          try {
+            const res = await APIMember.isCollection("GOODS", skuId);
+            if (res.success && res.result) {
+              this.cartList.forEach((shop) => {
+                (shop.skuList || []).forEach((goods) => {
+                  if (goods.goodsSku && goods.goodsSku.id === skuId) {
+                    goods.isCollected = true;
+                  }
+                });
+              });
+            }
+          } catch (e) {
+            // 单个查询失败不影响其他商品
+          }
+        })
+      );
+      this.$forceUpdate();
+    },
+    // 收藏 / 取消收藏商品
+    handleCollect(goods) {
+      const skuId = goods.goodsSku && goods.goodsSku.id;
+      if (!skuId) return;
+      if (goods.isCollected) {
+        Modal.confirm({
+          title: "取消收藏",
+          content: "确定取消收藏该商品吗？",
+          onOk: () => {
+            return APIMember.cancelCollect("GOODS", skuId).then((res) => {
+              if (res.success) {
+                goods.isCollected = false;
+                Message.success("取消收藏成功");
+                this.$forceUpdate();
+              }
+            });
+          },
+          onCancel: () => {},
+        });
+        return;
+      }
       Modal.confirm({
         title: "收藏",
         content: "商品收藏后可在个人中心我的收藏查看",
         onOk: () => {
-          APIMember.collectGoods("GOODS", id).then((res) => {
+          return APIMember.collectGoods("GOODS", skuId).then((res) => {
             if (res.success) {
+              goods.isCollected = true;
               Message.success("收藏商品成功");
-              this.getCartList();
+              this.$forceUpdate();
             }
           });
         },
@@ -425,6 +479,7 @@ export default {
           }
           this.$forceUpdate();
           this.allChecked = allChecked;
+          this.syncCartCollectionStatus();
         }
       } catch (error) {
         this.loading = false;
@@ -878,6 +933,18 @@ export default {
     border-color: #e55a15 !important;
     color: #fff !important;
   }
+
+  &.is-collected {
+    background-color: $theme_color !important;
+    border-color: $theme_color !important;
+
+    &:hover,
+    &:focus {
+      background-color: $theme_color !important;
+      border-color: $theme_color !important;
+      opacity: 0.9;
+    }
+  }
 }
 </style>
 <style>

buyer/src/pages/GoodsDetail.vue

@@ -17,8 +17,12 @@
               :to="{ path: '/merchant', query: { id: goodsMsg.data.storeId } }"
             >{{ goodsMsg.data.storeName }}</router-link>
           </span>
-          <span class="store-collect-btn" @click="collect">
+          <span
-            <el-icon :color="storeCollected ? '#ffc107' : '#666'"><StarFilled /></el-icon>
+            class="store-collect-btn"
+            :class="{ 'is-collected': storeCollected }"
+            @click="collect"
+          >
+            <el-icon class="store-collect-icon"><StarFilled /></el-icon>
             {{ storeCollected? "已收藏店铺": "收藏店铺" }}
           </span>
           <span class="ml_10 contact-service-btn" @click="IMService(goodsMsg.data.storeId,goodsMsg.data.goodsId,goodsMsg.data.id)">联系客服</span>
@@ -247,6 +251,17 @@ export default {
       cursor: pointer;
     }
 
+    .store-collect-btn {
+      .store-collect-icon {
+        color: #666;
+        vertical-align: middle;
+      }
+
+      &.is-collected .store-collect-icon {
+        color: $theme_color;
+      }
+    }
+
     .store-name-link {
       color: $theme_color;
       text-decoration: none;

buyer/src/pages/home/memberCenter/evaluation/AddEval.vue

@@ -11,9 +11,9 @@
     <div class="delivery-rate">
       <div class="fontsize_16">物流服务评价：</div>
       <div class="color999 rate-list">
-        <span class="rate-item">物流评价：<el-rate v-model="form.deliveryScore" /></span>
+        <span class="rate-item">物流评价：<el-rate v-model="form.deliveryScore" :colors="rateThemeColors" class="theme-rate" /></span>
-        <span class="rate-item">服务评价：<el-rate v-model="form.serviceScore" /></span>
+        <span class="rate-item">服务评价：<el-rate v-model="form.serviceScore" :colors="rateThemeColors" class="theme-rate" /></span>
-        <span class="rate-item">描述评价：<el-rate v-model="form.descriptionScore" /></span>
+        <span class="rate-item">描述评价：<el-rate v-model="form.descriptionScore" :colors="rateThemeColors" class="theme-rate" /></span>
       </div>
     </div>
     <!-- 添加订单评价  左侧商品详情  右侧评价框 -->
@@ -96,7 +96,9 @@ export default {
       action: commonUrl + '/common/common/upload/file', // 上传地址
       accessToken: {}, // 验证token
       previewImage: '', // 预览图片地址
-      loading: false // 提交加载状态
+      loading: false, // 提交加载状态
+      // el-rate SVG 通过 colors 写入 fill-color，跟随平台主题色
+      rateThemeColors: ['var(--theme-color)', 'var(--theme-color)', 'var(--theme-color)']
     }
   },
   methods: {
@@ -208,6 +210,13 @@ export default {
   display: inline-flex;
   align-items: center;
 }
+.rate-list :deep(.theme-rate.el-rate) {
+  --el-rate-fill-color: #{$theme_color};
+  --el-rate-disabled-fill-color: #{$theme_color};
+}
+:deep(.theme-rate .el-rate__icon.is-active) {
+  color: $theme_color !important;
+}
 .goods-eval li{
   display: flex;
   border-bottom: 1px solid #eee;

buyer/src/pages/home/memberCenter/evaluation/EvalDetail.vue

@@ -11,9 +11,9 @@
     <div class="delivery-rate">
       <div class="fontsize_16">物流服务评价：</div>
       <div class="color999 delivery-rate-items">
-        <span>物流评价：<el-rate disabled :model-value="Number(orderGoods.deliveryScore) || 0" /></span>
+        <span>物流评价：<el-rate disabled :model-value="Number(orderGoods.deliveryScore) || 0" :colors="rateThemeColors" class="theme-rate" /></span>
-        <span>服务评价：<el-rate disabled :model-value="Number(orderGoods.serviceScore) || 0" /></span>
+        <span>服务评价：<el-rate disabled :model-value="Number(orderGoods.serviceScore) || 0" :colors="rateThemeColors" class="theme-rate" /></span>
-        <span>描述评价：<el-rate disabled :model-value="Number(orderGoods.descriptionScore) || 0" /></span>
+        <span>描述评价：<el-rate disabled :model-value="Number(orderGoods.descriptionScore) || 0" :colors="rateThemeColors" class="theme-rate" /></span>
       </div>
     </div>
     <!-- 添加订单评价  左侧商品详情  右侧评价框 -->
@@ -99,6 +99,8 @@ export default {
       visible: false, // 图片预览
       previewImage: "", // 预览图片链接
       loading: false, // 加载状态
+      // el-rate SVG 通过 colors 写入 fill-color，跟随平台主题色
+      rateThemeColors: ["var(--theme-color)", "var(--theme-color)", "var(--theme-color)"],
     };
   },
   methods: {
@@ -147,13 +149,13 @@ export default {
   gap: 16px;
 }
 
-.delivery-rate-items :deep(.el-rate) {
+.delivery-rate-items :deep(.theme-rate.el-rate) {
-  --el-rate-fill-color: #ffb400;
+  --el-rate-fill-color: #{$theme_color};
-  --el-rate-disabled-fill-color: #ffb400;
+  --el-rate-disabled-fill-color: #{$theme_color};
 }
 
-:deep(.el-rate__icon.is-active) {
+:deep(.theme-rate .el-rate__icon.is-active) {
-  color: #ffb400;
+  color: $theme_color !important;
 }
 .goods-eval li {
   display: flex;

buyer/src/pages/home/orderCenter/Complain.vue

@@ -102,6 +102,10 @@ export default {
       })
     },
     save () { // 提交投诉信息
+      if (!this.form.content || !String(this.form.content).trim()) {
+        Message.warning('投诉内容不能为空')
+        return
+      }
       let params = {
         goodsId: this.orderGoods.goodsId,
         complainTopic: this.form.complainTopic,

manager/src/components/editor/upload-image.vue

@@ -3,12 +3,12 @@
     <el-button @click="handleClickUploadImage">上传图片</el-button>
     <el-dialog v-model="show" width="850px" title="上传图片" append-to-body :z-index="3500">
       <div class="import-oss" @click="importOSS">从资源库中导入</div>
-      <div style="display: flex; flex-wrap: wrap">
+      <div class="upload-images-wrap">
         <vuedraggable
           v-model="images"
           :animation="200"
           :item-key="draggableItemKey"
-          style="display: flex; flex-wrap: wrap"
+          class="upload-images-draggable"
         >
           <template #item="{ element, index }">
             <div class="upload-list">
@@ -67,6 +67,7 @@
         ref="ossManage"
         :is-component="true"
         :initialize="showOssManager"
+        :hide-select-footer="true"
         @selected="handleOssSelected"
       />
       <template #footer>
@@ -212,27 +213,57 @@ export default {
 .wrapper {
   margin: 10px 0;
 }
+$upload-item-size: 150px;
+.upload-images-wrap {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+}
+.upload-images-draggable {
+  display: flex;
+  flex-wrap: wrap;
+}
 .upload-list {
-  width: 150px;
+  width: $upload-item-size;
-  height: 150px;
+  height: $upload-item-size;
   text-align: center;
-  border: 1px solid transparent;
+  border: 1px solid #dcdfe6;
   border-radius: 4px;
   display: inline-block;
   background: #fff;
   position: relative;
-  margin-right: 4px;
+  margin: 0 4px 4px 0;
-  vertical-align: bottom;
+  overflow: hidden;
+  flex-shrink: 0;
 }
 .upload-box {
-  margin: 10px 0;
+  width: $upload-item-size;
+  height: $upload-item-size;
+  margin: 0 4px 4px 0;
   display: inline-block;
-  vertical-align: bottom;
+  flex-shrink: 0;
+
+  :deep(.el-upload) {
+    width: $upload-item-size;
+    height: $upload-item-size;
+    display: block;
+  }
+
+  :deep(.el-upload-dragger) {
+    width: $upload-item-size;
+    height: $upload-item-size;
+    min-height: $upload-item-size;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    box-sizing: border-box;
+  }
 }
 .upload-trigger {
-  width: 148px;
+  width: 100%;
-  height: 148px;
+  height: 100%;
-  line-height: 148px;
   display: flex;
   align-items: center;
   justify-content: center;

manager/src/components/lili/upload-pic-input.vue

@@ -63,6 +63,7 @@
         ref="ossManage"
         :is-component="true"
         :initialize="picModalFlag"
+        :max-select="1"
         @callback="handleOssCallback"
       />
     </el-dialog>

manager/src/views/goods/goods-manage/brand.vue

@@ -60,7 +60,7 @@
               <span class="op-split">|</span>
               <a class="link-text" @click="openCategoryModal(row)">关联分类</a>
               <span class="op-split">|</span>
-              <a class="link-text" @click="delBrand(row.id)">删除</a>
+              <a class="link-text" @click="delBrand(row)">删除</a>
             </template>
           </template>
         </el-table-column>
@@ -289,12 +289,15 @@ export default {
         this.$nextTick(() => this.$forceUpdate());
       });
     },
-    async delBrand(id) {
+    delBrand(row) {
-      const res = await delBrand(id);
+      ElMessageBox.confirm("您确认要删除 " + row.name + " ?", "确认删除", { type: "warning" }).then(() => {
+        return delBrand(row.id).then((res) => {
           if (res.success) {
             ElMessage.success("品牌删除成功!");
             this.getDataList();
           }
+        });
+      }).catch(() => {});
     },
     init() {
       this.getDataList();

manager/src/views/main-parts/shrinkable-menu/shrinkable-menu.vue

@@ -142,13 +142,13 @@ export default {
 
   :deep(.el-menu-item.is-active) {
     background-color: #fff !important;
-    color: $theme_color !important;
+    color: var(--el-color-primary) !important;
   }
 
   :deep(.el-menu-item.is-active:hover),
   :deep(.el-menu-item.is-active:focus) {
     background-color: #fff !important;
-    color: $theme_color !important;
+    color: var(--el-color-primary) !important;
   }
 }
 

manager/src/views/sys/oss-manage/ossManage.vue

@@ -272,7 +272,7 @@
                     @current-change="pageChange"
                   />
                 </div>
-                <div v-if="isComponent && selectImage" class="oss-select-footer">
+                <div v-if="isComponent && selectImage && !hideSelectFooter" class="oss-select-footer">
                   <el-button @click="handleSelectCancel">取消</el-button>
                   <el-button type="primary" @click="handleSelectConfirm">确定</el-button>
                 </div>
@@ -410,6 +410,10 @@ export default {
       type: Number,
       default: 0,
     },
+    hideSelectFooter: {
+      type: Boolean,
+      default: false,
+    },
   },
   data() {
     return {

seller/src/views/main-components/shrinkable-menu/shrinkable-menu.vue

@@ -106,13 +106,13 @@ export default {
 
   :deep(.el-menu-item.is-active) {
     background-color: #fff !important;
-    color: $theme_color !important;
+    color: var(--el-color-primary) !important;
   }
 
   :deep(.el-menu-item.is-active:hover),
   :deep(.el-menu-item.is-active:focus) {
     background-color: #fff !important;
-    color: $theme_color !important;
+    color: var(--el-color-primary) !important;
   }
 }
 

seller/src/views/shop/hotzone/assets/styles/main.css

@@ -645,8 +645,8 @@ html.z-modal body {
 }
 
 .hz-edit-img img {
-  max-width: 300px;
+  max-width: 240px;
-  max-height: 200px;
+  max-height: 140px;
   margin-bottom: 10px;
 }
 

seller/src/views/shop/hotzone/components/Zone.vue

@@ -54,6 +54,7 @@
     <el-dialog
       v-model="showModal"
       title="编辑热区"
+      width="420px"
       :close-on-click-modal="false"
       append-to-body
       @close="cancelZone"
@@ -179,6 +180,7 @@ export default {
       this.zoneForm.link = this.$filters.formatLinkType(val);
       this.settingZone(val);
       this.changeInfo(this.zoneForm);
+      this.showModal = false;
     },
     settingZone(val) {
       this.zoneForm.type = val.___type || val.type;