update: 修复上传问题

web/components/FileUpload.vue

@@ -9,6 +9,7 @@
     :on-error="handleUploadError"
     :on-remove="handleFileRemove"
     :max="5"
+    ref="uploadRef"
   >
     <n-upload-dragger>
       <div style="margin-bottom: 12px">
@@ -67,10 +68,68 @@ const maxFiles = ref(10)
 const maxFileSize = ref(5 * 1024 * 1024) // 5MB
 const acceptTypes = ref('image/*')
 
+// 添加状态标记：用于跟踪已上传的文件
+const uploadedFiles = ref<Map<string, boolean>>(new Map()) // 文件哈希 -> 是否已上传
+const uploadingFiles = ref<Set<string>>(new Set()) // 正在上传的文件哈希
+
+// 生成文件哈希值（基于文件名、大小和修改时间）
+const generateFileHash = (file: File): string => {
+  return `${file.name}_${file.size}_${file.lastModified}`
+}
+
+// 检查文件是否已经上传过
+const isFileAlreadyUploaded = (file: File): boolean => {
+  const fileHash = generateFileHash(file)
+  return uploadedFiles.value.has(fileHash)
+}
+
+// 检查文件是否正在上传
+const isFileUploading = (file: File): boolean => {
+  const fileHash = generateFileHash(file)
+  return uploadingFiles.value.has(fileHash)
+}
+
+// 标记文件为已上传
+const markFileAsUploaded = (file: File) => {
+  const fileHash = generateFileHash(file)
+  uploadedFiles.value.set(fileHash, true)
+  uploadingFiles.value.delete(fileHash)
+}
+
+// 标记文件为正在上传
+const markFileAsUploading = (file: File) => {
+  const fileHash = generateFileHash(file)
+  uploadingFiles.value.add(fileHash)
+}
+
+// 标记文件上传失败
+const markFileAsFailed = (file: File) => {
+  const fileHash = generateFileHash(file)
+  uploadingFiles.value.delete(fileHash)
+}
+
 // 自定义上传请求
 const customRequest = async (options: any) => {
   const { file, onProgress, onSuccess, onError } = options
   
+  // 检查文件是否已经上传过
+  if (isFileAlreadyUploaded(file.file)) {
+    message.warning(`${file.name} 已经上传过了，跳过重复上传`)
+    if (onSuccess) {
+      onSuccess({ message: '文件已存在，跳过上传' })
+    }
+    return
+  }
+  
+  // 检查文件是否正在上传
+  if (isFileUploading(file.file)) {
+    message.warning(`${file.name} 正在上传中，请稍候`)
+    return
+  }
+  
+  // 标记文件为正在上传
+  markFileAsUploading(file.file)
+  
   console.log('开始上传文件:', file.name, file.file)
   
   try {
@@ -84,11 +143,16 @@ const customRequest = async (options: any) => {
     
     console.log('文件上传成功:', file.name, response)
     
+    // 标记文件为已上传
+    markFileAsUploaded(file.file)
+    
     if (onSuccess) {
       onSuccess(response)
     }
   } catch (error) {
     console.error('文件上传失败:', file.name, error)
+    // 标记文件上传失败
+    markFileAsFailed(file.file)
     if (onError) {
       onError(error)
     }
@@ -103,6 +167,18 @@ const defaultFileList = ref<UploadFileInfo[]>([])
 const handleBeforeUpload = (data: { file: Required<UploadFileInfo> }) => {
   const { file } = data
   
+  // 检查文件是否已经上传过
+  if (file.file && isFileAlreadyUploaded(file.file)) {
+    //message.warning(`${file.name} 已经上传过了，请勿重复上传`)
+    return false
+  }
+  
+  // 检查文件是否正在上传
+  if (file.file && isFileUploading(file.file)) {
+    message.warning(`${file.name} 正在上传中，请稍候`)
+    return false
+  }
+  
   // 检查文件大小
   if (file.file && file.file.size > maxFileSize.value) {
     message.error(`文件大小不能超过 ${formatFileSize(maxFileSize.value)}`)
@@ -137,18 +213,30 @@ const handleUploadFinish = (data: { file: Required<UploadFileInfo> }) => {
   
   if (file.status === 'finished') {
     message.success(`${file.name} 上传成功`)
-    // 不在这里重新加载文件列表，避免重复上传
+    // 确保文件被标记为已上传
+    if (file.file) {
+      markFileAsUploaded(file.file)
+    }
   }
 }
 
 const handleUploadError = (data: { file: Required<UploadFileInfo> }) => {
   const { file } = data
   message.error(`${file.name} 上传失败`)
+  // 标记文件上传失败
+  if (file.file) {
+    markFileAsFailed(file.file)
+  }
 }
 
 const handleFileRemove = (data: { file: Required<UploadFileInfo> }) => {
   const { file } = data
   message.info(`已移除 ${file.name}`)
+  // 从上传状态中移除文件
+  if (file.file) {
+    const fileHash = generateFileHash(file.file)
+    uploadingFiles.value.delete(fileHash)
+  }
 }
 
 const loadFileList = async () => {
@@ -221,13 +309,25 @@ const resetUpload = () => {
   if (uploadRef.value) {
     uploadRef.value.clear()
   }
+  // 清空上传状态
+  uploadedFiles.value.clear()
+  uploadingFiles.value.clear()
+}
+
+// 清空已上传文件状态（用于重新开始上传）
+const clearUploadedFiles = () => {
+  uploadedFiles.value.clear()
+  uploadingFiles.value.clear()
 }
 
 // 暴露方法给父组件
 defineExpose({
   loadFileList,
   fileList,
-  resetUpload
+  resetUpload,
+  clearUploadedFiles,
+  uploadedFiles,
+  uploadingFiles
 })
 </script>