feat: 完善文件上传提示

src/views/Tracking/src/components/TrackingDetail/src/components/UploadFilesDialog.vue

@@ -13,7 +13,7 @@ defineExpose({
   openDialog
 })
 
-const uploadFileList = ref()
+const uploadFileList = ref([])
 
 const changeFileList = (file: any, fileList: any) => {
   if (file.size / 1024 / 1024 > 5) {
@@ -21,6 +21,7 @@ const changeFileList = (file: any, fileList: any) => {
     if (index !== -1) {
       fileList.splice(index, 1)
     }
+    ElMessage.warning('File size must not exceed 5MB!')
     return false
   }
   // 给当前文件添加fileType属性
@@ -46,6 +47,10 @@ const finishLoading = ref(false)
 const emit = defineEmits<{ update: [] }>()
 const handleSave = () => {
   // uploadRef.value.submit()
+  if (fileTypeList.value.length === 0 || uploadFileList.value.length === 0) {
+    ElMessage.warning('Please select file type and upload file')
+    return
+  }
 
   if (finishLoading.value) return
   finishLoading.value = true
@@ -122,7 +127,8 @@ const beforeAvatarUpload = (rawFile: any) => {
       // 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
     ].includes(rawFile.type)
   ) {
-    ElMessage.error('The file types allowed for upload are: PDF, DOCX, and XLSX.')
+    // , DOCX, and XLSX
+    ElMessage.error('The file types allowed for upload are: PDF.')
     return false
   } else if (rawFile.size / 1024 / 1024 > 5) {
     ElMessage.error('File size must not exceed 5MB!')
@@ -145,11 +151,11 @@ const disableUpload = ref(false)
   >
     <div class="upload-template">
       <div class="label">File Type</div>
-      <el-select v-model="fileType" placeholder="fileType">
+      <el-select v-model="fileType" placeholder="file type">
         <el-option
           v-for="item in fileTypeList"
           :key="item.file_type"
-          :label="item.display_name"
+          :label="item.file_type"
           :value="item.file_type"
         ></el-option>
       </el-select>
@@ -163,7 +169,7 @@ const disableUpload = ref(false)
         :show-file-list="false"
         :action="url"
         :auto-upload="false"
-        :disabled="disableUpload"
+        :disabled="disableUpload || fileTypeList.length === 0"
         :before-upload="beforeAvatarUpload"
         @change="changeFileList"
         @remove="changeFileList"
@@ -217,7 +223,7 @@ const disableUpload = ref(false)
           style="height: 40px; padding: 8px 40px"
           class="download-btn el-button--dark"
           @click="handleSave"
-          >Finish</el-button
+          >Upload</el-button
         >
       </div>
     </template>