设计做法
- 把总览拆成配额进度、账单构成和周期趋势，读者先看到有变化的指标，再下钻。
- 把日期和对比周期放在图表区域上方。数值旁保留单位与上期数字，降低误读。
可以复用的文件
src/app/(main)/overview/page.tsx总览页面与各指标的组织方式src/components/ui/overview/DashboardChartCard.tsx趋势卡片、比较值和图表src/components/ui/overview/DashboardFilterbar.tsx时间范围与对比周期选择src/data/overview-data.ts示例数据结构，接入时换成真实数据
接入步骤
- 需要独立看板时，解压固定版本并按 README 运行 pnpm install、pnpm dev。先定义指标名称、单位、时间范围和上期口径。
- 提取总览页、图表卡和筛选栏。先用项目的只读数据做一组趋势，核对空数据、缺失日期和上期为零时的显示。
- 换掉示例账号、账单和站点标识。保留 Apache-2.0 许可证和上游声明，并标明修改过的文件。
搭配能力库使用
上游源码 · 版本 a20f619680