Pārlūkot izejas kodu

fix: 文件标注bux修改

Eureka 8 mēneši atpakaļ
vecāks
revīzija
9ed6a87bb0
1 mainītis faili ar 35 papildinājumiem un 18 dzēšanām
  1. 35 18
      src/components/ImportPicDataset/index.vue

+ 35 - 18
src/components/ImportPicDataset/index.vue

@@ -1,6 +1,6 @@
 <template>
   <el-dialog v-model="dialogVisible" :width="parameter.width" :top="parameter.top" :title="`${parameter.title}`" :destroy-on-close="true" draggable>
-    <el-form class="drawer-multiColumn-form" label-width="100px">
+    <el-form class="drawer-multiColumn-form" label-width="100px" ref="formRef">
       <el-form-item label="图片数据集压缩文件上传">
         <el-upload
           action="#"
@@ -11,6 +11,7 @@
           :before-upload="beforeZipUpload"
           :on-exceed="handleExceed"
           :accept="parameter.ZipFileType!.join(',')"
+          @change="handleChange"
         >
           <slot name="empty">
             <el-icon class="el-icon--upload">
@@ -97,7 +98,6 @@ export interface ParameterProps {
 
 const formModel = ref({
   batchNum: '',
-  name: '',
   objectType: '',
   objectSubtype: '',
   scene: '',
@@ -107,11 +107,12 @@ const formModel = ref({
   dataType: '',
   labeled: false
 })
+
 const dataTypes = ref([
   { dictValue: '1', dictLabel: '训练' },
   { dictValue: '2', dictLabel: '测试' }
-  // 添加更多数据类型
 ])
+
 const dialogVisible = ref(false)
 const parameter = ref<ParameterProps>({
   title: '',
@@ -124,12 +125,19 @@ const parameter = ref<ParameterProps>({
   ZipFileType: ['application/zip', 'application/x-zip-compressed', 'application/x-rar-compressed']
 })
 
+// 存储上传文件
+let uploadedFile: UploadRawFile | null = null
+
 const acceptParams = (params: ParameterProps) => {
   parameter.value = { ...parameter.value, ...params }
   dialogVisible.value = true
+  resetFormModel()
+}
+
+// 重置表单模型
+const resetFormModel = () => {
   formModel.value = {
     batchNum: '',
-    name: '',
     objectType: '',
     objectSubtype: '',
     scene: '',
@@ -140,11 +148,10 @@ const acceptParams = (params: ParameterProps) => {
     labeled: false
   }
 }
-const formData = new FormData()
+
+// 提交表单
 const handleSubmit = async () => {
-  const zipFile = formData.get('file')
-  console.log(zipFile)
-  if (!zipFile) {
+  if (!uploadedFile) {
     ElNotification({
       title: '温馨提示',
       message: '请上传一个压缩文件!',
@@ -152,13 +159,15 @@ const handleSubmit = async () => {
     })
     return
   }
+
   const formDataInfo = new FormData()
-  formDataInfo.append('file', zipFile)
+  formDataInfo.append('file', uploadedFile)
   for (const key in formModel.value) {
     if (Object.prototype.hasOwnProperty.call(formModel.value, key)) {
       formDataInfo.append(key, formModel.value[key])
     }
   }
+
   try {
     await parameter.value.importApi!(formDataInfo)
     ElNotification({
@@ -169,28 +178,33 @@ const handleSubmit = async () => {
     parameter.value.getTableList && parameter.value.getTableList()
     dialogVisible.value = false
   } catch (error) {
-    // ElNotification({
-    //   // title: '温馨提示',
-    //   // message: `文件上传失败,请重新上传`,
-    //   // type: 'error'
-    // })
+    ElNotification({
+      title: '温馨提示',
+      message: `文件上传失败,请重新上传`,
+      type: 'error'
+    })
   }
 }
 
+// 处理文件上传
 const uploadZip = (param: UploadRequestOptions) => {
-  formData.append('file', param.file)
+  uploadedFile = param.file // 将文件保存到变量中
 }
 
+// 上传前的校验
 const beforeZipUpload = (file: UploadRawFile) => {
   const isZip = parameter.value.ZipFileType!.includes(file.type as File.ZipMimeType)
   const fileSize = file.size / 1024 / 1024 < parameter.value.fileSize!
-  if (!isZip)
+
+  if (!isZip) {
     ElNotification({
       title: '温馨提示',
       message: '上传文件只能是 zip 格式!',
       type: 'warning'
     })
-  if (!fileSize)
+  }
+
+  if (!fileSize) {
     setTimeout(() => {
       ElNotification({
         title: '温馨提示',
@@ -198,9 +212,12 @@ const beforeZipUpload = (file: UploadRawFile) => {
         type: 'warning'
       })
     }, 0)
-  return isZip && fileSize
+  }
+
+  return isZip && fileSize // 只有同时满足两个条件才允许上传
 }
 
+// 处理文件超出限制的情况
 const handleExceed = () => {
   ElNotification({
     title: '温馨提示',