feat(mobile): 接入移动端订单与消息中心
This commit is contained in:
+2
-2
@@ -181,13 +181,13 @@ dist/assets/MobileListingDetailPage-*.js 27.31 kB │ gzip 10.70 kB
|
||||
|
||||
## 5. 已知限制
|
||||
|
||||
1. 移动端订单与消息页仍是占位,下单、客服会话尚未接入。
|
||||
1. 移动端订单列表/详情与消息中心已接入真实接口;下单、支付、交接、归还、结账等操作仍待迁移。
|
||||
2. 后台除仪表盘、订单列表与订单详情外,其余页面仍为统一占位。
|
||||
3. 分销后台尚未做品牌轻改。
|
||||
4. 后台菜单权限码基于旧项目推断:订单页已核对为 `order:list`(列表)与 `order:view`(详情),其余页面仍需逐一核对。
|
||||
5. SVG 中文尚未转曲。
|
||||
6. 首屏包体仍偏大。
|
||||
7. 移动端批次已提交为 `ef01486`;后台订单列表与详情在后续批次提交。
|
||||
7. 移动端批次 `ef01486`、后台订单批次 `17b985a` 已提交;移动订单与消息在后续批次提交。
|
||||
|
||||
---
|
||||
|
||||
|
||||
@@ -0,0 +1,105 @@
|
||||
# Phase 2 验收报告(移动端订单与消息)
|
||||
|
||||
> 日期:2026-10-30
|
||||
> 项目:解忧商行(hfb_jysh)
|
||||
> 范围:`/m/orders`、`/m/orders/:id`、`/m/messages`、`/m/messages/:id`
|
||||
> 结论:**本切片通过,移动端订单与消息已接真实接口**
|
||||
|
||||
---
|
||||
|
||||
## 1. 订单中心
|
||||
|
||||
### 1.1 接口
|
||||
|
||||
- `GET /api/orders?page=&page_size=`:我的订单分页(列表 DTO)
|
||||
- `GET /api/orders/:id`:订单详情(按角色脱敏后的 `OrderDTO`)
|
||||
- `POST /api/orders/:id/cancel`:租客取消待支付订单
|
||||
|
||||
### 1.2 页面
|
||||
|
||||
`frontend/src/features/mobile/MobileOrdersPage.tsx`
|
||||
|
||||
- 未登录展示登录引导,登录后跳回 `/m/orders`
|
||||
- 下拉刷新 + 分页「加载更多」(`useInfiniteQuery`,20 条/页)
|
||||
- 订单卡片:订单号、状态标签、商品标题、角色(我租的 / 我出租的)、区服、租期、金额、押金、下单时间
|
||||
- 空态、错误态、加载骨架
|
||||
- 请求在未登录时不发出,避免 401 触发刷新失败跳转
|
||||
|
||||
`frontend/src/features/mobile/MobileOrderDetailPage.tsx`
|
||||
|
||||
- 状态头:订单号、订单状态、交接状态、结算状态、金额与押金
|
||||
- 分段:商品信息、金额明细、时间、结账单、进行中申诉
|
||||
- 待支付且为租客时提供「取消订单」,二次确认后调用取消接口并刷新列表
|
||||
- 详情页隐藏底部 TabBar
|
||||
|
||||
## 2. 消息中心
|
||||
|
||||
### 2.1 接口
|
||||
|
||||
- `GET /api/chats` / `GET /api/chats/:id` / `GET /api/chats/:id/messages`
|
||||
- `POST /api/chats/:id/messages`、`POST /api/chats/:id/read`
|
||||
- `POST /api/chats/support`:创建/复用平台客服会话
|
||||
- `GET /api/chats/unread-count`:底部 TabBar 未读徽标(20 秒轮询)
|
||||
- `GET /api/notifications`、`POST /api/notifications/:id/read`、`PUT /api/notifications/read-all`
|
||||
|
||||
### 2.2 页面
|
||||
|
||||
`frontend/src/features/mobile/MobileMessagesPage.tsx`
|
||||
|
||||
- 「会话 / 通知」双 Tab
|
||||
- 会话行:类型印章(客服 / 订单 / 商品)、标题、最后一条预览、时间、未读数
|
||||
- 「联系客服」直接创建并进入客服会话
|
||||
- 通知行:未读标记、标题、内容摘要、时间;点击标记已读,支持全部已读
|
||||
|
||||
`frontend/src/features/mobile/MobileChatPage.tsx`
|
||||
|
||||
- 会话标题、类型说明、订单号(订单群聊)
|
||||
- 消息按日期分组;系统消息居中;自己/对方气泡区分
|
||||
- 图片消息支持展示附件
|
||||
- 输入框 + 发送按钮,发送后刷新消息与会话列表
|
||||
- 打开会话与收到新消息时自动标记已读
|
||||
- 6 秒轮询新消息;上拉加载更早消息
|
||||
- 底部输入区固定,页面高度按视口计算
|
||||
|
||||
## 3. 其它配套修改
|
||||
|
||||
- `LoginPage` 修复移动端登录后跳转:优先使用 `redirect` 参数,未登录用户从 `/m/orders`、`/m/messages` 进入登录后回到原页面。
|
||||
- `MobileLayout` 新增 `mobile-shell--no-tabbar`,详情页/聊天页不再预留 72px TabBar 空白。
|
||||
- 底部「消息」Tab 接入未读数徽标。
|
||||
|
||||
## 4. 验证结果
|
||||
|
||||
```text
|
||||
npx tsc --noEmit 通过
|
||||
npm run build 通过(主包 888.74 kB,gzip 290.00 kB,仍有 >700 kB 警告)
|
||||
GET /m/orders 200
|
||||
GET /m/orders/1 200
|
||||
GET /m/messages 200
|
||||
GET /m/messages/2 200
|
||||
POST /api/auth/password/login(13800138000) ok
|
||||
GET /api/orders(用户 Bearer) ok,空列表
|
||||
GET /api/notifications ok,items/total/page/page_size
|
||||
GET /api/chats ok,返回 listing_group 会话
|
||||
POST /api/chats/support ok,创建 general_support 会话 #2
|
||||
GET /api/chats/2/messages ok,返回系统欢迎消息
|
||||
POST /api/chats/2/messages(文本) ok,返回 is_self=true 的消息
|
||||
POST /api/chats/2/read ok,{"read":true}
|
||||
GET /api/chats/unread-count ok,unread_count=0
|
||||
PUT /api/notifications/read-all ok,read_count=0
|
||||
```
|
||||
|
||||
## 5. 已知限制
|
||||
|
||||
1. 订单支付、交接、归还、结账、申诉等操作仍未接入移动端;当前只读 + 取消待支付订单。
|
||||
2. 聊天使用 6 秒轮询,尚未接入 `/api/chats/events` SSE;消息量增大后需要升级。
|
||||
3. 聊天暂不支持发送图片/附件,仅展示已存在的图片消息。
|
||||
4. 订单列表接口暂不支持按状态筛选,移动端采用分页加载而非状态 Tab。
|
||||
5. 主包体积仍偏大。
|
||||
|
||||
## 6. 下一步建议
|
||||
|
||||
1. 移动端下单、支付与交接/归还/结账操作流。
|
||||
2. 聊天 SSE 与附件上传。
|
||||
3. 后台商品管理/审核,复用 DataTable 与 DetailDrawer。
|
||||
4. 用户管理列表与 `orders?user_id=` 深链。
|
||||
5. 分销后台品牌轻改与首包拆分。
|
||||
@@ -381,6 +381,8 @@ hfb_jysh/
|
||||
|
||||
### Phase 3:C 端 PC + 移动端(3 周)
|
||||
|
||||
> 状态:**进行中(2026-10-30)**。移动端已完成首页、商品列表/详情、登录、个人中心、订单列表/详情、消息中心与聊天;PC 端与下单/支付/交接/结账操作待迁移。
|
||||
|
||||
- 首页、商品列表、商品详情、撞车商品。
|
||||
- 登录、注册、找回密码、实名认证。
|
||||
- 卖家发布、编辑、提交审核。
|
||||
|
||||
Reference in New Issue
Block a user