1
0

feat: 重构 Dashboard 为卡片式分组布局

表格布局替换为按分组展示的卡片式布局,新增 group 字段配置和 TargetBoard/TargetCard 等组件。模态框详情页支持时间范围筛选和分页,SummaryCards 减为 3 个。API 端点变更:trend/history 改用 from/to 参数,history 支持分页。recentSampleCount 硬编码为 30。
This commit is contained in:
2026-05-11 08:54:21 +08:00
parent b8810f1182
commit 548b44d28e
44 changed files with 1676 additions and 557 deletions

View File

@@ -0,0 +1,25 @@
import { Line, LineChart, ResponsiveContainer } from "recharts";
import type { RecentSample } from "../../shared/api";
interface MiniSparklineProps {
data: RecentSample[];
}
export function MiniSparkline({ data }: MiniSparklineProps) {
const chartData = data
.filter((s) => s.durationMs !== null)
.map((s) => ({ duration: s.durationMs! }))
.reverse();
if (chartData.length === 0) {
return <span className="sparkline-empty">-</span>;
}
return (
<ResponsiveContainer width={80} height={32}>
<LineChart data={chartData}>
<Line type="monotone" dataKey="duration" stroke="#356dd2" strokeWidth={1.5} dot={false} />
</LineChart>
</ResponsiveContainer>
);
}