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

feat: 优化文件选择逻辑 (#1532)

This commit is contained in:
zhengkunwang223 2023-07-05 09:54:12 +08:00 committed by GitHub
parent a0ceb62372
commit 3cbaa052c8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 84 additions and 28 deletions

View File

@ -11,7 +11,7 @@
<el-button :icon="Folder" @click="popoverVisible = true"></el-button> <el-button :icon="Folder" @click="popoverVisible = true"></el-button>
</template> </template>
<div> <div>
<el-button class="close" link @click="popoverVisible = false"> <el-button class="close" link @click="closePage">
<el-icon><Close /></el-icon> <el-icon><Close /></el-icon>
</el-button> </el-button>
<BreadCrumbs> <BreadCrumbs>
@ -67,6 +67,22 @@
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<div class="file-list-bottom">
<div v-if="selectRow?.path">
{{ $t('file.currentSelect') }}
<el-tooltip :content="selectRow.path" placement="top">
<el-tag type="success">
<div class="path">
<span>{{ selectRow.path }}</span>
</div>
</el-tag>
</el-tooltip>
</div>
<div class="button">
<el-button @click="closePage">{{ $t('commons.button.cancel') }}</el-button>
<el-button type="primary" @click="selectFile">{{ $t('commons.button.confirm') }}</el-button>
</div>
</div>
</el-popover> </el-popover>
</template> </template>
@ -78,11 +94,12 @@ import BreadCrumbs from '@/components/bread-crumbs/index.vue';
import BreadCrumbItem from '@/components/bread-crumbs/bread-crumbs-item.vue'; import BreadCrumbItem from '@/components/bread-crumbs/bread-crumbs-item.vue';
import { onMounted, onUpdated, reactive, ref } from 'vue'; import { onMounted, onUpdated, reactive, ref } from 'vue';
let rowName = ref(''); const rowName = ref('');
let data = ref(); const data = ref();
let loading = ref(false); const loading = ref(false);
let paths = ref<string[]>([]); const paths = ref<string[]>([]);
let req = reactive({ path: '/', expand: true, page: 1, pageSize: 300 }); const req = reactive({ path: '/', expand: true, page: 1, pageSize: 300 });
const selectRow = ref();
const popoverVisible = ref(false); const popoverVisible = ref(false);
@ -100,9 +117,20 @@ const props = defineProps({
const em = defineEmits(['choose']); const em = defineEmits(['choose']);
const checkFile = (row: any) => { const checkFile = (row: any) => {
rowName.value = row.name; selectRow.value = row;
em('choose', row.path); rowName.value = selectRow.value.name;
};
const selectFile = () => {
if (selectRow.value) {
em('choose', selectRow.value.path);
}
closePage();
};
const closePage = () => {
popoverVisible.value = false; popoverVisible.value = false;
selectRow.value = {};
}; };
const open = async (row: File.File) => { const open = async (row: File.File) => {
@ -116,6 +144,7 @@ const open = async (row: File.File) => {
} }
search(req); search(req);
} }
rowName.value = '';
}; };
const jump = async (index: number) => { const jump = async (index: number) => {
@ -172,4 +201,17 @@ onUpdated(() => {
top: 10px; top: 10px;
} }
} }
.file-list-bottom {
margin-top: 10px;
.path {
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.button {
margin-top: 10px;
float: right;
}
}
</style> </style>

View File

@ -867,6 +867,7 @@ const message = {
searchHelper: 'Support wildcards such as *', searchHelper: 'Support wildcards such as *',
uploadFailed: '[{0}] File Upload file', uploadFailed: '[{0}] File Upload file',
fileUploadStart: 'Uploading [{0}]....', fileUploadStart: 'Uploading [{0}]....',
currentSelect: 'Current Select: ',
}, },
ssh: { ssh: {
sshAlert: sshAlert:

View File

@ -837,6 +837,7 @@ const message = {
searchHelper: '支持 * 等通配符', searchHelper: '支持 * 等通配符',
uploadFailed: '[{0}] 文件上傳失敗', uploadFailed: '[{0}] 文件上傳失敗',
fileUploadStart: '正在上傳[{0}]....', fileUploadStart: '正在上傳[{0}]....',
currentSelect: '當前選中: ',
}, },
ssh: { ssh: {
sshAlert: '列表數據根據登錄時間排序但請註意切換時區或其他操作可能導致登錄日誌的時間出現偏差', sshAlert: '列表數據根據登錄時間排序但請註意切換時區或其他操作可能導致登錄日誌的時間出現偏差',

View File

@ -837,6 +837,7 @@ const message = {
searchHelper: '支持 * 等通配符', searchHelper: '支持 * 等通配符',
uploadFailed: '[{0}] 文件上传失败', uploadFailed: '[{0}] 文件上传失败',
fileUploadStart: '正在上传[{0}]....', fileUploadStart: '正在上传[{0}]....',
currentSelect: '当前选中: ',
}, },
ssh: { ssh: {
sshAlert: '列表数据根据登录时间排序但请注意切换时区或其他操作可能导致登录日志的时间出现偏差', sshAlert: '列表数据根据登录时间排序但请注意切换时区或其他操作可能导致登录日志的时间出现偏差',

View File

@ -45,7 +45,16 @@
</template> </template>
<template #main> <template #main>
<el-row :gutter="5"> <el-row :gutter="5">
<el-col v-for="(app, index) in apps" :key="index" :xs="24" :sm="12" :md="8" :lg="8" :xl="8"> <el-col
class="app-col-12"
v-for="(app, index) in apps"
:key="index"
:xs="24"
:sm="12"
:md="8"
:lg="8"
:xl="8"
>
<div class="app-card"> <div class="app-card">
<el-card class="e-card"> <el-card class="e-card">
<el-row :gutter="20"> <el-row :gutter="20">
@ -177,20 +186,15 @@ const getAppDetail = (key: string) => {
}; };
const sync = () => { const sync = () => {
loading.value = true; SyncApp().then((res) => {
SyncApp() if (res.message != '') {
.then((res) => { MsgSuccess(res.message);
if (res.message != '') { } else {
MsgSuccess(res.message); MsgSuccess(i18n.global.t('app.syncStart'));
} else { }
MsgSuccess(i18n.global.t('app.syncStart')); canUpdate.value = false;
} search(req);
canUpdate.value = false; });
search(req);
})
.finally(() => {
loading.value = false;
});
}; };
const changeTag = (key: string) => { const changeTag = (key: string) => {
@ -288,4 +292,11 @@ onMounted(() => {
margin-bottom: 10px; margin-bottom: 10px;
margin-top: 10px; margin-top: 10px;
} }
@media only screen and (min-width: 768px) and (max-width: 1200px) {
.app-col-12 {
max-width: 50%;
flex: 0 0 50%;
}
}
</style> </style>

View File

@ -16,13 +16,13 @@ const buttons = [
label: i18n.global.t('menu.config'), label: i18n.global.t('menu.config'),
path: '/hosts/ssh/ssh', path: '/hosts/ssh/ssh',
}, },
{
label: i18n.global.t('ssh.loginLogs'),
path: '/hosts/ssh/log',
},
{ {
label: i18n.global.t('ssh.session'), label: i18n.global.t('ssh.session'),
path: '/hosts/ssh/session', path: '/hosts/ssh/session',
}, },
{
label: i18n.global.t('ssh.loginLogs'),
path: '/hosts/ssh/log',
},
]; ];
</script> </script>

View File

@ -26,7 +26,7 @@
<template #main> <template #main>
<ComplexTable :data="data" ref="tableRef" v-loading="loading"> <ComplexTable :data="data" ref="tableRef" v-loading="loading">
<el-table-column :label="$t('commons.table.user')" fix prop="username"></el-table-column> <el-table-column :label="$t('commons.table.user')" fix prop="username"></el-table-column>
<el-table-column :label="'PTS'" fix prop="terminal"></el-table-column> <el-table-column :label="'TTY'" fix prop="terminal"></el-table-column>
<el-table-column :label="$t('ssh.loginIP')" fix prop="host"></el-table-column> <el-table-column :label="$t('ssh.loginIP')" fix prop="host"></el-table-column>
<el-table-column <el-table-column
:label="$t('ssh.loginTime')" :label="$t('ssh.loginTime')"