3.8 KiB
3.8 KiB
1. 项目准备与依赖
- 1.1 清理 demo 代码：移除 /api/demo 路由、DemoResponse 类型、前端 demo 展示逻辑
- 1.2 安装 recharts 依赖
- 1.3 创建 src/server/checker/ 目录结构和类型定义文件 types.ts
- 1.4 创建示例 YAML 配置文件 probes.example.yaml
2. 配置解析层
- 2.1 实现 YAML 配置类型定义（ProbeConfig、TargetConfig、ExpectConfig 等）
- 2.2 实现 config-loader.ts：读取文件 + Bun.YAML.parse + 配置校验（必填字段、name 唯一性、interval 格式、port 范围）
- 2.3 重写 src/server/config.ts：CLI 只接受配置文件路径参数，从 YAML 读取 host/port/dataDir
- 2.4 为配置解析和校验编写完整测试
3. 数据存储层
- 3.1 实现 store.ts：SQLite 初始化（建表、WAL 模式、复合索引）、数据目录自动创建
- 3.2 实现 targets 表同步逻辑（根据 name 匹配：新增插入、删除移除、修改更新）
- 3.3 实现 check_results 追加写入方法
- 3.4 实现查询方法：按 target+时间范围查询、按小时聚合趋势、计算可用率/平均延迟/P99
- 3.5 为数据存储层编写完整测试（初始化、同步、写入、查询、聚合）
4. 拨测引擎
- 4.1 实现 fetcher.ts：HTTP 请求执行（method/header/body）+ AbortController 超时控制
- 4.2 实现 expect 校验逻辑（status 列表匹配、bodyContains、maxLatencyMs）
- 4.3 实现 engine.ts：按 interval 分组 → setInterval → Promise.all 并发拨测 → 结果写入 store
- 4.4 为 fetcher 和 expect 校验编写完整测试（使用 mock HTTP server）
- 4.5 为调度引擎编写完整测试（分组逻辑、并发执行、单目标失败隔离）
5. API 路由层
- 5.1 定义 src/shared/api.ts 响应类型（SummaryResponse、TargetStatus、CheckResult、TrendPoint）
- 5.2 重写 src/server/app.ts：注册新 API 路由（/api/summary、/api/targets、/api/targets/:id/history、/api/targets/:id/trend），保留 /health
- 5.3 实现 API 错误处理（目标不存在返回 404、参数无效返回 400）
- 5.4 为 API 路由编写完整测试（各端点正常响应、边界情况、错误处理）
6. 前端 Dashboard
- 6.1 创建前端组件目录结构 src/web/components/ 和 src/web/hooks/
- 6.2 实现 hooks：useSummary（轮询 /api/summary）、useTargets（轮询 /api/targets）、useTrend（按需加载趋势数据）
- 6.3 实现 StatusDot 组件（绿色 UP / 红色 DOWN 圆点）
- 6.4 实现 SummaryCards 组件（4 个统计卡片）
- 6.5 实现 SparklineChart 组件（recharts 迷你折线图）
- 6.6 实现 TrendChart 组件（recharts 完整折线图，含时间轴和双 Y 轴）
- 6.7 实现 TargetRow 组件（表格行：名称、URL、状态、延迟、Sparkline，可展开）
- 6.8 实现 TargetDetail 组件（展开面板：统计摘要、趋势图、历史记录列表）
- 6.9 实现 TargetTable 组件（组合 TargetRow 和 TargetDetail）
- 6.10 重写 App.tsx：组合 SummaryCards + TargetTable，处理加载和错误状态
- 6.11 重写 styles.css：Dashboard 布局样式（卡片、表格、详情面板、响应式）
- 6.12 更新 vite.config.ts 代理配置确保 /api/* 转发
7. 集成与启动流程
- 7.1 重写 src/server/dev.ts 和 src/server/server.ts：启动流程为 读取配置 → 初始化 store → 同步 targets → 启动 engine → 启动 HTTP server
- 7.2 更新构建脚本确保 recharts 正确打包进 executable
- 7.3 更新 README.md：新的 CLI 用法、YAML 配置说明、API 端点文档、项目结构变更
8. 端到端验证
- 8.1 更新 smoke test 脚本适配新的 API 端点和前端路由
- 8.2 手动验证完整流程：YAML 配置 → 启动 → 拨测执行 → Dashboard 展示