Brainstorm Summary

Change: weapp-capsule-safearea
Date: 2026-06-24

确认的技术方案

采用「统一移入 TopBar + 自动包裹 right slot」的方案：

新增 CapsuleSafeArea.vue 组件，基于 uni.getMenuButtonBoundingClientRect() 计算胶囊安全宽度，以 wrapper 形式给 slot 内容加 margin-left。
TopBar.vue 内部自动用 CapsuleSafeArea 包裹 right slot，页面无需感知安全区。
三个首页组件和 TaskListView 从自定义 header 重构为使用 TopBar；ScheduleView 的「今天」「新增排班」均移入 TopBar right slot。

关键取舍与风险

取舍：选择 TopBar 自动包裹而非 spacer/composable，是因为最符合「统一移入 TopBar」的目标，页面改造成本最低。
风险：uni.getMenuButtonBoundingClientRect() 可能获取失败，使用基于屏幕宽度的估算值兜底。
风险：横屏/旋转时胶囊尺寸变化，当前不做实时监听，后续如需可单独提 change。

测试策略

npm run type-check
npm run build:mp-weixin
微信开发者工具真机检查
H5 构建确认布局无回归

Spec Patch

将回写 openspec/changes/weapp-capsule-safearea/specs/weapp-capsule-safearea/spec.md：

明确首页、任务列表需要从「自定义 header」重构为使用 TopBar。
明确 ScheduleView 中「今天」和「新增排班」均移入 TopBar right slot。
明确 CapsuleSafeArea 采用 wrapper 形式给 slot 内容加 margin-left。
补充 API 失败时的回退行为验收场景。