2.7 KiB
2.7 KiB
订单详情页 5 个待办按钮点击跳转交互指引（前端实现,后端零改动）
日期: 2026-04-24 类型: 前端交互增强 受众: hl-ui 管理后台 对应界面: 订单详情 → 顶部「待办」按钮组
现状
订单详情页顶部「待办」区已有 5 个按钮(分配房间 / 分配车辆 / 确认清单 / 购买保险 / 签署合同),按 order_todo.status 和业务前置校验决定可点性(见 PR #1327 后端校验)。但点击按钮目前只触发「完成待办」接口,没有引导用户到对应操作入口。
用户场景:点「分配房间」时系统提示 请先在行程安排中完成房间分配,用户不知道房间分配在哪个 tab 做,来回找。
目标
5 个待办按钮点击后先跳转到对应操作 tab,让用户可以直接进入配置动作,操作完成后按钮会自动变绿(无需手动点"完成")。
跳转规则
| 待办按钮 | 对应页内位置 | 跳转动作 |
|---|---|---|
| 分配房间 | 「行程安排」tab (已有) | 切到 行程安排 tab,聚焦酒店/房间配置区块 |
| 分配车辆 | 「行程安排」tab (已有) | 切到 行程安排 tab,聚焦车辆配置区块 |
| 确认清单 | 当前「概览」tab 保留锁单弹窗 | 沿用现有「弹二次确认对话框 → 调 PUT /admin/order/todo/{todoId}/complete」逻辑,无需跳转 |
| 购买保险 | 「合同保险」tab | 切到 合同保险 tab,聚焦保险子块(若无投保单,点「添加保险」) |
| 签署合同 | 「合同保险」tab | 切到 合同保险 tab,聚焦合同子块(若无合同,点「新建合同」) |
按钮状态
completed(绿色对勾): 不再触发跳转,点击无效 / 或提示「已完成」pending且前置未满足: 跳转到对应 tab,不调「完成待办」接口(让用户先去配)pending且前置已满足 (例如确认清单): 走原有流程
为什么不在后端做跳转
跳转是 admin UI 的交互,不是业务数据变更。后端已经在 PR #1327 补齐了业务前置校验(未就绪点「完成」会返 BusinessException),这个校验保持不变 — 前端跳转只是避免用户触发这个错误。
涉及接口(均已存在,前端无需后端配合改动)
GET /admin/order/{orderId}— 订单详情,返回todos数组(含todoType和status)- 行程安排 tab:
GET /admin/order/{orderId}/hotel-assignment,GET /admin/order/{orderId}/vehicle-assignment等(已有) - 合同保险 tab: 保险 / 合同相关接口(已有)
- 「确认清单」完成:
PUT /admin/order/todo/{todoId}/complete(PR #1327 已上线前置校验)