perf: add lion connector

Author: ibuler

.env.development

@@ -7,5 +7,5 @@ VITE_KOKO_HOST = 'http://localhost:5050'
 # VITE_CHEN_WS = 'ws://localhost:9523'
 # VITE_CHEN_HOST = 'http://localhost:9523'
 
-# VITE_LION_WS = 'ws://localhost:9529'
-# VITE_LION_HOST = 'http://localhost:9529'
+# VITE_LION_WS = 'ws://localhost:8081'
+# VITE_LION_HOST = 'http://localhost:8081'

.pnpm-store/v11/index.db

@@ -1,6 +1,6 @@
 const jumpServerTarget = process.env.JMS_CORE_DEV_URL || "http://localhost:8080";
 const kokoTarget = process.env.JMS_KOKO_DEV_URL || "http://localhost:5050";
-const lionTarget = process.env.JMS_LION_DEV_URL || "http://localhost:9529";
+const lionTarget = process.env.JMS_LION_DEV_URL || "http://localhost:8081";
 const chenTarget = process.env.JMS_CHEN_DEV_URL || "http://localhost:9523";
 const faceliveTarget = process.env.JMS_FACELIVE_DEV_URL || "http://localhost:5173";
 const kaelTarget = process.env.JMS_KAEL_DEV_URL || "http://localhost:5172";
@@ -162,12 +162,35 @@ export default defineNuxtConfig({
           changeOrigin: true,
           configure: rewriteProxyOrigin(jumpServerTarget)
         },
-        "/lion": {
+        "/luna/lion/ws/": {
+          target: lionTarget.replace(/^http/i, "ws"),
+          secure: false,
+          ws: true,
+          changeOrigin: true,
+          rewrite: (path) => path.replace(/^\/luna/, ""),
+          configure: bindProxyErrorHandler("luna-lion-ws")
+        },
+        "/luna/lion/": {
+          target: lionTarget,
+          secure: false,
+          ws: true,
+          changeOrigin: true,
+          rewrite: (path) => path.replace(/^\/luna/, ""),
+          configure: bindProxyErrorHandler("luna-lion-http")
+        },
+        "/lion/ws/": {
+          target: lionTarget.replace(/^http/i, "ws"),
+          secure: false,
+          ws: true,
+          changeOrigin: true,
+          configure: bindProxyErrorHandler("lion-ws")
+        },
+        "/lion/": {
           target: lionTarget,
           secure: false,
           ws: true,
           changeOrigin: true,
-          rewrite: (path) => path.replace(/^\/lion\/monitor/, "/monitor")
+          configure: bindProxyErrorHandler("lion-http")
         },
         "/chen": {
           target: chenTarget,

nuxt.config.ts

@@ -78,6 +78,7 @@
     "fflate": "^0.8.2",
     "guacamole-common-js-jumpserver": "1.1.0-c",
     "js-untar": "^2.0.0",
+    "lucide-vue-next": "^0.525.0",
     "mitt": "^3.0.1",
     "nora-zmodemjs": "^1.1.1",
     "nuxt": "^4.4.6",

package.json

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+import { message as lionMessages } from "@/lion/locales/modules";
+import { LanguageCode } from "@/lion/utils/config";
+import { withBasePath } from "@/lion/utils/base";
+
+import "@/lion/styles/base.css";
+
+const { mergeLocaleMessage } = useI18n();
+
+const loaded = ref(false);
+const normalizedLangCode = LanguageCode.toLowerCase();
+
+onMounted(async () => {
+  for (const [code, value] of Object.entries(lionMessages)) {
+    mergeLocaleMessage(code, value);
+  }
+
+  try {
+    const response = await fetch(`${withBasePath("/api/v1/settings/i18n/lion/")}?lang=${encodeURIComponent(normalizedLangCode)}&flat=0`, {
+      credentials: "include"
+    });
+
+    if (response.ok) {
+      const translations = await response.json();
+      for (const [key, value] of Object.entries(translations)) {
+        mergeLocaleMessage(key, value as Record<string, any>);
+      }
+    }
+  } catch (error) {
+    console.error("load lion i18n failed", error);
+  } finally {
+    loaded.value = true;
+  }
+});
+</script>
+
+<template>
+  <div v-if="loaded" class="h-full w-full overflow-hidden">
+    <slot />
+  </div>
+</template>

pnpm-lock.yaml

@@ -1,7 +1,7 @@
 import type { UnlistenFn } from "@tauri-apps/api/event";
 import type { AssetItem, ConnectionBody, PermedAccount, PermedProtocol, TokenResponse } from "~/types";
 
-import { K8S_NATIVE_VALUE, SFTP_FILE_EDITOR_VALUE, SFTP_FILE_MANAGER_VALUE } from "~/composables/useConnectMethods";
+import { K8S_NATIVE_VALUE, SFTP_FILE_EDITOR_VALUE, SFTP_FILE_MANAGER_VALUE, WEB_RDP_NATIVE_VALUE } from "~/composables/useConnectMethods";
 import { useSettingManager } from "~/composables/useSettingManager";
 import { useUserInfoStore } from "~/store/modules/userInfo";
 
@@ -25,9 +25,10 @@ let unlistenBuiltinSessionFailure: UnlistenFn | null = null;
 const BUILTIN_CLIENT_METHOD = "builtin_client";
 // 内置 Koko 界面，见 useConnectMethods 注入
 const WEB_CLI_NATIVE_METHOD = "web_cli_native";
-const NATIVE_KOKO_METHODS = new Set([
+const NATIVE_WORKSPACE_METHODS = new Set([
   BUILTIN_CLIENT_METHOD,
   WEB_CLI_NATIVE_METHOD,
+  WEB_RDP_NATIVE_VALUE,
   SFTP_FILE_MANAGER_VALUE,
   SFTP_FILE_EDITOR_VALUE,
   K8S_NATIVE_VALUE
@@ -397,15 +398,22 @@ export const useAssetAction = () => {
   };
 
   const resolveServerConnectMethod = async (body: ConnectionBody) => {
-    // 服务端不认识本地注入的 method（builtin_client / web_cli_native），换成真实 koko web method
-    if (!NATIVE_KOKO_METHODS.has(body.connect_method)) return body.connect_method;
+    // 服务端不认识本地注入的 method（builtin_client / web_cli_native / web_rdp_native），换成真实 web method
+    if (!NATIVE_WORKSPACE_METHODS.has(body.connect_method)) return body.connect_method;
 
     try {
       const allMethods = await fetchConnectMethods();
       const methods = allMethods[body.protocol] || [];
       const injected = methods.find((item) => item.value === body.connect_method);
       if (injected?.origin_value) return injected.origin_value;
 
+      if (body.connect_method === WEB_RDP_NATIVE_VALUE) {
+        const lionWeb = methods.find(
+          (item) => item.type === "web" && ["lion", "tinker"].includes(item.component) && !item.origin_value
+        );
+        if (lionWeb) return lionWeb.value;
+      }
+
       const kokoWeb = methods.find(
         (item) => item.type === "web" && ["koko", "default"].includes(item.component) && !item.origin_value
       );
@@ -415,6 +423,11 @@ export const useAssetAction = () => {
     return body.connect_method;
   };
 
+  const resolveBuiltinComponent = (body: ConnectionBody) => {
+    if (body.connect_method === WEB_RDP_NATIVE_VALUE) return "lion";
+    return "koko";
+  };
+
   const getBuiltinConnectSession = (
     body: ConnectionBody,
     meta: {
@@ -441,7 +454,7 @@ export const useAssetAction = () => {
           const payload = {
             token,
             ...token,
-            connectMethod: { value: body.connect_method, component: "koko" }
+            connectMethod: { value: body.connect_method, component: resolveBuiltinComponent(body) }
           };
           if (meta.onSessionReady) meta.onSessionReady(payload);
           else updateSessionPayload(meta, payload);
@@ -675,11 +688,11 @@ export const useAssetAction = () => {
       let tabId = ephemeral?.tabId;
 
       // ponytail: 有 onSessionReady 时由调用方内嵌展示（如右侧 SFTP），不新开 workspace tab
-      if (!tabId && ephemeral?.asset && NATIVE_KOKO_METHODS.has(connectMethod) && !ephemeral?.onSessionReady) {
+      if (!tabId && ephemeral?.asset && NATIVE_WORKSPACE_METHODS.has(connectMethod) && !ephemeral?.onSessionReady) {
         tabId = openSession(ephemeral.asset, { protocol, account }).id;
       }
 
-      if (NATIVE_KOKO_METHODS.has(connectMethod)) {
+      if (NATIVE_WORKSPACE_METHODS.has(connectMethod)) {
         getBuiltinConnectSession(connectionBody, {
           tabId,
           assetId,

ui/components/lion/LionProvider.vue

@@ -8,7 +8,8 @@ export {
   K8S_NATIVE_VALUE,
   SFTP_FILE_EDITOR_VALUE,
   SFTP_FILE_MANAGER_VALUE,
-  WEB_CLI_NATIVE_VALUE
+  WEB_CLI_NATIVE_VALUE,
+  WEB_RDP_NATIVE_VALUE
 } from "~/shared/connectors/capabilities";
 
 interface ConnectMethod {
@@ -69,6 +70,28 @@ const normalizeWebConnectMethods = (methods: ConnectMethodsResponse): ConnectMet
       }
     }
 
+    const lionWebIndex = renamed.findIndex(
+      (method) => method.type === "web" && ["lion", "tinker"].includes(method.component)
+    );
+
+    if (lionWebIndex !== -1) {
+      const origin = renamed[lionWebIndex]!;
+      const declaredMethods = COMPONENT_WORKSPACE_CAPABILITIES
+        .filter((item) => item.component === "lion" && item.protocols.includes(key))
+        .flatMap((item) =>
+          item.connectMethods.map((methodValue) => ({
+            ...origin,
+            value: methodValue,
+            label: item.label,
+            origin_value: origin.value
+          }) as ConnectMethod)
+        );
+
+      if (declaredMethods.length) {
+        renamed.splice(lionWebIndex, 1, ...declaredMethods);
+      }
+    }
+
     normalized[key] = renamed;
   });
 

ui/composables/useAssetAction.ts

@@ -0,0 +1,5 @@
+<template>
+  <LionProvider>
+    <slot />
+  </LionProvider>
+</template>

ui/composables/useConnectMethods.ts

@@ -1 +1,10 @@
-# Lion connector (Phase 3)
+# Lion connector
+
+Lion 是 RDP/VNC 远程桌面 connector，结构与 koko 对齐：
+
+- `views/` — 独立页面（`/lion/connect`、`/lion/share`、`/lion/monitor`）
+- `workspaces/` — 内嵌到 Luna workspace 的 session surface
+- `shared/connectors/capabilities.ts` — 声明 `web_rdp_native` 连接方式
+- `shared/connectors/registry.ts` — 解析到 `RemoteSessionSurface.vue`
+
+开发代理见根目录 `nuxt.config.ts`：`/lion/`、`/lion/ws/` 转发到 `localhost:8081`。API/WS 固定走站点根路径 `/lion/*`（不带 `/luna` 前缀）。