Bläddra i källkod

错误 #96295 图片大小限制

Administrator 4 år sedan
förälder
incheckning
dd72f6b31c
2 ändrade filer med 14 tillägg och 3 borttagningar
  1. 12 0
      src/common/components/uploadImg/index.vue
  2. 2 3
      src/common/setup/upload/index.ts

+ 12 - 0
src/common/components/uploadImg/index.vue

@@ -2,6 +2,7 @@
   <div class="upload">
     <a-upload :action="uploadUrl"
               v-model:file-list="uploadImgList"
+              :before-upload="beforeUpload"
               @change="uploadAction">
       <a-button class="uploadBtn">上传</a-button>
     </a-upload>
@@ -23,6 +24,7 @@ import { defineComponent } from '@/common/export/table';
 import { handlePreviewImg, handleUplodImg } from '@/common/setup/upload';
 import { FileInfo, FileItem } from '@/common/setup/upload/interface';
 import { PropType, watchEffect } from '@vue/runtime-core';
+import { message } from 'ant-design-vue';
 
 export default defineComponent({
     name: 'upload-img',
@@ -53,7 +55,17 @@ export default defineComponent({
                 uploadImgList.value = props.imgList;
             }
         });
+        // 文件上传校验
+        const beforeUpload = (file:any) => {
+          const isLt2M = file.size / 1024 / 1024 <= 1;
+          if (!isLt2M) {
+            message.error(file.name + "图片大小超出1M限制,请修改后重新上传", 0.8);
+            return isLt2M;
+          }
+          return isLt2M;
+        };
         return {
+            beforeUpload,
             uploadUrl,
             uploadAction,
             uploadChange,

+ 2 - 3
src/common/setup/upload/index.ts

@@ -61,11 +61,10 @@ export function handleUplodImg(limitSize = 1) {
         let resFileList = [...fileList];
         // 1. Limit the number of uploaded files
         resFileList = resFileList.slice(-limitSize);
-
         // 2. 处理上传异常
         if (file.status !== 'uploading') {
-            if (file.xhr?.status !== 200) {
-                message.error(`服务器返回状态不为200: ${file.xhr?.statusText}`)
+            if (file.response.code !== 200) {
+                message.error(`服务器返回状态: ${file.response.code},${file.response.message}`)
             }
 
         }