fix : 修复上传文件功能

src/components/FileUpload.vue

@@ -11,18 +11,20 @@
              :before-upload="beforeUpload"
              :on-success="handleUploadSuccess"
   >
-    <el-button color="#DED0B2">上传文件</el-button>
+    <el-button color="#DED0B2" :loading="loading">上传文件</el-button>
   </el-upload>
   <div v-if="showTable||fileList.length!==0">
     <el-table :data="fileList" style="width: 100%">
-      <el-table-column fixed prop="originalFilename" label="文件名" />
+      <el-table-column prop="originalFilename" label="文件名"/>
-      <el-table-column fixed prop="fileType" label="文件类型" />
+      <el-table-column prop="fileType" label="文件类型"/>
-      <el-table-column fixed prop="size" label="文件大小"  >
+      <el-table-column prop="size" label="文件大小">
         <template #default="scope">
-          {{parseInt(scope.row.size/1024)}}{{parseInt(scope.row.size/1024)>1024?'MB':'KB'}}
+          {{ parseInt(scope.row.size / 1024) }}KB
+<!--          {{ parseInt(scope.row.size / 1024) > 1024 ? 'MB' : 'KB' }}-->
         </template>
       </el-table-column>
-      <el-table-column fixed="right" label="操作" >
+<!--      <el-table-column prop="tag" label="标签"/>-->
+      <el-table-column fixed="right" label="操作">
         <template #default="scope">
           <a :href="scope.row.url">
             下载
@@ -32,7 +34,8 @@
           </el-button>
         </template>
       </el-table-column>
-    </el-table></div>
+    </el-table>
+  </div>
 </template>
 
 <script setup>
@@ -47,6 +50,7 @@ const headers = reactive({
   authorization: getToken()
 })
 const disabled = ref(false)
+const loading = ref(false)
 const showTable = ref(false)
 const uploadParams = ref({})
 const props = defineProps({
@@ -74,23 +78,28 @@ const _value = computed({
 })
 
 const beforeUpload = (file) => {
-  const FileExt = file.name.replace(/.+\./, "");
+  // const FileExt = file.name.replace(/.+\./, "");
-  if (['zip', 'rar','pdf','doc','docx','xlsx'].indexOf(FileExt.toLowerCase()) === -1){
+  // if (['zip', 'rar', 'pdf', 'doc', 'docx', 'xlsx'].indexOf(FileExt.toLowerCase()) === -1) {
-    ElMessage.warning('请上传后缀名为pdf、doc、docx、xlsx、zip或rar的文件！');
+  //   ElMessage.warning('请上传后缀名为pdf、doc、docx、xlsx、zip或rar的文件！');
-    return false;
+  //   return false;
-  } else if (props.maxSize > 0 && file.size / 1024 / 1024 > props.maxSize) {
+  // } else
-    ElMessage.warning(`每个文件最大不超过 ${props.maxSize}MB`)
+  // if (props.maxSize > 0 && file.size / 1024 / 1024 > props.maxSize) {
-  } else {
+  //   ElMessage.warning(`每个文件最大不超过 ${props.maxSize}MB`)
-    return true
+  // } else {
-  }
+  loading.value=true
+  return true
+  // }
 }
 const handleUploadSuccess = (res, file) => {
+
   if (res.code !== 1000) {
+    loading.value=false
     ElMessage.error("上传失败")
-  }else {
+  } else {
+    loading.value=false
     ElMessage.success("上传成功")
   }
-  showTable.value=true
+  showTable.value = true
   let data = res.data
   fileList.value.push(data)
   emit("getFile", fileList.value)
@@ -102,7 +111,7 @@ const beforeRemove = (row) => {
     type: 'warning'
   }).then(() => {
     handleRemove(row)
-  }).catch(()=>{
+  }).catch(() => {
     ElMessage.warning("用户取消删除! ");
   })
 }
@@ -119,8 +128,8 @@ const handleRemove = (row) => {
 </script>
 
 <style lang="scss" scoped>
-a{
+a {
   font-size: 12px;
-  color:#2a99ff;
+  color: #2a99ff;
 }
 </style>