修复多文件上传报错出现的异常问题
This commit is contained in:
		
							parent
							
								
									9a895763d5
								
							
						
					
					
						commit
						39efed1710
					
				| @ -12,7 +12,7 @@ | ||||
|       :show-file-list="false" | ||||
|       :headers="headers" | ||||
|       class="upload-file-uploader" | ||||
|       ref="upload" | ||||
|       ref="fileUpload" | ||||
|     > | ||||
|       <!-- 上传按钮 --> | ||||
|       <el-button size="mini" type="primary">选取文件</el-button> | ||||
| @ -151,14 +151,16 @@ export default { | ||||
|       this.$modal.closeLoading() | ||||
|     }, | ||||
|     // 上传成功回调 | ||||
|     handleUploadSuccess(res) { | ||||
|       this.uploadList.push({ name: res.fileName, url: res.fileName }); | ||||
|       if (this.uploadList.length === this.number) { | ||||
|         this.fileList = this.fileList.concat(this.uploadList); | ||||
|         this.uploadList = []; | ||||
|         this.number = 0; | ||||
|         this.$emit("input", this.listToString(this.fileList)); | ||||
|     handleUploadSuccess(res, file) { | ||||
|       if (res.code === 200) { | ||||
|         this.uploadList.push({ name: res.fileName, url: res.fileName }); | ||||
|         this.uploadedSuccessfully(); | ||||
|       } else { | ||||
|         this.number--; | ||||
|         this.$modal.closeLoading(); | ||||
|         this.$modal.msgError(res.msg); | ||||
|         this.$refs.fileUpload.handleRemove(file); | ||||
|         this.uploadedSuccessfully(); | ||||
|       } | ||||
|     }, | ||||
|     // 删除文件 | ||||
| @ -166,6 +168,16 @@ export default { | ||||
|       this.fileList.splice(index, 1); | ||||
|       this.$emit("input", this.listToString(this.fileList)); | ||||
|     }, | ||||
|     // 上传结束处理 | ||||
|     uploadedSuccessfully() { | ||||
|       if (this.number > 0 && this.uploadList.length === this.number) { | ||||
|         this.fileList = this.fileList.concat(this.uploadList); | ||||
|         this.uploadList = []; | ||||
|         this.number = 0; | ||||
|         this.$emit("input", this.listToString(this.fileList)); | ||||
|         this.$modal.closeLoading(); | ||||
|       } | ||||
|     }, | ||||
|     // 获取文件名称 | ||||
|     getFileName(name) { | ||||
|       if (name.lastIndexOf("/") > -1) { | ||||
|  | ||||
| @ -9,8 +9,8 @@ | ||||
|       :limit="limit" | ||||
|       :on-error="handleUploadError" | ||||
|       :on-exceed="handleExceed" | ||||
|       name="file" | ||||
|       :on-remove="handleRemove" | ||||
|       ref="imageUpload" | ||||
|       :on-remove="handleDelete" | ||||
|       :show-file-list="true" | ||||
|       :headers="headers" | ||||
|       :file-list="fileList" | ||||
| @ -117,25 +117,6 @@ export default { | ||||
|     }, | ||||
|   }, | ||||
|   methods: { | ||||
|     // 删除图片 | ||||
|     handleRemove(file, fileList) { | ||||
|       const findex = this.fileList.map(f => f.name).indexOf(file.name); | ||||
|       if(findex > -1) { | ||||
|         this.fileList.splice(findex, 1); | ||||
|         this.$emit("input", this.listToString(this.fileList)); | ||||
|       } | ||||
|     }, | ||||
|     // 上传成功回调 | ||||
|     handleUploadSuccess(res) { | ||||
|       this.uploadList.push({ name: res.fileName, url: res.fileName }); | ||||
|       if (this.uploadList.length === this.number) { | ||||
|         this.fileList = this.fileList.concat(this.uploadList); | ||||
|         this.uploadList = []; | ||||
|         this.number = 0; | ||||
|         this.$emit("input", this.listToString(this.fileList)); | ||||
|         this.$modal.closeLoading(); | ||||
|       } | ||||
|     }, | ||||
|     // 上传前loading加载 | ||||
|     handleBeforeUpload(file) { | ||||
|       let isImg = false; | ||||
| @ -171,11 +152,42 @@ export default { | ||||
|     handleExceed() { | ||||
|       this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`); | ||||
|     }, | ||||
|     // 上传成功回调 | ||||
|     handleUploadSuccess(res, file) { | ||||
|       if (res.code === 200) { | ||||
|         this.uploadList.push({ name: res.fileName, url: res.fileName }); | ||||
|         this.uploadedSuccessfully(); | ||||
|       } else { | ||||
|         this.number--; | ||||
|         this.$modal.closeLoading(); | ||||
|         this.$modal.msgError(res.msg); | ||||
|         this.$refs.imageUpload.handleRemove(file); | ||||
|         this.uploadedSuccessfully(); | ||||
|       } | ||||
|     }, | ||||
|     // 删除图片 | ||||
|     handleDelete(file) { | ||||
|       const findex = this.fileList.map(f => f.name).indexOf(file.name); | ||||
|       if(findex > -1) { | ||||
|         this.fileList.splice(findex, 1); | ||||
|         this.$emit("input", this.listToString(this.fileList)); | ||||
|       } | ||||
|     }, | ||||
|     // 上传失败 | ||||
|     handleUploadError() { | ||||
|       this.$modal.msgError("上传图片失败,请重试"); | ||||
|       this.$modal.closeLoading(); | ||||
|     }, | ||||
|     // 上传结束处理 | ||||
|     uploadedSuccessfully() { | ||||
|       if (this.number > 0 && this.uploadList.length === this.number) { | ||||
|         this.fileList = this.fileList.concat(this.uploadList); | ||||
|         this.uploadList = []; | ||||
|         this.number = 0; | ||||
|         this.$emit("input", this.listToString(this.fileList)); | ||||
|         this.$modal.closeLoading(); | ||||
|       } | ||||
|     }, | ||||
|     // 预览 | ||||
|     handlePictureCardPreview(file) { | ||||
|       this.dialogImageUrl = file.url; | ||||
| @ -186,7 +198,9 @@ export default { | ||||
|       let strs = ""; | ||||
|       separator = separator || ","; | ||||
|       for (let i in list) { | ||||
|         strs += list[i].url.replace(this.baseUrl, "") + separator; | ||||
|         if (list[i].url) { | ||||
|           strs += list[i].url.replace(this.baseUrl, "") + separator; | ||||
|         } | ||||
|       } | ||||
|       return strs != '' ? strs.substr(0, strs.length - 1) : ''; | ||||
|     } | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user
	 RuoYi
						RuoYi