优化上传附件功能，提升用户体验，提高操作效率。

src/components/uploadAnnex/index.vue

@@ -1,15 +1,15 @@
 <template>
-    <el-upload
-        accept="doc, docx, xls, xlsx, ppt, pptx, pdf, txt, zip, rar, tar, jpg, png, gif, jpeg, webp, wmv, avi, mpg, mpeg, 3gp, mov, mp4, flv, f4v, rmvb, mkv"
-        :show-file-list="true" aria-hidden="true" :headers="{ Token: userStore?.token }" :action="base_url + '/upload/file'"
-        :on-success="handleAvatarSuccess" ref="upload" :limit="100" multiple :on-preview="previewFile"
-        :on-remove="removeFile">
+    <el-upload :accept="acceptList" :show-file-list="true" aria-hidden="true" :headers="{ Token: userStore?.token }"
+        :action="base_url + '/upload/file'" :on-success="handleAvatarSuccess" ref="upload" :limit="100" multiple
+        :on-preview="previewFile" :on-remove="removeFile" :before-upload="checkSize">
         <template #tip>
             <span class="text-primary" style="margin-left:5px;font-size:11px">提示:文件单个大小不能超过1个G</span>
         </template>
-        <el-button type="primary">
-            上传
-        </el-button>
+        <template #default>
+            <el-button type="primary">
+                上传
+            </el-button>
+        </template>
     </el-upload>
 </template>
 <script setup lang="ts">
@@ -17,6 +17,7 @@ import { ref, defineProps } from "vue"
 import configs from "@/config"
 import useUserStore from "@/stores/modules/user";
 
+const acceptList = reactive('doc, docx, xls, xlsx, ppt, pptx, pdf, txt, zip, rar, tar, jpg, png, gif, jpeg, webp, wmv, avi, mpg, mpeg, 3gp, mov, mp4, flv, f4v, rmvb, mkv')
 const userStore = useUserStore();
 const base_url = ref(configs.baseUrl + configs.urlPrefix)
 const props = defineProps({
@@ -30,6 +31,14 @@ const props = defineProps({
     }
 })
 
+const checkSize = (e) => {
+    if (e.size > 1024000000) {
+        ElMessage.error('文件大小不能超过1个G')
+        return false
+    }
+}
+
+
 const handleAvatarSuccess = (response: any) => {
     props.formData[props.value] ||= []
     // @ts-ignore