mirror of
https://github.com/MCSManager/MCSManager.git
synced 2025-02-05 15:29:35 +08:00
Feat: add file download
This commit is contained in:
parent
37a72eb758
commit
a67783d4ba
@ -185,3 +185,21 @@ export const uploadFile = useDefineApi<
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "multipart/form-data" }
|
||||
});
|
||||
|
||||
// 获取文件下载地址
|
||||
export const downloadAddress = useDefineApi<
|
||||
{
|
||||
params: {
|
||||
file_name: string;
|
||||
remote_uuid: string;
|
||||
uuid: string;
|
||||
};
|
||||
},
|
||||
{
|
||||
password: string;
|
||||
addr: string;
|
||||
}
|
||||
>({
|
||||
url: "/api/files/download",
|
||||
method: "POST"
|
||||
});
|
||||
|
@ -29,7 +29,8 @@ import {
|
||||
moveFile as moveFileApi,
|
||||
compressFile as compressFileApi,
|
||||
uploadAddress,
|
||||
uploadFile as uploadFileApi
|
||||
uploadFile as uploadFileApi,
|
||||
downloadAddress
|
||||
} from "@/services/apis/fileManager";
|
||||
import { throttle } from "lodash";
|
||||
import { message, Modal } from "ant-design-vue";
|
||||
@ -424,26 +425,28 @@ const beforeUpload: UploadProps["beforeUpload"] = async (file) => {
|
||||
return false;
|
||||
};
|
||||
|
||||
const { state: cfg, execute: getCfg } = uploadAddress();
|
||||
const { state: uploadCfg, execute: getUploadCfg } = uploadAddress();
|
||||
const { execute: uploadFile } = uploadFileApi();
|
||||
const percentComplete = ref(0);
|
||||
const selectedFile = async (file: File) => {
|
||||
try {
|
||||
await getCfg({
|
||||
await getUploadCfg({
|
||||
params: {
|
||||
upload_dir: breadcrumbs[breadcrumbs.length - 1].path,
|
||||
remote_uuid: daemonId!,
|
||||
uuid: instanceId!
|
||||
}
|
||||
});
|
||||
if (!cfg.value) throw new Error(t("获取上传地址失败"));
|
||||
if (!uploadCfg.value) throw new Error(t("获取上传地址失败"));
|
||||
|
||||
const uploadFormData = new FormData();
|
||||
uploadFormData.append("file", file);
|
||||
|
||||
await uploadFile({
|
||||
data: uploadFormData,
|
||||
url: `${parseForwardAddress(cfg.value.addr, "http")}/upload/${cfg.value.password}`,
|
||||
url: `${parseForwardAddress(uploadCfg.value.addr, "http")}/upload/${
|
||||
uploadCfg.value.password
|
||||
}`,
|
||||
onUploadProgress: (progressEvent: any) => {
|
||||
percentComplete.value = Math.round((progressEvent.loaded * 100) / progressEvent.total);
|
||||
}
|
||||
@ -476,6 +479,28 @@ const rowClickTable = async (item: string, type: number) => {
|
||||
spinning.value = false;
|
||||
};
|
||||
|
||||
const { state: downloadCfg, execute: getDownloadCfg } = downloadAddress();
|
||||
const downloadFile = async (fileName: string) => {
|
||||
try {
|
||||
await getDownloadCfg({
|
||||
params: {
|
||||
file_name: fileName,
|
||||
remote_uuid: daemonId!,
|
||||
uuid: instanceId!
|
||||
}
|
||||
});
|
||||
if (!downloadCfg.value) throw new Error(t("获取下载地址失败"));
|
||||
window.open(
|
||||
`${parseForwardAddress(downloadCfg.value.addr, "http")}/download/${
|
||||
downloadCfg.value.password
|
||||
}/${fileName}`
|
||||
);
|
||||
} catch (err: any) {
|
||||
console.error(err);
|
||||
return message.error(err.message);
|
||||
}
|
||||
};
|
||||
|
||||
const handleChangeDir = async (dir: string) => {
|
||||
if (breadcrumbs.findIndex((e) => e.path === dir) === -1) return message.error(t("找不到路径"));
|
||||
spinning.value = true;
|
||||
@ -687,20 +712,21 @@ onMounted(() => {
|
||||
<!-- eslint-disable-next-line vue/no-unused-vars -->
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'name'">
|
||||
<a-button
|
||||
type="link"
|
||||
class="file-name"
|
||||
@click="rowClickTable(record.name, record.type)"
|
||||
>
|
||||
<span class="mr-4">
|
||||
<component
|
||||
:is="getFileIcon(record.name, record.type)"
|
||||
style="font-size: 16px"
|
||||
/>
|
||||
<!-- -->
|
||||
</span>
|
||||
{{ record.name }}
|
||||
</a-button>
|
||||
<a-popconfirm :title="t('下载此文件?')" @confirm="downloadFile(record.name)">
|
||||
<a-button
|
||||
type="link"
|
||||
class="file-name"
|
||||
@click="rowClickTable(record.name, record.type)"
|
||||
>
|
||||
<span class="mr-4">
|
||||
<component
|
||||
:is="getFileIcon(record.name, record.type)"
|
||||
style="font-size: 16px"
|
||||
/>
|
||||
</span>
|
||||
{{ record.name }}
|
||||
</a-button>
|
||||
</a-popconfirm>
|
||||
</template>
|
||||
<template v-if="column.key === 'action'">
|
||||
<a-dropdown>
|
||||
@ -709,24 +735,27 @@ onMounted(() => {
|
||||
<a-menu-item v-if="fileStatus?.platform != 'win32'" key="1">
|
||||
{{ t("TXT_CODE_16853efe") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="7" @click="editFile(record.name)">
|
||||
<a-menu-item key="2" @click="editFile(record.name)">
|
||||
{{ t("TXT_CODE_ad207008") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="2" @click="resetname(record.name)">
|
||||
{{ t("TXT_CODE_c83551f5") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="3" @click="unzipFile(record.name)">
|
||||
{{ t("TXT_CODE_a64f3007") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="4" @click="setClipBoard('copy', record.name)">
|
||||
<a-menu-item key="3" @click="setClipBoard('copy', record.name)">
|
||||
{{ t("TXT_CODE_13ae6a93") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="5" @click="setClipBoard('move', record.name)">
|
||||
<a-menu-item key="4" @click="setClipBoard('move', record.name)">
|
||||
{{ t("剪切") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="5" @click="resetname(record.name)">
|
||||
{{ t("TXT_CODE_c83551f5") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="6" @click="deleteFile(record.name)">
|
||||
{{ t("TXT_CODE_ecbd7449") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="7" @click="unzipFile(record.name)">
|
||||
{{ t("TXT_CODE_a64f3007") }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="8" @click="downloadFile(record.name)">
|
||||
{{ t("下载") }}
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
<a-button size="">
|
||||
|
Loading…
Reference in New Issue
Block a user