设置的实时

src/shared/composables/configUpdate.ts

@@ -0,0 +1,44 @@
+import { useConfigStore } from "shared/store/config"
+import { useConfigWebSocket, type ConfigUpdate } from "shared/composables/websocket"
+
+export function useConfigUpdate() {
+  const configStore = useConfigStore()
+  
+  // 处理 WebSocket 配置更新
+  const handleConfigUpdate = (data: ConfigUpdate) => {
+    console.log("收到配置更新:", data)
+    
+    // 更新全局配置 - 使用响应式方式
+    if (data.key in configStore.config) {
+      // 直接修改 ref 的值来触发响应式更新
+      (configStore.config as any)[data.key] = data.value
+      console.log(`配置 ${data.key} 已更新为:`, data.value)
+    }
+  }
+  
+  // 初始化 WebSocket - handler 会在 onMounted 时自动添加
+  const { connect, status } = useConfigWebSocket(handleConfigUpdate)
+  
+  // 连接 WebSocket
+  onMounted(() => {
+    console.log("配置更新 WebSocket 正在连接...")
+    connect()
+    
+    // 测试连接 - 发送心跳包
+    setTimeout(() => {
+      if (status.value === "connected") {
+        console.log("配置更新 WebSocket 连接成功，发送测试消息...")
+        // 这里可以发送一个测试消息
+      }
+    }, 2000)
+  })
+  
+  // 监听连接状态
+  watch(status, (newStatus) => {
+    console.log("配置更新 WebSocket 状态:", newStatus)
+  })
+
+  return {
+    connect
+  }
+}

src/shared/composables/maxkb.ts

@@ -0,0 +1,89 @@
+import { useConfigStore } from "shared/store/config"
+import { useConfigWebSocket, type ConfigUpdate } from "shared/composables/websocket"
+
+export function useMaxKB() {
+  const configStore = useConfigStore()
+  const isLoaded = ref(false)
+  
+  // 处理 WebSocket 配置更新 - 只处理 MaxKB 相关
+  const handleConfigUpdate = (data: ConfigUpdate) => {
+    console.log("MaxKB 收到配置更新:", data)
+    if (data.key === 'enable_maxkb') {
+      if (data.value) {
+        loadMaxKBScript()
+      } else {
+        removeMaxKBScript()
+      }
+    }
+  }
+  
+  // 初始化 WebSocket
+  const { connect } = useConfigWebSocket(handleConfigUpdate)
+
+  const loadMaxKBScript = () => {
+    const { enable_maxkb } = configStore.config
+
+    if (!enable_maxkb) {
+      return
+    }
+
+    const existingScript = document.querySelector(`script[src="${import.meta.env.PUBLIC_MAXKB_URL}"]`)
+    if (existingScript) {
+      isLoaded.value = true
+      return
+    }
+
+    // 创建并插入脚本标签
+    const script = document.createElement("script")
+    script.src = import.meta.env.PUBLIC_MAXKB_URL
+    script.async = true
+    script.defer = true
+    
+    script.onload = () => {
+      isLoaded.value = true
+      console.log("MaxKB script loaded successfully")
+    }
+    
+    script.onerror = () => {
+      console.error("Failed to load MaxKB script")
+    }
+
+    document.head.appendChild(script)
+  }
+
+  const removeMaxKBScript = () => {
+    isLoaded.value = false
+    const maxkbChatButton = document.getElementById("maxkb-chat-button")
+    const maxkbChatContainer = document.getElementById("maxkb-chat-container")
+    if (maxkbChatButton) {
+      maxkbChatButton.remove()
+    }
+    if (maxkbChatContainer) {
+      maxkbChatContainer.remove()
+    }
+  }
+
+  // 连接 WebSocket
+  onMounted(() => {
+    connect()
+  })
+
+  watch(
+    () => configStore.config.enable_maxkb,
+    (newValue) => {
+      if (newValue) {
+        loadMaxKBScript()
+      } else {
+        console.log("removeMaxKBScript")
+        removeMaxKBScript()
+      }
+    },
+    { immediate: true }
+  )
+
+  return {
+    loadMaxKBScript,
+    removeMaxKBScript,
+    isLoaded: readonly(isLoaded)
+  }
+}

src/shared/composables/websocket.ts

@@ -410,3 +410,63 @@ export function createWebSocketComposable<T extends WebSocketMessage>(
     removeHandler: (h: MessageHandler<T>) => ws.removeHandler(h),
   }
 }
+
+/**
+ * 配置更新消息类型
+ */
+export interface ConfigUpdate extends WebSocketMessage {
+  type: "config_update"
+  key: string
+  value: any
+}
+
+/**
+ * 配置 WebSocket 连接管理类
+ */
+class ConfigWebSocket extends BaseWebSocket<ConfigUpdate> {
+  constructor() {
+    super({
+      path: "config",
+    })
+  }
+
+  /**
+   * 发送配置更新
+   */
+  updateConfig(key: string, value: any) {
+    this.send({
+      type: "config_update",
+      key,
+      value,
+    })
+  }
+}
+
+/**
+ * 用于组件中使用配置 WebSocket 的 Composable
+ */
+export function useConfigWebSocket(handler?: MessageHandler<ConfigUpdate>) {
+  const ws = new ConfigWebSocket()
+
+  onMounted(() => {
+    if (handler) {
+      ws.addHandler(handler)
+    }
+  })
+
+  onUnmounted(() => {
+    if (handler) {
+      ws.removeHandler(handler)
+    }
+    ws.disconnect()
+  })
+
+  return {
+    connect: () => ws.connect(),
+    disconnect: () => ws.disconnect(),
+    updateConfig: (key: string, value: any) => ws.updateConfig(key, value),
+    status: ws.status,
+    addHandler: (h: MessageHandler<ConfigUpdate>) => ws.addHandler(h),
+    removeHandler: (h: MessageHandler<ConfigUpdate>) => ws.removeHandler(h),
+  }
+}