部分下载文件功能添加

This commit is contained in:
2026-09-23 13:45:06 +08:00
parent 0e42842611
commit 86a3520ecb
6 changed files with 36 additions and 32 deletions
+1 -1
View File
@@ -238,8 +238,8 @@ export function getTimeRangeStamp(timeRange: string){
export function downloadFileFun(url: string, name: string) {
const a = document.createElement('a');
a.href = url;
a.target = '_blank';
a.download = name;
a.style.display = 'none';
document.body.appendChild(a)
a.click()
document.body.removeChild(a);
+6 -7
View File
@@ -4,7 +4,7 @@ import { Icon } from '@iconify/vue'
import { useThemeStore } from '@/store/modules/theme';
import { useRouterPush } from '@/hooks/common/router';
import { useRoute } from 'vue-router';
import { getColorWithOpacity, tagTextColor, tagBgColor, tagBorderColor } from '@/utils/common';
import { getColorWithOpacity, tagTextColor, tagBgColor, tagBorderColor, downloadFileFun } from '@/utils/common';
import { AiError, aiTypeJudge } from "@/service/api/ai";
import { systemConfigApi } from '@/service/api/system';
import { getChangeDetailApi } from '@/service/api/change';
@@ -268,12 +268,11 @@ const exportFile = (type: string) => {
};
// 变更附带资料下载/一键下载
const downloadFile = (type: string) => {
window.$message?.info('还差接口')
const downloadFile = (file:any,type: string) => {
if(type === 'all'){
window.$message?.success('打包下载全部附件');
window.$message?.info('还差接口')
}else{
window.$message?.success('下载当前附件成功');
downloadFileFun(file?.file_url, file?.doc_name || file?.file_name);
}
};
// 变更附带资料预览
@@ -560,7 +559,7 @@ onMounted(() => {
class="rounded-sm bg-[var(--theme-color)] px-3 py-1 text-xs font-semibold text-white"
:style="{'--theme-color': themeStore.themeColor}"
>变更附带资料</p>
<NButton ghost size="small" class="text-xs" @click="downloadFile('all')"><Icon icon="material-symbols:download" class="size-16px" />一键下载</NButton>
<NButton ghost size="small" class="text-xs" @click="downloadFile(null,'all')"><Icon icon="material-symbols:download" class="size-16px" />一键下载</NButton>
</div>
<NTable size="small">
<thead>
@@ -587,7 +586,7 @@ onMounted(() => {
<td>
<div class="flex items-center justify-center gap-2">
<NButton text type="primary" class="text-xs" @click="openPreview(doc)">预览</NButton>
<NButton text type="primary" class="text-xs" @click="downloadFile('single')">下载</NButton>
<NButton text type="primary" class="text-xs" @click="downloadFile(doc,'single')">下载</NButton>
</div>
</td>
</tr>
+14 -10
View File
@@ -1,10 +1,10 @@
<script setup lang="ts">
import { ref, onMounted, computed } from 'vue';
import { ref, onMounted } from 'vue';
import { Icon } from '@iconify/vue'
import { useThemeStore } from '@/store/modules/theme';
import { useRouterPush } from '@/hooks/common/router';
import { useRoute } from 'vue-router';
import { getColorWithOpacity, tagTextColor, tagBgColor, tagBorderColor, formatTimestamp, anyToTimestamp } from '@/utils/common';
import { formatTimestamp, downloadFileFun } from '@/utils/common';
import { uploadFileApi, deleteFileApi, fileListApi } from "@/service/api/file";
import { systemConfigApi } from '@/service/api/system';
import { getChangeDetailApi } from '@/service/api/change';
@@ -103,8 +103,12 @@ const onUploadFile = async (type:string = '',files:any,index:number = -1) => {
}
// 下载文件
const downloadFile = (type:string) => {
const downloadFile = (file:any,type:string) => {
if(file){
downloadFileFun(file?.file_url, file?.doc_name || file?.file_name);
}else{
window.$message?.info('还差接口')
}
}
// 删除文件(真删)
const removeFileReal = async (type:string, fileIndex:number,index:number = -1) => {
@@ -300,7 +304,7 @@ onMounted(() => {
<Icon icon="akar-icons:file" class="size-12px" />
{{file.file_name}}
<NButton text type="primary" class="text-11px" @click="preview(file)">预览</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile('pssr')">下载</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile(file,'train')">下载</NButton>
<NPopconfirm
positive-text="确定"
:positiveButtonProps="{ size: 'tiny' }"
@@ -315,7 +319,7 @@ onMounted(() => {
</div>
</div>
</div>
<NButton ghost type="primary" size="small" class="text-xs" @click="downloadFile('pssr')">
<NButton ghost type="primary" size="small" class="text-xs" @click="downloadFile(null,'train')">
<Icon icon="akar-icons:download" class="size-14px mr-1" />
下载培训签到表
</NButton>
@@ -349,7 +353,7 @@ onMounted(() => {
<Icon icon="akar-icons:file" class="size-12px" />
{{file.file_name}}
<NButton text type="primary" class="text-11px" @click="preview(file)">预览</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile('pssr')">下载</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile(file,'pssr')">下载</NButton>
<NPopconfirm
positive-text="确定"
:positiveButtonProps="{ size: 'tiny' }"
@@ -364,7 +368,7 @@ onMounted(() => {
</div>
</div>
</div>
<NButton ghost type="primary" size="small" class="text-xs" @click="downloadFile('pssr')">
<NButton ghost type="primary" size="small" class="text-xs" @click="downloadFile(null,'pssr')">
<Icon icon="akar-icons:download" class="size-14px mr-1" />
下载PSSR检查表
</NButton>
@@ -421,7 +425,7 @@ onMounted(() => {
<Icon icon="akar-icons:file" class="size-12px" />
{{file.file_name}}
<NButton text type="primary" class="text-11px" @click="preview(file)">预览</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile('pssr')">下载</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile(file,'accept')">下载</NButton>
<NPopconfirm
positive-text="确定"
:positiveButtonProps="{ size: 'tiny' }"
@@ -436,7 +440,7 @@ onMounted(() => {
</div>
</div>
</div>
<NButton ghost type="primary" size="small" class="text-xs" @click="downloadFile('accept')">
<NButton ghost type="primary" size="small" class="text-xs" @click="downloadFile(null,'accept')">
<Icon icon="akar-icons:download" class="size-14px mr-1" />
下载验收表
</NButton>
@@ -502,7 +506,7 @@ onMounted(() => {
<Icon icon="akar-icons:file" class="size-12px" />
{{file.file_name}}
<NButton text type="primary" class="text-11px" @click="preview(file)">预览</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile('accept')">下载</NButton>
<NButton text type="primary" class="text-11px" @click="downloadFile(file,'close')">下载</NButton>
<NPopconfirm
positive-text="确定"
:positiveButtonProps="{ size: 'tiny' }"
+7 -8
View File
@@ -4,7 +4,7 @@ import { Icon } from '@iconify/vue'
import { useThemeStore } from '@/store/modules/theme';
import { useRouterPush } from '@/hooks/common/router';
import { useRoute } from 'vue-router';
import { getColorWithOpacity, tagTextColor, tagBgColor, tagBorderColor } from '@/utils/common';
import { tagTextColor, tagBgColor, tagBorderColor, downloadFileFun } from '@/utils/common';
import { AiError, aiTypeJudge } from "@/service/api/ai";
import { systemConfigApi } from '@/service/api/system';
import { getChangeDetailApi } from '@/service/api/change';
@@ -183,12 +183,11 @@ const exportFile = (type: string) => {
};
// 变更附带资料下载/一键下载
const downloadFile = (type: string) => {
window.$message?.info('还差接口')
if(type === 'all'){
window.$message?.success('打包下载全部附件');
const downloadFile = (file:any,type: string) => {
if(file){
downloadFileFun(file?.file_url, file?.doc_name || file?.file_name);
}else{
window.$message?.success('下载当前附件成功');
window.$message?.info('还差接口')
}
};
// 变更附带资料预览
@@ -443,7 +442,7 @@ onMounted(() => {
class="rounded-sm bg-[var(--theme-color)] px-3 py-1 text-xs font-semibold text-white"
:style="{'--theme-color': themeStore.themeColor}"
>变更附带资料</p>
<NButton ghost size="small" class="text-xs" @click="downloadFile('all')"><Icon icon="material-symbols:download" class="size-16px" />一键下载</NButton>
<NButton ghost size="small" class="text-xs" @click="downloadFile(null,'all')"><Icon icon="material-symbols:download" class="size-16px" />一键下载</NButton>
</div>
<NTable size="small">
<thead>
@@ -470,7 +469,7 @@ onMounted(() => {
<td>
<div class="flex items-center justify-center gap-2">
<NButton text type="primary" class="text-xs" @click="openPreview(doc)">预览</NButton>
<NButton text type="primary" class="text-xs" @click="downloadFile('single')">下载</NButton>
<NButton text type="primary" class="text-xs" @click="downloadFile(doc,'single')">下载</NButton>
</div>
</td>
</tr>
@@ -3,7 +3,7 @@
import { ref, computed, h, watch } from 'vue';
import { Icon } from '@iconify/vue'
import { useThemeStore } from '@/store/modules/theme';
import { tagTextColor, tagBgColor, tagBorderColor } from '@/utils/common';
import { tagTextColor, tagBgColor, tagBorderColor, downloadFileFun } from '@/utils/common';
import { localStg } from '@/utils/storage';
import { useChangeStore } from '@/store/modules/change';
import { AiError, aiTypeJudge, aiLevelScore, aiApplication } from "@/service/api/ai";
@@ -346,8 +346,10 @@ const handleScoreChange = (val:number,index:number) => {
totalScore.value = score;
}
// 下载PDF
const downloadPdf = () => window.$message?.success(`演示:${previewFile.value} 已下载`);
// 下载
const downloadFile = (file:any) => {
downloadFileFun(file?.file_url, file?.doc_name || file?.file_name);
};
// 自定义渲染展开图标
const renderSwitcherIcon = (node:any) => {
// 如果节点没有 children 或 children 为空数组,则不显示图标
@@ -794,7 +796,7 @@ defineExpose({form, questions, applyAiResult, generateLevel: useAiLevel})
</template>
<template #footer>
<div class="flex justify-end gap-[10px]">
<NButton ghost size="small" @click="downloadPdf">
<NButton ghost size="small" @click="downloadFile(previewFile)">
<Icon icon="material-symbols:download" class="size-16px" /> 下载
</NButton>
<NButton size="small" type="primary" @click="previewFile = null">关闭</NButton>