P8：小程序前端 — 看板模块 — miniapp-fe-boards

优先级：P8（依赖 P2 + P3 + P5-A）预估工作量：大

需求（Requirements）

筛选器：区域筛选 + 时间筛选（本月/上月/本周/上周/前3月/本季/上季/近6月；营业日以 08:00 为分割点，如"本月"= 当月1日 08:00 ~ 次月1日 08:00）
数据板块：收入结构、预收资产（条件隐藏）、支出汇总、平台结算
环比展示
AI 智能洞察（应用 2 缓存结果，JSON 结构化输出：数组，每条含序号+标题+正文详情；UI 布局参考 docs/h5_ui/ 财务看板 AI 智能洞察）
"问问助手"入口 → chat.html

维度筛选：定档业绩最高/最低、工资最高/最低、高客源储值额最高、任务完成最多
项目筛选：全部/🎱 中式/追分/斯诺克/🀄 麻将/棋牌/🎤 团建/K歌
日期维度筛选：本月/上月/本周/上周/前3月/本季/上季/近6月（营业日以 08:00 为分割点，如"本月"= 当月1日 08:00 ~ 次月1日 08:00）
助教列表
右下角 AI 按钮 → chat.html

API	说明	缓存
`GET /api/board/finance`	财务看板数据（交叉筛选）	是
`GET /api/board/finance/ai-insight`	财务 AI 洞察	是（应用2缓存）
`GET /api/board/customers`	客户看板（维度+类型筛选）	是
`GET /api/board/coaches`	助教看板（维度×项目×日期）	是

收入结构（settle_type IN (1, 3)，台桌结账 + 商城订单）：

收入来源	DWS 字段	占比	说明
台费	`table_charge_money`	56.6%	按秒计时，台区单价固定
助教陪打	`assistant_pd_money`	30.6%	按秒计时，单价按等级
商品	`goods_money`	10.1%	酒水食品
助教超休	`assistant_cx_money`	0.9%（仅 type=1）	按课时，190 元/课时；settle_type=3 含 477 笔纯超休订单（cx=245,480），占全口径超休 85%+
灯控电费	`electricity_money`	0%	门店未启用，全为 0

⚠️ settle_type=3（商城订单）中包含大量纯超休/激励课订单，财务看板取数必须 settle_type IN (1, 3)，否则严重低估超休收入。

⚠️ 消费金额口径：使用 items_sum（= tc + goods + pd + cx + electricity），不得使用 consume_money（三种历史口径混合）。

充值收入（settle_type=5）：从 dws_finance_recharge_summary 读取，充值退款（settle_type=7）需扣除。

支付渠道分布（settle_type=1）：

看板数据缓存层：Redis 或内存缓存
缓存粒度：site_id + 筛选条件组合
缓存过期：ETL 数据更新后失效（约 1 小时）
AI 洞察缓存：从 biz.ai_cache 读取（应用 2 每日更新，cache_type = app2_finance，result_json 为 JSON 数组：序号+标题+正文详情）

以下规范适用于本 SPEC 中所有小程序页面实现，具有强制约束力。

原型图是唯一视觉真相：docs/h5_ui/pages/*.html 中的结构、层次、元素、配色、间距、交互行为是小程序页面实现的唯一参考标准。任何偏离原型图的实现都需要明确的产品确认。
WXML ≠ HTML：严禁在小程序中使用 HTML 标签（div/span/p/a/img 等），必须使用小程序原生标签（view/text/image/navigator 等）。
WXSS ≠ CSS：使用 rpx 单位、仅支持有限选择器、无 DOM/BOM API、样式隔离机制不同。Tailwind CSS 类名必须手动转换为 WXSS。
TDesign 优先：凡 TDesign 组件库能覆盖的 UI 元素，必须使用 TDesign 组件；自定义实现仅限 TDesign 无法覆盖的场景。
Power 文档优先：实现前必须加载 wechat-miniprogram Power 的相关 steering 文件（view-layer.md、tdesign.md、builtin-components.md），确保语法和组件用法正确。
项目踩坑指南必读：实现前必须阅读 docs/prd/MIGRATION-PLAYBOOK.md 第六章，该文档是基于本项目实际转换经验的避坑手册，涵盖 WXML/WXSS 差异、事件系统、TDesign 用法、rpx 换算规则及新页面开发 Checklist。