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

修复多文件上传报错出现的异常问题

RuoYi лет назад: 3
Родитель
Сommit
8c7986acdb
2 измененных файлов с 56 добавлено и 30 удалено
  1. 20 8
      ruoyi-ui/src/components/FileUpload/index.vue
  2. 36 22
      ruoyi-ui/src/components/ImageUpload/index.vue

+ 20 - 8
ruoyi-ui/src/components/FileUpload/index.vue

@@ -12,7 +12,7 @@
12
       :show-file-list="false"
12
       :show-file-list="false"
13
       :headers="headers"
13
       :headers="headers"
14
       class="upload-file-uploader"
14
       class="upload-file-uploader"
15
-      ref="upload"
15
+      ref="fileUpload"
16
     >
16
     >
17
       <!-- 上传按钮 -->
17
       <!-- 上传按钮 -->
18
       <el-button size="mini" type="primary">选取文件</el-button>
18
       <el-button size="mini" type="primary">选取文件</el-button>
@@ -150,14 +150,16 @@ export default {
150
       this.$modal.closeLoading()
150
       this.$modal.closeLoading()
151
     },
151
     },
152
     // 上传成功回调
152
     // 上传成功回调
153
-    handleUploadSuccess(res) {
154
-      this.uploadList.push({ name: res.data.url, url: res.data.url });
155
-      if (this.uploadList.length === this.number) {
156
-        this.fileList = this.fileList.concat(this.uploadList);
157
-        this.uploadList = [];
158
-        this.number = 0;
159
-        this.$emit("input", this.listToString(this.fileList));
153
+    handleUploadSuccess(res, file) {
154
+      if (res.code === 200) {
155
+        this.uploadList.push({ name: res.data.url, url: res.data.url });
156
+        this.uploadedSuccessfully();
157
+      } else {
158
+        this.number--;
160
         this.$modal.closeLoading();
159
         this.$modal.closeLoading();
160
+        this.$modal.msgError(res.msg);
161
+        this.$refs.fileUpload.handleRemove(file);
162
+        this.uploadedSuccessfully();
161
       }
163
       }
162
     },
164
     },
163
     // 删除文件
165
     // 删除文件
@@ -165,6 +167,16 @@ export default {
165
       this.fileList.splice(index, 1);
167
       this.fileList.splice(index, 1);
166
       this.$emit("input", this.listToString(this.fileList));
168
       this.$emit("input", this.listToString(this.fileList));
167
     },
169
     },
170
+    // 上传结束处理
171
+    uploadedSuccessfully() {
172
+      if (this.number > 0 && this.uploadList.length === this.number) {
173
+        this.fileList = this.fileList.concat(this.uploadList);
174
+        this.uploadList = [];
175
+        this.number = 0;
176
+        this.$emit("input", this.listToString(this.fileList));
177
+        this.$modal.closeLoading();
178
+      }
179
+    },
168
     // 获取文件名称
180
     // 获取文件名称
169
     getFileName(name) {
181
     getFileName(name) {
170
       if (name.lastIndexOf("/") > -1) {
182
       if (name.lastIndexOf("/") > -1) {

+ 36 - 22
ruoyi-ui/src/components/ImageUpload/index.vue

@@ -9,8 +9,8 @@
9
       :limit="limit"
9
       :limit="limit"
10
       :on-error="handleUploadError"
10
       :on-error="handleUploadError"
11
       :on-exceed="handleExceed"
11
       :on-exceed="handleExceed"
12
-      name="file"
13
-      :on-remove="handleRemove"
12
+      ref="imageUpload"
13
+      :on-remove="handleDelete"
14
       :show-file-list="true"
14
       :show-file-list="true"
15
       :headers="headers"
15
       :headers="headers"
16
       :file-list="fileList"
16
       :file-list="fileList"
@@ -112,25 +112,6 @@ export default {
112
     },
112
     },
113
   },
113
   },
114
   methods: {
114
   methods: {
115
-    // 删除图片
116
-    handleRemove(file, fileList) {
117
-      const findex = this.fileList.map(f => f.name).indexOf(file.name);
118
-      if(findex > -1) {
119
-        this.fileList.splice(findex, 1);
120
-        this.$emit("input", this.listToString(this.fileList));
121
-      }
122
-    },
123
-    // 上传成功回调
124
-    handleUploadSuccess(res) {
125
-      this.uploadList.push({ name: res.data.url, url: res.data.url });
126
-      if (this.uploadList.length === this.number) {
127
-        this.fileList = this.fileList.concat(this.uploadList);
128
-        this.uploadList = [];
129
-        this.number = 0;
130
-        this.$emit("input", this.listToString(this.fileList));
131
-        this.$modal.closeLoading();
132
-      }
133
-    },
134
     // 上传前loading加载
115
     // 上传前loading加载
135
     handleBeforeUpload(file) {
116
     handleBeforeUpload(file) {
136
       let isImg = false;
117
       let isImg = false;
@@ -166,11 +147,42 @@ export default {
166
     handleExceed() {
147
     handleExceed() {
167
       this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`);
148
       this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`);
168
     },
149
     },
150
+    // 上传成功回调
151
+    handleUploadSuccess(res, file) {
152
+      if (res.code === 200) {
153
+        this.uploadList.push({ name: res.data.url, url: res.data.url });
154
+        this.uploadedSuccessfully();
155
+      } else {
156
+        this.number--;
157
+        this.$modal.closeLoading();
158
+        this.$modal.msgError(res.msg);
159
+        this.$refs.imageUpload.handleRemove(file);
160
+        this.uploadedSuccessfully();
161
+      }
162
+    },
163
+    // 删除图片
164
+    handleDelete(file) {
165
+      const findex = this.fileList.map(f => f.name).indexOf(file.name);
166
+      if (findex > -1) {
167
+        this.fileList.splice(findex, 1);
168
+        this.$emit("input", this.listToString(this.fileList));
169
+      }
170
+    },
169
     // 上传失败
171
     // 上传失败
170
     handleUploadError() {
172
     handleUploadError() {
171
       this.$modal.msgError("上传图片失败,请重试");
173
       this.$modal.msgError("上传图片失败,请重试");
172
       this.$modal.closeLoading();
174
       this.$modal.closeLoading();
173
     },
175
     },
176
+    // 上传结束处理
177
+    uploadedSuccessfully() {
178
+      if (this.number > 0 && this.uploadList.length === this.number) {
179
+        this.fileList = this.fileList.concat(this.uploadList);
180
+        this.uploadList = [];
181
+        this.number = 0;
182
+        this.$emit("input", this.listToString(this.fileList));
183
+        this.$modal.closeLoading();
184
+      }
185
+    },
174
     // 预览
186
     // 预览
175
     handlePictureCardPreview(file) {
187
     handlePictureCardPreview(file) {
176
       this.dialogImageUrl = file.url;
188
       this.dialogImageUrl = file.url;
@@ -181,7 +193,9 @@ export default {
181
       let strs = "";
193
       let strs = "";
182
       separator = separator || ",";
194
       separator = separator || ",";
183
       for (let i in list) {
195
       for (let i in list) {
184
-        strs += list[i].url + separator;
196
+        if (list[i].url) {
197
+          strs += list[i].url.replace(this.baseUrl, "") + separator;
198
+        }
185
       }
199
       }
186
       return strs != '' ? strs.substr(0, strs.length - 1) : '';
200
       return strs != '' ? strs.substr(0, strs.length - 1) : '';
187
     }
201
     }