From d8ad529f9de06932e16a76fe57c1e053ab21097e Mon Sep 17 00:00:00 2001 From: rick Date: Wed, 6 Aug 2025 08:24:43 +0800 Subject: [PATCH 01/10] add ui extension point --- cmd/server.go | 9 +- console/atest-ui/src/App.vue | 61 +- console/atest-ui/src/views/Extension.vue | 49 + console/atest-ui/src/views/net.ts | 29 +- pkg/server/demo.css | 1 + pkg/server/demo.umd.js | 20 + pkg/server/remote_server.go | 43 + pkg/server/server.pb.go | 2560 ++++++++++++---------- pkg/server/server.pb.gw.go | 329 +++ pkg/server/server.proto | 28 + pkg/server/server_grpc.pb.go | 158 ++ 11 files changed, 2051 insertions(+), 1236 deletions(-) create mode 100644 console/atest-ui/src/views/Extension.vue create mode 100644 pkg/server/demo.css create mode 100644 pkg/server/demo.umd.js diff --git a/cmd/server.go b/cmd/server.go index 44e6f382..34bee5db 100644 --- a/cmd/server.go +++ b/cmd/server.go @@ -297,6 +297,7 @@ func (o *serverOption) runE(cmd *cobra.Command, args []string) (err error) { server.RegisterMockServer(s, mockServerController) server.RegisterDataServerServer(s, remoteServer.(server.DataServerServer)) server.RegisterThemeExtensionServer(s, remoteServer.(server.ThemeExtensionServer)) + server.RegisterUIExtensionServer(s, remoteServer.(server.UIExtensionServer)) serverLogger.Info("gRPC server listening at", "addr", lis.Addr()) s.Serve(lis) }() @@ -345,7 +346,9 @@ func (o *serverOption) runE(cmd *cobra.Command, args []string) (err error) { server.RegisterRunnerHandlerFromEndpoint(ctx, mux, gRPCServerAddr, opts), server.RegisterMockHandlerFromEndpoint(ctx, mux, gRPCServerAddr, opts), server.RegisterThemeExtensionHandlerFromEndpoint(ctx, mux, gRPCServerAddr, opts), - server.RegisterDataServerHandlerFromEndpoint(ctx, mux, gRPCServerAddr, opts)) + server.RegisterDataServerHandlerFromEndpoint(ctx, mux, gRPCServerAddr, opts), + server.RegisterUIExtensionHandlerFromEndpoint(ctx, mux, gRPCServerAddr, opts), + ) } else { dialOption := []grpc.DialOption{grpc.WithTransportCredentials(insecure.NewCredentials()), grpc.WithDefaultCallOptions(grpc.MaxCallRecvMsgSize(math.MaxInt))} @@ -353,7 +356,9 @@ func (o *serverOption) runE(cmd *cobra.Command, args []string) (err error) { server.RegisterRunnerHandlerFromEndpoint(ctx, mux, gRPCServerAddr, dialOption), server.RegisterMockHandlerFromEndpoint(ctx, mux, gRPCServerAddr, dialOption), server.RegisterThemeExtensionHandlerFromEndpoint(ctx, mux, gRPCServerAddr, dialOption), - server.RegisterDataServerHandlerFromEndpoint(ctx, mux, gRPCServerAddr, dialOption)) + server.RegisterDataServerHandlerFromEndpoint(ctx, mux, gRPCServerAddr, dialOption), + server.RegisterUIExtensionHandlerFromEndpoint(ctx, mux, gRPCServerAddr, dialOption), + ) } if err == nil { diff --git a/console/atest-ui/src/App.vue b/console/atest-ui/src/App.vue index d2d74fa1..f1de17ac 100644 --- a/console/atest-ui/src/App.vue +++ b/console/atest-ui/src/App.vue @@ -20,6 +20,7 @@ import SecretManager from './views/SecretManager.vue' import WelcomePage from './views/WelcomePage.vue' import DataManager from './views/DataManager.vue' import MagicKey from './components/MagicKey.vue' +import Extension from './views/Extension.vue' import { useI18n } from 'vue-i18n' import ElementPlus from 'element-plus'; import zhCn from 'element-plus/dist/locale/zh-cn.mjs' @@ -111,44 +112,20 @@ watch(theme, (e) => { setTheme(e) }) +interface Menu { + name: string + icon: string + index: string +} - const loadPlugin = async (): Promise => { - try { - // 动态加载CSS - const css = document.createElement('link'); - css.rel = 'stylesheet'; - css.href = 'http://localhost:6060/atest-store-orm-ui.css'; - document.head.appendChild(css); - - // 动态加载JS - await new Promise((resolve, reject) => { - const script = document.createElement('script'); - script.src = 'http://localhost:6060/my-plugin.umd.js'; - script.onload = () => resolve(); - script.onerror = (err) => reject(err); - document.head.appendChild(script); - }); - - // 类型安全的插件访问 - const plugin = window.ATestPlugin; - - if (plugin && plugin.mount) { - console.log('插件加载成功'); - plugin.mount('#plugin-container', { - message: '来自宿主的消息' - }); - } - } catch (error) { - console.log(`加载失败: ${(error as Error).message}`) - } finally { - console.log('插件加载完成'); - } - }; - try { - loadPlugin(); - } catch (error) { - console.error('插件加载失败:', error); +const extensionMenus = ref([] as Menu[]); +API.GetMenus((menus) => { + if (menus.data && menus.data.length > 0) { + extensionMenus.value = menus.data; + } else { + console.warn('没有获取到扩展菜单') } +});