refactor(frontend): api/components/pages 目录架构统一对齐菜单域 + 日志中心修复

1. 目录架构统一（API = components = 菜单域，一域一目录 + barrel） - log/ 提为独立顶层域（日志中心在菜单中与监控中心平级，不再塞在 monitor/） - task/ 拆分原 automation.ts → cron-job / script / remote-exec - aiops/ 合并 ai.ts + agentCli.ts → assistant + agent-cli - agent/ approval/ audit/ 提升为域目录 - auth 拆分：authApi(认证自服务) + system/user.ts(userApi+ldapApi 管理端) - components/automation → components/task，菜单"自动化运维"→"作业任务" - pages/ 按域分子目录(approval/audit/monitor)，删孤儿 AuditPage.tsx - 所有 API 符号名不变，组件经 @/api 聚合引用，运行时行为零变化 2. Loki 查询无返回修复：aiops 容器 DNS 解析外网域名失败（宿主机 systemd-resolved 转发链路异常），docker-compose 显式配 dns 上游 3. ES 查询框布局：工具栏单行挤 7 控件(ES 多 150px 索引框)，拆两行—— 查询输入独占一行(+查询按钮)，次级控件换行 flex-wrap Co-Authored-By: Claude <noreply@anthropic.com>
2026-06-28 06:06:48 +00:00
1 parent da01cbb119
commit c0ee8e4ddd
@@ -0,0 +1,77 @@
+// 双线图表（网卡带宽 rx+tx）// Logan.Li
+import { Network } from 'lucide-react';
+import { Card, CardContent } from '@/components/ui/card';
+import {
+  AreaChart, Area, XAxis, YAxis, CartesianGrid, Tooltip,
+  ResponsiveContainer, Brush,
+} from 'recharts';
+import type { AggType, BucketPoint } from './types';
+
+interface DualLineChartProps {
+  title: string;
+  currentRx: string;
+  currentTx: string;
+  rxData: BucketPoint[];
+  txData: BucketPoint[];
+  aggType: AggType;
+  unit: string;
+}
+
+export function DualLineChart({
+  title, currentRx, currentTx, rxData, txData, aggType, unit,
+}: DualLineChartProps) {
+  const chartData = rxData.map((d, i) => ({
+    time: d.time,
+    timestamp: d.timestamp,
+    rx: d[aggType] ?? 0,
+    tx: txData[i]?.[aggType] ?? 0,
+  }));
+  const rxGradId = `grad-rx-${title.replace(/\s/g, '')}`;
+  const txGradId = `grad-tx-${title.replace(/\s/g, '')}`;
+  return (
+    <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
+      <CardContent className="p-3">
+        <div className="flex items-center justify-between mb-1">
+          <div className="flex items-center gap-1.5">
+            <Network className="h-4 w-4 text-blue-400" />
+            <span className="text-xs text-[var(--dg-text-primary)] font-medium">{title}</span>
+          </div>
+          <div className="flex items-center gap-3 text-xs">
+            <span><span className="inline-block w-2.5 h-2.5 rounded-sm bg-blue-400 mr-1 align-middle" />接收 <b className="text-blue-300">{currentRx}</b></span>
+            <span><span className="inline-block w-2.5 h-2.5 rounded-sm bg-emerald-400 mr-1 align-middle" />发送 <b className="text-emerald-300">{currentTx}</b></span>
+          </div>
+        </div>
+        <div className="h-56">
+          {chartData.length === 0 ? (
+            <div className="h-full flex items-center justify-center text-xs text-[var(--dg-text-muted)] border border-dashed border-[var(--dg-border)] rounded-md">暂无数据</div>
+          ) : (
+            <ResponsiveContainer width="100%" height="100%">
+              <AreaChart data={chartData} margin={{ top: 2, right: 2, bottom: 0, left: -10 }}>
+                <defs>
+                  <linearGradient id={rxGradId} x1="0" y1="0" x2="0" y2="1">
+                    <stop offset="5%" stopColor="#3b82f6" stopOpacity={0.3} />
+                    <stop offset="95%" stopColor="#3b82f6" stopOpacity={0} />
+                  </linearGradient>
+                  <linearGradient id={txGradId} x1="0" y1="0" x2="0" y2="1">
+                    <stop offset="5%" stopColor="#10b981" stopOpacity={0.3} />
+                    <stop offset="95%" stopColor="#10b981" stopOpacity={0} />
+                  </linearGradient>
+                </defs>
+                <CartesianGrid strokeDasharray="3 3" stroke="#1e293b" strokeOpacity={0.5} />
+                <XAxis dataKey="time" hide />
+                <YAxis hide domain={[0, 'auto']} />
+                <Tooltip contentStyle={{ backgroundColor: '#0f172a', border: '1px solid #1e293b', borderRadius: '4px', color: '#f8fafc', fontSize: '11px', padding: '4px 8px' }}
+                  formatter={(v: number, name: string) => [`${v.toFixed(2)} ${unit}`, name === 'rx' ? '接收' : '发送']}
+                  labelFormatter={(label) => `时间: ${label}`} />
+                <Area type="monotone" dataKey="rx" stroke="#3b82f6" strokeWidth={1.5} fill={`url(#${rxGradId})`} name="rx" />
+                <Area type="monotone" dataKey="tx" stroke="#10b981" strokeWidth={1.5} fill={`url(#${txGradId})`} name="tx" />
+                <Brush dataKey="time" height={24} stroke="#334155" fill="#0f172a"
+                  startIndex={Math.max(0, chartData.length - Math.min(20, chartData.length))} />
+              </AreaChart>
+            </ResponsiveContainer>
+          )}
+        </div>
+      </CardContent>
+    </Card>
+  );
+}