From d23d9f66382c11f5df2e02e77c4ae525ee93d015 Mon Sep 17 00:00:00 2001 From: Kirigaya <1193466151@qq.com> Date: Fri, 11 Apr 2025 13:34:51 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=20renderer=20=E8=B5=84?= =?UTF-8?q?=E6=BA=90=E8=BD=BD=E5=85=A5=E6=96=B9=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- renderer/public/mcp.css | 7 ++ renderer/src/App.vue | 76 +++++++++++++------ renderer/src/api/message-bridge.ts | 5 ++ renderer/src/components/sidebar/mcp-title.vue | 8 +- renderer/src/hook/panel.ts | 2 + renderer/src/hook/setting.ts | 2 + renderer/src/views/about/index.vue | 3 +- renderer/vue.config.js | 19 +++++ 8 files changed, 88 insertions(+), 34 deletions(-) diff --git a/renderer/public/mcp.css b/renderer/public/mcp.css index 489e074..f4a8203c 100644 --- a/renderer/public/mcp.css +++ b/renderer/public/mcp.css @@ -189,4 +189,11 @@ a { .copy-button:hover { background-color: var(--main-color); color: #fff; +} + +.openmcp-logo { + background-image: url('./images/openmcp.svg'); + background-size: contain; + background-repeat: no-repeat; + background-position: center; } \ No newline at end of file diff --git a/renderer/src/App.vue b/renderer/src/App.vue index 3689e02..01991f8 100644 --- a/renderer/src/App.vue +++ b/renderer/src/App.vue @@ -26,9 +26,54 @@ bridge.addCommandListener('hello', data => { pinkLog(`version: ${data.version}`); }, { once: true }); +function initDebug() { + connectionArgs.commandString = 'mcp run ../servers/main.py'; + connectionMethods.current = 'STDIO'; + + bridge.addCommandListener('connect', data => { + const { code, msg } = data; + connectionResult.success = (code === 200); + connectionResult.logString = msg; + }, { once: true }); + + setTimeout(() => { + // 初始化 设置 + loadSetting(); + + // 初始化 tab + loadPanels(); + + // 尝试连接 + doConnect(); + + // 200 是我的电脑上的 ws 的连接时间，部署环境中不存在 ws 连接延时的问题，所以 + // 可以直接不管 + }, 200); +} + +function initProduce() { + // TODO: get from vscode + connectionArgs.commandString = 'mcp run ../servers/main.py'; + connectionMethods.current = 'STDIO'; + + bridge.addCommandListener('connect', data => { + const { code, msg } = data; + connectionResult.success = (code === 200); + connectionResult.logString = msg; + }, { once: true }); + + // 初始化 设置 + loadSetting(); + + // 初始化 tab + loadPanels(); + + // 尝试连接 + doConnect(); +} onMounted(() => { - // 初始化 css + // 初始化 css setDefaultCss(); document.addEventListener('click', () => { @@ -37,30 +82,11 @@ onMounted(() => { pinkLog('OpenMCP Client 启动'); - // 如果是 debug 模式，直接连接项目中的服务器 - if (acquireVsCodeApi === undefined) { - connectionArgs.commandString = 'mcp run ../servers/main.py'; - connectionMethods.current = 'STDIO'; - - bridge.addCommandListener('connect', data => { - const { code, msg } = data; - connectionResult.success = (code === 200); - connectionResult.logString = msg; - }, { once: true }); - - setTimeout(() => { - // 初始化 设置 - loadSetting(); - - // 初始化 tab - loadPanels(); - - doConnect(); - - // 200 是我的电脑上的 ws 的连接时间，部署环境中不存在 ws 连接延时的问题，所以 - // 可以直接不管 - }, 200); - } + if (acquireVsCodeApi === undefined) { + initDebug(); + } else { + initProduce(); + } }); diff --git a/renderer/src/api/message-bridge.ts b/renderer/src/api/message-bridge.ts index cb1a5d4..35c33ff 100644 --- a/renderer/src/api/message-bridge.ts +++ b/renderer/src/api/message-bridge.ts @@ -48,6 +48,11 @@ class MessageBridge { this.postMessage = (message) => vscode.postMessage(message); this.isConnected.value = true; + + this.postMessage({ + command: 'init', + data: {} + }); } // WebSocket 环境连接 diff --git a/renderer/src/components/sidebar/mcp-title.vue b/renderer/src/components/sidebar/mcp-title.vue index 9edc574..eb625f3 100644 --- a/renderer/src/components/sidebar/mcp-title.vue +++ b/renderer/src/components/sidebar/mcp-title.vue @@ -1,6 +1,6 @@ @@ -17,13 +17,7 @@ defineComponent({ name: 'mcp-title' }); align-items: center; } -.mcp-title > img { - height: 48px; - margin-right: 10px; -} - .mcp-title > div { font-size: 24px; } - \ No newline at end of file diff --git a/renderer/src/hook/panel.ts b/renderer/src/hook/panel.ts index 7e2dbb5..95a5f4a 100644 --- a/renderer/src/hook/panel.ts +++ b/renderer/src/hook/panel.ts @@ -24,6 +24,8 @@ export function loadPanels() { bridge.addCommandListener('panel/load', data => { const persistTab = data.msg as SaveTab; + console.log('receive persist tab', persistTab); + if (persistTab.tabs.length === 0) { // 空的，直接返回不需要管 return; diff --git a/renderer/src/hook/setting.ts b/renderer/src/hook/setting.ts index 5db6024..71a297c 100644 --- a/renderer/src/hook/setting.ts +++ b/renderer/src/hook/setting.ts @@ -8,6 +8,8 @@ export function loadSetting() { bridge.addCommandListener('setting/load', data => { const persistConfig = data.msg; + + console.log('receive persist config', persistConfig); llmManager.currentModelIndex = persistConfig.MODEL_INDEX; I18n.global.locale.value = persistConfig.LANG; diff --git a/renderer/src/views/about/index.vue b/renderer/src/views/about/index.vue index 3d903b8..bf57222 100644 --- a/renderer/src/views/about/index.vue +++ b/renderer/src/views/about/index.vue @@ -1,8 +1,7 @@