Pre Merge pull request !289 from CyberShen123/dev

snowy-admin-web/src/components/XnUpload/index.vue

@@ -9,6 +9,7 @@
 			:maxCount="props.uploadNumber"
 			:progress="progress"
 			@change="handleChange"
+            @remove="handleRemove"
 			:showUploadList="props.showUploadList"
 			:accept="accept"
 			:disabled="props.disabled"
@@ -30,6 +31,7 @@
 			list-type="picture-card"
 			@change="handleChange"
 			@preview="handlePreview"
+            @remove="handleRemove"
 			:progress="progress"
 			:showUploadList="props.showUploadList"
 			:accept="accept"
@@ -52,6 +54,7 @@
 			list-type="picture-card"
 			@change="handleChange"
 			@preview="handlePreview"
+            @remove="handleRemove"
 			:progress="progress"
 			:showUploadList="props.showUploadList"
 			:accept="accept"
@@ -109,8 +112,11 @@
 <script setup name="uploadIndex">
 	import tool from '@/utils/tool'
 	import sysConfig from '@/config/index'
+    import fileApi from '@/api/dev/fileApi';
+    import { createVNode } from 'vue';
 	import { convertUrl } from '@/utils/apiAdaptive'
-	import { message, Upload } from 'ant-design-vue'
+	import { message, Upload, Modal } from 'ant-design-vue'
+    import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
 	import { cloneDeep } from 'lodash-es'
 	const fileList = ref([])
 	const emit = defineEmits(['update:value', 'onChange', 'onSuccessful'])
@@ -384,6 +390,59 @@
 		emit('update:value', undefined)
 		emit('onChange', undefined)
 	}
+    // 删除文件
+	const handleRemove = (file) => {
+		return new Promise((resolve,reject) => {
+			Modal.confirm({
+				title: '删除确认',
+				icon: createVNode(ExclamationCircleOutlined),
+				content: '确定要删除吗？这将从服务器删除该文件',
+				okText: '确认',
+				cancelText: '取消',
+				onOk(){
+					// 删除文件
+					fileList.value = fileList.value.filter((f) => f.url !== file.url)
+					// 截取文件id
+					var fileId = file.url.substring(file.url.lastIndexOf('=') + 1)
+				
+					fileApi.fileDeleteAbsolute({id:fileId}).then(res => {
+						if (props.uploadResultCategory === 'interval') {
+							const resultIntervalValue = ref('')
+							fileList.value.forEach((data) => {
+								resultIntervalValue.value =
+									data.response.data + (resultIntervalValue.value ? ',' + resultIntervalValue.value : '')
+							})
+							emit('update:value', resultIntervalValue)
+							emit('onChange', resultIntervalValue)
+						} else if (props.uploadResultCategory === 'array') {
+							if (props.completeResult) {
+								// 得去掉数组里面的thumbUrl，一个base64太大，无用
+								let newResult = cloneDeep(fileList.value)
+								newResult.map((e) => {
+									if (e.thumbUrl) { 
+										delete e.thumbUrl
+									}
+								})
+								emit('update:value', newResult)
+								emit('onChange', newResult)
+							} else {
+								const resultArrayValue = ref([])
+								fileList.value.forEach((data) => {
+									resultArrayValue.value.push(data.response.data)
+								})
+								emit('update:value', resultArrayValue)
+								emit('onChange', resultArrayValue)
+							}
+						}
+						resolve(file)
+					})
+				},
+				onCancel() {
+					reject()
+				},
+			})		
+		})
+	}
 	// 通过DOM获取上传的文件
 	const uploadFileList = () => {
 		if (fileList.value) {