feat: 前端指标体系增强 — Dashboard/Metrics API、2×4 统计区、趋势图面积+异常标记、连续状态列
- 新增 GET /api/dashboard 合并原 summary+targets 首屏接口 - 新增 GET /api/targets/:id/metrics 合并原 stats+trend 概览接口 - 后端指标纯函数:可用率、百分位、故障段分析、连续状态、UTC 小时分桶 - ProbeStore 窗口取数方法替代全量历史查询 - SummaryCards 扩展为 4 卡片(新增异常事件数)+ 数据新鲜度展示 - 表格新增「连续」列(Tag 渲染 capped 状态) - OverviewTab 重构为 2×4 Statistic 多维度布局 - TrendChart 改为延迟范围面积图 + 红色异常标记点 - 删除旧路由(summary/targets/trend)和 computeTrendStats - 同步 delta specs 到主 specs 并归档变更
This commit is contained in:
@@ -3,28 +3,25 @@ import { Alert, Loading, Typography } from "tdesign-react";
|
||||
import { SummaryCards } from "./components/SummaryCards";
|
||||
import { TargetBoard } from "./components/TargetBoard";
|
||||
import { TargetDetailDrawer } from "./components/TargetDetailDrawer";
|
||||
import { useSummary, useTargets } from "./hooks/use-queries";
|
||||
import { useDashboard } from "./hooks/use-queries";
|
||||
import { useTargetDetail } from "./hooks/use-target-detail";
|
||||
|
||||
export function App() {
|
||||
const { data: summary, error: summaryError, isLoading: summaryLoading } = useSummary();
|
||||
const { data: targets, error: targetsError, isLoading: targetsLoading } = useTargets();
|
||||
const { data: dashboard, error: dashboardError, isLoading: dashboardLoading } = useDashboard();
|
||||
const {
|
||||
closeDrawer,
|
||||
handlePageChange,
|
||||
handleTimeChange,
|
||||
historyData,
|
||||
historyLoading,
|
||||
metricsData,
|
||||
metricsLoading,
|
||||
openDrawer,
|
||||
selectedTarget,
|
||||
timeFrom,
|
||||
timeTo,
|
||||
trendData,
|
||||
trendLoading,
|
||||
} = useTargetDetail();
|
||||
|
||||
const error = summaryError ?? targetsError;
|
||||
|
||||
return (
|
||||
<main className="dashboard">
|
||||
<header className="dashboard-header">
|
||||
@@ -32,14 +29,14 @@ export function App() {
|
||||
<Typography.Text theme="secondary">统一拨测平台</Typography.Text>
|
||||
</header>
|
||||
|
||||
{error && <Alert closeBtn message={`请求失败: ${error.message}`} theme="error" />}
|
||||
{dashboardError && <Alert closeBtn message={`请求失败: ${dashboardError.message}`} theme="error" />}
|
||||
|
||||
{summaryLoading && targetsLoading ? (
|
||||
{dashboardLoading ? (
|
||||
<Loading />
|
||||
) : (
|
||||
<>
|
||||
<SummaryCards summary={summary ?? null} />
|
||||
<TargetBoard onTargetClick={openDrawer} targets={targets ?? []} />
|
||||
<SummaryCards summary={dashboard?.summary ?? null} />
|
||||
<TargetBoard onTargetClick={openDrawer} targets={dashboard?.targets ?? []} />
|
||||
</>
|
||||
)}
|
||||
|
||||
@@ -47,14 +44,14 @@ export function App() {
|
||||
historyData={historyData}
|
||||
historyLoading={historyLoading}
|
||||
key={selectedTarget?.id}
|
||||
metricsData={metricsData}
|
||||
metricsLoading={metricsLoading}
|
||||
onClose={closeDrawer}
|
||||
onPageChange={handlePageChange}
|
||||
onTimeChange={handleTimeChange}
|
||||
target={selectedTarget}
|
||||
timeFrom={timeFrom}
|
||||
timeTo={timeTo}
|
||||
trendData={trendData}
|
||||
trendLoading={trendLoading}
|
||||
/>
|
||||
</main>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user