Просмотр исходного кода

fix: 动态发布两次提示的问题,和申诉删除没校验的问题

sgc 3 дней назад
Родитель
Сommit
b551e4b6cb

+ 15 - 15
src/views/dynamicManagement/publishDynamic.vue

@@ -208,6 +208,12 @@ const uploading = ref(false);
 const currentDraftId = ref<number | string | null>(null); // 当前编辑的草稿ID
 const isEditMode = ref(false); // 是否为编辑模式
 
+/** 动态发布:体积上限与提示(与商户端口径一致;仅在此处弹一次,避免 before-upload 与 on-change 重复提示) */
+const DYNAMIC_IMAGE_MAX_MB = 20;
+const DYNAMIC_VIDEO_MAX_MB = 500;
+const UPLOAD_TIP_IMAGE = "图片建议不超过 20MB";
+const UPLOAD_TIP_VIDEO = "视频建议不超过 500MB";
+
 // 表单数据
 const formData = reactive<FormData>({
   title: "",
@@ -324,7 +330,7 @@ const handleFileChange = (uploadFile: UploadFile, uploadFiles: UploadFile[]) =>
       if (index > -1) {
         uploadFiles.splice(index, 1);
       }
-      ElMessage.warning("只能上传图片或视频文件");
+      // 提示由 beforeImageUpload 统一给出,避免与 before-upload 双次弹窗
       return;
     }
 
@@ -335,25 +341,22 @@ const handleFileChange = (uploadFile: UploadFile, uploadFiles: UploadFile[]) =>
     if (alreadyHasVideo) {
       const index = uploadFiles.findIndex(f => f.uid === uploadFile.uid);
       if (index > -1) uploadFiles.splice(index, 1);
-      ElMessage.warning("已上传视频,只能上传一个视频,不可再上传");
       return;
     }
     if (alreadyHasImage && isVideo) {
       const index = uploadFiles.findIndex(f => f.uid === uploadFile.uid);
       if (index > -1) uploadFiles.splice(index, 1);
-      // ElMessage.warning("已上传图片,后续只能上传图片,不能上传视频");
       return;
     }
 
-    // 根据文件类型设置不同的大小限制
-    const maxSize = isVideo ? 500 : 20;
-    const isLtMaxSize = uploadFile.raw.size / 1024 / 1024 < maxSize;
+    // 体积超限:不在此弹窗(与 beforeImageUpload 重复);仅从列表移除,由 beforeImageUpload 统一提示一次
+    const maxSizeMb = isVideo ? DYNAMIC_VIDEO_MAX_MB : DYNAMIC_IMAGE_MAX_MB;
+    const isLtMaxSize = uploadFile.raw.size / 1024 / 1024 < maxSizeMb;
     if (!isLtMaxSize) {
       const index = uploadFiles.findIndex(f => f.uid === uploadFile.uid);
       if (index > -1) {
         uploadFiles.splice(index, 1);
       }
-      ElMessage.warning(`${isVideo ? "视频" : "图片"}大小不能超过 ${maxSize}MB`);
       return;
     }
   }
@@ -461,30 +464,27 @@ const uploadSingleFile = async (file: UploadFile) => {
   }
 };
 
-// 图片上传前验证
+// 图片上传前验证(与 el-upload on-change 相比先执行或后执行因版本而异,此处为唯一弹窗出口)
 const beforeImageUpload = (file: File) => {
   const isImage = file.type.startsWith("image/");
   const isVideo = file.type.startsWith("video/");
   const isValidType = isImage || isVideo;
 
   if (!isValidType) {
-    ElMessage.error("只能上传图片或视频文件!");
+    ElMessage.warning("只能上传图片或视频文件");
     return false;
   }
 
   // 权限:已上传视频则不能再传;已上传图片则只能继续传图片(排除当前文件,避免清除图片后选视频被误判)
   const permission = checkUploadPermission(file, file);
   if (!permission.allowed) {
-    ElMessage.warning(permission.message);
+    ElMessage.warning(permission.message || "当前不可上传该文件");
     return false;
   }
 
-  // 图片和视频使用不同的大小限制
-  const maxSize = isVideo ? 500 : 20; // 视频500MB,图片20MB
-  const isLtMaxSize = file.size / 1024 / 1024 < maxSize;
-
+  const isLtMaxSize = file.size / 1024 / 1024 < (isVideo ? DYNAMIC_VIDEO_MAX_MB : DYNAMIC_IMAGE_MAX_MB);
   if (!isLtMaxSize) {
-    ElMessage.error(`${isVideo ? "视频" : "图片"}大小不能超过 ${maxSize}MB!`);
+    ElMessage.warning(isVideo ? UPLOAD_TIP_VIDEO : UPLOAD_TIP_IMAGE);
     return false;
   }
   return true;

+ 19 - 0
src/views/dynamicManagement/reviewAppeal.vue

@@ -168,6 +168,7 @@
             v-model:file-list="appealFormData.fileList"
             list-type="picture-card"
             :limit="6"
+            :before-upload="beforeAppealImageUpload"
             :http-request="handleUpload"
             :on-preview="handlePreview"
             :on-remove="handleRemove"
@@ -278,6 +279,24 @@ const appealFormData = reactive({
   images: [] as string[], // 申诉凭证:OSS 图片 URL(与 fileList 顺序一致)
   fileList: [] as UploadUserFile[]
 });
+
+/** 申诉凭证仅图片,与商户端 / 动态发布一致:单张 20MB */
+const APPEAL_IMAGE_MAX_MB = 20;
+const UPLOAD_TIP_IMAGE = "图片建议不超过 20MB";
+
+const beforeAppealImageUpload = (rawFile: File) => {
+  const mime = String(rawFile?.type || "");
+  if (!mime.startsWith("image/")) {
+    ElMessage.warning("只能上传图片格式");
+    return false;
+  }
+  if (rawFile.size > APPEAL_IMAGE_MAX_MB * 1024 * 1024) {
+    ElMessage.warning(UPLOAD_TIP_IMAGE);
+    return false;
+  }
+  return true;
+};
+
 const hasStoreReply = (review: any) => {
   return review?.storeComment && review.storeComment.length > 0;
 };