附件查看

src/views/tentative/material/components/HcDragUpload.vue

@@ -1,16 +1,18 @@
 <template>
-    <el-upload ref="uploadRef" :accept="acceptData" :action="api + actionData" :auto-upload="autoUpload"
-               :before-upload="beforeUpload" :data="uploadData" :disabled="uploadDisabled" :headers="getTokenHeader()" :limit="1"
-               :on-change="uploadChange"
-               :on-error="uploadError" :on-exceed="uploadExceed" :on-progress="uploadprogress"
-               :on-success="uploadSuccess" :show-file-list="false" class="hc-upload-border approach" drag>
+    <el-upload
+        ref="uploadRef" :accept="acceptData" :action="api + actionData" :auto-upload="autoUpload"
+        :before-upload="beforeUpload" :data="uploadData" :disabled="uploadDisabled" :headers="getTokenHeader()" :limit="1"
+        :on-change="uploadChange"
+        :on-error="uploadError" :on-exceed="uploadExceed" :on-progress="uploadprogress"
+        :on-success="uploadSuccess" :show-file-list="false" class="hc-upload-border approach" drag
+    >
         <div v-loading="uploadDisabled" class="hc-upload-loading upload-file-info" element-loading-text="上传中...">
             <template v-if="uploadFileInfo?.name">
-                <HcIcon class="upload-file-icon" name="file-text"/>
+                <HcIcon class="upload-file-icon" name="file-text" />
                 <div class="upload-file-name">{{ uploadFileInfo?.name }}</div>
             </template>
             <template v-else>
-                <HcIcon class="upload-icon" name="upload-cloud"/>
+                <HcIcon class="upload-icon" name="upload-cloud" />
                 <div class="el-upload__text">拖动文件到这里 或 <em>点击这里选择文件</em> 并上传</div>
             </template>
         </div>
@@ -22,42 +24,45 @@
 </template>
 
 <script setup>
-import {ref, watch} from "vue";
-import {getTokenHeader} from '~src/api/request/header';
-import {isFileSize} from "js-fast-way"
-import {genFileId} from "element-plus";
+import { ref, watch } from 'vue'
+import { getTokenHeader } from '~src/api/request/header'
+import { isFileSize } from 'js-fast-way'
+import { genFileId } from 'element-plus'
 
 const props = defineProps({
     datas: {
         type: Object,
-        default: () => ({})
+        default: () => ({}),
     },
     action: {
         type: String,
-        default: "mobilization/import"
+        default: 'mobilization/import',
     },
     accept: {
         type: String,
-        default: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+        default: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
     },
     size: {
         type: Number,
-        default: 20
+        default: 20,
     },
     formatTip: {
         type: String,
-        default: "excel"
+        default: 'excel',
     },
     autoUpload: {
         type: Boolean,
-        default: false
+        default: false,
     },
     api: {
         type: String,
-        default: "/api/blade-resource/oss/"
-    }
+        default: '/api/blade-resource/oss/',
+    },
+    
 })
 
+//事件
+const emit = defineEmits(['progress', 'finished', 'change'])
 //变量
 const uploadRef = ref(null)
 const uploadData = ref(props.datas)
@@ -73,23 +78,20 @@ const uploadDisabled = ref(false)
 watch(() => [
     props.datas,
     props.action,
-    props.accept
+    props.accept,
 ], ([datas, action, accept]) => {
     uploadData.value = datas
     actionData.value = action
     acceptData.value = accept
 })
 
-//事件
-const emit = defineEmits(['progress', 'finished', 'change'])
-
 //上传前
 const beforeUpload = async (file) => {
     if (isFileSize(file?.size, props.size)) {
-        return true;
+        return true
     } else {
-        window?.$message?.warning('文件大小, 不能过' + props.size + 'M!');
-        return false;
+        window?.$message?.warning('文件大小, 不能过' + props.size + 'M!')
+        return false
     }
 }
 
@@ -108,15 +110,16 @@ const uploadprogress = () => {
 }
 
 //上传完成
-const uploadSuccess = ({code, data}) => {
+const uploadSuccess = ({ code, data }) => {
     uploadDisabled.value = false
     emit('progress', false)
     if (code === 200) {
-        window?.$message?.success('上传成功');
+        window?.$message?.success('上传成功')
         emit('finished', data)
+        uploadFileInfo.value.name = ''
         clearFiles()
     } else {
-        window?.$message?.error('上传失败');
+        window?.$message?.error('上传失败')
     }
 }
 
@@ -125,7 +128,7 @@ const uploadError = (err) => {
     let errmsg = JSON.parse(err.message).msg
     uploadDisabled.value = false
     emit('progress', false)
-    window?.$message?.error(errmsg);
+    window?.$message?.error(errmsg)
 }
 
 //文件改变时
@@ -142,10 +145,12 @@ const clearFiles = () => {
     uploadRef.value?.clearFiles()
 }
 
+
 // 暴露出去
 defineExpose({
     submit,
-    clearFiles
+    clearFiles,
+  
 })
 </script>