feat: 终端全局快捷键.

orion-ops-ui/src/views/host/terminal/handler/terminal-session-handler.ts

@@ -29,94 +29,7 @@ export default class TerminalSessionHandler implements ITerminalSessionHandler {
     this.domRef = domRef;
     const { preference, tabManager } = useTerminalStore();
     this.interactSetting = preference.interactSetting;
-    // this.shortcutKeys = preference.shortcutSetting.keys;
-    this.shortcutKeys = [
-      {
-        option: 'copy',
-        ctrlKey: true,
-        shiftKey: true,
-        altKey: false,
-        code: 'KeyC'
-      }, {
-        option: 'paste',
-        ctrlKey: true,
-        shiftKey: true,
-        altKey: false,
-        code: 'KeyV'
-      }, {
-        option: 'toTop',
-        ctrlKey: true,
-        shiftKey: true,
-        altKey: false,
-        code: 'ArrowUp'
-      }, {
-        option: 'toBottom',
-        ctrlKey: true,
-        shiftKey: true,
-        altKey: false,
-        code: 'ArrowDown'
-      }, {
-        option: 'selectAll',
-        ctrlKey: true,
-        shiftKey: true,
-        altKey: false,
-        code: 'KeyA'
-      }, {
-        option: 'search',
-        ctrlKey: true,
-        shiftKey: true,
-        altKey: false,
-        code: 'KeyF'
-      }, {
-        option: 'fontSizePlus',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'Equal'
-      }, {
-        option: 'fontSizeSubtract',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'Minus'
-      }, {
-        option: 'commandEditor',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'KeyE'
-      }, {
-        option: 'close',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'KeyW'
-      }, {
-        option: 'changeToPrev',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'ArrowLeft'
-      }, {
-        option: 'changeToNext',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'ArrowRight'
-      }, {
-        option: 'openCopyTerminal',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'KeyO'
-      }, {
-        option: 'openNewConnect',
-        ctrlKey: true,
-        shiftKey: false,
-        altKey: true,
-        code: 'KeyN'
-      },
-    ];
+    this.shortcutKeys = preference.shortcutSetting.keys;
     this.tabManager = tabManager;
   }
 
@@ -158,7 +71,7 @@ export default class TerminalSessionHandler implements ITerminalSessionHandler {
     });
     if (key) {
       // 调用处理方法
-      this.invokeHandle.call(this, key.option);
+      this.invokeHandle.call(this, key.item);
       return false;
     } else {
       return true;
@@ -271,22 +184,22 @@ export default class TerminalSessionHandler implements ITerminalSessionHandler {
   }
 
   // 切换到前一个 tab
-  changeToPrev() {
-    this.tabManager.changeToPrev();
+  changeToPrevTab() {
+    this.tabManager.changeToPrevTab();
   }
 
   // 切换到后一个 tab
-  changeToNext() {
-    this.tabManager.changeToNext();
+  changeToNextTab() {
+    this.tabManager.changeToNextTab();
   }
 
-  // 复制终端
-  openCopyTerminal() {
+  // 复制终端 tab
+  openCopyTerminalTab() {
     useTerminalStore().openCopyTerminal(this.session.hostId);
   }
 
-  // 打开新建连接页面
-  openNewConnect() {
+  // 打开新建连接 tab
+  openNewConnectTab() {
     this.tabManager.openTab(InnerTabs.NEW_CONNECTION);
   }
 

orion-ops-ui/src/views/host/terminal/handler/terminal-session.ts

@@ -2,8 +2,8 @@ import type { UnwrapRef } from 'vue';
 import type { TerminalPreference } from '@/store/modules/terminal/types';
 import type { ITerminalChannel, ITerminalSession, ITerminalSessionHandler, TerminalAddons, TerminalDomRef } from '../types/terminal.type';
 import { useTerminalStore } from '@/store';
-import { fontFamilySuffix, TerminalStatus } from '../types/terminal.const';
 import { InputProtocol } from '../types/terminal.protocol';
+import { fontFamilySuffix, TerminalStatus } from '../types/terminal.const';
 import { Terminal } from 'xterm';
 import { FitAddon } from 'xterm-addon-fit';
 import { WebLinksAddon } from 'xterm-addon-web-links';
@@ -13,6 +13,7 @@ import { CanvasAddon } from 'xterm-addon-canvas';
 import { WebglAddon } from 'xterm-addon-webgl';
 import { playBell } from '@/utils/bell';
 import TerminalSessionHandler from './terminal-session-handler';
+import { addEventListen } from '@/utils/event';
 
 // 终端会话实现
 export default class TerminalSession implements ITerminalSession {
@@ -82,16 +83,14 @@ export default class TerminalSession implements ITerminalSession {
     // 处理自定义按键
     this.inst.attachCustomKeyEventHandler((e: KeyboardEvent) => {
       e.preventDefault();
-      // 未开启
-      if (!preference.shortcutSetting.enabled) {
-        return true;
+      // 触发快捷键检测
+      if (e.type === 'keydown'
+        && preference.shortcutSetting.enabled
+        && preference.shortcutSetting.keys.length) {
+        // 触发快捷键
+        return this.handler.triggerShortcutKey(e);
       }
-      // 只监听 keydown 事件
-      if (e.type !== 'keydown') {
-        return true;
-      }
-      // 触发快捷键
-      return this.handler.triggerShortcutKey(e);
+      return true;
     });
   }
 
@@ -134,7 +133,7 @@ export default class TerminalSession implements ITerminalSession {
       });
     });
     // 设置右键选项
-    dom.addEventListener('contextmenu', async () => {
+    addEventListen(dom, 'contextmenu', async () => {
       // 右键粘贴逻辑
       if (preference.interactSetting.rightClickPaste) {
         if (!this.canWrite || !this.connected) {
@@ -195,16 +194,21 @@ export default class TerminalSession implements ITerminalSession {
     this.inst.write(value);
   }
 
-  // 自适应
-  fit(): void {
-    this.addons.fit?.fit();
-  }
-
   // 聚焦
   focus(): void {
     this.inst.focus();
   }
 
+  // 失焦
+  blur(): void {
+    this.inst.blur();
+  }
+
+  // 自适应
+  fit(): void {
+    this.addons.fit?.fit();
+  }
+
   // 查找
   find(word: string, next: boolean, options: ISearchOptions): void {
     if (next) {
@@ -229,7 +233,7 @@ export default class TerminalSession implements ITerminalSession {
       Object.values(this.addons)
         .filter(Boolean)
         .forEach(s => s.dispose());
-      // 卸载实体
+      // 卸载终端
       this.inst.dispose();
     } catch (e) {
     }

orion-ops-ui/src/views/host/terminal/handler/terminal-tab-manager.ts

@@ -45,12 +45,12 @@ export default class TerminalTabManager implements ITerminalTabManager {
   }
 
   // 切换到前一个 tab
-  changeToPrev() {
+  changeToPrevTab() {
     this.changeToIndex(this.getCurrentTabIndex() - 1);
   }
 
   // 切换到后一个 tab
-  changeToNext() {
+  changeToNextTab() {
     this.changeToIndex(this.getCurrentTabIndex() + 1);
   }