gh_mirrors/1Panel
1
0
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-01-19 16:29:17 +08:00
Code

pref: 调整部分界面的高度问题 (#4534)

Browse Source
This commit is contained in:
ssongliu 2024-04-16 18:59:14 +08:00 committed by GitHub
parent 4814a76c47
commit 9e44db53a7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 75 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
backend/app/service/container.go
View File

@ -656,7 +656,6 @@ func (u *ContainerService) ContainerLogs(wsConn *websocket.Conn, containerType,
commandArg = append(commandArg, "-f")
}
if !follow {
commandArg = append(commandArg, "2>&1")
cmd := exec.Command(commandName, commandArg...)
stdout, _ := cmd.CombinedOutput()
if !utf8.Valid(stdout) {

8
frontend/src/components/container-log/index.vue
View File

@ -31,7 +31,7 @@
:placeholder="$t('commons.msg.noneData')"
:indent-with-tab="true"
:tabSize="4"
style="margin-top: 10px; height: calc(100vh - 375px)"
:style="{ height: `calc(100vh - ${loadHeight()})`, 'margin-top': '10px' }"
:lineWrapping="true"
:matchBrackets="true"
theme="cobalt"
@ -53,6 +53,8 @@ import { Codemirror } from 'vue-codemirror';
import { javascript } from '@codemirror/lang-javascript';
import { oneDark } from '@codemirror/theme-one-dark';
import { MsgError, MsgSuccess } from '@/utils/message';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const extensions = [javascript(), oneDark];
@ -63,6 +65,10 @@ const handleReady = (payload) => {
};
const terminalSocket = ref<WebSocket>();
const loadHeight = () => {
return globalStore.openMenuTabs ? '405px' : '375px';
};
const logSearch = reactive({
isWatch: false,
container: '',

8
frontend/src/views/container/setting/index.vue
View File

@ -170,7 +170,7 @@
placeholder="# The Docker configuration file does not exist or is empty (/etc/docker/daemon.json)"
:indent-with-tab="true"
:tabSize="4"
style="margin-top: 10px; height: calc(100vh - 430px)"
:style="{ height: `calc(100vh - ${loadHeight()})`, 'margin-top': '10px' }"
:lineWrapping="true"
:matchBrackets="true"
theme="cobalt"
@ -264,6 +264,8 @@ import {
import { getSettingInfo } from '@/api/modules/setting';
import { MsgSuccess } from '@/utils/message';
import { checkNumberRange } from '@/global/form-rules';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const unset = ref(i18n.global.t('setting.unSetting'));
const submitInput = ref();
@ -326,6 +328,10 @@ const onSaveFile = async () => {
confirmDialogRefFile.value!.acceptParams(params);
};
const loadHeight = () => {
return globalStore.openMenuTabs ? '450px' : '430px';
};
const onChangeMirrors = () => {
mirrorRef.value.acceptParams({ mirrors: form.mirrors });
};

8
frontend/src/views/database/mysql/setting/index.vue
View File

@ -57,7 +57,7 @@
:placeholder="$t('commons.msg.noneData')"
:indent-with-tab="true"
:tabSize="4"
style="margin-top: 10px; height: calc(100vh - 375px)"
:style="{ height: `calc(100vh - ${loadHeight()})`, 'margin-top': '10px' }"
:lineWrapping="true"
:matchBrackets="true"
theme="cobalt"
@ -153,6 +153,8 @@ import { Rules } from '@/global/form-rules';
import i18n from '@/lang';
import { MsgSuccess } from '@/utils/message';
import router from '@/routers';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const loading = ref(false);
@ -196,6 +198,10 @@ const jumpToConf = async () => {
loadMysqlConf();
};
const loadHeight = () => {
return globalStore.openMenuTabs ? '405px' : '375px';
};
const jumpToSlowlog = async () => {
activeName.value = 'slowLog';
loadSlowLogs();

15
frontend/src/views/database/mysql/setting/slow-log/index.vue
View File

@ -56,6 +56,8 @@ import { loadDBFile, updateMysqlVariables } from '@/api/modules/database';
import { dateFormatForName, downloadWithContent } from '@/utils/util';
import i18n from '@/lang';
import { MsgError, MsgInfo, MsgSuccess } from '@/utils/message';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const extensions = [javascript(), oneDark];
const slowLogs = ref();
@ -120,7 +122,18 @@ const handleSlowLogs = async () => {
};
const getDynamicHeight = () => {
return variables.slow_query_log === 'ON' ? `calc(100vh - 437px)` : `calc(100vh - 383px)`;
if (variables.slow_query_log === 'ON') {
if (globalStore.openMenuTabs) {
return `calc(100vh - 467px)`;
} else {
return `calc(100vh - 437px)`;
}
}
if (globalStore.openMenuTabs) {
return `calc(100vh - 413px)`;
} else {
return `calc(100vh - 383px)`;
}
};
const changeSlowLogs = () => {

8
frontend/src/views/database/postgresql/setting/index.vue
View File

@ -33,7 +33,7 @@
:placeholder="$t('commons.msg.noneData')"
:indent-with-tab="true"
:tabSize="8"
style="margin-top: 10px; height: calc(100vh - 375px)"
:style="{ height: `calc(100vh - ${loadHeight()})`, 'margin-top': '10px' }"
:lineWrapping="true"
:matchBrackets="true"
theme="cobalt"
@ -104,6 +104,8 @@ import { Rules } from '@/global/form-rules';
import i18n from '@/lang';
import { MsgSuccess } from '@/utils/message';
import router from '@/routers';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const loading = ref(false);
@ -134,6 +136,10 @@ const props = withDefaults(defineProps<DBProps>(), {
database: '',
});
const loadHeight = () => {
return globalStore.openMenuTabs ? '405px' : '375px';
};
const dialogContainerLogRef = ref();
const jumpToConf = async () => {
activeName.value = 'conf';

8
frontend/src/views/database/redis/index.vue
View File

@ -21,7 +21,7 @@
</template>
<template #main v-if="redisIsExist && !isOnSetting">
<Terminal
style="height: calc(100vh - 370px)"
:style="{ height: `calc(100vh - ${loadHeight()})` }"
:key="isRefresh"
ref="terminalRef"
v-show="terminalShow"
@ -68,6 +68,8 @@ import { nextTick, onBeforeUnmount, ref } from 'vue';
import { App } from '@/api/interface/app';
import { GetAppPort } from '@/api/modules/app';
import router from '@/routers';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const loading = ref(false);
const maskShow = ref(true);
@ -94,6 +96,10 @@ const onSetting = async () => {
settingRef.value!.acceptParams({ status: redisStatus.value, redisName: redisName.value });
};
const loadHeight = () => {
return globalStore.openMenuTabs ? '400px' : '370px';
};
const goDashboard = async () => {
if (redisCommandPort.value === 0) {
commandVisible.value = true;

8
frontend/src/views/database/redis/setting/index.vue
View File

@ -40,7 +40,7 @@
:placeholder="$t('commons.msg.noneData')"
:indent-with-tab="true"
:tabSize="4"
style="margin-top: 10px; height: calc(100vh - 380px)"
:style="{ height: `calc(100vh - ${loadHeight()})`, 'margin-top': '10px' }"
:lineWrapping="true"
:matchBrackets="true"
theme="cobalt"
@ -140,6 +140,8 @@ import i18n from '@/lang';
import { checkNumberRange, Rules } from '@/global/form-rules';
import { ChangePort, GetAppDefaultConfig } from '@/api/modules/app';
import { MsgSuccess } from '@/utils/message';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const extensions = [javascript(), oneDark];
@ -150,6 +152,10 @@ const handleReady = (payload) => {
view.value = payload.view;
};
const loadHeight = () => {
return globalStore.openMenuTabs ? '410px' : '380px';
};
const form = reactive({
name: '',
port: 6379,

23
frontend/src/views/host/terminal/terminal/index.vue
View File

@ -44,7 +44,7 @@
</span>
</template>
<Terminal
style="height: calc(100vh - 229px); background-color: #000"
:style="{ height: `calc(100vh - ${loadHeight()})`, 'background-color': '#000' }"
:ref="'t-' + item.index"
:key="item.Refresh"
></Terminal>
@ -121,13 +121,19 @@
</el-tab-pane>
<div v-if="terminalTabs.length === 0">
<el-empty
style="background-color: #000; height: calc(100vh - 200px)"
:style="{ height: `calc(100vh - ${loadEmptyHeight()})`, 'background-color': '#000' }"
:description="$t('terminal.emptyTerminal')"
></el-empty>
</div>
</el-tabs>
<el-tooltip :content="loadTooltip()" placement="top">
<el-button @click="toggleFullscreen" v-if="!mobile" class="fullScreen" icon="FullScreen"></el-button>
<el-button
@click="toggleFullscreen"
v-if="!mobile"
class="fullScreen"
:style="{ top: loadFullScreenHeight() }"
icon="FullScreen"
></el-button>
</el-tooltip>
<HostDialog ref="dialogRef" @on-conn-terminal="onConnTerminal" @load-host-tree="loadHostTree" />
@ -236,6 +242,16 @@ const cleanTimer = () => {
}
};
const loadHeight = () => {
return globalStore.openMenuTabs ? '269px' : '229px';
};
const loadEmptyHeight = () => {
return globalStore.openMenuTabs ? '240px' : '200px';
};
const loadFullScreenHeight = () => {
return globalStore.openMenuTabs ? '66px' : '90px';
};
const handleTabsRemove = (targetName: string, action: 'remove' | 'add') => {
if (action !== 'remove') {
return;
@ -436,7 +452,6 @@ onMounted(() => {
border: none;
position: absolute;
right: 50px;
top: 90px;
font-weight: 600;
font-size: 14px;
}