xuyunhui/aquagreen_wechat_app

Context

清道夫 App 采用 uni-app Vue 3 + TypeScript 开发，页面使用 navigationStyle: custom 自定义导航栏。TopBar 组件为通用导航头，CapsuleSafeArea 负责计算微信胶囊安全区。自定义 tabBar 使用微信小程序 custom-tab-bar 组件。后端为 Java Spring Boot + MyBatis-Plus。

当前问题：

TopBar 默认 showBack: true，导致 tab 页面（首页、任务、排班、我的）出现多余返回按钮。
任务页发布/新增按钮虽放入 TopBar 右侧插槽，但仍被胶囊遮挡，需要进一步调整。
排班页 addSchedule() 仅提示“排班功能开发中”，未实现 V21-SOP 原型的新增排班流程。
自定义 tabBar 在页面切换后高亮状态未同步更新。
退出登录时先执行 authStore.doLogout() 和 uni.showToast，再 uni.reLaunch，导致页面切换无动画、卡顿。

Goals / Non-Goals

Goals:

tab 页面 TopBar 不显示返回按钮，非 tab 页面保留返回能力。
任务页新增/发布按钮完全避开微信胶囊，可正常点击。
排班页可按原型新增排班并保存到后端。
tabBar 高亮与当前页面实时同步。
退出登录动画流畅、无卡顿。
后端缺失 /vehicle/simple-list 时补全该接口，保证前端下拉数据可用。

Non-Goals:

不重构整个导航或 tabBar 架构。
不改变任务/排班核心业务状态机。
不新增排班以外的调度功能。

Decisions

TopBar 默认不显示返回按钮
- 将 showBack 默认值改为 false；需要返回的页面显式传入 :showBack="true"。
- 理由：tab 页面是入口页，绝大多数场景不需要返回；显式开启更安全，避免遗漏。
任务页按钮胶囊安全区二次确认
- 检查 TaskListView 是否正确将按钮放入 TopBar 的 right slot，并确认 CapsuleSafeArea 已包裹 right slot。
- 如仍被遮挡，调整按钮容器为 CapsuleSafeArea 内部元素，确保 margin-left 生效。
排班新增采用弹窗表单
- 在 ScheduleView 内实现 uni-popup 或同项目弹窗组件，表单字段：班组（下拉 /team/simple-list）、工作日期（日期选择器）、班次类型（月计划/应急，映射 month_plan/emergency）、车辆（多选，调用 /vehicle/simple-list）、人员（多选，调用 /staff/simple-list）、备注（文本）。
- 提交调用 POST /schedule，成功后刷新当前日期班表列表。
- 理由：与原型一致，保持在当前页面完成新增，避免全页跳转。
后端车辆下拉接口补全 /vehicle/simple-list
- 在 VehicleController 新增该接口，返回 { value: vehicleId, label: plateNo }。
- 理由：前端现有 getAvailableVehicles() 调用不存在的 /vehicle/available；用户要求以后端接口为准，缺失则补全。
tabBar 高亮同步
- 在每个 tab 页面的 onShow 中调用 uni.setTabBarItem 不够，因为项目使用自定义 tabBar；需通过 getTabBar().setData({ selected: index }) 显式同步。
退出登录顺序调整
- 先调用 uni.reLaunch({ url: '/pages/login/login' })，再执行 authStore.doLogout() 清理 token/state；toast 可在跳转后可选显示或省略。
- 理由：reLaunch 是同步触发页面切换的 API，放在前面可立即释放当前页面；清理逻辑在后台完成不影响动画。

Risks / Trade-offs

[Risk] TopBar 默认 showBack=false 可能导致已有非 tab 页面依赖默认返回而失效。 → Mitigation：全局搜索 TopBar 使用处，为非 tab 页面补充 :showBack="true"。
[Risk] 排班表单字段与后端 DispatchSchedule 不完全对齐。 → Mitigation：严格参考后端 entity 字段命名，提交前做一次字段映射。
[Risk] 自定义 tabBar getTabBar() 在页面未完全挂载时可能为 null。 → Mitigation：使用 this.getTabBar()?.setData 并加空值保护。
[Risk] 后端新增接口需要重新部署才能生效。 → Mitigation：前端同时保留降级方案（如使用 /vehicle/list?pageSize=100），但本次按用户要求优先补全后端接口。

Migration Plan

后端：新增 /vehicle/simple-list，重启服务。
前端：修改 TopBar、TaskListView、ScheduleView、custom-tab-bar/index.js、ProfileView 及相关 API 文件。
构建：npm run type-check 与 npm run build:mp-weixin 验证。
真机验证：微信开发者工具 + 真机预览，检查胶囊遮挡、tabBar 高亮、退出动画。

Open Questions

任务页发布按钮在当前角色化首页改造后，是否仍命名为“发布”或已改为“新增”？以当前代码为准。
V21-SOP 原型文件路径需读取确认排班弹窗具体字段顺序与校验规则。

design.md 4.8 KB История Исходник