# index.uvue — 配送端首页 ## 概要 配送员主界面,包含司机信息、在线/离线切换、今日统计、当前配送任务、附近可接订单与快捷入口。 ## 数据结构 - DeliveryDriverType (来自 `ml_delivery_drivers`) - id, user_id, real_name, avatar_url, work_status, vehicle_type, vehicle_number, rating, service_areas, ... - CurrentTaskType / AvailableOrderType - id, order_no, status, pickup_address, delivery_address, pickup_contact, delivery_contact, delivery_fee, distance, estimated_time, created_at ## 关键方法 - `onLoad()` - 调用 `getCurrentUser()` 确保用户上下文可用 - 执行:`loadDriverInfo()`, `loadTodayStats()`, `loadCurrentTask()`, `loadAvailableOrders()` - `loadDriverInfo()` - 从 `ml_delivery_drivers` 表按 `user_id` 查询并更新 `driverInfo`。 - `loadTodayStats()` - 查询 `ml_delivery_tasks` 在当天范围内的记录,计算完成订单数、总收入、配送里程等。 - `loadCurrentTask()` - 查询 `ml_delivery_tasks` 中 driver_id 的未完成任务(status < 5),并取最新一条作为当前任务。 - `loadAvailableOrders()` - 若 `isOnline` 且无 `currentTask`,从 `ml_delivery_tasks` 查询 `driver_id IS NULL` 且 status=1 的订单列表(可按地理位置筛选)。 - `_transformTask(task)` - 兼容处理 `pickup_address` / `delivery_address` 与 `pickup_contact` 的多种格式(对象或 JSON 字符串),输出页面期望结构。 ## 关键 DB 查询 示例 ``` await supa.from('ml_delivery_drivers').select('*').eq('user_id', userId).limit(1).execute() await supa.from('ml_delivery_tasks') .select('id,delivery_fee,distance,created_at,status') .eq('driver_id', driverId) .gte('created_at', start) .lte('created_at', end) .execute() ``` ## 交互与状态流 - `toggleWorkStatus()`:切换 `isOnline` 并调用 `startWork()` / `stopWork()`。上线时会刷新可接订单列表。 - 接单/开始取货/确认取货/开始配送/确认送达等均通过对 `ml_delivery_tasks` 的 `update` 操作变更 `status`,并在成功后更新本地 `currentTask`。 ## UI 行为变动(已生效) - 当页面检测到存在 `currentTask`(来自 `ml_delivery_tasks`)时,页面不会再弹出“附近可接订单”列表。即:配送端以 `ml_delivery_tasks` 为状态真源,主页面的订单展示不再依赖或回退展示 `ml_orders.order_status`,以避免两表不同步导致的显示冲突。 - 为了减少页面闪烁与重复刷新,`enableAutoRefresh` 在默认实现中已可被关闭(`false`),且 `loadAvailableOrders()` 在检测到 `currentTask` 时会跳过可接订单的渲染。 ## 会话与加载保护 - `supaReady` 的会话恢复在某些环境中会较慢,页面中已对其使用 `Promise.race(..., 1500)` 超时包装:超时后页面会打警告并继续渲染以避免长时间阻塞用户界面。依赖用户 id 的查询在超时情况下可能为空,请参照 `order-history.md` 的“已实现的防护”部分进行排查。 ## 前端同步尝试(临时) - 在接单/确认送达流程中前端会尝试向 `ml_orders` 发送更新(将 `order_status` 同步到任务的状态)并记录返回结果用于诊断。但该同步并不保证在所有权限或网络错误下成功,因此更稳妥的方案仍是后端触发器同步或可信服务端接口。 ## 注意事项 - 高并发接单场景需后端保证原子性(乐观锁或 DB 事务)以防止竞单冲突。 - `loadAvailableOrders()` 最好按司机服务区域与距离筛选,并使用分页/实时推送代替频繁轮询。 - 日志(console.log)语句便于调试,但生产环境建议使用集中化日志系统。 # index.uvue — 配送端首页 页面目的:配送员主界面,展示司机资料、工作状态、今日统计、当前任务与可接订单。 关键点: - 数据加载:`onLoad()` 调用 `getCurrentUser()` 后依次调用 `loadDriverInfo()`, `loadTodayStats()`, `loadCurrentTask()`, `loadAvailableOrders()`。 - Supabase 交互:通过 `supa.from(...).select(...).eq(...).execute()` 查询 `ml_delivery_drivers`、`ml_delivery_tasks` 等表。 - 兼容解析:`_transformTask(task)` 将 DB 返回的地址/contact 字段兼容解析为页面所需结构(处理字符串或对象)。 - 操作:接单/开始取货/确认取货/开始配送/确认送达等,会调用 supa 更新 `ml_delivery_tasks` 状态并同步页面状态。 注意:对 supa 操作有大量 try/catch,页面对无用户 ID 情况做了保护,适合直接对接真实后端。