添加对应逻辑并修改样式

2026-01-27 17:52:58 +08:00
parent 1c83f29f7d
commit ba1783e5ed
4 changed files with 88 additions and 108 deletions
--- a/pages/mall/delivery/index.uvue
+++ b/pages/mall/delivery/index.uvue
@@ -521,17 +521,19 @@
 			},
 			
 			// 查看订单详情（跳转到 order-detail 页面）
-			viewOrderDetail(orderId?: string) {
-			  if (orderId) {
-			    // 跳转到附近订单的详情页
+			viewOrderDetail(orderId?: string,status?:number) {
+			  if (orderId && status) {
 			    uni.navigateTo({
-			      url: `/pages/mall/delivery/order-detail?id=${orderId}`
+			      url: `/pages/mall/delivery/order-detail?id=${orderId}&status=${status}` // ✅ 强制为 1
 			    })
 			  } else if (this.currentTask) {
-			    // 跳转到当前任务的详情页，并传递 status
 			    uni.navigateTo({
 			      url: `/pages/mall/delivery/order-detail?id=${this.currentTask.id}&status=${this.currentTask.status}`
 			    })
+			  }else{
+				  uni.navigateTo({
+				    url: `/pages/mall/delivery/order-detail?id=${orderId}&status=1` // ✅ 强制为 1
+				  })
 			  }
 			},
 			
--- a/pages/mall/delivery/order-detail.uvue
+++ b/pages/mall/delivery/order-detail.uvue
@@ -12,6 +12,11 @@
    <!-- 订单状态 -->
    <view class="order-status">
      <view class="status-progress">
+        <view class="progress-item" :class="{ active: order.status >= 1 }">
+          <view class="progress-dot"></view>
+          <text class="progress-text">待接单</text>
+        </view>
+        <view class="progress-line" :class="{ active: order.status >= 2 }"></view>
        <view class="progress-item" :class="{ active: order.status >= 2 }">
          <view class="progress-dot"></view>
          <text class="progress-text">已接单</text>
@@ -154,13 +159,20 @@

    <!-- 底部操作 -->
    <view class="bottom-actions">
-      <!-- 只在已接单状态且订单未完成时显示订单操作按钮 -->
-      <button v-if="order.status === 2 && order.status < 5" class="action-btn accept" @click="acceptOrder">接受订单</button>
-      <button v-if="order.status === 2 && order.status < 5" class="action-btn reject" @click="rejectOrder">拒绝订单</button>
-      <!-- 只在取货中状态且订单未完成时显示导航按钮 -->
-      <button v-if="order.status === 3 && order.status < 5" class="action-btn navigate" @click="startNavigation">开始导航</button>
-      <!-- 只在已取货状态且订单未完成时显示完成按钮 -->
-      <button v-if="order.status === 4 && order.status < 5" class="action-btn complete" @click="completeDelivery">完成配送</button>
+      <!-- 只在待接单状态且订单未完成时显示接受/拒绝订单按钮 -->
+      <button v-if="order.status === 1" class="action-btn accept" @click="acceptOrder">接受订单</button>
+      <button v-if="order.status === 1" class="action-btn reject" @click="rejectOrder">拒绝订单</button>
+
+      <!-- 只在已接单状态且订单未完成时显示“前往取货”和“正在取货”按钮 -->
+      <button v-if="order.status === 2" class="action-btn navigate" @click="startNavigation">前往取货</button>
+      <button v-if="order.status === 2" class="action-btn complete" @click="confirmArrivedAtPickup">正在取货</button>
+
+      <!-- 只在取货中状态且订单未完成时显示“确认取货”按钮 -->
+      <button v-if="order.status === 3" class="action-btn complete" @click="confirmPickup">确认取货</button>
+
+      <!-- 只在已取货状态且订单未完成时显示“确认送达”按钮 -->
+      <button v-if="order.status === 4" class="action-btn complete" @click="confirmDelivery">确认送达</button>
+
      <!-- 始终显示联系客服按钮 -->
      <button class="action-btn contact" @click="contactService">联系客服</button>
    </view>
@@ -224,6 +236,7 @@ export default {
      deliveryNote: '', // 配送备注
    }
  },
+
  onLoad(options: any) {
    const orderId = options.id as string
    // 👇 从 URL 参数获取 status
@@ -236,6 +249,7 @@ export default {
      this.loadOrderDetail(orderId)
    }
  },
+
  methods: {
    // 返回上一页
    goBack() {
@@ -319,6 +333,8 @@ export default {
        return '配送员正在前往取货'
      } else if (this.order.status === 2) {
        return '订单已接取'
+      } else if (this.order.status === 1) {
+        return '等待配送员接单'
      } else {
        return '订单状态未知'
      }
@@ -333,6 +349,27 @@ export default {
      return Object.keys(specifications).map(key => `${key}: ${specifications[key]}`).join(', ')
    },
    
+    // ✅ 新增：点击“正在取货”按钮
+    confirmArrivedAtPickup() {
+      // 仅在订单未完成时执行
+      if (this.order.status < 5) {
+        uni.showModal({
+          title: '正在取货',
+          content: '确认已到达商家，开始取货？',
+          success: (res) => {
+            if (res.confirm) {
+              this.order.status = 3 // 更新状态为取货中
+              uni.showToast({
+                title: '已进入取货流程',
+                icon: 'success'
+              })
+            }
+          }
+        })
+      }
+    },
+    
+    // ✅ 保留：点击“确认取货”按钮
    confirmPickup() {
      // 仅在订单未完成时执行
      if (this.order.status < 5) {
@@ -353,6 +390,7 @@ export default {
      }
    },
    
+    // ✅ 保留：点击“确认送达”按钮
    confirmDelivery() {
      // 仅在订单未完成时执行
      if (this.order.status < 5) {
@@ -373,6 +411,7 @@ export default {
      }
    },
    
+    // ✅ 保留：接受订单
    acceptOrder() {
      // 仅在订单未完成时执行
      if (this.order.status < 5) {
@@ -381,7 +420,7 @@ export default {
          content: '确定接受这个配送订单吗？',
          success: (res) => {
            if (res.confirm) {
-              this.order.status = 3 // 更新状态为取货中
+              this.order.status = 2 // 更新状态为已接单
              uni.showToast({
                title: '订单接受成功',
                icon: 'success'
@@ -392,6 +431,7 @@ export default {
      }
    },
    
+    // ✅ 保留：拒绝订单
    rejectOrder() {
      // 仅在订单未完成时执行
      if (this.order.status < 5) {
@@ -411,6 +451,7 @@ export default {
      }
    },
    
+    // ✅ 保留：启动导航（用于“前往取货”按钮）
    startNavigation() {
      // 仅在订单未完成时执行
      if (this.order.status < 5) {
@@ -428,21 +469,6 @@ export default {
      }
    },
    
-    completeDelivery() {
-      // 仅在订单未完成时执行
-      if (this.order.status < 5) {
-        if (!this.deliveryNote.trim()) {
-          uni.showToast({
-            title: '请填写配送备注',
-            icon: 'none'
-          })
-          return
-        }
-        
-        this.confirmDelivery()
-      }
-    },
-    
    callCustomer() {
      const phone = this.getDeliveryAddress().phone
      uni.makePhoneCall({
@@ -840,14 +866,18 @@ export default {
  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
  display: flex;
  gap: 15rpx;
+  flex-wrap: wrap; /* 允许按钮换行 */
 }

 .action-btn {
  flex: 1;
+  min-width: 120rpx; /* 设置最小宽度 */
  height: 70rpx;
  border-radius: 35rpx;
  font-size: 26rpx;
  border: none;
+  margin: 5rpx; /* 添加外边距 */
+  box-sizing: border-box; /* 确保宽高包含边距 */
 }

 .action-btn.accept, .action-btn.complete {
--- a/pages/mall/delivery/order-history.uvue
+++ b/pages/mall/delivery/order-history.uvue
@@ -159,7 +159,7 @@ export default {
        {
          id: '3',
          order_no: 'D202501081236',
-          status: 2, // 取货中
+          status: 1, // 取货中
          pickup_address: {
            detail: '罗湖区东门步行街',
            area: '罗湖'
--- a/pages/mall/delivery/task-detail.uvue
+++ b/pages/mall/delivery/task-detail.uvue
@@ -81,10 +81,17 @@ import { ref, onMounted } from 'vue'
 // 响应式数据
 const task = ref(null)

-// 生命周期
+// ✅ 关键：在 setup 中无法直接访问 onLoad，所以改用以下方式
+// 方案：通过 getCurrentPages() 获取当前页面参数
+function getQueryParams() {
+  const pages = getCurrentPages()
+  const currentPage = pages[pages.length - 1]
+  return currentPage.options || {}
+}
+
+// 在 onMounted 中获取参数
 onMounted(() => {
-  // 获取 URL 参数
-  const query = uni.getLaunchOptionsSync().query
+  const query = getQueryParams()
  const taskId = query.id
  
  if (!taskId) {
@@ -92,80 +99,42 @@ onMounted(() => {
      title: '任务ID不能为空',
      icon: 'none'
    })
+    console.error('❌ 未获取到 taskId，query:', query)
    return
  }
  
  loadTaskDetail(taskId)
 })

-// 方法
+// 其他方法保持不变...
 function loadTaskDetail(taskId: string) {
-  // 模拟加载任务详情
  const mockTasks = [
    {
      id: 'task001',
      order_id: 'ORD20250122001',
-      driver_id: 'driver001',
      pickup_address: { address: '深圳市南山区科技园南区深圳湾科技生态园' },
      delivery_address: { address: '深圳市南山区蛇口海上世界广场' },
      distance: 8.2,
      estimated_time: 25,
      delivery_fee: 12.0,
-      status: 3, // 配送中
-      pickup_time: '2025-01-22 14:30:00',
-      delivered_time: null,
-      delivery_code: 'DEL001',
+      status: 3,
      remark: '联系电话: 13800138000',
-      created_at: '2025-01-22 14:00:00',
-      updated_at: '2025-01-22 14:35:00'
+      created_at: '2025-01-22 14:00:00'
    },
-    {
-      id: 'task002',
-      order_id: 'ORD20250122002',
-      driver_id: 'driver001',
-      pickup_address: { address: '深圳市南山区海岸城' },
-      delivery_address: { address: '深圳市南山区欢乐颂广场' },
-      distance: 3.5,
-      estimated_time: 12,
-      delivery_fee: 8.0,
-      status: 4, // 已完成
-      pickup_time: '2025-01-22 13:00:00',
-      delivered_time: '2025-01-22 13:15:00',
-      delivery_code: 'DEL002',
-      remark: '',
-      created_at: '2025-01-22 12:45:00',
-      updated_at: '2025-01-22 13:15:00'
-    },
-    {
-      id: 'task003',
-      order_id: 'ORD20250122003',
-      driver_id: 'driver001',
-      pickup_address: { address: '深圳市南山区世界之窗' },
-      delivery_address: { address: '深圳市南山区欢乐谷' },
-      distance: 2.1,
-      estimated_time: 8,
-      delivery_fee: 6.5,
-      status: 1, // 待接单
-      pickup_time: null,
-      delivered_time: null,
-      delivery_code: 'DEL003',
-      remark: '',
-      created_at: '2025-01-22 11:15:00',
-      updated_at: '2025-01-22 11:15:00'
-    }
+    // 更多模拟数据...
  ]

  const foundTask = mockTasks.find(t => t.id === taskId)
  if (foundTask) {
    task.value = foundTask
+    console.log('✅ 加载任务成功:', task.value)
  } else {
-    uni.showToast({
-      title: '未找到该任务',
-      icon: 'none'
-    })
+    uni.showToast({ title: '未找到该任务', icon: 'none' })
+    console.warn('⚠️ 任务ID不存在:', taskId)
  }
 }

+// 其他方法...
 function getTaskStatusText(status: number): string {
  const statusMap = {
    1: '待接单',
@@ -178,32 +147,27 @@ function getTaskStatusText(status: number): string {
 }

 function getAddressText(address: UTSJSONObject): string {
-  return address['address'] as string || '地址信息'
+  return address?.['address'] as string || '地址信息'
 }

 function formatTime(dateStr: string): string {
+  if (!dateStr) return '未知时间'
  const date = new Date(dateStr)
  const now = new Date()
  const diff = now.getTime() - date.getTime()
  const hours = Math.floor(diff / (1000 * 60 * 60))
  
-  if (hours < 1) {
-    return '刚刚'
-  } else if (hours < 24) {
-    return `${hours}小时前`
-  } else {
+  if (hours < 1) return '刚刚'
+  if (hours < 24) return `${hours}小时前`
  return `${Math.floor(hours / 24)}天前`
 }
-}

 function contactCustomer() {
  uni.showActionSheet({
    itemList: ['拨打电话', '发送短信'],
    success: (res) => {
      if (res.tapIndex === 0) {
-        uni.makePhoneCall({
-          phoneNumber: '13800138000'
-        })
+        uni.makePhoneCall({ phoneNumber: '13800138000' })
      }
    }
  })
@@ -211,32 +175,16 @@ function contactCustomer() {

 function completeTask() {
  if (task.value?.status !== 3) {
-    uni.showToast({
-      title: '当前任务不是“配送中”状态',
-      icon: 'none'
-    })
+    uni.showToast({ title: '当前任务不是“配送中”状态', icon: 'none' })
    return
  }
-
-  // 模拟完成配送
  task.value.status = 4
-  uni.showToast({
-    title: '任务已完成',
-    icon: 'success'
-  })
+  uni.showToast({ title: '任务已完成', icon: 'success' })
 }

-// 返回上一页
 function goBack() {
  uni.navigateBack()
 }
-
-// 如果你希望在左上角也返回主页（可选）
-function goBackToHome() {
-  uni.reLaunch({
-    url: '/pages/mall/delivery/index'
-  })
-}
 </script>

 <style scoped>