diff --git a/orion-ops-ui/.env.development b/orion-ops-ui/.env.development index fe87f179..2e8f9d22 100644 --- a/orion-ops-ui/.env.development +++ b/orion-ops-ui/.env.development @@ -1,2 +1,3 @@ VITE_API_BASE_URL= 'http://127.0.0.1:9200/orion-api' +VITE_WS_BASE_URL= 'ws://127.0.0.1:9200/orion/keep-alive' VITE_APP_VERSION= '1.0.0' diff --git a/orion-ops-ui/.env.production b/orion-ops-ui/.env.production index fe87f179..2e8f9d22 100644 --- a/orion-ops-ui/.env.production +++ b/orion-ops-ui/.env.production @@ -1,2 +1,3 @@ VITE_API_BASE_URL= 'http://127.0.0.1:9200/orion-api' +VITE_WS_BASE_URL= 'ws://127.0.0.1:9200/orion/keep-alive' VITE_APP_VERSION= '1.0.0' diff --git a/orion-ops-ui/src/api/asset/host-terminal.ts b/orion-ops-ui/src/api/asset/host-terminal.ts new file mode 100644 index 00000000..f5898ca1 --- /dev/null +++ b/orion-ops-ui/src/api/asset/host-terminal.ts @@ -0,0 +1,16 @@ +import axios from 'axios'; + +/** + * 主机终端访问响应 + */ +export interface HostTerminalAccessResponse { + accessToken: string; + sessionInitial: string; +} + +/** + * 获取主机终端 accessToken + */ +export function getHostTerminalAccessToken() { + return axios.get('/asset/host-terminal/access'); +} diff --git a/orion-ops-ui/src/env.d.ts b/orion-ops-ui/src/env.d.ts index dcb3db5e..c724023f 100644 --- a/orion-ops-ui/src/env.d.ts +++ b/orion-ops-ui/src/env.d.ts @@ -9,6 +9,7 @@ declare module '*.vue' { interface ImportMetaEnv { readonly VITE_API_BASE_URL: string; + readonly VITE_WS_BASE_URL: string; readonly VITE_APP_VERSION: string; } diff --git a/orion-ops-ui/src/store/modules/terminal/index.ts b/orion-ops-ui/src/store/modules/terminal/index.ts index 59308c32..fcf7fc6c 100644 --- a/orion-ops-ui/src/store/modules/terminal/index.ts +++ b/orion-ops-ui/src/store/modules/terminal/index.ts @@ -1,9 +1,11 @@ -import type { TerminalDisplaySetting, TerminalPreference, TerminalState, TerminalThemeSchema } from './types'; +import type { TabItem, TerminalDisplaySetting, TerminalPreference, TerminalState, TerminalThemeSchema } from './types'; +import type { HostQueryResponse } from '@/api/asset/host'; import { defineStore } from 'pinia'; import { getPreference, updatePreference } from '@/api/user/preference'; import { Message } from '@arco-design/web-vue'; import { useDark } from '@vueuse/core'; import { DEFAULT_SCHEMA } from '@/views/host-ops/terminal/types/terminal.theme'; +import { InnerTabs } from '@/views/host-ops/terminal/types/terminal.const'; // 暗色主题 export const DarkTheme = { @@ -28,6 +30,10 @@ export default defineStore('terminal', { displaySetting: {} as TerminalDisplaySetting, themeSchema: {} as TerminalThemeSchema }, + tabs: { + active: InnerTabs.NEW_CONNECTION.key, + items: [InnerTabs.NEW_CONNECTION, InnerTabs.VIEW_SETTING] + } }), actions: { @@ -94,7 +100,7 @@ export default defineStore('terminal', { await this.updateTerminalPreference('newConnectionType', newConnectionType); }, - // 更新终端偏好-防抖 + // 更新终端偏好 async updateTerminalPreference(item: string, value: any) { try { // 修改配置 @@ -106,7 +112,37 @@ export default defineStore('terminal', { } catch (e) { Message.error('同步失败'); } + }, + + // 点击 tab + clickTab(key: string) { + this.tabs.active = key; + }, + + // 删除 tab + deleteTab(key: string) { + const tabIndex = this.tabs.items.findIndex(s => s.key === key); + this.tabs.items.splice(tabIndex, 1); + if (key === this.tabs.active && this.tabs.items.length !== 0) { + // 切换为前一个 tab + this.tabs.active = this.tabs.items[Math.max(tabIndex - 1, 0)].key; + } + }, + + // 切换 tab + switchTab(tab: TabItem) { + // 不存在则创建tab + if (!this.tabs.items.find(s => s.key === tab.key)) { + this.tabs.items.push(tab); + } + this.tabs.active = tab.key; + }, + + // 打开终端 + openTerminal(record: HostQueryResponse) { + console.log(record); } + }, }); diff --git a/orion-ops-ui/src/store/modules/terminal/types.ts b/orion-ops-ui/src/store/modules/terminal/types.ts index 036ff4e1..c2ba6318 100644 --- a/orion-ops-ui/src/store/modules/terminal/types.ts +++ b/orion-ops-ui/src/store/modules/terminal/types.ts @@ -3,6 +3,7 @@ import type { Ref } from 'vue'; export interface TerminalState { isDarkTheme: Ref; preference: TerminalPreference; + tabs: TerminalTabs; } // 终端配置 @@ -54,3 +55,18 @@ export interface TerminalThemeSchema { [key: string]: unknown; } + +// 终端 tab +export interface TerminalTabs { + active: string; + items: Array; +} + +// tab 元素 +export interface TabItem { + key: string; + title: string; + type: string; + + [key: string]: unknown; +} diff --git a/orion-ops-ui/src/views/host-ops/terminal/components/layout/icon-actions.vue b/orion-ops-ui/src/views/host-ops/terminal/components/layout/icon-actions.vue index 4fd86c56..04b7fba6 100644 --- a/orion-ops-ui/src/views/host-ops/terminal/components/layout/icon-actions.vue +++ b/orion-ops-ui/src/views/host-ops/terminal/components/layout/icon-actions.vue @@ -7,8 +7,7 @@ content-class="terminal-tooltip-content" arrow-class="terminal-tooltip-arrow" :content="action.content"> -
+
diff --git a/orion-ops-ui/src/views/host-ops/terminal/components/layout/terminal-content.vue b/orion-ops-ui/src/views/host-ops/terminal/components/layout/terminal-content.vue index 8f909431..16f7de73 100644 --- a/orion-ops-ui/src/views/host-ops/terminal/components/layout/terminal-content.vue +++ b/orion-ops-ui/src/views/host-ops/terminal/components/layout/terminal-content.vue @@ -1,8 +1,8 @@