From 3d4385ee1fe43839b5d5b1a9d5e3ff019328c70e Mon Sep 17 00:00:00 2001
From: NicholasLD <nicholasld505@gmail.com>
Date: Tue, 10 Jun 2025 04:04:39 +0000
Subject: [PATCH 1/3] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dplus=E5=90=8E?=
 =?UTF-8?q?=E7=AB=AF=E5=85=BC=E5=AE=B9=E6=80=A7=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: NicholasLD <nicholasld505@gmail.com>
---
 src/components/custom/file-upload.vue | 116 ++++++++++++++++++++++----
 1 file changed, 99 insertions(+), 17 deletions(-)

diff --git a/src/components/custom/file-upload.vue b/src/components/custom/file-upload.vue
index 0dea9af6..e3d02991 100644
--- a/src/components/custom/file-upload.vue
+++ b/src/components/custom/file-upload.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
-import { ref, useAttrs, watch } from 'vue';
+import { computed, ref, useAttrs, watch } from 'vue';
 import type { UploadFileInfo, UploadProps } from 'naive-ui';
-import { fetchBatchDeleteOss } from '@/service/api/system/oss';
+import { cloneDeep } from 'lodash-es';
+import { fetchBatchDeleteOss, listByIds } from '@/service/api/system/oss';
 import { getToken } from '@/store/modules/auth/shared';
 import { getServiceBaseURL } from '@/utils/service';
 
@@ -18,6 +19,7 @@ interface Props {
   accept?: string;
   fileSize?: number;
   uploadType?: 'file' | 'image';
+  modelValue?: string | string[] | any[]; // 用于回显
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -28,24 +30,68 @@ const props = withDefaults(defineProps<Props>(), {
   max: 5,
   accept: '.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.pdf',
   fileSize: 5,
-  uploadType: 'file'
+  uploadType: 'file',
+  modelValue: ''
 });
 
 const attrs: UploadProps = useAttrs();
 
+const accept = computed(() => {
+  return props.uploadType === 'file' ? '.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.pdf' : '.jpg,.jpeg,.png,.gif,.bmp,.webp';
+});
+
 let fileNum = 0;
 const fileList = ref<UploadFileInfo[]>([]);
 
 const needRelaodData = ref(false);
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: string): void;
+}>();
 
 defineExpose({
   needRelaodData
 });
 watch(
-  () => fileList.value,
-  newValue => {
-    needRelaodData.value = newValue.length > 0;
-  }
+  () => props.modelValue,
+  async (newValue: string | any[] | string[]) => {
+    if (!newValue) {
+      fileList.value = [];
+      return;
+    }
+
+    let list: UploadFileInfo[] = [];
+
+    if (Array.isArray(newValue)) {
+      list = newValue as UploadFileInfo[];
+    } else {
+      try {
+        const res = await listByIds(newValue);
+        list = res.data;
+      } catch (error) {
+        list = [];
+        throw new Error(`获取文件列表失败: ${error}`);
+      }
+    }
+
+    fileList.value = list.map((item: any) => {
+      if (typeof item === 'string') {
+        return {
+          id: item,
+          name: item,
+          url: item,
+          status: 'finished'
+        } as UploadFileInfo;
+      }
+
+      return {
+        id: String(item.ossId),
+        name: item.fileName,
+        url: item.url,
+        status: 'finished'
+      } as UploadFileInfo;
+    });
+  },
+  { deep: true, immediate: true }
 );
 
 const isHttpProxy = import.meta.env.DEV && import.meta.env.VITE_HTTP_PROXY === 'Y';
@@ -56,7 +102,12 @@ const headers: Record<string, string> = {
   clientid: import.meta.env.VITE_APP_CLIENT_ID!
 };
 
+// 拷贝一份当前的FileList
+let currentFileList: UploadFileInfo[] = [];
+
 function beforeUpload(options: { file: UploadFileInfo; fileList: UploadFileInfo[] }) {
+  currentFileList = cloneDeep(fileList.value);
+
   fileNum += 1;
   const { file } = options;
 
@@ -92,23 +143,54 @@ function isErrorState(xhr: XMLHttpRequest) {
   return response.code !== 200;
 }
 
+// 对象转成指定字符串分隔
+const listToString = (list: any[]) => {
+  let strs = '';
+  const separator = ',';
+  for (const i in list) {
+    if (undefined !== list[i].id && list[i].url?.indexOf('blob:') !== 0) {
+      strs += list[i].id + separator;
+    }
+  }
+  return strs !== '' ? strs.substring(0, strs.length - 1) : '';
+};
+
+// 上传中的文件列表
+const uploadingFiles = ref<any[]>([]);
+
 function handleFinish(options: { file: UploadFileInfo; event?: ProgressEvent }) {
   fileNum -= 1;
-  const { file, event } = options;
-  // @ts-expect-error Ignore type errors
-  const responseText = event?.target?.responseText;
-  const response = JSON.parse(responseText);
-  const oss: Api.System.Oss = response.data;
-  fileList.value.find(item => item.id === file.id)!.id = String(oss.ossId);
-  file.id = String(oss.ossId);
-  file.url = oss.url;
-  file.name = oss.fileName;
+  const { file } = options;
+
+  // 标记当前文件上传完成
+  const target = event?.target as XMLHttpRequest;
+  const responseText = target?.responseText;
+  const uploadFileResp = JSON.parse(responseText).data;
+
+  uploadingFiles.value.push({
+    id: uploadFileResp.ossId,
+    name: uploadFileResp.fileName,
+    url: uploadFileResp.url
+  });
+
+  // 检查是否所有文件都上传完成
   if (fileNum === 0) {
+    // 所有文件上传完成，执行批量查询
+    handleAllFilesUploaded();
     window.$message?.success('上传成功');
   }
+
   return file;
 }
 
+async function handleAllFilesUploaded() {
+  fileList.value = [...currentFileList, ...uploadingFiles.value];
+  uploadingFiles.value = [];
+  const fileIds = listToString(fileList.value);
+  emit('update:modelValue', fileIds);
+  needRelaodData.value = true;
+}
+
 function handleError(options: { file: UploadFileInfo; event?: ProgressEvent }) {
   const { event } = options;
   // @ts-expect-error Ignore type errors
@@ -179,4 +261,4 @@ async function handleRemove(file: UploadFileInfo) {
   </NP>
 </template>
 
-<style scoped></style>
+<style scoped></style>
\ No newline at end of file

From e8240021cb83430b386189a16af587dd0230093c Mon Sep 17 00:00:00 2001
From: NicholasLD <nicholasld505@gmail.com>
Date: Tue, 10 Jun 2025 04:05:31 +0000
Subject: [PATCH 2/3] =?UTF-8?q?feat:=20=E6=9F=A5=E8=AF=A2OSS=E5=AF=B9?=
 =?UTF-8?q?=E8=B1=A1=E5=9F=BA=E4=BA=8Eid=E4=B8=B2=E6=8E=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: NicholasLD <nicholasld505@gmail.com>
---
 src/service/api/system/oss.ts | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/service/api/system/oss.ts b/src/service/api/system/oss.ts
index 2a1d1c52..e3db6972 100644
--- a/src/service/api/system/oss.ts
+++ b/src/service/api/system/oss.ts
@@ -10,6 +10,14 @@ export function fetchGetOssList(params?: Api.System.OssSearchParams) {
   });
 }
 
+// 查询OSS对象基于id串
+export function listByIds(ossId: string | number) {
+  return request({
+    url: `/resource/oss/listByIds/${ossId}`,
+    method: 'get'
+  });
+}
+
 /** 批量删除文件管理 */
 export function fetchBatchDeleteOss(ossIds: CommonType.IdType[]) {
   return request<boolean>({

From 19940201f5ddd9a88ff992400b3960f57ff4d72a Mon Sep 17 00:00:00 2001
From: NicholasLD <nicholasld505@gmail.com>
Date: Tue, 10 Jun 2025 05:35:35 +0000
Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=E6=96=87=E4=BB=B6=E7=B1=BB=E5=9E=8B?=
 =?UTF-8?q?=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: NicholasLD <nicholasld505@gmail.com>
---
 src/components/custom/file-upload.vue | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/components/custom/file-upload.vue b/src/components/custom/file-upload.vue
index e3d02991..d9af02e2 100644
--- a/src/components/custom/file-upload.vue
+++ b/src/components/custom/file-upload.vue
@@ -28,7 +28,7 @@ const props = withDefaults(defineProps<Props>(), {
   defaultUpload: true,
   showTip: true,
   max: 5,
-  accept: '.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.pdf',
+  accept: '',
   fileSize: 5,
   uploadType: 'file',
   modelValue: ''
@@ -121,6 +121,12 @@ function beforeUpload(options: { file: UploadFileInfo; fileList: UploadFileInfo[
       return false;
     }
   }
+
+  if (accept.value && !file.name.match(new RegExp(accept.value.replace(/\./g, '\\.').replace(/,/g, '|')))) {
+    window.$message?.error(`文件格式不正确, 请上传 ${accept.value} 格式文件!`);
+    return false;
+  }
+
   // 校检文件名是否包含特殊字符
   if (file.name.includes(',')) {
     window.$message?.error('文件名不正确，不能包含英文逗号!');
@@ -203,8 +209,13 @@ async function handleRemove(file: UploadFileInfo) {
   if (file.status !== 'finished') {
     return;
   }
+  fileList.value = fileList.value.filter(item => item.id !== file.id);
+  const fileIds = listToString(fileList.value);
+  emit('update:modelValue', fileIds);
+  needRelaodData.value = true;
   const { error } = await fetchBatchDeleteOss([file.id]);
   if (error) return;
+
   window.$message?.success('删除成功');
 }
 </script>
@@ -261,4 +272,4 @@ async function handleRemove(file: UploadFileInfo) {
   </NP>
 </template>
 
-<style scoped></style>
\ No newline at end of file
+<style scoped></style>