diff --git a/pages.json b/pages.json index 97b986cd..596cf2a1 100644 --- a/pages.json +++ b/pages.json @@ -126,6 +126,20 @@ "navigationStyle": "custom" } }, + { + "path": "pages/mall/delivery/vehicle-add", + "style": { + "navigationBarTitleText": "添加车辆", + "navigationStyle": "custom" + } + }, + { + "path": "pages/mall/delivery/vehicle-edit", + "style": { + "navigationBarTitleText": "添加车辆", + "navigationStyle": "custom" + } + }, { "path": "pages/mall/delivery/settings", "style": { diff --git a/pages/mall/delivery/delivery.md b/pages/mall/delivery/delivery.md new file mode 100644 index 00000000..3166bf09 --- /dev/null +++ b/pages/mall/delivery/delivery.md @@ -0,0 +1,191 @@ +✅ 明白了!你不需要完整代码,而是希望我**用简洁的 Markdown 文档形式,解释这个 `delivery` 文件夹下的项目结构和每个页面的功能定位**。 + +--- + +# 🚚 配送端模块项目结构说明(`/pages/mall/delivery/`) + +> 本模块为配送员使用的移动端应用核心功能区,涵盖个人中心、任务管理、收入统计、车辆管理等核心功能。 + +--- + +## 📁 目录结构概览 + +``` +delivery/ +├── index.uvue # 配送端首页(工作台) +├── profile.uvue # 个人中心 +├── profile-edit.uvue # 编辑个人信息 +├── settings.uvue # 设置页面 +├── tasks.uvue # 配送任务列表(按状态筛选) +├── task-detail.uvue # 单个任务详情页 +├── order-history.uvue # 历史订单列表 +├── order-detail.uvue # 订单详情页(从历史或当前跳转) +├── earnings.uvue # 收入明细 +├── ratings.uvue # 评价记录 +├── vehicle.uvue # 车辆管理主页 +├── vehicle-add.uvue # 添加车辆 +├── vehicle-edit.uvue # 编辑车辆信息 +└── index.uvue # 首页(与上面重复?应统一命名) +``` + +> 💡 注:`index.uvue` 出现两次,建议保留一个作为首页入口,另一个可重命名为 `dashboard.uvue` 或 `home.uvue` + +--- + +## 🧭 各页面功能说明 + +### 1. `index.uvue` —— **配送端首页 / 工作台** +- ✅ 核心入口页面 +- 📍 展示当前任务、今日数据、快捷操作入口 +- 🔄 可跳转到“个人中心”、“任务列表”、“收入明细”等 + +--- + +### 2. `profile.uvue` —— **个人中心** +- 👤 显示配送员基本信息(头像、姓名、评分、总单数) +- 📊 展示今日配送数据(完成单数、收入、里程、准时率) +- 📈 收入统计图表(最近7天) +- 🚗 功能菜单:收入明细、车辆管理、评价记录、帮助中心、意见反馈 + +--- + +### 3. `profile-edit.uvue` —— **编辑个人信息** +- 🖋️ 修改头像、姓名、身份证号、驾驶证、车辆信息、服务区域等 +- 📱 界面包含表单输入 + 保存按钮 +- ⬅️ 左上角返回按钮(箭头+文字垂直排列) +- 💾 数据本地模拟或调用API更新 + +--- + +### 4. `settings.uvue` —— **设置页面** +- ⚙️ 通用设置项(如通知、隐私、退出登录等) +- 🔐 安全相关设置(修改密码、绑定手机等) +- 📲 通常由 `profile.uvue` 中的“⚙️”图标进入 + +--- + +### 5. `tasks.uvue` —— **配送任务列表** +- 📋 按状态分类展示任务: + - 全部任务 + - 待接单 + - 配送中 + - 已完成 +- 🚀 点击任一任务 → 跳转至 `task-detail.uvue` +- 📈 页面顶部有“工作状态”切换开关(工作中/休息中) + +--- + +### 6. `task-detail.uvue` —— **任务详情页** +- 📍 显示取货地址、送达地址、距离、预计时间 +- 📞 “联系客户”按钮 +- 📝 查看任务详情(可选) +- ✅ 适用于“当前任务”或“待接单”的操作场景 + +--- + +### 7. `order-history.uvue` —— **历史订单列表** +- 📜 展示已完成、已接受、配送中的历史订单 +- 📌 包含订单号、状态、取送货地址、配送费、距离、时间 +- 🔍 点击“查看详情” → 跳转至 `order-detail.uvue`,并携带参数 `?from=history` +- 📅 支持查看“已完成”的订单(仅显示“联系客服”按钮) + +--- + +### 8. `order-detail.uvue` —— **订单详情页(多来源)** +- 🔄 从 `tasks.uvue` 或 `order-history.uvue` 进入 +- 🎯 **关键逻辑**: + - 若来自历史订单(`from=history`)且状态为“已完成” → 只显示“联系客服” + - 若来自历史订单且状态为“进行中” → 显示“接受/拒绝/导航/完成”等操作按钮 + - 若非历史来源 → 显示完整操作按钮 +- 📞 包含联系顾客、联系商家、联系客服三个联系方式 + +--- + +### 9. `earnings.uvue` —— **收入明细** +- 💰 展示总收入、用户打赏、商家打赏、总订单数 +- 📊 按订单聚合的收入数据列表 +- 📈 图表展示最近7天收入趋势 +- ➕ 加载更多按钮 + +--- + +### 10. `ratings.uvue` —— **评价记录** +- ⭐ 展示用户对配送员的评价 +- 📝 包含评分、评价内容、订单号、时间 +- 📊 统计平均分、好评率等 + +--- + +### 11. `vehicle.uvue` —— **车辆管理主页** +- 🚗 列出当前绑定的所有车辆 +- ➕ “添加车辆”按钮 +- 🖋️ 点击车辆 → 跳转至 `vehicle-edit.uvue` +- 🗑️ 支持删除、设为主用车等操作 + +--- + +### 12. `vehicle-add.uvue` —— **添加车辆** +- 📝 表单填写:车牌号、车型、行驶证照片、车辆类型等 +- ✅ 提交后绑定到当前账户 +- ⬅️ 返回车辆管理页 + +--- + +### 13. `vehicle-edit.uvue` —— **编辑车辆信息** +- 🖋️ 修改已有车辆信息(车牌、车型、照片等) +- 📸 支持重新上传行驶证照片 +- ✅ 保存后更新车辆信息 + +--- + +## 🔄 页面跳转关系图(简化版) + +``` +index.uvue + │ + ├──→ profile.uvue → profile-edit.uvue + │ + ├──→ tasks.uvue → task-detail.uvue + │ + ├──→ order-history.uvue → order-detail.uvue (from=history) + │ + ├──→ earnings.uvue + │ + ├──→ ratings.uvue + │ + └──→ vehicle.uvue → vehicle-add.uvue / vehicle-edit.uvue +``` + +--- + +## 🎯 设计原则 + +- ✅ **一致性**:所有页面使用相同导航栏样式(左上角返回按钮 + 居中标题) +- ✅ **响应式**:适配 H5、APP、小程序等平台 +- ✅ **状态驱动**:根据订单状态动态显示不同操作按钮 +- ✅ **用户体验优先**:历史订单跳转后只显示必要操作,避免冗余按钮 + +--- + +## 📌 建议优化点 + +| 问题 | 建议 | +|------|------| +| `index.uvue` 重复 | 重命名为 `dashboard.uvue` 或 `home.uvue` | +| 页面间参数传递 | 使用 `uni.navigateTo({ url: '?param=value' })` 并在 `onLoad` 中接收 | +| UTS 语法兼容性 | 如遇问题,可临时改用标准 TS 语法调试 | + +--- + +## ✅ 总结 + +这个 `delivery` 模块是一个完整的配送员工作系统,涵盖了: + +- **个人管理**(资料、设置) +- **任务处理**(接单、配送、完成) +- **数据统计**(收入、评价、历史) +- **车辆管理** + +结构清晰、功能完整,适合用于实际配送平台开发。 + +--- diff --git a/pages/mall/delivery/earnings.uvue b/pages/mall/delivery/earnings.uvue index b7740adb..c3bfc49a 100644 --- a/pages/mall/delivery/earnings.uvue +++ b/pages/mall/delivery/earnings.uvue @@ -3,10 +3,10 @@ - - - 返回主页 - + + + 返回上一页 + 收入明细 @@ -308,11 +308,9 @@ export default { } }, - // 返回主页 + // 返回到来源页面 goBackToHome() { - uni.reLaunch({ - url: '/pages/mall/delivery/index' - }) + uni.navigateBack() } } } @@ -336,7 +334,7 @@ type EarningType = { } - + \ No newline at end of file diff --git a/pages/mall/delivery/order-history.uvue b/pages/mall/delivery/order-history.uvue index f069b122..33159a9c 100644 --- a/pages/mall/delivery/order-history.uvue +++ b/pages/mall/delivery/order-history.uvue @@ -5,7 +5,6 @@ - 返回主页 @@ -54,7 +53,7 @@ - + @@ -107,6 +106,31 @@ export default { loadOrderHistory() { // TODO: 调用API获取历史订单列表 this.orderList = [ + { + id: '1', + order_no: 'D202501081234', + status: 4, // 已接取 + pickup_address: { + detail: '深圳公司', + area: '购物公园' + }, + delivery_address: { + detail: '梅州', + area: '海岸城' + }, + pickup_contact: { + name: '商家联系人', + phone: '138****6567' + }, + delivery_contact: { + name: '张先生', + phone: '139****9786' + }, + delivery_fee: 12.0, + distance: 8.2, + estimated_time: 25, + created_at: '2025-01-08T15:00:00Z' + }, { id: '2', order_no: 'D202501081235', @@ -131,6 +155,31 @@ export default { distance: 8.2, estimated_time: 25, created_at: '2025-01-08T15:00:00Z' + }, + { + id: '3', + order_no: 'D202501081236', + status: 2, // 取货中 + pickup_address: { + detail: '罗湖区东门步行街', + area: '罗湖' + }, + delivery_address: { + detail: '福田区市民中心', + area: '福田' + }, + pickup_contact: { + name: '商家联系人', + phone: '138****5678' + }, + delivery_contact: { + name: '李先生', + phone: '139****5678' + }, + delivery_fee: 10.0, + distance: 5.0, + estimated_time: 15, + created_at: '2025-01-08T16:00:00Z' } ] @@ -144,8 +193,8 @@ export default { case 1: return 'status-pending' case 2: return 'status-accepted' case 3: return 'status-picking' - case 4: return 'status-picked' - case 5: return 'status-delivering' // 这里我们用 '已完成' 的样式 + case 4: return 'status-picked' // 已取货 + case 5: return 'status-delivered' // 已送达 default: return 'status-default' } }, @@ -163,9 +212,9 @@ export default { }, // 查看订单详情 - viewOrderDetail(orderId: string) { + viewOrderDetail(orderId: string, status: number) { uni.navigateTo({ - url: `/pages/mall/delivery/order-detail?id=${orderId}` + url: `/pages/mall/delivery/order-detail?id=${orderId}&status=${status}` }) }, @@ -298,12 +347,12 @@ export default { color: #F57C00; } -.status-picked { +.status-picked { background-color: #E8F5E8; color: #388E3C; } -.status-delivering { +.status-delivered { background-color: #E8F5E8; color: #388E3C; } diff --git a/pages/mall/delivery/tasks.uvue b/pages/mall/delivery/tasks.uvue index cbeb10e3..5b762b69 100644 --- a/pages/mall/delivery/tasks.uvue +++ b/pages/mall/delivery/tasks.uvue @@ -230,10 +230,10 @@ function viewTaskDetail(taskId: string) { }) } -// 返回主页 +// 返回上一页 function goBackToHome() { uni.reLaunch({ - url: '/pages/mall/delivery/index' + url: '/pages/mall/delivery/profile' }) } diff --git a/pages/mall/delivery/vehicle-add.uvue b/pages/mall/delivery/vehicle-add.uvue new file mode 100644 index 00000000..1a7f129c --- /dev/null +++ b/pages/mall/delivery/vehicle-add.uvue @@ -0,0 +1,320 @@ +