refactor(web): 前端代码规范化重构

- 集中化 HID 类型定义到 types/hid.ts，消除重复代码
- 统一 WebSocket 连接管理，提取共享工具到 types/websocket.ts
- 拆分 ConsoleView.vue 关注点，创建 useVideoStream、useHidInput、useConsoleEvents composables
- 添加 useConfigPopover 抽象配置弹窗公共逻辑
- 优化视频容器布局，支持动态比例自适应

web/src/composables/useConfigPopover.ts

@@ -0,0 +1,73 @@
+// Config popover composable - shared logic for config popover components
+// Provides common state management and lifecycle hooks
+
+import { ref, watch, type Ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { toast } from 'vue-sonner'
+
+export interface UseConfigPopoverOptions {
+  /** Reactive open state from props */
+  open: Ref<boolean>
+  /** Load device list callback */
+  loadDevices?: () => Promise<void>
+  /** Initialize from current config callback */
+  initializeFromCurrent?: () => void
+}
+
+export function useConfigPopover(options: UseConfigPopoverOptions) {
+  const { t } = useI18n()
+
+  // Common state
+  const applying = ref(false)
+  const loadingDevices = ref(false)
+
+  // Watch open state to initialize
+  watch(options.open, async (isOpen) => {
+    if (isOpen) {
+      options.initializeFromCurrent?.()
+      if (options.loadDevices) {
+        loadingDevices.value = true
+        try {
+          await options.loadDevices()
+        } finally {
+          loadingDevices.value = false
+        }
+      }
+    }
+  })
+
+  // Apply config wrapper with loading state and toast
+  async function applyConfig(applyFn: () => Promise<void>) {
+    applying.value = true
+    try {
+      await applyFn()
+      toast.success(t('config.applied'))
+    } catch (e) {
+      console.info('[ConfigPopover] Apply failed:', e)
+      // Error toast is usually shown by API layer
+    } finally {
+      applying.value = false
+    }
+  }
+
+  // Refresh devices
+  async function refreshDevices() {
+    if (!options.loadDevices) return
+    loadingDevices.value = true
+    try {
+      await options.loadDevices()
+    } finally {
+      loadingDevices.value = false
+    }
+  }
+
+  return {
+    // State
+    applying,
+    loadingDevices,
+
+    // Methods
+    applyConfig,
+    refreshDevices,
+  }
+}