feat: 实时日志面板增加日志等级选择器

- 4级过滤：错误/警告+/成功+/全部
- inline模式和card模式均支持
- 点击Select时不触发折叠事件（stopPropagation）
- 条数统计仍显示全部日志数（不过滤）

web/frontend/src/components/RealtimeLogPanel.tsx

@@ -1,8 +1,25 @@
-import { useEffect, useRef, useState, type CSSProperties, type ReactNode } from 'react';
-import { Card, Spin, Tag, theme } from 'antd';
+import { useEffect, useMemo, useRef, useState, type CSSProperties, type ReactNode } from 'react';
+import { Card, Select, Spin, Tag, theme } from 'antd';
 import { DownOutlined, UpOutlined } from '@ant-design/icons';
 import type { RealtimeLog } from '../hooks/useWebSocketLogs';
 
+/** 日志等级定义：value 越小越严格（只显示该等级及以上） */
+const LOG_LEVELS = [
+  { value: 0, label: '错误', key: 'error' },
+  { value: 1, label: '警告+', key: 'warning' },
+  { value: 2, label: '成功+', key: 'success' },
+  { value: 3, label: '全部', key: 'info' },
+] as const;
+
+/** 等级权重映射 */
+const LEVEL_WEIGHT: Record<string, number> = {
+  error: 0,
+  warning: 1,
+  success: 2,
+  info: 3,
+  debug: 4,
+};
+
 interface RealtimeLogPanelProps {
   logs: RealtimeLog[];
   connected?: boolean;
@@ -32,13 +49,20 @@ export default function RealtimeLogPanel({
 }: RealtimeLogPanelProps) {
   const { token } = theme.useToken();
   const [visible, setVisible] = useState(defaultVisible);
+  const [levelFilter, setLevelFilter] = useState<number>(3); // 默认：全部
   const endRef = useRef<HTMLDivElement | null>(null);
 
+  // 按等级过滤日志
+  const filteredLogs = useMemo(() => {
+    if (levelFilter >= 3) return logs;
+    return logs.filter((log) => (LEVEL_WEIGHT[log.level] ?? 3) <= levelFilter);
+  }, [logs, levelFilter]);
+
   useEffect(() => {
     if (visible) {
       endRef.current?.scrollIntoView({ behavior: 'smooth' });
     }
-  }, [logs, visible]);
+  }, [filteredLogs, visible]);
 
   const logColors: Record<string, string> = {
     error: token.colorError,
@@ -60,14 +84,14 @@ export default function RealtimeLogPanel({
         ...bodyStyle,
       }}
     >
-      {logs.length === 0 ? (
+      {filteredLogs.length === 0 ? (
         spinWhenEmpty && connected ? (
           <Spin spinning size="small" />
         ) : (
           <span style={{ color: token.colorTextTertiary }}>{emptyText}</span>
         )
       ) : (
-        logs.map((log, index) => (
+        filteredLogs.map((log, index) => (
           <div
             key={`${index}-${log.message}`}
             style={{ color: logColors[log.level] || token.colorText, lineHeight: '20px' }}
@@ -85,6 +109,16 @@ export default function RealtimeLogPanel({
       <Card
         title={title}
         size="small"
+        extra={
+          <Select
+            size="small"
+            value={levelFilter}
+            onChange={setLevelFilter}
+            options={LOG_LEVELS.map((l) => ({ value: l.value, label: l.label }))}
+            style={{ width: 80 }}
+            popupMatchSelectWidth={false}
+          />
+        }
         style={{ flex: 1, overflow: 'hidden', ...style }}
         styles={{ body: { height: '100%', overflow: 'hidden', padding: 0 } }}
       >
@@ -100,6 +134,15 @@ export default function RealtimeLogPanel({
         onClick={() => collapsible && setVisible((value) => !value)}
       >
         <span style={{ fontWeight: 500, fontSize: 13 }}>{title}</span>
+        <Select
+          size="small"
+          value={levelFilter}
+          onChange={setLevelFilter}
+          options={LOG_LEVELS.map((l) => ({ value: l.value, label: l.label }))}
+          style={{ marginLeft: 8, width: 80 }}
+          popupMatchSelectWidth={false}
+          onClick={(e) => e.stopPropagation()}
+        />
         {collapsible && (
           visible ? <UpOutlined style={{ marginLeft: 6, fontSize: 10 }} /> : <DownOutlined style={{ marginLeft: 6, fontSize: 10 }} />
         )}