1
0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-01-31 22:18:07 +08:00

feat: 文件操作增加名称显示 (#985)

resolve  https://github.com/1Panel-dev/1Panel/issues/975
This commit is contained in:
zhengkunwang223 2023-05-10 15:02:15 +08:00 committed by GitHub
parent 8083837333
commit 1e4ea2f8c3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 37 additions and 29 deletions

View File

@ -55,6 +55,7 @@ export namespace File {
isSymlink?: boolean; isSymlink?: boolean;
linkPath?: boolean; linkPath?: boolean;
sub?: boolean; sub?: boolean;
name?: string;
} }
export interface FileDelete { export interface FileDelete {

View File

@ -1,7 +1,7 @@
<template> <template>
<el-drawer v-model="open" :before-close="handleClose" :close-on-click-modal="false" width="50%"> <el-drawer v-model="open" :before-close="handleClose" :close-on-click-modal="false" width="50%">
<template #header> <template #header>
<DrawerHeader :header="$t('file.setRole')" :back="handleClose" /> <DrawerHeader :header="$t('file.setRole')" :resource="name" :back="handleClose" />
</template> </template>
<el-row> <el-row>
@ -30,10 +30,11 @@ import i18n from '@/lang';
import FileRole from '@/components/file-role/index.vue'; import FileRole from '@/components/file-role/index.vue';
import { MsgSuccess } from '@/utils/message'; import { MsgSuccess } from '@/utils/message';
let open = ref(false); const open = ref(false);
let form = ref<File.FileCreate>({ path: '', isDir: false, mode: 0o755 }); const form = ref<File.FileCreate>({ path: '', isDir: false, mode: 0o755 });
let loading = ref<Boolean>(false); const loading = ref<Boolean>(false);
let mode = ref('0755'); const mode = ref('0755');
const name = ref('');
const em = defineEmits(['close']); const em = defineEmits(['close']);
const handleClose = () => { const handleClose = () => {
@ -47,6 +48,7 @@ const acceptParams = (create: File.FileCreate) => {
form.value.path = create.path; form.value.path = create.path;
form.value.isLink = false; form.value.isLink = false;
form.value.sub = false; form.value.sub = false;
name.value = create.name;
mode.value = String(create.mode); mode.value = String(create.mode);
}; };

View File

@ -1,7 +1,7 @@
<template> <template>
<el-drawer v-model="open" size="40%"> <el-drawer v-model="open" size="40%">
<template #header> <template #header>
<DrawerHeader :header="$t('file.changeOwner')" :back="handleClose" /> <DrawerHeader :header="$t('file.changeOwner')" :resource="name" :back="handleClose" />
</template> </template>
<el-row> <el-row>
<el-col :span="22" :offset="1"> <el-col :span="22" :offset="1">
@ -50,12 +50,14 @@ interface OwnerProps {
user: string; user: string;
group: string; group: string;
isDir: boolean; isDir: boolean;
name: string;
} }
const fileForm = ref<FormInstance>(); const fileForm = ref<FormInstance>();
const loading = ref(false); const loading = ref(false);
const open = ref(false); const open = ref(false);
const isDir = ref(false); const isDir = ref(false);
const name = ref('');
const addForm = reactive({ const addForm = reactive({
path: '', path: '',
@ -101,6 +103,7 @@ const acceptParams = (props: OwnerProps) => {
addForm.path = props.path; addForm.path = props.path;
addForm.group = props.group; addForm.group = props.group;
isDir.value = props.isDir; isDir.value = props.isDir;
name.value = props.name;
open.value = true; open.value = true;
}; };

View File

@ -1,7 +1,7 @@
<template> <template>
<el-dialog <el-dialog
v-model="open" v-model="open"
:title="$t('commons.button.edit')" :title="$t('commons.button.edit') + ' - ' + fileName"
:before-close="handleClose" :before-close="handleClose"
destroy-on-close destroy-on-close
width="70%" width="70%"
@ -84,6 +84,7 @@ interface EditorConfig {
const open = ref(false); const open = ref(false);
const loading = ref(false); const loading = ref(false);
const fileName = ref('');
const config = reactive<EditorConfig>({ const config = reactive<EditorConfig>({
theme: 'vs-dark', theme: 'vs-dark',
@ -193,6 +194,7 @@ const acceptParams = (props: EditProps) => {
form.value.content = props.content; form.value.content = props.content;
form.value.path = props.path; form.value.path = props.path;
config.language = props.language; config.language = props.language;
fileName.value = props.name;
// TODO Now,1panel only support liunux,so we can use LF. // TODO Now,1panel only support liunux,so we can use LF.
// better,We should rely on the actual line feed character of the file returned from the background // better,We should rely on the actual line feed character of the file returned from the background
config.eol = monaco.editor.EndOfLineSequence.LF; config.eol = monaco.editor.EndOfLineSequence.LF;

View File

@ -75,12 +75,12 @@ const rules = reactive<FormRules>({
}); });
const fileForm = ref<FormInstance>(); const fileForm = ref<FormInstance>();
let loading = ref(false); const loading = ref(false);
let form = ref<File.FileCompress>({ files: [], type: 'zip', dst: '', name: '', replace: false }); const form = ref<File.FileCompress>({ files: [], type: 'zip', dst: '', name: '', replace: false });
let options = ref<string[]>([]); const options = ref<string[]>([]);
let open = ref(false); const open = ref(false);
let title = ref(''); const title = ref('');
let operate = ref('compress'); const operate = ref('compress');
const em = defineEmits(['close']); const em = defineEmits(['close']);

View File

@ -7,7 +7,7 @@
size="40%" size="40%"
> >
<template #header> <template #header>
<DrawerHeader :header="$t('file.deCompress')" :back="handleClose" /> <DrawerHeader :header="$t('file.deCompress')" :resource="name" :back="handleClose" />
</template> </template>
<el-row> <el-row>
<el-col :span="22" :offset="1"> <el-col :span="22" :offset="1">

View File

@ -7,14 +7,14 @@
<el-col> <el-col>
<el-descriptions :column="1" border> <el-descriptions :column="1" border>
<el-descriptions-item :label="$t('file.fileName')">{{ data.name }}</el-descriptions-item> <el-descriptions-item :label="$t('file.fileName')">{{ data.name }}</el-descriptions-item>
<!-- <el-descriptions-item :label="$t('file.type')">{{ data.type }}</el-descriptions-item> --> <el-descriptions-item :label="$t('file.type')">{{ data.type }}</el-descriptions-item>
<el-descriptions-item :label="$t('file.path')">{{ data.path }}</el-descriptions-item> <el-descriptions-item :label="$t('file.path')">{{ data.path }}</el-descriptions-item>
<el-descriptions-item :label="$t('file.size')"> <el-descriptions-item :label="$t('file.size')">
{{ computeSize(data.size) }} {{ computeSize(data.size) }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('file.role')">{{ data.mode }}</el-descriptions-item> <el-descriptions-item :label="$t('file.role')">{{ data.mode }}</el-descriptions-item>
<!-- <el-descriptions-item :label="$t('file.user')">{{ data.user }}</el-descriptions-item> <el-descriptions-item :label="$t('file.user')">{{ data.user }}</el-descriptions-item>
<el-descriptions-item :label="$t('file.group')">{{ data.group }}</el-descriptions-item> --> <el-descriptions-item :label="$t('file.group')">{{ data.group }}</el-descriptions-item>
<el-descriptions-item :label="$t('commons.table.updatedAt')"> <el-descriptions-item :label="$t('commons.table.updatedAt')">
{{ dateFormatSimple(data.modTime) }} {{ dateFormatSimple(data.modTime) }}
</el-descriptions-item> </el-descriptions-item>

View File

@ -178,7 +178,7 @@
<Download ref="downloadRef" @close="search" /> <Download ref="downloadRef" @close="search" />
<Process :open="processPage.open" @close="closeProcess" /> <Process :open="processPage.open" @close="closeProcess" />
<Owner ref="chownRef" @close="search"></Owner> <Owner ref="chownRef" @close="search"></Owner>
<!-- <Detail ref="detailRef" /> --> <Detail ref="detailRef" />
</LayoutContent> </LayoutContent>
</div> </div>
</template> </template>
@ -205,7 +205,7 @@ import Download from './download/index.vue';
import Owner from './chown/index.vue'; import Owner from './chown/index.vue';
import { Mimetypes, Languages } from '@/global/mimetype'; import { Mimetypes, Languages } from '@/global/mimetype';
import Process from './process/index.vue'; import Process from './process/index.vue';
// import Detail from './detail/index.vue'; import Detail from './detail/index.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { Back, Refresh } from '@element-plus/icons-vue'; import { Back, Refresh } from '@element-plus/icons-vue';
import { MsgSuccess, MsgWarning } from '@/utils/message'; import { MsgSuccess, MsgWarning } from '@/utils/message';
@ -252,7 +252,7 @@ const processPage = reactive({ open: false });
const createRef = ref(); const createRef = ref();
const roleRef = ref(); const roleRef = ref();
// const detailRef = ref(); const detailRef = ref();
const compressRef = ref(); const compressRef = ref();
const deCompressRef = ref(); const deCompressRef = ref();
const codeEditorRef = ref(); const codeEditorRef = ref();
@ -603,9 +603,9 @@ const openDownload = () => {
} }
}; };
// const openDetail = (row: File.File) => { const openDetail = (row: File.File) => {
// detailRef.value.acceptParams({ path: row.path }); detailRef.value.acceptParams({ path: row.path });
// }; };
const buttons = [ const buttons = [
{ {
@ -641,10 +641,10 @@ const buttons = [
label: i18n.global.t('commons.button.delete'), label: i18n.global.t('commons.button.delete'),
click: delFile, click: delFile,
}, },
// { {
// label: i18n.global.t('file.info'), label: i18n.global.t('file.info'),
// click: openDetail, click: openDetail,
// }, },
]; ];
onMounted(() => { onMounted(() => {

View File

@ -1,7 +1,7 @@
<template> <template>
<el-drawer v-model="open" size="40%"> <el-drawer v-model="open" size="40%">
<template #header> <template #header>
<DrawerHeader :header="$t('file.rename')" :back="handleClose" /> <DrawerHeader :header="$t('file.rename')" :resource="oldName" :back="handleClose" />
</template> </template>
<el-row> <el-row>
<el-col :span="22" :offset="1"> <el-col :span="22" :offset="1">
@ -47,7 +47,7 @@ interface RenameProps {
const fileForm = ref<FormInstance>(); const fileForm = ref<FormInstance>();
const loading = ref(false); const loading = ref(false);
let open = ref(false); const open = ref(false);
const oldName = ref(''); const oldName = ref('');
const addForm = reactive({ const addForm = reactive({