131 行
4.1 KiB
Markdown
131 行
4.1 KiB
Markdown
---
|
||
date: 2026-04-23
|
||
type: fix-guidance
|
||
scope: hl-ui (admin 订单详情)
|
||
pr: "无后端 PR (纯前端渲染问题)"
|
||
issue: "无(前端直接修)"
|
||
breaking: false
|
||
audience: [hl-ui]
|
||
---
|
||
|
||
# admin 订单详情 · 房间安排区域两处渲染 BUG 修正指引(后端零改动)
|
||
|
||
## 背景
|
||
|
||
用户反馈订单详情 → 行程安排 → 房间安排 两处不对:
|
||
|
||
1. **编辑回显失效**:点「编辑」打开配房弹窗,现有已配数据不预填,等于从零配。
|
||
2. **日期列显示「-」**:表格「日期」列应显示真实入住日期,现在渲染成 `-`。
|
||
|
||
后端 API 已具备正确数据,属前端渲染绑错字段/未调回显接口。**后端不做改动**,本文档只给前端改动指引。
|
||
|
||
## 问题 1:编辑弹窗不回显
|
||
|
||
### 根因
|
||
|
||
前端编辑弹窗打开时未调 GET 拉当前已配数据,直接开空表单。
|
||
|
||
### 正确做法
|
||
|
||
弹窗打开的 `onMounted` / `open()` 钩子里调:
|
||
|
||
```http
|
||
GET /admin/order/{orderId}/hotel-assignment
|
||
Authorization: Bearer {token}
|
||
```
|
||
|
||
**响应**(已上线,PR #1049 起):
|
||
|
||
```json
|
||
{
|
||
"code": 200,
|
||
"data": [
|
||
{
|
||
"assignmentId": "2047139323009990657",
|
||
"orderId": "2046864526866886657",
|
||
"familyIndex": 1,
|
||
"hotelId": "2023714929877450753",
|
||
"hotelName": "呼伦贝尔香格里拉大酒店",
|
||
"roomTypeId": "3002000000000000013",
|
||
"roomType": "大床房",
|
||
"dayNumber": 4,
|
||
"assignmentDate": "2026-04-27",
|
||
"upgradePrice": null,
|
||
"remark": "bug1257-execute"
|
||
}
|
||
]
|
||
}
|
||
```
|
||
|
||
按 `(familyIndex, dayNumber)` 预填编辑表格即可。空数组代表尚未配过,弹窗走空态。
|
||
|
||
## 问题 2:日期列显示「-」
|
||
|
||
### 根因
|
||
|
||
前端列表绑的是 `OrderDetailVO.hotelAssignments` —— **这是 Entity 原始 JSON 字符串**(为兼容 V1 保留),**不含 `assignmentDate` 字段**,所以日期列恒为空。
|
||
|
||
### 正确做法
|
||
|
||
改绑 `OrderDetailVO.hotelAssignmentDetails`(已结构化 + 含计算好的日期):
|
||
|
||
```js
|
||
// ❌ 错误(老 V1 兼容字段,无日期)
|
||
const list = JSON.parse(orderDetail.hotelAssignments || '[]')
|
||
|
||
// ✅ 正确(结构化列表,含 assignmentDate)
|
||
const list = orderDetail.hotelAssignmentDetails || []
|
||
```
|
||
|
||
字段对照:
|
||
|
||
| 展示列 | 取字段 |
|
||
|--------|--------|
|
||
| 家庭 | `familyIndex` |
|
||
| 日期 | `assignmentDate`(YYYY-MM-DD) |
|
||
| 酒店 | `hotelName` |
|
||
| 房型 | `roomType` |
|
||
| 备注 | `remark` |
|
||
|
||
`assignmentDate` 由后端按 `order.departureDate + dayNumber - 1` 现算,前端直接展示即可。
|
||
|
||
## 相关字段来源
|
||
|
||
`OrderDetailVO` 内两个字段并存(`hl-order-service-v2`):
|
||
|
||
```java
|
||
@ApiModelProperty("酒店分配信息JSON（原始数据，V1 兼容，不建议新代码使用）")
|
||
private String hotelAssignments;
|
||
|
||
@ApiModelProperty("酒店分配详情列表（含酒店名/房型/入住日期等结构化数据，推荐使用）")
|
||
private List<HotelAssignmentDetailVO> hotelAssignmentDetails;
|
||
```
|
||
|
||
**以后所有新代码统一走 `hotelAssignmentDetails`**。`hotelAssignments` 字段保留但标记为 V1 兼容字段,后续不再扩展新字段。
|
||
|
||
## 验证
|
||
|
||
### 测试服订单
|
||
|
||
`2046864526866886657`(HL20260422161146-2849,南线经典 5 天 4 晚,2026-04-24 出发)
|
||
|
||
当前 DB 状态(PR #1262 测试残留,实际业务测试时可重新配房):
|
||
|
||
| day | hotelName | roomType | assignmentDate |
|
||
|-----|-----------|----------|---------------:|
|
||
| 4 | 呼伦贝尔香格里拉大酒店 | 大床房 | 2026-04-27 |
|
||
|
||
### 验收清单
|
||
|
||
- [ ] 打开订单 `2046864526866886657` 详情 → 行程安排 → 房间安排表格,日期列显示 `2026-04-27`(不是 `-`)
|
||
- [ ] 点「编辑」按钮 → 弹窗自动预填 `家庭1 / 第4天 / 呼伦贝尔香格里拉大酒店 / 大床房`
|
||
- [ ] 空态订单(从未配房)→ 弹窗打开为空表单,不报错
|
||
- [ ] 改完提交 → 刷新详情页,列表正确显示新数据 + 日期
|
||
|
||
## 相关
|
||
|
||
- 后端接口(现有,无改动):`GET /admin/order/{orderId}/hotel-assignment`
|
||
- 后端字段(现有,无改动):`OrderDetailVO.hotelAssignmentDetails[]`
|
||
- 前置历史:PR #1049(字段 `assignmentDate` → `dayNumber` 迁移,Service 层现算日期回填 VO)
|
||
- 后端 PR 关联:PR #1250(配房差价预览 3 BUG 修复)/ #1262(差价 execute 联动费用项)
|