gh_mirrors/1Panel
1
0
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-01-31 14:08:06 +08:00
Code

feat: 增加文件下载功能

Browse Source
This commit is contained in:
zhengkunwang223 2022-09-06 17:48:49 +08:00
parent 7719f028fb
commit 9d6e232d0f
11 changed files with 325 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
backend/app/api/v1/file.go
View File

@ -155,7 +155,7 @@ func (b *BaseApi) UploadFiles(c *gin.Context) {
helper.SuccessWithMsg(c, fmt.Sprintf("%d files upload success", success))
}
func (b *BaseApi) ChangeName(c *gin.Context) {
func (b *BaseApi) ChangeFileName(c *gin.Context) {
var req dto.FileRename
if err := c.ShouldBindJSON(&req); err != nil {
helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
@ -168,20 +168,20 @@ func (b *BaseApi) ChangeName(c *gin.Context) {
helper.SuccessWithData(c, nil)
}
func (b *BaseApi) Download(c *gin.Context) {
var req dto.FileDownload
func (b *BaseApi) WgetFile(c *gin.Context) {
var req dto.FileWget
if err := c.ShouldBindJSON(&req); err != nil {
helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
return
}
if err := fileService.Download(req); err != nil {
if err := fileService.Wget(req); err != nil {
helper.ErrorWithDetail(c, constant.CodeErrInternalServer, constant.ErrTypeInternalServer, err)
return
}
helper.SuccessWithData(c, nil)
}
func (b *BaseApi) Move(c *gin.Context) {
func (b *BaseApi) MoveFile(c *gin.Context) {
var req dto.FileMove
if err := c.ShouldBindJSON(&req); err != nil {
helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
@ -193,3 +193,17 @@ func (b *BaseApi) Move(c *gin.Context) {
}
helper.SuccessWithData(c, nil)
}
func (b *BaseApi) Download(c *gin.Context) {
var req dto.FileDownload
if err := c.ShouldBindJSON(&req); err != nil {
helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
return
}
filePath, err := fileService.FileDownload(req)
if err != nil {
helper.ErrorWithDetail(c, constant.CodeErrInternalServer, constant.ErrTypeInternalServer, err)
return
}
c.File(filePath)
}

8
backend/app/dto/file.go
View File

@ -58,7 +58,7 @@ type FileRename struct {
NewName string
}
type FileDownload struct {
type FileWget struct {
Url string `json:"url" validate:"required"`
Path string `json:"path" validate:"required"`
Name string `json:"name" validate:"required"`
@ -69,3 +69,9 @@ type FileMove struct {
OldPaths []string `json:"oldPaths" validate:"required"`
NewPath string `json:"newPath" validate:"required"`
}
type FileDownload struct {
Paths []string `json:"paths" validate:"required"`
Type string `json:"type" validate:"required"`
Name string `json:"name" validate:"required"`
}

47
backend/app/service/file.go
View File

@ -9,8 +9,10 @@ import (
"github.com/pkg/errors"
"io"
"io/fs"
"os"
"path/filepath"
"strings"
"time"
)
type FileService struct {
@ -94,18 +96,18 @@ func (f FileService) DeCompress(c dto.FileDeCompress) error {
return fo.Decompress(c.Path, c.Dst, files.CompressType(c.Type))
}
func (f FileService) GetContent(c dto.FileOption) (dto.FileInfo, error) {
info, err := files.NewFileInfo(c.FileOption)
func (f FileService) GetContent(op dto.FileOption) (dto.FileInfo, error) {
info, err := files.NewFileInfo(op.FileOption)
if err != nil {
return dto.FileInfo{}, err
}
return dto.FileInfo{*info}, nil
}
func (f FileService) SaveContent(c dto.FileEdit) error {
func (f FileService) SaveContent(edit dto.FileEdit) error {
info, err := files.NewFileInfo(files.FileOption{
Path: c.Path,
Path: edit.Path,
Expand: false,
})
if err != nil {
@ -113,30 +115,30 @@ func (f FileService) SaveContent(c dto.FileEdit) error {
}
fo := files.NewFileOp()
return fo.WriteFile(c.Path, strings.NewReader(c.Content), info.FileMode)
return fo.WriteFile(edit.Path, strings.NewReader(edit.Content), info.FileMode)
}
func (f FileService) ChangeName(c dto.FileRename) error {
func (f FileService) ChangeName(re dto.FileRename) error {
fo := files.NewFileOp()
return fo.Rename(c.OldName, c.NewName)
return fo.Rename(re.OldName, re.NewName)
}
func (f FileService) Download(c dto.FileDownload) error {
func (f FileService) Wget(w dto.FileWget) error {
fo := files.NewFileOp()
return fo.DownloadFile(c.Url, filepath.Join(c.Path, c.Name))
return fo.DownloadFile(w.Url, filepath.Join(w.Path, w.Name))
}
func (f FileService) MvFile(c dto.FileMove) error {
func (f FileService) MvFile(m dto.FileMove) error {
fo := files.NewFileOp()
if c.Type == "cut" {
return fo.Cut(c.OldPaths, c.NewPath)
if m.Type == "cut" {
return fo.Cut(m.OldPaths, m.NewPath)
}
var errs []error
if c.Type == "copy" {
for _, src := range c.OldPaths {
if err := fo.Copy(src, c.NewPath); err != nil {
if m.Type == "copy" {
for _, src := range m.OldPaths {
if err := fo.Copy(src, m.NewPath); err != nil {
errs = append(errs, err)
global.LOG.Errorf("copy file [%s] to [%s] failed, err: %s", src, c.NewPath, err.Error())
global.LOG.Errorf("copy file [%s] to [%s] failed, err: %s", src, m.NewPath, err.Error())
}
}
}
@ -152,6 +154,19 @@ func (f FileService) MvFile(c dto.FileMove) error {
return nil
}
func (f FileService) FileDownload(d dto.FileDownload) (string, error) {
tempPath := filepath.Join(os.TempDir(), fmt.Sprintf("%d", time.Now().UnixNano()))
if err := os.MkdirAll(tempPath, os.ModePerm); err != nil {
return "", err
}
fo := files.NewFileOp()
if err := fo.Compress(d.Paths, tempPath, d.Name, files.CompressType(d.Type)); err != nil {
return "", err
}
filePath := filepath.Join(tempPath, d.Name)
return filePath, nil
}
func getUuid() string {
b := make([]byte, 16)
io.ReadFull(rand.Reader, b)

5
backend/router/ro_file.go
View File

@ -25,9 +25,10 @@ func (f *FileRouter) InitFileRouter(Router *gin.RouterGroup) {
fileRouter.POST("/content", baseApi.GetContent)
fileRouter.POST("/save", baseApi.SaveContent)
fileRouter.POST("/upload", baseApi.UploadFiles)
fileRouter.POST("/rename", baseApi.ChangeName)
fileRouter.POST("/rename", baseApi.ChangeFileName)
fileRouter.POST("/wget", baseApi.WgetFile)
fileRouter.POST("/move", baseApi.MoveFile)
fileRouter.POST("/download", baseApi.Download)
fileRouter.POST("/move", baseApi.Move)
}
}

3
frontend/src/api/index.ts
View File

@ -78,6 +78,9 @@ class RequestHttp {
delete<T>(url: string, params?: any, _object = {}): Promise<ResultData<T>> {
return this.service.delete(url, { params, ..._object });
}
download<BlobPart>(url: string, params?: object, _object = {}): Promise<BlobPart> {
return this.service.post(url, params, _object);
}
}
export default new RequestHttp(config);

8
frontend/src/api/interface/file.ts
View File

@ -71,7 +71,7 @@ export namespace File {
newName: string;
}
export interface FileDownload {
export interface FileWget {
path: string;
name: string;
url: string;
@ -82,4 +82,10 @@ export namespace File {
newPath: string;
type: string;
}
export interface FileDownload {
paths: string[];
name: string;
url: string;
}
}

8
frontend/src/api/modules/files.ts
View File

@ -45,10 +45,14 @@ export const RenameRile = (params: File.FileRename) => {
return http.post<File.File>('files/rename', params);
};
export const DownloadFile = (params: File.FileDownload) => {
return http.post<File.File>('files/download', params);
export const WgetFile = (params: File.FileWget) => {
return http.post<File.File>('files/wget', params);
};
export const MoveFile = (params: File.FileMove) => {
return http.post<File.File>('files/move', params);
};
export const DownloadFile = (params: File.FileDownload) => {
return http.download<BlobPart>('files/download', params, { responseType: 'blob' });
};

11
frontend/src/utils/util.ts
View File

@ -48,3 +48,14 @@ export function dateFromat(row: number, col: number, dataStr: any) {
second = second < 10 ? `0${String(second)}` : second;
return `${String(y)}-${String(m)}-${String(d)} ${String(h)}:${String(minute)}:${String(second)}`;
}
export function getRandomStr(e: number): string {
const t = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
const a = t.length;
let n = '';
for (let i = 0; i < e; i++) {
n += t.charAt(Math.floor(Math.random() * a));
}
return n;
}

110
frontend/src/views/file-management/download/index.vue
View File

@ -1,71 +1,69 @@
<template>
<el-dialog v-model="open" :before-close="handleClose" :title="$t('file.download')" width="30%" @open="onOpen">
<el-form
ref="fileForm"
label-position="left"
:model="addForm"
label-width="100px"
:rules="rules"
v-loading="loading"
>
<el-form-item :label="$t('file.downloadUrl')" prop="url">
<el-input v-model="addForm.url" />
</el-form-item>
<el-form-item :label="$t('file.path')" prop="path">
<el-input v-model="addForm.path">
<template #append> <FileList :path="path" @choose="getPath"></FileList> </template
></el-input>
<el-dialog
v-model="open"
:title="$t('file.download')"
:before-close="handleClose"
width="30%"
@open="onOpen"
v-loading="loading"
>
<el-form ref="fileForm" label-position="left" :model="addForm" label-width="100px" :rules="rules">
<el-form-item :label="$t('file.compressType')" prop="type">
<el-select v-model="addForm.type">
<el-option v-for="item in options" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item :label="$t('file.name')" prop="name">
<el-input v-model="addForm.name"></el-input>
<el-input v-model="addForm.name">
<template #append>{{ extension }}</template></el-input
>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="handleClose" :disabled="loading">{{ $t('commons.button.cancel') }}</el-button>
<el-button type="primary" @click="submit(fileForm)" :disabled="loading">{{
$t('commons.button.confirm')
}}</el-button>
<el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
<el-button type="primary" @click="submit(fileForm)">{{ $t('commons.button.confirm') }}</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
<script setup lang="ts">
import { FormInstance, FormRules } from 'element-plus';
import { CompressExtention, CompressType } from '@/enums/files';
import { computed, PropType, reactive, ref, toRefs } from 'vue';
import { DownloadFile } from '@/api/modules/files';
import { File } from '@/api/interface/file';
import { Rules } from '@/global/form-rues';
import i18n from '@/lang';
import { ElMessage, FormInstance, FormRules } from 'element-plus';
import { reactive, ref, toRefs } from 'vue';
const props = defineProps({
open: {
type: Boolean,
default: false,
},
path: {
paths: {
type: Array as PropType<string[]>,
default: function () {
return [];
},
},
name: {
type: String,
default: '',
},
});
const { open } = toRefs(props);
const fileForm = ref<FormInstance>();
const loading = ref(false);
const rules = reactive<FormRules>({
name: [Rules.requiredInput],
path: [Rules.requiredInput],
url: [Rules.requiredInput],
type: [Rules.requiredInput],
});
const addForm = reactive({
url: '',
path: '',
name: '',
});
const { open } = toRefs(props);
const fileForm = ref<FormInstance>();
const options = ref<string[]>([]);
let loading = ref(false);
const em = defineEmits(['close']);
const handleClose = () => {
if (fileForm.value) {
fileForm.value.resetFields();
@ -73,12 +71,27 @@ const handleClose = () => {
em('close', open);
};
const getPath = (path: string) => {
addForm.path = path;
};
let addForm = ref({
paths: [] as string[],
type: '',
name: '',
});
const extension = computed(() => {
return CompressExtention[addForm.value.type];
});
const onOpen = () => {
addForm.path = props.path;
addForm.value = {
type: 'zip',
paths: props.paths,
name: props.name,
};
console.log(addForm);
options.value = [];
for (const t in CompressType) {
options.value.push(CompressType[t]);
}
};
const submit = async (formEl: FormInstance | undefined) => {
@ -87,10 +100,19 @@ const submit = async (formEl: FormInstance | undefined) => {
if (!valid) {
return;
}
let addItem = {};
Object.assign(addItem, addForm.value);
addItem['name'] = addForm.value.name + extension.value;
loading.value = true;
DownloadFile(addForm)
.then(() => {
ElMessage.success(i18n.global.t('file.downloadStart'));
DownloadFile(addItem as File.FileDownload)
.then((res) => {
const downloadUrl = window.URL.createObjectURL(new Blob([res]));
const a = document.createElement('a');
a.style.display = 'none';
a.href = downloadUrl;
a.download = addItem['name'];
const event = new MouseEvent('click');
a.dispatchEvent(event);
handleClose();
})
.finally(() => {

99
frontend/src/views/file-management/index.vue
View File

@ -59,13 +59,19 @@
</el-dropdown>
<el-button type="primary" plain @click="openUpload"> {{ $t('file.upload') }}</el-button>
<!-- <el-button type="primary" plain> {{ $t('file.search') }}</el-button> -->
<el-button type="primary" plain @click="openDownload"> {{ $t('file.remoteFile') }}</el-button>
<el-button type="primary" plain @click="openWget"> {{ $t('file.remoteFile') }}</el-button>
<el-button type="primary" plain @click="openMove('copy')" :disabled="selects.length === 0">
{{ $t('file.copy') }}</el-button
>
<el-button type="primary" plain @click="openMove('cut')" :disabled="selects.length === 0">
{{ $t('file.move') }}</el-button
>
<el-button type="primary" plain @click="openCompress(selects)" :disabled="selects.length === 0">
{{ $t('file.compress') }}</el-button
>
<el-button type="primary" plain @click="openDownload" :disabled="selects.length === 0">
{{ $t('file.download') }}</el-button
>
<!-- <el-button type="primary" plain> {{ $t('file.sync') }}</el-button>
<el-button type="primary" plain> {{ $t('file.terminal') }}</el-button>
<el-button type="primary" plain> {{ $t('file.shareList') }}</el-button> -->
@ -138,20 +144,28 @@
@close="closeRename"
></FileRename>
<Upload :open="uploadPage.open" :path="uploadPage.path" @close="closeUpload"></Upload>
<FileDown :open="downloadPage.open" :path="downloadPage.path" @close="closeDownload"></FileDown>
<Wget :open="wgetPage.open" :path="wgetPage.path" @close="closeWget"></Wget>
<Move :open="movePage.open" :oldPaths="movePage.oldPaths" :type="movePage.type" @close="clodeMove"></Move>
<Download
:open="downloadPage.open"
:paths="downloadPage.paths"
:name="downloadPage.name"
@close="closeDownload"
></Download>
</el-row>
</LayoutContent>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref } from '@vue/runtime-core';
import { GetFilesList, GetFilesTree, DeleteFile, GetFileContent, SaveFileContent } from '@/api/modules/files';
import { dateFromat, getRandomStr } from '@/utils/util';
import { File } from '@/api/interface/file';
import { useDeleteData } from '@/hooks/use-delete-data';
import { ElMessage } from 'element-plus';
import LayoutContent from '@/layout/layout-content.vue';
import ComplexTable from '@/components/complex-table/index.vue';
import i18n from '@/lang';
import { GetFilesList, GetFilesTree, DeleteFile, GetFileContent, SaveFileContent } from '@/api/modules/files';
import { dateFromat } from '@/utils/util';
import { File } from '@/api/interface/file';
import BreadCrumbs from '@/components/bread-crumbs/index.vue';
import BreadCrumbItem from '@/components/bread-crumbs/bread-crumbs-item.vue';
import CreateFile from './create/index.vue';
@ -160,20 +174,19 @@ import Compress from './compress/index.vue';
import Decompress from './decompress/index.vue';
import Upload from './upload/index.vue';
import FileRename from './rename/index.vue';
import { useDeleteData } from '@/hooks/use-delete-data';
import CodeEditor from './code-editor/index.vue';
import { ElMessage } from 'element-plus';
import FileDown from './download/index.vue';
import Wget from './wget/index.vue';
import Move from './move/index.vue';
import Download from './download/index.vue';
let data = ref();
let selects = ref<any>([]);
let req = reactive({ path: '/', expand: true });
let loading = ref(false);
let treeLoading = ref(false);
let paths = ref<string[]>([]);
let fileTree = ref<File.FileTree[]>([]);
let expandKeys = ref<string[]>([]);
const data = ref();
const selects = ref<any>([]);
const req = reactive({ path: '/', expand: true });
const loading = ref(false);
const treeLoading = ref(false);
const paths = ref<string[]>([]);
const fileTree = ref<File.FileTree[]>([]);
const expandKeys = ref<string[]>([]);
const filePage = reactive({ open: false, createForm: { path: '/', isDir: false, mode: 0o755 } });
const modePage = reactive({ open: false, modeForm: { path: '/', isDir: false, mode: 0o755 } });
@ -183,8 +196,9 @@ const editorPage = reactive({ open: false, content: '', loading: false });
const codeReq = reactive({ path: '', expand: false });
const uploadPage = reactive({ open: false, path: '' });
const renamePage = reactive({ open: false, path: '', oldName: '' });
const downloadPage = reactive({ open: false, path: '' });
const wgetPage = reactive({ open: false, path: '' });
const movePage = reactive({ open: false, oldPaths: [''], type: '' });
const downloadPage = reactive({ open: false, paths: [''], name: '' });
const defaultProps = {
children: 'children',
@ -237,7 +251,11 @@ const jump = async (index: number) => {
if (index != -1) {
const jPaths = paths.value.slice(0, index + 1);
for (let i in jPaths) {
path = path + '/' + jPaths[i];
if (path.endsWith('/')) {
path = path + jPaths[i];
} else {
path = path + '/' + jPaths[i];
}
}
}
req.path = path;
@ -311,10 +329,18 @@ const closeMode = () => {
search(req);
};
const openCompress = (item: File.File) => {
const openCompress = (items: File.File[]) => {
compressPage.open = true;
compressPage.files = [item.path];
compressPage.name = item.name;
const paths = [];
for (const item of items) {
paths.push(item.path);
}
compressPage.files = paths;
if (paths.length === 1) {
compressPage.name = items[0].name;
} else {
compressPage.name = getRandomStr(6);
}
compressPage.dst = req.path;
};
@ -359,13 +385,13 @@ const closeUpload = () => {
search(req);
};
const openDownload = () => {
downloadPage.open = true;
downloadPage.path = req.path;
const openWget = () => {
wgetPage.open = true;
wgetPage.path = req.path;
};
const closeDownload = () => {
downloadPage.open = false;
const closeWget = () => {
wgetPage.open = false;
search(req);
};
@ -382,12 +408,12 @@ const closeRename = () => {
const openMove = (type: string) => {
movePage.type = type;
movePage.open = true;
const oldpaths = [];
for (const s of selects.value) {
oldpaths.push(s['path']);
}
movePage.oldPaths = oldpaths;
movePage.open = true;
};
const clodeMove = () => {
@ -395,6 +421,21 @@ const clodeMove = () => {
search(req);
};
const openDownload = () => {
const paths = [];
for (const s of selects.value) {
paths.push(s['path']);
}
downloadPage.paths = paths;
downloadPage.name = getRandomStr(6);
downloadPage.open = true;
};
const closeDownload = () => {
downloadPage.open = false;
search(req);
};
const saveContent = (content: string) => {
editorPage.loading = true;
SaveFileContent({ path: codeReq.path, content: content }).finally(() => {
@ -429,7 +470,9 @@ const buttons = [
},
{
label: i18n.global.t('file.compress'),
click: openCompress,
click: (row: File.File) => {
openCompress([row]);
},
},
{
label: i18n.global.t('file.deCompress'),

101
frontend/src/views/file-management/wget/index.vue Normal file
View File

@ -0,0 +1,101 @@
<template>
<el-dialog v-model="open" :before-close="handleClose" :title="$t('file.download')" width="30%" @open="onOpen">
<el-form
ref="fileForm"
label-position="left"
:model="addForm"
label-width="100px"
:rules="rules"
v-loading="loading"
>
<el-form-item :label="$t('file.downloadUrl')" prop="url">
<el-input v-model="addForm.url" />
</el-form-item>
<el-form-item :label="$t('file.path')" prop="path">
<el-input v-model="addForm.path">
<template #append> <FileList :path="path" @choose="getPath"></FileList> </template
></el-input>
</el-form-item>
<el-form-item :label="$t('file.name')" prop="name">
<el-input v-model="addForm.name"></el-input>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="handleClose" :disabled="loading">{{ $t('commons.button.cancel') }}</el-button>
<el-button type="primary" @click="submit(fileForm)" :disabled="loading">{{
$t('commons.button.confirm')
}}</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { WgetFile } from '@/api/modules/files';
import { Rules } from '@/global/form-rues';
import i18n from '@/lang';
import { ElMessage, FormInstance, FormRules } from 'element-plus';
import { reactive, ref, toRefs } from 'vue';
const props = defineProps({
open: {
type: Boolean,
default: false,
},
path: {
type: String,
default: '',
},
});
const { open } = toRefs(props);
const fileForm = ref<FormInstance>();
const loading = ref(false);
const rules = reactive<FormRules>({
name: [Rules.requiredInput],
path: [Rules.requiredInput],
url: [Rules.requiredInput],
});
const addForm = reactive({
url: '',
path: '',
name: '',
});
const em = defineEmits(['close']);
const handleClose = () => {
if (fileForm.value) {
fileForm.value.resetFields();
}
em('close', open);
};
const getPath = (path: string) => {
addForm.path = path;
};
const onOpen = () => {
addForm.path = props.path;
};
const submit = async (formEl: FormInstance | undefined) => {
if (!formEl) return;
await formEl.validate((valid) => {
if (!valid) {
return;
}
loading.value = true;
WgetFile(addForm)
.then(() => {
ElMessage.success(i18n.global.t('file.downloadStart'));
handleClose();
})
.finally(() => {
loading.value = false;
});
});
};
</script>