mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2025-01-19 08:19:15 +08:00
feat: 优化文件选择逻辑 (#1532)
This commit is contained in:
zhengkunwang223
GitHub
parent
a0ceb62372
commit
3cbaa052c8
@ -11,7 +11,7 @@
|
||||
<el-button :icon="Folder" @click="popoverVisible = true"></el-button>
|
||||
</template>
|
||||
<div>
|
||||
<el-button class="close" link @click="popoverVisible = false">
|
||||
<el-button class="close" link @click="closePage">
|
||||
<el-icon><Close /></el-icon>
|
||||
</el-button>
|
||||
<BreadCrumbs>
|
||||
@ -67,6 +67,22 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</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>
|
||||
</template>
|
||||
|
||||
@ -78,11 +94,12 @@ import BreadCrumbs from '@/components/bread-crumbs/index.vue';
|
||||
import BreadCrumbItem from '@/components/bread-crumbs/bread-crumbs-item.vue';
|
||||
import { onMounted, onUpdated, reactive, ref } from 'vue';
|
||||
|
||||
let rowName = ref('');
|
||||
let data = ref();
|
||||
let loading = ref(false);
|
||||
let paths = ref<string[]>([]);
|
||||
let req = reactive({ path: '/', expand: true, page: 1, pageSize: 300 });
|
||||
const rowName = ref('');
|
||||
const data = ref();
|
||||
const loading = ref(false);
|
||||
const paths = ref<string[]>([]);
|
||||
const req = reactive({ path: '/', expand: true, page: 1, pageSize: 300 });
|
||||
const selectRow = ref();
|
||||
|
||||
const popoverVisible = ref(false);
|
||||
|
||||
@ -100,9 +117,20 @@ const props = defineProps({
|
||||
const em = defineEmits(['choose']);
|
||||
|
||||
const checkFile = (row: any) => {
|
||||
rowName.value = row.name;
|
||||
em('choose', row.path);
|
||||
selectRow.value = row;
|
||||
rowName.value = selectRow.value.name;
|
||||
};
|
||||
|
||||
const selectFile = () => {
|
||||
if (selectRow.value) {
|
||||
em('choose', selectRow.value.path);
|
||||
}
|
||||
closePage();
|
||||
};
|
||||
|
||||
const closePage = () => {
|
||||
popoverVisible.value = false;
|
||||
selectRow.value = {};
|
||||
};
|
||||
|
||||
const open = async (row: File.File) => {
|
||||
@ -116,6 +144,7 @@ const open = async (row: File.File) => {
|
||||
}
|
||||
search(req);
|
||||
}
|
||||
rowName.value = '';
|
||||
};
|
||||
|
||||
const jump = async (index: number) => {
|
||||
@ -172,4 +201,17 @@ onUpdated(() => {
|
||||
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>
|
||||
|
||||
@ -867,6 +867,7 @@ const message = {
|
||||
searchHelper: 'Support wildcards such as *',
|
||||
uploadFailed: '[{0}] File Upload file',
|
||||
fileUploadStart: 'Uploading [{0}]....',
|
||||
currentSelect: 'Current Select: ',
|
||||
},
|
||||
ssh: {
|
||||
sshAlert:
|
||||
|
||||
@ -837,6 +837,7 @@ const message = {
|
||||
searchHelper: '支持 * 等通配符',
|
||||
uploadFailed: '[{0}] 文件上傳失敗',
|
||||
fileUploadStart: '正在上傳[{0}]....',
|
||||
currentSelect: '當前選中: ',
|
||||
},
|
||||
ssh: {
|
||||
sshAlert: '列表數據根據登錄時間排序，但請註意，切換時區或其他操作可能導致登錄日誌的時間出現偏差。',
|
||||
|
||||
@ -837,6 +837,7 @@ const message = {
|
||||
searchHelper: '支持 * 等通配符',
|
||||
uploadFailed: '[{0}] 文件上传失败',
|
||||
fileUploadStart: '正在上传[{0}]....',
|
||||
currentSelect: '当前选中: ',
|
||||
},
|
||||
ssh: {
|
||||
sshAlert: '列表数据根据登录时间排序，但请注意，切换时区或其他操作可能导致登录日志的时间出现偏差。',
|
||||
|
||||
@ -45,7 +45,16 @@
|
||||
</template>
|
||||
<template #main>
|
||||
<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">
|
||||
<el-card class="e-card">
|
||||
<el-row :gutter="20">
|
||||
@ -177,20 +186,15 @@ const getAppDetail = (key: string) => {
|
||||
};
|
||||
|
||||
const sync = () => {
|
||||
loading.value = true;
|
||||
SyncApp()
|
||||
.then((res) => {
|
||||
if (res.message != '') {
|
||||
MsgSuccess(res.message);
|
||||
} else {
|
||||
MsgSuccess(i18n.global.t('app.syncStart'));
|
||||
}
|
||||
canUpdate.value = false;
|
||||
search(req);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
SyncApp().then((res) => {
|
||||
if (res.message != '') {
|
||||
MsgSuccess(res.message);
|
||||
} else {
|
||||
MsgSuccess(i18n.global.t('app.syncStart'));
|
||||
}
|
||||
canUpdate.value = false;
|
||||
search(req);
|
||||
});
|
||||
};
|
||||
|
||||
const changeTag = (key: string) => {
|
||||
@ -288,4 +292,11 @@ onMounted(() => {
|
||||
margin-bottom: 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>
|
||||
|
||||
@ -16,13 +16,13 @@ const buttons = [
|
||||
label: i18n.global.t('menu.config'),
|
||||
path: '/hosts/ssh/ssh',
|
||||
},
|
||||
{
|
||||
label: i18n.global.t('ssh.loginLogs'),
|
||||
path: '/hosts/ssh/log',
|
||||
},
|
||||
{
|
||||
label: i18n.global.t('ssh.session'),
|
||||
path: '/hosts/ssh/session',
|
||||
},
|
||||
{
|
||||
label: i18n.global.t('ssh.loginLogs'),
|
||||
path: '/hosts/ssh/log',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
@ -26,7 +26,7 @@
|
||||
<template #main>
|
||||
<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="'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.loginTime')"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user