修改过时文档,优化文档内容

This commit is contained in:
not-like-juvenile
2026-03-17 11:06:26 +08:00
parent dac730474b
commit f33efe6ec8
45 changed files with 162 additions and 236 deletions

View File

@@ -0,0 +1,118 @@
## 目的
当“附近订单”过多时,在主页面展示前 N 条(当前为 20 条),需要提供“更多”入口,跳转到单独页面展示所有可接取的订单并支持翻页/上拉加载。
## 路由与文件
- 主入口:在 `pages/mall/delivery/index.uvue` 的“附近订单”区块新增“更多”按钮,导航到新页面。
- 新页面文件:`pages/mall/delivery/all.uvue`(建议路径)
- 文档说明文件:`pages/mall/delivery/doc/more-orders.md`(本文件)
## 用户流程
1. 用户在 `index.uvue` 看到“附近订单”列表(最多 20 条)。
2. 当可接取订单数量 >= 20 时,显示“更多”按钮。
3. 点击“更多”跳转到 `all.uvue`,展示可接取订单的完整列表(分页或无限滚动)。
4. 用户可在新页面接受订单或刷新列表。
## 后端 / 查询设计示例Supabase 客户端)
- 建议分页参数:`pageSize = 50`(可配置)。
- 前端通过 offset/pagination 请求:
示例(首次加载 page=0, size=50
```ts
const page = 0
const size = 50
const res = await supa.from('ml_delivery_tasks')
.select('*')
.is('driver_id', 'null')
.eq('status', 1)
.order('created_at', { ascending: false })
.range(page*size, page*size + size - 1)
.execute()
```
- 翻页时将 `page` 增加;上拉加载时继续请求下一段 `range`
- 后端/数据库建议对 `ml_delivery_tasks` 建立索引status, driver_id, created_at以加速查询。
## 前端实现建议
- `index.uvue`:在 `availableOrders` 列表下方加入:
- 条件显示:`availableOrders.length >= 20` 时显示“更多”按钮。
- 点击处理函数:`uni.navigateTo({ url: '/pages/mall/delivery/all' })`
- `all.uvue` 页面职责:
- 使用与 `index.uvue` 相同的 `supa` 客户端和 `_transformTask` 方法复用数据格式化逻辑。
- 支持分页page + pageSize或无限滚动onReachBottom 加载下一页)。
- 显示空状态、加载中状态和错误提示。
示例数据加载片段(伪代码):
```ts
data() { return { page: 0, pageSize: 50, items: [], loading: false, finished: false } }
async loadPage() {
if (this.loading || this.finished) return
this.loading = true
const res = await supa.from('ml_delivery_tasks')
.select('*')
.is('driver_id', 'null')
.eq('status', 1)
.order('created_at', { ascending: false })
.range(this.page * this.pageSize, (this.page+1)*this.pageSize - 1)
.execute()
const rows = Array.isArray(res.data) ? res.data : []
if (rows.length < this.pageSize) this.finished = true
this.items.push(...rows.map(r => this._transformTask(r)))
this.page += 1
this.loading = false
}
```
## 并发与安全
- 接单时应在服务器端/数据库层做原子性判断,避免竞态:
- 示例(伪 SQL
UPDATE ml_delivery_tasks
SET driver_id = :driverId, status = 2
WHERE id = :taskId AND driver_id IS NULL AND status = 1
RETURNING id
- 前端在发起“接受订单”请求后,基于返回结果确认是否成功;若失败需提示用户订单已被接取。
## 接受标准/验收条件
-`index.uvue` 点击“更多”能跳转到 `all.uvue`
- `all.uvue` 能正确加载 >20 条可接订单并支持继续加载直到无更多数据。
- 接单操作的竞态由后端或事务性查询处理,前端能正确反馈成功/失败。
## 测试数据与验证
- 使用现有文档 `doc_mall/database/realistic_mock_data.sql` 创建若干测试订单;也可循环插入多条 `ml_delivery_tasks`status=1, driver_id=NULL用于分页测试。
示例快速生成Postgres 伪 SQL
```sql
INSERT INTO public.ml_delivery_tasks (order_id, pickup_address, delivery_address, delivery_fee, status, created_at, updated_at)
SELECT uuid_generate_v4(), '{"detail":"店铺"}'::jsonb, '{"detail":"用户地址"}'::jsonb, 5.0, 1, NOW() - (i || ' minutes')::interval, NOW()
FROM generate_series(1,200) as s(i);
```
## 开发任务清单(简要)
1.`pages/mall/delivery/index.uvue` 增加“更多”按钮並导航。
2. 新建 `pages/mall/delivery/all.uvue`,实现分页/上拉加载并复用 `_transformTask`
3. 后端或 DB 层确保接单操作的原子性。
4. 编写 E2E 或手动测试脚本验证加载与接单行为。
## 是否需要我实现?
如果你需要,我可以:
- 直接在 `index.uvue` 添加“更多”按钮示例(小改动)。
- 新增 `pages/mall/delivery/all.uvue` 的样板实现并提交 PR 样例。
---
文档已创建:`pages/mall/delivery/doc/more-orders.md`