Merge pull request 'feat(upload): 优化文件上传组件逻辑' (#1086) from master into prod

Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/1086

src/components/AttachmentUpload.vue

@@ -426,6 +426,7 @@ const handleDelete = (row, type) => {
         allFileList.value.splice(allFileList.value.findIndex((item) => item.fileId === row.fileId), 1);
         isHaveOneFile.value = !(allFileList.value && allFileList.value?.length == 0);
         console.log('allFileList.value',allFileList.value)
+        localStorage.setItem('deleteFileRow', JSON.stringify(row))
         if (localStorage.getItem('collectData')) {
           let collectData = JSON.parse(localStorage.getItem('collectData'))
           collectData.fileList = allFileList.value
@@ -462,6 +463,7 @@ const getOtherFile = (val) => {
   } else {
     allFileList.value = _otherFileListValue.value
   }
+
   isHaveOneFile.value = true
   emit('getOtherFile', val)
 }

src/components/FileUpload.vue

@@ -10,11 +10,11 @@
              :show-file-list="showFileList"
              :auto-upload="false"
              :before-upload="beforeUpload"
-             :on-success="handleUploadSuccess"
              :on-error="uploadError"
              :before-remove="beforeRemove"
              :on-remove="handleRemove"
   >
+    <!--    :on-success="handleUploadSuccess"-->
     <el-button color="#DED0B2" :loading="loading" :disabled="disabled">上传文件</el-button>
   </el-upload>
 </template>
@@ -61,7 +61,7 @@ const props = defineProps({
 })
 const uploadRef = ref(null); // el-upload 的 ref
 const uploadPromises = ref([]); // 跟踪每个文件的上传状态
-const emit = defineEmits(["input", "beforeUpload","getFile", "delete"])
+const emit = defineEmits(["input", "beforeUpload", "getFile", "delete"])
 const fileList = ref([])
 const _value = computed({
   get() {
@@ -87,14 +87,29 @@ const handleRemove = (file) => {
 
 // 文件选择变化时触发
 const handleChange = (file, files) => {
-  console.log(file, files,'files')
+  const deleteFileRow = JSON.parse(localStorage.getItem('deleteFileRow'));
+  console.log("🚀 ~ file:deleteFileRow ", deleteFileRow, uploadFile.value)
+  let deleteIndex = null
+  if (deleteFileRow) {
+    deleteIndex = uploadFile.value.findIndex((item) => item.name === deleteFileRow.originalFileName && item.size === deleteFileRow.size)
+    console.log("🚀 ~ file:deleteIndex ", deleteIndex)
+
+    if (deleteIndex != -1) {
+      uploadFile.value.splice(deleteIndex, 1);
+    }
+  }
+
+
+  console.log(file, files, 'files')
   uploadIndex.value++
   uploadFile.value.push(file)
+  console.log("🚀 ~ file:uploadFile.value ", uploadFile.value)
+  localStorage.removeItem('deleteFileRow')
 };
 watch(() => uploadIndex.value, (newVal) => {
-  console.log('newVal',newVal)
+  console.log('newVal', newVal)
   startUpload(uploadFile.value); // 自动触发上传
-},{
+}, {
   deep: true
 })
 // 自定义上传逻辑
@@ -117,7 +132,7 @@ const customUpload = async (options) => {
 
 // 触发所有文件上传
 const startUpload = (files) => {
-  uploadLoading.value= ElLoading.service({
+  uploadLoading.value = ElLoading.service({
     fullscreen: true,
     text: '文件上传中...',
   })
@@ -144,9 +159,10 @@ const startUpload = (files) => {
         })
         files = []; // 清空文件列表
         uploadRef.value.clearFiles(); // 清空上传组件
+        uploadFile.value = [] // 清空文件列表
         nextTick(() => {
           uploadLoading.value.close()
-          uploadLoading.value=null
+          uploadLoading.value = null
         })
       })
 
@@ -157,6 +173,7 @@ const beforeUpload = () => {
   return true
 }
 const handleUploadSuccess = (res) => {
+
   ElNotification({
     title: '提示',
     message: res.code === 1000 ? '上传成功' : '上传失败',
@@ -166,7 +183,7 @@ const handleUploadSuccess = (res) => {
   showTable.value = true
   let data = res.data
   fileList.value.push(data)
-  emit("getFile", res.data)
+  // emit("getFile", res.data)
 }
 const uploadError = () => {
   loading.value = false