
## 1. 功能概述
`all.uvue` 是为配送端设计的全量订单抓取页面。当首页待接订单超过 5 个时，用户可通过此页面查看并抢单。

## 2. 核心设计说明
根据最新 UI 指标，该页面采用了**现代垂直流布局**：
- **中心费用展示**：订单金额在卡片顶部居中加粗显示，强化利益点。
- **垂直路径流**：采用垂直排布的取货（📍）与送达（🏠）地址，中间以箭头连接，更符合手机屏阅读习惯。
- **全宽操作按钮**：底部采用 100% 宽度的按钮，提高抢单操作的触达率。
- **实时空态处理**：当订单被他人抢先接走时，列表会自动更新。

## 3. 技术实现要点

### 3.1 数据安全与并发控制
在执行 `acceptOrder`（抢单）时，通过数据库约束确保操作的原子性：
```uts
// 增加 driver_id 为空的前提条件，防止已被他人接单
const res = await supa.from('ml_delivery_tasks')
    .update({ 
        driver_id: driverId, 
        status: 2, 
        accepted_at: new Date().toISOString() 
    })
    .eq('id', taskId)
    .is('driver_id', 'null') // 关键：确保单子还没被接
    .execute();
```

### 3.2 数据结构转换 (`_transformTask`)
为了兼容数据库存储的 JSON 字符串格式与 UI 组件所需的 Object 格式，页面内置了转换逻辑：
- 自动解析 `pickup_address` 和 `delivery_address` JSON 字符串。
- 格式化 `delivery_fee` 为保留两位小数。
- 映射状态码到对应的 UI 标签。

### 3.3 路由与交互
- **路由路径**：`pages/mall/delivery/all`
- **导航栏**：配置了 `navigationBarTitleText: "待接订单"`，并开启了原生的回退功能。
- **动态跳转**：支持从详情页返回后自动刷新列表（通过 `onShow` 触发）。

## 4. 样式规范
- 布局：Flexbox (Column)
- 配色：
  - 取货点：Pink (`#ff4d94`)
  - 送达点：Blue (`#2196F3`)
  - 主按钮：Green (`#4CAF50`)
- 间距：标准 30rpx 外边距，卡片内 40rpx 内边距。

## 5. 开发历史
- **2026-02-03**: 页面初版创建。
- **2026-02-03**: 完成从水平卡片到垂直流卡片的 UI 重构。
- **2026-02-03**: 接入 Supabase 实现秒级抢单逻辑与状态同步。
