- 删除 target-detail-modal(已被 target-detail-drawer 完整替代) - 删除 card-dashboard(已被 target-table 完整替代) - 将 card-dashboard 的容器宽度和分组间距约束迁入 target-table - 改写 probe-dashboard,移除与下层 spec 重复的描述,仅保留页面级关注点
35 lines
1.7 KiB
Markdown
35 lines
1.7 KiB
Markdown
## Purpose
|
||
|
||
定义拨测系统前端 Dashboard 页面:总览统计卡片、页面标题、加载和错误状态处理。分组表格布局见 `target-table`,目标详情 Drawer 见 `target-detail-drawer`,数据轮询和缓存见 `tanstack-query-data-layer`。
|
||
|
||
## Requirements
|
||
|
||
### Requirement: 总览统计卡片
|
||
Dashboard SHALL 在页面顶部使用 TDesign Statistic 组件展示总览统计,包含总目标数、正常数和异常数。
|
||
|
||
#### Scenario: 展示统计卡片
|
||
- **WHEN** 用户打开 Dashboard 页面
|
||
- **THEN** 页面顶部 SHALL 使用 TDesign Row/Col 布局展示 3 个 TDesign Card + Statistic 组合:全部目标数(color=blue)、正常目标数(color=green)、异常目标数(color=red)
|
||
|
||
#### Scenario: 统计数据自动刷新
|
||
- **WHEN** 页面处于打开状态
|
||
- **THEN** 统计卡片 SHALL 通过 TanStack Query 的 refetchInterval=8000 自动刷新数据
|
||
|
||
### Requirement: 页面标题
|
||
Dashboard 页面 SHALL 使用 TDesign Typography 组件渲染标题和副标题。
|
||
|
||
#### Scenario: 页面标题渲染
|
||
- **WHEN** Dashboard 页面渲染
|
||
- **THEN** 页面标题 SHALL 使用 TDesign Typography.Title 组件(level="h1")渲染"DiAL",副标题 SHALL 使用 Typography.Text 组件(theme="secondary")渲染"统一拨测平台"
|
||
|
||
### Requirement: 页面加载与错误状态
|
||
Dashboard SHALL 使用 TDesign 组件正确处理加载状态和 API 错误。
|
||
|
||
#### Scenario: 首次加载
|
||
- **WHEN** 页面首次加载且数据尚未返回
|
||
- **THEN** 表格 SHALL 显示 TDesign Loading 加载状态
|
||
|
||
#### Scenario: API 请求失败
|
||
- **WHEN** 前端 API 请求失败
|
||
- **THEN** 页面 SHALL 使用 TDesign Alert 组件(theme=error)显示错误提示
|