fix: 终端面板telnet内容行列数自适应调整

This commit is contained in:
TsMask
2024-08-08 10:40:19 +08:00
parent 377ffc6e10
commit 049c0e7a0f
2 changed files with 20 additions and 6 deletions

View File

@@ -155,6 +155,15 @@ function handleRanderXterm(container: HTMLElement | undefined) {
// 自适应尺寸
const fitAddon = new FitAddon();
xterm.loadAddon(fitAddon);
// 终端尺寸变化触发
xterm.onResize(({ cols, rows }) => {
// console.log('尺寸', cols, rows);
ws.send({
requestId: `telnet_resize_${props.hostId}`,
type: 'telnet_resize',
data: { cols, rows },
});
});
// 创建 ResizeObserver 实例
var observer = new ResizeObserver(entries => {
@@ -280,7 +289,7 @@ defineExpose({
<template>
<div class="terminal">
<div ref="terminalDom" style="height: 78%" :id="id"></div>
<div ref="terminalDom" style="height: calc(100% - 36px)" :id="id"></div>
<a-auto-complete
v-model:value="terminalState.text"
:dropdown-match-select-width="500"

View File

@@ -226,10 +226,11 @@ function fnTabClose(id: string) {
<template>
<PageContainer>
<a-card :bordered="false" :body-style="{ padding: '12px' }">
<a-card :bordered="false" size="small" :body-style="{ padding: '12px' }">
<a-tabs
class="terminal-tabs"
hide-add
size="small"
tab-position="top"
type="editable-card"
:tab-bar-gutter="8"
@@ -343,7 +344,12 @@ function fnTabClose(id: string) {
<template #title>
{{ t('views.tool.terminal.new') }}
</template>
<a-button type="default" shape="circle" @click="fnTabMenu('new')">
<a-button
type="default"
shape="circle"
size="small"
@click="fnTabMenu('new')"
>
<template #icon><PlusOutlined /></template>
</a-button>
</a-tooltip>
@@ -354,7 +360,7 @@ function fnTabClose(id: string) {
{{ t('views.tool.terminal.more') }}
</template>
<a-dropdown trigger="click" placement="bottomRight">
<a-button type="ghost" shape="circle">
<a-button type="ghost" shape="circle" size="small">
<template #icon><EllipsisOutlined /></template>
</a-button>
<template #overlay>
@@ -385,8 +391,7 @@ function fnTabClose(id: string) {
<style lang="less" scoped>
.pane-box {
padding: 16px;
height: calc(100vh - 320px);
height: calc(100vh - 200px);
overflow-x: hidden;
}
</style>