优化商品管理页面图片尺寸验证逻辑

- 简化图片尺寸验证方法，参考活动页面的实现逻辑
- 移除复杂的URL处理和跨域设置
- 优化错误处理，支持后端图片验证错误的专门处理
- 移除图片验证确认对话框，提升用户体验
- 保留核心的尺寸比例验证功能和15%容差设置

src/views/hisStore/storeProduct/index.vue

@@ -701,28 +701,18 @@ export default {
       this.form.image = val.join(',');
       // 验证商品图片
       if (val.length > 0) {
-        const latestImage = val[val.length - 1];
-        if (latestImage && latestImage.trim()) {
-          this.validateImage(latestImage, 'product');
-        } else {
-          this.productImageValidation.show = false;
-        }
+        this.validateImage(val[val.length - 1], 'product');
       } else {
-        this.productImageValidation = { show: false, type: 'success', message: '' };
+        this.productImageValidation.show = false;
       }
     },
     photoArr: function(val) {
       this.form.sliderImage = val.join(',');
       // 验证轮播图片
       if (val.length > 0) {
-        const latestImage = val[val.length - 1];
-        if (latestImage && latestImage.trim()) {
-          this.validateImage(latestImage, 'carousel');
-        } else {
-          this.carouselImageValidation.show = false;
-        }
+        this.validateImage(val[val.length - 1], 'carousel');
       } else {
-        this.carouselImageValidation = { show: false, type: 'success', message: '' };
+        this.carouselImageValidation.show = false;
       }
     }
   },
@@ -1109,19 +1099,12 @@ export default {
     },
     // 验证图片尺寸
     validateImage(imageUrl, type) {
-      if (!imageUrl || !imageUrl.trim()) {
-        const validation = type === 'product' ? this.productImageValidation : this.carouselImageValidation;
-        validation.show = false;
-        return;
-      }
+      if (!imageUrl) return;
       
       const img = new Image();
       const config = this.sizeConfig[type];
       const validation = type === 'product' ? this.productImageValidation : this.carouselImageValidation;
       
-      // 设置跨域属性，避免CORS问题
-      img.crossOrigin = 'anonymous';
-      
       img.onload = () => {
         const { width: actualWidth, height: actualHeight } = img;
         const { width: expectedWidth, height: expectedHeight, tolerance } = config;
@@ -1136,36 +1119,21 @@ export default {
         if (ratioDiff <= tolerance) {
           validation.type = 'success';
           validation.message = `✓ 尺寸符合要求 (实际: ${actualWidth}x${actualHeight}px)`;
-          // 3秒后隐藏成功消息
         } else {
           validation.type = 'warning';
-          const typeName = type === 'product' ? '商品图片' : '轮播图片';
-          const expectedRatioText = expectedWidth / expectedHeight === 1.25 ? '5:4' : '1:1';
-          validation.message = `⚠ ${typeName}尺寸不符合要求！实际: ${actualWidth}x${actualHeight}px (${(actualRatio).toFixed(2)}:1)，建议: ${expectedWidth}x${expectedHeight}px (${expectedRatioText})`;
+          validation.message = `⚠ 尺寸不符合要求！实际: ${actualWidth}x${actualHeight}px，建议: ${expectedWidth}x${expectedHeight}px`;
         }
       };
       
       img.onerror = () => {
         validation.show = true;
         validation.type = 'warning';
-        validation.message = '图片加载失败，无法验证尺寸，请检查图片URL是否正确';
+        validation.message = '图片加载失败，无法验证尺寸';
       };
       
-      // 处理相对路径和绝对路径
-      const fullImageUrl = this.getFullImageUrl(imageUrl);
-      img.src = fullImageUrl;
-    },
-    // 获取完整的图片URL
-    getFullImageUrl(imageUrl) {
-      if (!imageUrl) return '';
-      // 如果是完整的URL，直接返回
-      if (imageUrl.startsWith('http://') || imageUrl.startsWith('https://')) {
-        return imageUrl;
-      }
-      // 如果是相对路径，拼接基础URL
-      const baseUrl = process.env.VUE_APP_BASE_API || '';
-      return baseUrl + (imageUrl.startsWith('/') ? imageUrl : '/' + imageUrl);
+      img.src = imageUrl;
     },
+
     handleClick(tab, event) {
       this.queryParams.isShow=tab.name;
       this.getList();
@@ -1400,29 +1368,6 @@ export default {
     submitForm() {
       this.$refs["form"].validate(valid => {
         if (valid) {
-          // 检查是否有图片验证警告
-          if (this.productImageValidation.show && this.productImageValidation.type === 'warning') {
-            this.$confirm('商品图片尺寸不符合建议要求，是否继续提交？', '提示', {
-              confirmButtonText: '继续提交',
-              cancelButtonText: '取消',
-              type: 'warning'
-            }).then(() => {
-              this.doSubmit();
-            }).catch(() => {});
-            return;
-          }
-          
-          if (this.carouselImageValidation.show && this.carouselImageValidation.type === 'warning') {
-            this.$confirm('轮播图片尺寸不符合建议要求，是否继续提交？', '提示', {
-              confirmButtonText: '继续提交',
-              cancelButtonText: '取消',
-              type: 'warning'
-            }).then(() => {
-              this.doSubmit();
-            }).catch(() => {});
-            return;
-          }
-          
           this.doSubmit();
         }
       });
@@ -1469,12 +1414,28 @@ export default {
       if(this.form.productId !== null && this.form.productId !== undefined && this.form.productId === 0) {
         this.form.productId=null;
       }
+      
       addOrEdit(this.form).then(response => {
         if (response.code === 200) {
-          this.msgSuccess("操作成功");
+          this.msgSuccess(this.form.productId != null ? "修改成功" : "新增成功");
           this.open = false;
           this.getList();
         }
+      }).catch(error => {
+        // 处理后端返回的图片校验错误
+        if (error.response && error.response.data && error.response.data.msg) {
+          const msg = error.response.data.msg;
+          // 检查是否为图片尺寸验证错误
+          if (msg.includes("图片") && (msg.includes("尺寸") || msg.includes("比例"))) {
+            this.$message.error(msg);
+            return;
+          }
+          // 其他业务错误
+          this.$message.error(msg);
+          return;
+        }
+        // 网络或其他未知错误
+        this.$message.error("操作失败：" + (error.message || error));
       });
     },
     /** 删除按钮操作 */