feat(admin): 新增后台订单列表与详情抽屉

2026-10-30 12:36:02 +08:00
parent ef01486e53
commit 17b985a4a4
17 changed files with 1656 additions and 6 deletions
@@ -182,12 +182,12 @@ dist/assets/MobileListingDetailPage-*.js   27.31 kB │ gzip 10.70 kB
 ## 5. 已知限制

 1. 移动端订单与消息页仍是占位，下单、客服会话尚未接入。
-2. 后台 43 个页面目前只有仪表盘是真实页面，其余为统一占位。
+2. 后台除仪表盘、订单列表与订单详情外，其余页面仍为统一占位。
 3. 分销后台尚未做品牌轻改。
-4. 后台菜单权限码基于旧项目推断，后续需与后端权限表逐一核对。
+4. 后台菜单权限码基于旧项目推断：订单页已核对为 `order:list`（列表）与 `order:view`（详情），其余页面仍需逐一核对。
 5. SVG 中文尚未转曲。
 6. 首屏包体仍偏大。
-7. 本移动端批次尚未提交 Git。
+7. 移动端批次已提交为 `ef01486`；后台订单列表与详情在后续批次提交。

 ---

@@ -0,0 +1,92 @@
+# Phase 2 验收报告（后台订单管理）
+
+> 日期：2026-10-30  
+> 项目：解忧商行（hfb_jysh）  
+> 范围：后台订单列表、订单详情抽屉、通用列表/详情原型  
+> 结论：**本切片通过，可继续迁移其它后台列表页**
+
+---
+
+## 1. 本批次完成内容
+
+### 1.1 接口与类型
+
+- `fetchAdminOrders(query)` → `GET /api/admin/orders`
+  - 支持 `page`、`page_size`、`keyword`、`status`、`handoff_status`、`handoff_mode`、`settlement_status`、`offline_settlement_status`、`user_id`
+  - 空字符串参数自动剔除，避免后端收到无效筛选
+- `fetchAdminOrder(id)` → `GET /api/admin/orders/:id`
+- 新增列表 `AdminOrderListItem`、分页 `AdminOrderPage`、详情 `AdminOrderDetail`、结账 `AdminCheckoutInfo`、操作位 `AdminOrderActions` 等类型
+- 列表只使用列表 DTO；详情字段只从详情接口读取，符合后端“最小暴露”设计
+
+### 1.2 权限码核对
+
+| 入口 | 后端实际权限码 | 前端菜单 |
+| --- | --- | --- |
+| 订单列表 | `order:list` | 已从推断值 `order:view` 修正为 `order:list` |
+| 订单详情 | `order:view` | 无 `order:view` 时隐藏详情入口与行点击，操作列显示“无详情权限” |
+
+### 1.3 通用组件原型
+
+位于 `frontend/src/features/admin/components/`，供后续后台页面复用：
+
+- `AdminPageHeader`：眉标 + 标题 + 描述 + 标签 + 右侧操作
+- `FilterBar` / `FilterField`：可换行筛选区，统一查询/重置按钮与回车提交
+- `DataTable`：卡片容器、空态、分页文案、行点击样式、横向滚动
+- `DetailDrawer`：抽屉标题区、状态标签、分段 `Descriptions`、加载/错误/空态
+- `StatusTag`：统一状态标签外观
+
+配套：
+
+- `frontend/src/features/admin/labels.ts`：订单、交接、结算、线下结算、结账、退款状态文案与色调
+- `frontend/src/shared/utils/format.ts`：金额（分→元）、日期时间、数字、文本空值
+
+### 1.4 订单列表页
+
+`frontend/src/features/admin/AdminOrdersPage.tsx`
+
+- 头部：订单总数、用户筛选提示、刷新按钮
+- 筛选：关键词、订单状态、交接状态、订单类型、结算状态、线下结算
+- 列：订单信息、商品、租客/号主、金额、订单状态、交接、结算、操作
+- 分页：10 / 20 / 50，切换页长自动回到第一页
+- 支持 `?keyword=` 与 `?user_id=` 深链（为后续用户管理“明细”入口准备）
+- 加载使用 `keepPreviousData`，翻页不闪空表
+
+### 1.5 订单详情抽屉
+
+`frontend/src/features/admin/AdminOrderDetailDrawer.tsx`
+
+- 标题区展示订单号、商品标题、创建时间、订单/交接/结算三个状态标签
+- 分段：订单概览、商品与账号、交易双方、金额明细、交接与结算
+- 存在结账单时展示协商轮次、消耗品、哈夫币、押金扣除、租客可退、号主到手、短收/超收、结账内容与凭证
+- 存在进行中申诉时展示申诉单信息
+- 支持复制订单号、加载骨架、错误重试
+
+## 2. 验证结果
+
+```text
+npx tsc --noEmit                     通过
+npm run build                        通过（主包 887.21 kB，gzip 289.49 kB，仍超 700 kB 警告）
+GET /console-jy8k3m/orders           200（Vite SPA 回退）
+GET /console-jy8k3m/login            200
+GET /api/admin/orders（未登录）       401
+GET /api/admin/orders（管理员 Cookie） ok，返回 items/total/page/page_size
+GET /api/admin/orders?status=renting&handoff_status=received&...  ok
+GET /api/admin/orders/1（不存在）      404 {"code":"not_found","message":"订单不存在"}
+```
+
+说明：当前开发库 `rental_orders` 为 0 条，列表验证以空态与接口契约为准；首次产生真实订单后需目视复核列宽与抽屉信息密度。
+
+## 3. 已知限制
+
+1. 本批次只读，不包含关闭、退款、强制交接、线下结算等操作按钮；后端操作接口已存在，留待 Phase 4 逐项接入并补齐二次确认与权限校验。
+2. 详情抽屉未加载交接记录时间线与过程事件，后续可复用 `GET /api/admin/orders/:id/handoff-records` 与 `/process-events`。
+3. 列表未做列显隐、导出与批量选择。
+4. 主包体积仍未达标。
+
+## 4. 下一步建议
+
+1. 后台商品管理列表 + 商品审核，复用本批 `DataTable` / `FilterBar` / `DetailDrawer`。
+2. 用户管理列表与用户详情，接通订单深链 `orders?user_id=`。
+3. 交接记录与过程事件时间线组件。
+4. 移动端 `/m/orders` 与 `/m/messages` 真实接口。
+5. 分销后台品牌轻改与 AntD 首包拆分。
@@ -365,6 +365,8 @@ hfb_jysh/

 ### Phase 2：前端基础设施（1 周）

+> 状态：**进行中（2026-10-30）**。已完成双认证、401 单飞刷新、路由守卫与分站头；通用 `DataTable` / `FilterBar` / `DetailDrawer` / `StatusTag` / `AdminPageHeader` 原型已随后台订单页落地。
+
 - Axios 客户端、响应解包、错误提示、请求日志。
 - 用户 Bearer 与管理员 Cookie 双认证。
 - 401 单飞刷新队列。