laser1209/aerie-yunqi/dashboard-page

本地离线仪表盘（dashboard-page）

当用户要做本地可离线运行的 ECharts 数据看板时使用：KPI 面板、时间范围控件、图表网格、 数据来源可审计，可选按天生成数据快照。产出一个双击即开、不依赖网络的单文件页面。

铁律

1. 单文件离线：ECharts 与数据内联，断网照常渲染；不依赖 CDN，也不依赖后台接口。
2. 数据必须可审计：每个 KPI / 图表都能点开"数据来源"，看到采集时间、口径、原始数值，不用"最新数据"含糊带过。
3. KPI 与图分层：顶部 4~6 个 KPI 大数字卡（值 + 环比 + 口径），下方才是趋势与构成图，不要把 KPI 混进图表里。
4. 时间控件真起作用：切换时间范围时，所有图表与 KPI 同步重算；不允许只换标题不换数据。
5. 空数据要有交代：某时段无数据显示"该区间无数据"，而不是 0 或空白图，避免误读。
6. 配色有语义且色盲友好：增长/下降、正常/异常用固定色，不用随机彩虹色，对比度足够。

步骤

1. 定指标：列出要看的 KPI 与图表，每个写清 口径、单位、数据来源、刷新频率。
2. 定数据形态：确认数据是内联 JSON 还是按天快照文件；快照命名与目录结构固定（如 data/YYYY-MM-DD.json）。
3. 搭骨架：一个 index.html + 内联 data.js（或直接内联），栅格布局放 KPI 与图表。
4. 实现控件：时间范围选择（近 7 天 / 30 天 / 自定义），切换时统一调用重算函数更新所有视图。
5. 接来源弹窗：每张图右上角"来源"入口，展示口径、采集时间、原始数值表。
6. 做快照（可选）：按天生成数据文件，让看板能回看历史，而不是只有当下。
7. 离线与视觉自检：断网打开、确认控制台无报错；1440 / 1920 宽度下标签不重叠、布局不崩。

输出形态

dashboard.html（单文件离线）
├─ 时间控件：近 7 天 / 30 天 / 自定义
├─ KPI 卡片 ×4~6：值 / 环比 / 口径 / 来源
├─ 图表网格：趋势、构成、对比（ECharts）
├─ 来源弹窗：口径 + 采集时间 + 原始数值
└─ data/：按天快照（可选）

反面例子（不要这样）

• 图表写着"最新数据"，却说不清什么时候采的、算的是什么口径。
• 切时间范围只有标题变了，图没动。
• 无数据区间画成 0，读者以为真的掉到底了。
• 引用 CDN，内网或断网环境直接白屏。