UPDATE: 异步导出检测数据逻辑。

frontend/src/components/ImportZip/index.vue

@@ -5,6 +5,7 @@
         :destroy-on-close="true"
         width="450px"
         :close-on-click-modal="!parameter.progressBar"
+        :show-close="!disable"
         draggable
     >
         <el-upload
@@ -20,7 +21,7 @@
             :disabled="fileDisabled"
         >
             <slot name="empty">
-                <el-button type="primary" icon="Upload">点击上传</el-button>
+                <el-button type="primary" :disabled="fileDisabled" icon="Upload">点击上传</el-button>
             </slot>
             <template #tip>
                 <slot name="tip">
@@ -28,11 +29,7 @@
                 </slot>
             </template>
         </el-upload>
-        <el-progress
-            v-if="parameter.progressBar"
-            :status="progressData.status"
-            :percentage="progressData.percentage"
-        ></el-progress>
+
         <el-text v-if="parameter.progressBar && progressData.status === 'exception'" size="small" type="danger">
             {{ progressData.message }}
         </el-text>
@@ -42,6 +39,15 @@
         <el-text v-if="parameter.progressBar && progressData.status === ''" size="small" type="info">
             {{ progressData.message }}
         </el-text>
+        <el-progress
+            style="margin-top: 10px; margin-bottom: 10px"
+            v-if="parameter.progressBar"
+            :status="progressData.status"
+            :percentage="progressData.percentage"
+            :stroke-width="10"
+            striped
+            striped-flow
+        ></el-progress>
 
         <template #footer v-if="parameter.confirmMessage">
             <el-button :disabled="disable" type="primary" @click="uploadSubmit">开始导入</el-button>
@@ -96,7 +102,12 @@ const uploadZip = (param: UploadRequestOptions) => {
     }
 
     setTimeout(() => {
-        parameter.value.importApi!(zipFormData).then(res => handleImportResponse(res))
+        parameter.value.importApi!(zipFormData)
+            .then(res => handleImportResponse(res))
+            .catch(err => {
+                fileDisabled.value = false
+                disable.value = false
+            })
     }, 1000)
 }
 
@@ -104,13 +115,17 @@ const handleImportResponse = (res: any) => {
     if (!parameter.value.progressBar) {
         if (res.code === 'A0000') {
             ElMessage.success('导入成功')
+            dialogVisible.value = false
+            emit('result', res.data)
         } else {
             ElMessage.error(res.message)
+            fileDisabled.value = false
+            disable.value = false
         }
-        dialogVisible.value = false
-        emit('result', res.data)
     } else {
-        //
+        if (res.code !== 'A0000') {
+            ElMessage.error(res.message)
+        }
     }
 }