菜单路由处理

src/api/modules/project/gist.js

@@ -66,4 +66,13 @@ export default {
             data: form,
         }, false)
     },
+    //下载模板
+    async exportTemplate() {
+        return HcApi({
+            url: '/api/blade-attach/workfocus/export-template',
+            method: 'get',
+            params: {},
+            responseType: 'blob',
+        }, false)
+    },
 }

src/views/project/gist/list.vue

@@ -25,12 +25,12 @@
         <hc-dialog v-model="isImportShow" widths="24rem" title="项目数据导入" :footer="false" @close="modalImportClose">
             <hc-form-upload
                 v-model="importFile" class="hc-form-drop-upload"
-                :options="{ num: 0, type: 'list', drop: true }"
-                :upload="{ options: uploadOptions }"
+                :options="{ num: 1, type: 'list', drop: true, isSuccess: true }"
+                :upload="{ options: uploadOptions }" @success="uploadSuccess"
             />
             <div class="hc-flex mt-5">
                 <span class="mr-2">模板下载:</span>
-                <el-button color="#20C98B" size="small" class="text-white">点击下载</el-button>
+                <el-button color="#20C98B" size="small" class="text-white" :loading="downloadTemplateLoading" @click="downloadTemplate">点击下载</el-button>
             </div>
         </hc-dialog>
     </hc-card>
@@ -38,6 +38,7 @@
 
 <script setup>
 import { onMounted, ref } from 'vue'
+import { useClick } from 'hc-vue3-ui'
 import HcTableList from '../modules/gist-list.vue'
 import { getDictionaryData } from '~src/utils/tools'
 import { arrToId, getArrValue, newDownBlob } from 'js-fast-way'
@@ -133,8 +134,10 @@ const deriveTableItem = async (_, resolve) => {
 
 //项目数据导入
 const isImportShow = ref(false)
-const importFile = ref([])
+const importFile = ref('')
 const uploadOptions = {
+    url: '/api/blade-attach/workfocus/import-workfocus',
+    size: 120,
     accept: '.xls,.xlsx',
     accept_tip: '请选择Excel文件',
 }
@@ -142,8 +145,29 @@ const importClick = () => {
     isImportShow.value = true
 }
 
+//下载模板
+const downloadTemplateLoading = ref(false)
+const downloadTemplate = async () => {
+    await useClick() //这里要使用 await 来等待
+    downloadTemplateLoading.value = true
+    const { error, val } = await mainApi.exportTemplate()
+    downloadTemplateLoading.value = false
+    if (error) {
+        window.$message?.error('数据异常')
+        return
+    }
+    await newDownBlob(val)
+}
+
 //关闭项目数据导入弹窗
 const modalImportClose = () => {
     isImportShow.value = false
 }
+
+//上传完成
+const uploadSuccess = (_, resolve) => {
+    resolve('')
+    getTableData()
+    modalImportClose()
+}
 </script>