From 31971b4e066f97e18697ec5c7889cae6593a3642 Mon Sep 17 00:00:00 2001 From: lijiahang Date: Thu, 21 Mar 2024 13:04:51 +0800 Subject: [PATCH] =?UTF-8?q?:hammer:=20=E6=89=A7=E8=A1=8C=E6=97=A5=E5=BF=97?= =?UTF-8?q?.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/exec/log/panel-modal/index.vue | 11 ++-- .../src/components/exec/log/panel/const.ts | 2 + .../src/components/exec/log/panel/index.vue | 6 +-- .../components/exec/log/panel/log-appender.ts | 51 +++++++++++-------- .../components/exec/log/panel/log-item.vue | 2 +- .../components/exec/log/panel/log-view.vue | 2 - .../components/exec-panel-editor.vue | 2 +- .../exec-command/components/exec-panel.vue | 2 +- .../host/terminal/handler/ssh-session.ts | 5 +- 9 files changed, 45 insertions(+), 38 deletions(-) diff --git a/orion-ops-ui/src/components/exec/log/panel-modal/index.vue b/orion-ops-ui/src/components/exec/log/panel-modal/index.vue index 32010292..2a3de79b 100644 --- a/orion-ops-ui/src/components/exec/log/panel-modal/index.vue +++ b/orion-ops-ui/src/components/exec/log/panel-modal/index.vue @@ -3,8 +3,8 @@ title-align="start" title="执行日志" width="94%" - :top="40" - :body-style="{ padding: '0', height: 'calc(100vh - 140px)', overflow: 'hidden' }" + :top="44" + :body-style="{ padding: '0', height: 'calc(100vh - 138px)', overflow: 'hidden' }" :align-center="false" :draggable="true" :mask-closable="false" @@ -40,8 +40,6 @@ const log = ref(); - // TODO 卸载 - // 打开 const open = async (id: number) => { setVisible(true); @@ -51,7 +49,9 @@ const { data } = await getExecLog(id); // 打开日志 await nextTick(() => { - log.value.open(data); + setTimeout(() => { + log.value.open(data); + }, 50); }); } catch (e) { setVisible(false); @@ -71,7 +71,6 @@ const handleClear = () => { setLoading(false); setVisible(false); - console.log('clear'); }; diff --git a/orion-ops-ui/src/components/exec/log/panel/const.ts b/orion-ops-ui/src/components/exec/log/panel/const.ts index c75dff93..c015e66a 100644 --- a/orion-ops-ui/src/components/exec/log/panel/const.ts +++ b/orion-ops-ui/src/components/exec/log/panel/const.ts @@ -2,6 +2,7 @@ import type { IDisposable, ITerminalInitOnlyOptions, ITerminalOptions, Terminal import type { FitAddon } from 'xterm-addon-fit'; import type { SearchAddon } from 'xterm-addon-search'; import type { CanvasAddon } from 'xterm-addon-canvas'; +import type { WebLinksAddon } from 'xterm-addon-web-links'; // appender 配置 export const AppenderOptions: ITerminalOptions & ITerminalInitOnlyOptions = { @@ -43,6 +44,7 @@ export interface LogAddons extends Record { fit: FitAddon; canvas: CanvasAddon; search: SearchAddon; + weblink: WebLinksAddon; } // 执行日志 appender 定义 diff --git a/orion-ops-ui/src/components/exec/log/panel/index.vue b/orion-ops-ui/src/components/exec/log/panel/index.vue index f7e82d4a..d674f7a9 100644 --- a/orion-ops-ui/src/components/exec/log/panel/index.vue +++ b/orion-ops-ui/src/components/exec/log/panel/index.vue @@ -131,8 +131,6 @@ // 清理并且关闭 const closeAll = () => { - // TODO - console.log('closeAll'); // 清理轮询 clearAllInterval(); // 关闭 appender @@ -156,8 +154,8 @@ @host-real-width: @host-width + 16px; .log-panel-container { - width: calc(100% - 32px); - height: calc(100% - 32px); + width: 100%; + height: 100%; display: flex; position: absolute; } diff --git a/orion-ops-ui/src/components/exec/log/panel/log-appender.ts b/orion-ops-ui/src/components/exec/log/panel/log-appender.ts index ae8ed806..4d53b18f 100644 --- a/orion-ops-ui/src/components/exec/log/panel/log-appender.ts +++ b/orion-ops-ui/src/components/exec/log/panel/log-appender.ts @@ -1,6 +1,6 @@ import type { ILogAppender, LogAddons, LogAppenderConf, LogDomRef } from './const'; -import type { ExecTailRequest } from '@/api/exec/exec'; import { AppenderOptions } from './const'; +import type { ExecTailRequest } from '@/api/exec/exec'; import { getExecLogTailToken } from '@/api/exec/exec'; import { webSocketBaseUrl } from '@/utils/env'; import { Message } from '@arco-design/web-vue'; @@ -12,6 +12,7 @@ import { Terminal } from 'xterm'; import { FitAddon } from 'xterm-addon-fit'; import { SearchAddon } from 'xterm-addon-search'; import { CanvasAddon } from 'xterm-addon-canvas'; +import { WebLinksAddon } from 'xterm-addon-web-links'; // 执行日志 appender 实现 export default class LogAppender implements ILogAppender { @@ -105,13 +106,16 @@ export default class LogAppender implements ILogAppender { const fit = new FitAddon(); const search = new SearchAddon(); const canvas = new CanvasAddon(); + const weblink = new WebLinksAddon(); terminal.loadAddon(fit); terminal.loadAddon(search); terminal.loadAddon(canvas); + terminal.loadAddon(weblink); return { fit, search, - canvas + canvas, + weblink }; } @@ -223,37 +227,40 @@ export default class LogAppender implements ILogAppender { // 关闭 client closeClient(): void { - // 关闭 ws - if (this.client && this.client.readyState === WebSocket.OPEN) { - this.client.close(); + try { + // 清理持久化 + clearInterval(this.keepAliveTask); + // 关闭 ws + if (this.client && this.client.readyState === WebSocket.OPEN) { + this.client.close(); + } + } catch (e) { } - // 清理持久化 - clearInterval(this.keepAliveTask); } // 关闭 view closeView(): void { - // 关闭 terminal - Object.values(this.appenderRel).forEach(s => { - if (s.addons) { - Object.values(s.addons).forEach(s => s.dispose()); - } - s.terminal?.dispose(); - }); // 移除自适应事件 removeEventListen(window, 'resize', this.fitAllFn); + // 关闭 terminal + Object.values(this.appenderRel).forEach(s => { + try { + // 卸载插件 + Object.values(s.addons) + .filter(Boolean) + .forEach(s => s.dispose()); + // 卸载终端 + s.terminal?.dispose(); + } catch (e) { + // 卸载可能会报错 + } + }); } // 关闭 close(): void { - try { - this.closeClient(); - this.closeView(); - } catch (ex) { - // TODO - console.log('errr'); - console.error(ex); - } + this.closeClient(); + this.closeView(); } // 处理消息 diff --git a/orion-ops-ui/src/components/exec/log/panel/log-item.vue b/orion-ops-ui/src/components/exec/log/panel/log-item.vue index 3b7f2ae9..7ef96bd6 100644 --- a/orion-ops-ui/src/components/exec/log/panel/log-item.vue +++ b/orion-ops-ui/src/components/exec/log/panel/log-item.vue @@ -245,7 +245,7 @@ height: calc(100% - @header-height); position: relative; background: #202020; - padding: 4px 0 0 4px; + padding: 4px 0 4px 4px; .log-appender { width: 100%; diff --git a/orion-ops-ui/src/components/exec/log/panel/log-view.vue b/orion-ops-ui/src/components/exec/log/panel/log-view.vue index 50128c26..4bf2e293 100644 --- a/orion-ops-ui/src/components/exec/log/panel/log-view.vue +++ b/orion-ops-ui/src/components/exec/log/panel/log-view.vue @@ -43,8 +43,6 @@ // 打开 const open = () => { nextTick(async () => { - // TODO - console.log(props.appender); if (props.appender) { // 初始化 await props.appender.init(logRefs.value); diff --git a/orion-ops-ui/src/views/exec/exec-command/components/exec-panel-editor.vue b/orion-ops-ui/src/views/exec/exec-command/components/exec-panel-editor.vue index 7817e6e0..eb6e18a5 100644 --- a/orion-ops-ui/src/views/exec/exec-command/components/exec-panel-editor.vue +++ b/orion-ops-ui/src/views/exec/exec-command/components/exec-panel-editor.vue @@ -43,7 +43,7 @@