diff --git a/vue/full/src/api/file/index.js b/vue/full/src/api/file/index.js
index 0d46d26..bb00752 100644
--- a/vue/full/src/api/file/index.js
+++ b/vue/full/src/api/file/index.js
@@ -1,4 +1,4 @@
-import {GetApi} from "@/api/request"
+import {GetApi, PostApi} from "@/api/request"
export const getToken = new GetApi(
'/file/getToken',
@@ -7,3 +7,5 @@ export const getToken = new GetApi(
)
export const deleteUpload = new GetApi('/file/delete', url => ({params: {url: encodeURIComponent(url)}}))
+
+export const deleteUploadBatch = new PostApi('/file/deleteBatch')
diff --git a/vue/full/src/component/Upload/Qiniu.vue b/vue/full/src/component/Upload/Qiniu.vue
index d06f8db..2943226 100644
--- a/vue/full/src/component/Upload/Qiniu.vue
+++ b/vue/full/src/component/Upload/Qiniu.vue
@@ -4,6 +4,7 @@
:uploaded-file-list="uploadedFileList"
:limit="limit"
:multiple="multiple"
+ :disabled="disabled"
:http-request="httpRequest"
:before-upload="beforeUpload"
@exceed="onExceed"
@@ -100,14 +101,17 @@ export default {
},
//移除
onRemove(file) {
- //若不是新上传的,触发remove事件
+ if (file.status !== 'success') return
+
+ //不是本次上传的
if (!file.raw) {
- this.$emit('remove', {url: file.downloadUrl.replace(fileConfig.storePrefix, '')})
+ const key = file.downloadUrl.replace(fileConfig.storePrefix, '')
+ return this.$emit('remove', {key, isNew: false})
}
+
//移除本次新上传的文件时,删除OSS上的文件
- else if (file.response && !file.response.err) {
- deleteUpload.request(file.raw.key)
- }
+ deleteUpload.request(file.raw.key)
+ this.$emit('remove', {key: file.raw.key, isNew: true})
},
//上传前过滤文件,并根据文件类型修改缩略图
diff --git a/vue/full/src/mixin/docDetailMixin.js b/vue/full/src/mixin/docDetailMixin.js
index a72c065..b70c826 100644
--- a/vue/full/src/mixin/docDetailMixin.js
+++ b/vue/full/src/mixin/docDetailMixin.js
@@ -9,7 +9,7 @@ import DocSteps from '@/component/biz/doc/DocSteps'
import QiniuUpload from '@/component/Upload/Qiniu'
import {isEmpty, mergeObj} from '@/util'
import {auth} from "@/util/auth"
-import {deleteUpload} from "@/api/file"
+import {deleteUploadBatch} from "@/api/file"
import {elAlert, elConfirm, elPrompt, elSuccess} from "@/util/message"
import {closeCurrentPage} from "@/util/route"
@@ -50,8 +50,8 @@ export default {
remark: null,
data: [],
imageList: [],
- uploadImageList: [],
- deleteImageList: []
+ uploadImageList: [],//新上传文件的key数组
+ deleteImageList: [] //被删除的旧上传文件的key数组
},
rules: {}
}
@@ -237,17 +237,8 @@ export default {
return this.init(this.form.id)
},
- //关闭页面
+ //关闭页面并跳转到列表页
close() {
- //删除未保存的上传附件
- const deleteArr = []
- if (this.form.uploadImageList.length > 0) {
- deleteArr.push(...this.form.uploadImageList.map(i => i.url))
- }
- if (deleteArr.length > 0) {
- deleteUpload.request(deleteArr).catch(e => ({}))
- }
-
return closeCurrentPage(this.getTablePageUrl())
},
//获取列表页的地址
@@ -262,7 +253,14 @@ export default {
this.$store.commit('needSearch/emit', this.getTablePageUrl())
},
- //附件操作
+ /*附件操作*/
+ //删除未保存的上传附件
+ clearUnusedFile() {
+ const deleteArr = this.form.uploadImageList.map(i => i.url)
+ if (deleteArr.length > 0) {
+ deleteUploadBatch.request(deleteArr).catch(e => ({}))
+ }
+ },
uploadSuccess(file, res) {
this.form.uploadImageList.push({
url: res.key,
@@ -272,15 +270,23 @@ export default {
})
this.attachmentSortSeed++
},
- removeUpload(file) {
- this.form.deleteImageList.push(file.url)
- const index = this.form.uploadImageList.findIndex(i => i.url === file.url)
- if (index > -1) this.form.uploadImageList.splice(index, 1)
+ removeUpload({key, isNew}) {
+ //被删除的文件不是本次上传的
+ if (!isNew) {
+ return this.form.deleteImageList.push(key)
+ }
+
+ const index = this.form.uploadImageList.findIndex(i => i.url === key)
+ index > -1 && this.form.uploadImageList.splice(index, 1)
}
},
mounted() {
this.loading = false
if (this.type !== 'add') return this.init(this.id)
+ },
+
+ beforeDestroy() {
+ this.clearUnusedFile()
}
}
diff --git a/vue/full/src/view/example/component/uploadPage.vue b/vue/full/src/view/example/component/uploadPage.vue
index ee4a465..13a00fe 100644
--- a/vue/full/src/view/example/component/uploadPage.vue
+++ b/vue/full/src/view/example/component/uploadPage.vue
@@ -5,7 +5,8 @@
图片使用lightgallery预览,
非图片类型的文件使用kkFileView预览
-