feat: Agent CLI 与终端审计回放全面优化

- Agent CLI: 多轮对话、SSH 长连接、流式推理、Evolver 按用户隔离、历史侧栏
- 终端审计: 回放播放器、命令书签、筛选分页导出、命令输出统计、录制落盘修复
- 修复 session_commands 表迁移、Kill 竞态导致录制丢失、无录制会话回放提示
- 审计历史页只读（移除删除），移除回放弹框录制搜索

frontend/src/pages/audit/terminal-audit/HistorySessionsPanel.tsx

@@ -1,158 +1,194 @@
-// 终端审计 — 历史会话子面板 // Logan.Li
+// 终端审计 — 历史会话子面板（筛选 / 分页 / 回放 / 导出，只读无删除） // Logan.Li
 
-import { useState } from 'react';
+import { useState, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Card, CardContent } from '@/components/ui/card';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
+  Table, TableBody, TableCell, TableHead, TableHeader, TableRow,
 } from '@/components/ui/table';
-import { Search, RefreshCw, Play, Download, Monitor } from 'lucide-react';
-import { terminalSessionApi } from '@/api';
+import { Search, RefreshCw, Play, Download, Monitor, FileText, ChevronLeft, ChevronRight } from 'lucide-react';
+import { terminalSessionApi, sessionCommandApi } from '@/api';
 import { ReplayDialog } from '@/components/system/ReplayDialog';
 import { useTerminalSessions } from '@/hooks/api';
-import { formatDuration, getStatusBadge } from './helpers';
+import { unwrapList } from '@/hooks/api/unwrap';
+import { toast } from 'sonner';
+import { formatDuration, formatSize, getStatusBadge, presetAuditRange } from './helpers';
+import { buildCommandBookmarks } from '@/components/system/replay/replay-utils';
+import { exportAuditReportCsv } from '@/components/system/replay/export-audit';
+import type { ReplaySessionMeta } from '@/components/system/replay/replay-utils';
+
+const PAGE_SIZE = 20;
 
 export function HistorySessionsPanel() {
   const { t } = useTranslation();
-  const { data: sessions = [], isLoading, refetch } = useTerminalSessions({
-    page: 1,
-    page_size: 100,
-    status: 'closed',
+
+  const [page, setPage] = useState(1);
+  const [keyword, setKeyword] = useState('');
+  const [username, setUsername] = useState('');
+  const [startDate, setStartDate] = useState('');
+  const [endDate, setEndDate] = useState('');
+  const [hasRecordOnly, setHasRecordOnly] = useState(false);
+
+  const [applied, setApplied] = useState({
+    keyword: '', username: '', startDate: '', endDate: '', hasRecordOnly: false,
   });
 
-  const [keyword, setKeyword] = useState('');
+  const queryParams = useMemo(() => ({
+    page,
+    page_size: PAGE_SIZE,
+    status: 'closed',
+    ...(applied.keyword ? { keyword: applied.keyword } : {}),
+    ...(applied.username ? { username: applied.username } : {}),
+    ...(applied.startDate ? { start_date: applied.startDate } : {}),
+    ...(applied.endDate ? { end_date: applied.endDate } : {}),
+    ...(applied.hasRecordOnly ? { has_record: '1' } : {}),
+  }), [page, applied]);
+
+  const { data, isLoading, refetch } = useTerminalSessions(queryParams);
+  const sessions = data?.list ?? [];
+  const total = data?.total ?? 0;
+  const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
+
   const [replayId, setReplayId] = useState<number | null>(null);
   const [replayOpen, setReplayOpen] = useState(false);
 
-  const filtered = sessions.filter((s) => {
-    const kw = keyword.toLowerCase();
-    return (
-      !kw ||
-      (s.username || '').toLowerCase().includes(kw) ||
-      (s.server_name || '').toLowerCase().includes(kw) ||
-      (s.server_ip || '').toLowerCase().includes(kw)
-    );
-  });
+  const applyFilters = () => {
+    setApplied({ keyword, username, startDate, endDate, hasRecordOnly });
+    setPage(1);
+  };
 
   const openReplay = (id: number) => {
     setReplayId(id);
     setReplayOpen(true);
   };
 
-  const handleDownload = async (id: number) => {
+  const handleDownload = (id: number) => {
+    terminalSessionApi.download(id).catch(() => toast.error(t('audit.terminal.exportFailed')));
+  };
+
+  // 导出审计报告：命令列表失败时仍导出会话元信息 // Logan.Li
+  const handleExportReport = async (id: number) => {
     try {
-      await terminalSessionApi.download(id);
+      const sess = await terminalSessionApi.get(id);
+      const meta = sess as ReplaySessionMeta;
+      let cmdList: { id: number; command: string; timestamp?: string; created_at?: string }[] = [];
+      try {
+        const cmds = await sessionCommandApi.list({ session_id: id, page: 1, page_size: 500 });
+        cmdList = unwrapList(cmds);
+      } catch {
+        /* 无命令表数据时仅导出会话信息 */
+      }
+      const duration = meta.duration || 0;
+      const bookmarks = buildCommandBookmarks(cmdList, meta.start_time, duration);
+      exportAuditReportCsv({ ...meta, id }, bookmarks);
+      toast.success(t('audit.terminal.exportReport'));
     } catch {
-      // download error is handled in http.download
+      toast.error(t('audit.terminal.exportFailed'));
     }
   };
 
   return (
     <>
-      <div className="flex items-center gap-3 flex-wrap">
-        <div className="relative w-64">
-          <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-slate-500" />
+      <div className="flex flex-col gap-3">
+        <div className="flex items-center gap-2 flex-wrap">
+          <div className="relative w-52">
+            <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-slate-500" />
+            <Input
+              placeholder={t('audit.terminal.searchUserServerIp')}
+              value={keyword}
+              onChange={(e) => setKeyword(e.target.value)}
+              onKeyDown={(e) => e.key === 'Enter' && applyFilters()}
+              className="pl-9 h-9 bg-slate-800/50 border-slate-700 text-slate-200"
+            />
+          </div>
           <Input
-            placeholder={t('audit.terminal.searchUserServerIp')}
-            value={keyword}
-            onChange={(e) => setKeyword(e.target.value)}
-            className="pl-9 h-9 bg-slate-800/50 border-slate-700 text-slate-200 placeholder:text-slate-500"
+            placeholder={t('audit.terminal.filterUsername')}
+            value={username}
+            onChange={(e) => setUsername(e.target.value)}
+            onKeyDown={(e) => e.key === 'Enter' && applyFilters()}
+            className="w-32 h-9 bg-slate-800/50 border-slate-700 text-slate-200"
           />
+          <Input type="date" value={startDate} onChange={(e) => setStartDate(e.target.value)} className="w-36 h-9 bg-slate-800/50 border-slate-700 text-slate-200" />
+          <span className="text-slate-600 text-sm">—</span>
+          <Input type="date" value={endDate} onChange={(e) => setEndDate(e.target.value)} className="w-36 h-9 bg-slate-800/50 border-slate-700 text-slate-200" />
+          <Button variant="outline" size="sm" className="border-slate-700 text-slate-400 h-9" onClick={() => { const r = presetAuditRange(1); setStartDate(r.start); setEndDate(r.end); }}>
+            {t('audit.terminal.presetToday')}
+          </Button>
+          <Button variant="outline" size="sm" className="border-slate-700 text-slate-400 h-9" onClick={() => { const r = presetAuditRange(7); setStartDate(r.start); setEndDate(r.end); }}>
+            {t('audit.terminal.preset7d')}
+          </Button>
+          <Button variant="outline" size="sm" className="border-slate-700 text-slate-400 h-9" onClick={() => { const r = presetAuditRange(30); setStartDate(r.start); setEndDate(r.end); }}>
+            {t('audit.terminal.preset30d')}
+          </Button>
+          <label className="flex items-center gap-1.5 text-xs text-slate-400 cursor-pointer">
+            <input type="checkbox" checked={hasRecordOnly} onChange={(e) => setHasRecordOnly(e.target.checked)} className="rounded" />
+            {t('audit.terminal.hasRecordOnly')}
+          </label>
+          <Button size="sm" className="h-9" onClick={applyFilters}>{t('audit.terminal.applyFilter')}</Button>
+          <Button variant="outline" size="sm" className="border-slate-700 text-slate-300 h-9" onClick={() => refetch()}>
+            <RefreshCw className="h-4 w-4 mr-1" />{t('common.refresh')}
+          </Button>
         </div>
-        <Button
-          variant="outline"
-          className="border-slate-700 text-slate-300 hover:text-slate-100 hover:bg-slate-800"
-          onClick={() => refetch()}
-        >
-          <RefreshCw className="h-4 w-4 mr-2" />
-          {t('common.refresh')}
-        </Button>
       </div>
 
       <Card className="bg-slate-900 border-slate-800">
         <CardContent className="p-0">
-          <div className="border-t border-slate-800">
-            {isLoading ? (
-              <div className="flex items-center justify-center py-16">
-                <div className="w-8 h-8 border-2 border-blue-500 border-t-transparent rounded-full animate-spin" />
-              </div>
-            ) : filtered.length === 0 ? (
-              <div className="flex flex-col items-center justify-center py-16 text-slate-500">
-                <Monitor className="h-8 w-8 mb-3 opacity-40" />
-                <p className="text-sm">{t('audit.terminal.noHistory')}</p>
-              </div>
-            ) : (
+          {isLoading ? (
+            <div className="flex items-center justify-center py-16">
+              <div className="w-8 h-8 border-2 border-blue-500 border-t-transparent rounded-full animate-spin" />
+            </div>
+          ) : sessions.length === 0 ? (
+            <div className="flex flex-col items-center justify-center py-16 text-slate-500">
+              <Monitor className="h-8 w-8 mb-3 opacity-40" />
+              <p className="text-sm">{t('audit.terminal.noHistory')}</p>
+            </div>
+          ) : (
+            <>
               <Table>
                 <TableHeader>
                   <TableRow className="border-slate-800 hover:bg-transparent">
                     <TableHead className="text-slate-400">{t('audit.terminal.col.id')}</TableHead>
                     <TableHead className="text-slate-400">{t('audit.terminal.col.user')}</TableHead>
                     <TableHead className="text-slate-400">{t('audit.terminal.col.targetServer')}</TableHead>
-                    <TableHead className="text-slate-400">{t('audit.terminal.col.port')}</TableHead>
                     <TableHead className="text-slate-400">{t('audit.terminal.col.startTime')}</TableHead>
-                    <TableHead className="text-slate-400">{t('audit.terminal.col.endTime')}</TableHead>
                     <TableHead className="text-slate-400">{t('audit.terminal.col.duration')}</TableHead>
+                    <TableHead className="text-slate-400">{t('audit.terminal.col.recordSize')}</TableHead>
                     <TableHead className="text-slate-400">{t('audit.terminal.col.status')}</TableHead>
                     <TableHead className="text-slate-400 text-right">{t('audit.terminal.col.actions')}</TableHead>
                   </TableRow>
                 </TableHeader>
                 <TableBody>
-                  {filtered.map((s) => (
+                  {sessions.map((s) => (
                     <TableRow key={s.id} className="border-slate-800 hover:bg-slate-800/50">
-                      <TableCell>
-                        <span className="text-sm text-slate-400">{s.id}</span>
-                      </TableCell>
-                      <TableCell>
-                        <span className="text-sm text-slate-200">{s.username || '--'}</span>
-                      </TableCell>
+                      <TableCell><span className="text-sm text-slate-400">{s.id}</span></TableCell>
+                      <TableCell><span className="text-sm text-slate-200">{s.username || '--'}</span></TableCell>
                       <TableCell>
                         <div className="flex flex-col">
                           <span className="text-sm text-slate-200">{s.server_name || '--'}</span>
                           <span className="text-xs text-slate-500">{s.server_ip}</span>
                         </div>
                       </TableCell>
-                      <TableCell>
-                        <span className="text-sm text-slate-400">{s.server_port}</span>
-                      </TableCell>
                       <TableCell>
                         <span className="text-sm text-slate-400">
                           {s.start_time ? new Date(s.start_time).toLocaleString() : '--'}
                         </span>
                       </TableCell>
+                      <TableCell><span className="text-sm text-slate-300">{formatDuration(s.duration)}</span></TableCell>
                       <TableCell>
-                        <span className="text-sm text-slate-400">
-                          {s.end_time ? new Date(s.end_time).toLocaleString() : '--'}
-                        </span>
-                      </TableCell>
-                      <TableCell>
-                        <span className="text-sm text-slate-300">{formatDuration(s.duration)}</span>
+                        <span className="text-sm text-slate-400">{s.record_size > 0 ? formatSize(s.record_size) : '--'}</span>
                       </TableCell>
                       <TableCell>{getStatusBadge(s.status)}</TableCell>
                       <TableCell>
-                        <div className="flex items-center justify-end gap-1">
-                          <Button
-                            variant="ghost"
-                            size="icon"
-                            className="h-8 w-8 text-slate-400 hover:text-blue-400 hover:bg-slate-800"
-                            onClick={() => openReplay(s.id)}
-                            title={t('audit.terminal.replay')}
-                          >
+                        <div className="flex items-center justify-end gap-0.5">
+                          <Button variant="ghost" size="icon" className="h-8 w-8 text-slate-400 hover:text-blue-400" onClick={() => openReplay(s.id)} disabled={!s.record_size} title={t('audit.terminal.replay')}>
                             <Play className="h-4 w-4" />
                           </Button>
-                          <Button
-                            variant="ghost"
-                            size="icon"
-                            className="h-8 w-8 text-slate-400 hover:text-green-400 hover:bg-slate-800"
-                            onClick={() => handleDownload(s.id)}
-                            title={t('audit.terminal.downloadRecord')}
-                          >
+                          <Button variant="ghost" size="icon" className="h-8 w-8 text-slate-400 hover:text-amber-400" onClick={() => handleExportReport(s.id)} title={t('audit.terminal.exportReport')}>
+                            <FileText className="h-4 w-4" />
+                          </Button>
+                          <Button variant="ghost" size="icon" className="h-8 w-8 text-slate-400 hover:text-green-400" onClick={() => handleDownload(s.id)} disabled={!s.record_size} title={t('audit.terminal.downloadRecord')}>
                             <Download className="h-4 w-4" />
                           </Button>
                         </div>
@@ -161,12 +197,24 @@ export function HistorySessionsPanel() {
                   ))}
                 </TableBody>
               </Table>
-            )}
-          </div>
+              <div className="flex items-center justify-between px-4 py-3 border-t border-slate-800">
+                <span className="text-xs text-slate-500">{t('audit.terminal.totalSessions', { count: total })}</span>
+                <div className="flex items-center gap-2">
+                  <Button variant="ghost" size="icon" className="h-8 w-8" disabled={page <= 1} onClick={() => setPage((p) => p - 1)}>
+                    <ChevronLeft className="h-4 w-4" />
+                  </Button>
+                  <span className="text-xs text-slate-400">{page} / {totalPages}</span>
+                  <Button variant="ghost" size="icon" className="h-8 w-8" disabled={page >= totalPages} onClick={() => setPage((p) => p + 1)}>
+                    <ChevronRight className="h-4 w-4" />
+                  </Button>
+                </div>
+              </div>
+            </>
+          )}
         </CardContent>
       </Card>
 
       <ReplayDialog open={replayOpen} onOpenChange={setReplayOpen} sessionId={replayId} />
     </>
   );
-}
+}