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

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

src/video/format.rs

@@ -138,6 +138,34 @@ impl PixelFormat {
         }
     }
 
+    /// Get recommended format for video encoding (WebRTC)
+    ///
+    /// Hardware encoding prefers: NV12 > YUYV
+    /// Software encoding prefers: YUYV > NV12
+    ///
+    /// Returns None if no suitable format is available
+    pub fn recommended_for_encoding(available: &[PixelFormat], is_hardware: bool) -> Option<PixelFormat> {
+        if is_hardware {
+            // Hardware encoding: NV12 > YUYV
+            if available.contains(&PixelFormat::Nv12) {
+                return Some(PixelFormat::Nv12);
+            }
+            if available.contains(&PixelFormat::Yuyv) {
+                return Some(PixelFormat::Yuyv);
+            }
+        } else {
+            // Software encoding: YUYV > NV12
+            if available.contains(&PixelFormat::Yuyv) {
+                return Some(PixelFormat::Yuyv);
+            }
+            if available.contains(&PixelFormat::Nv12) {
+                return Some(PixelFormat::Nv12);
+            }
+        }
+        // Fallback to any non-compressed format
+        available.iter().find(|f| !f.is_compressed()).copied()
+    }
+
     /// Get all supported formats
     pub fn all() -> &'static [PixelFormat] {
         &[