feat:优化微信小程序可以运行

wlzboy

2025-10-26 5c5cddb1c2ee0d19adddebaf3a3a10a6d93fd2ad

 app/pages/index.vue

@@ -4,18 +4,29 @@
    <view class="user-info-section">
      <view class="user-info-content">
        <view class="user-details">
          <view class="user-name">{{ userName || '未登录' }}</view>
          <view class="vehicle-info">
            <text v-if="boundVehicle">关联车牌号：{{ boundVehicle }}</text>
            <text v-else>未绑定车牌号</text>
          <view class="user-info-row">
            <text class="user-name">{{ userName || '未登录' }}</text>
            <text class="separator" v-if="currentUser.branchCompanyName">|</text>
            <view class="branch-company" v-if="currentUser.branchCompanyName">
              <uni-icons type="location" size="16" color="#666" style="margin-right: 4rpx;"></uni-icons>
              <text>{{ currentUser.branchCompanyName }}</text>
            </view>
            <text class="separator" v-if="boundVehicle">|</text>
            <view class="vehicle-info" @click.stop="goToBindVehicle" v-if="boundVehicle">
              <text>{{ boundVehicle }}</text>
              <uni-icons 
                type="loop" 
                size="16" 
                color="#007AFF"
                style="margin-left: 4rpx;"
              ></uni-icons>
            </view>
          </view>
          <view class="bind-vehicle-btn" v-if="!boundVehicle" @click="goToBindVehicle">
            <uni-icons type="plus-filled" size="16" color="#007AFF" style="margin-right: 4rpx;"></uni-icons>
            <text>绑定车牌</text>
          </view>
        </view>
        <button 
          class="bind-vehicle-btn" 
          @click="goToBindVehicle"
        >
          {{ boundVehicle ? '更换车辆' : '绑定车辆' }}
        </button>
      </view>
    </view>

@@ -41,18 +52,21 @@
      <view class="task-list">
        <view class="task-item" v-for="task in runningTasks" :key="task.id">
          <view class="task-main" @click="viewTaskDetail(task)">
            <view class="task-title">{{ getTaskTypeText(task.type) }} - {{ task.vehicle }}</view>
            <view class="task-info">
              <view class="info-row">
                <view class="info-item">
                  <view class="label">任务编号:</view>
                  <view class="value">{{ task.taskNo }}</view>
                </view>
                <view class="info-item">
                  <view class="label">任务状态:</view>
                  <view class="value">{{ getStatusText(task.status) }}</view>
                </view>
            <!-- 任务头部：标题和状态标签 -->
            <view class="task-header">
              <view class="task-title">{{ getTaskTypeText(task.type) }} - {{ task.vehicle }}</view>
              <view class="task-status" :class="task.taskStatus === 'PENDING' ? 'status-pending' : task.taskStatus === 'DEPARTING' ? 'status-departing' : task.taskStatus === 'ARRIVED' ? 'status-arrived' : task.taskStatus === 'RETURNING' ? 'status-returning' : task.taskStatus === 'COMPLETED' ? 'status-completed' : task.taskStatus === 'CANCELLED' ? 'status-cancelled' : task.taskStatus === 'IN_PROGRESS' ? 'status-in-progress' : 'status-default'">
                {{ getStatusText(task.status) }}
              </view>
            </view>
            
            <!-- 任务编号单独一行 -->
            <view class="task-code-row">
              <text class="task-code">{{ task.taskNo }}</text>
            </view>
            
            <!-- 任务详细信息 -->
            <view class="task-info">
              <view class="info-row">
                <view class="info-item">
                  <view class="label">出发地:</view>
@@ -78,46 +92,59 @@
          
          <!-- 操作按钮 -->
          <view class="task-actions">
            <button 
              class="action-btn" 
              :class="{ disabled: isActionDisabled(task, 'depart') }"
              @click="handleTaskAction(task, 'depart')"
              v-if="task.status !== 'completed'"
            >
              出发
            </button>
            <button 
              class="action-btn" 
              :class="{ disabled: isActionDisabled(task, 'arrive') }"
              @click="handleTaskAction(task, 'arrive')"
              v-if="task.status !== 'completed'"
            >
              已到达
            </button>
            <button 
              class="action-btn" 
              :class="{ disabled: isActionDisabled(task, 'return') }"
              @click="handleTaskAction(task, 'return')"
              v-if="task.status !== 'completed'"
            >
              返程
            </button>
            <button 
              class="action-btn" 
              :class="{ disabled: isActionDisabled(task, 'settle') }"
              @click="handleTaskAction(task, 'settle')"
              v-if="task.status !== 'completed'"
            >
              结算
            </button>
            <button 
              class="action-btn primary" 
              :class="{ disabled: isActionDisabled(task, 'complete') }"
              @click="handleTaskAction(task, 'complete')"
              v-if="task.status !== 'completed'"
            >
              已完成
            </button>
            <!-- 待处理状态: 显示出发、取消 -->
            <template v-if="task.taskStatus === 'PENDING'">
              <button 
                class="action-btn primary" 
                @click="handleTaskAction(task, 'depart')"
              >
                出发
              </button>
              <button 
                class="action-btn cancel" 
                @click="handleTaskAction(task, 'cancel')"
              >
                取消
              </button>
            </template>
            
            <!-- 出发中状态: 显示已到达、强制结束 -->
            <template v-else-if="task.taskStatus === 'DEPARTING'">
              <button 
                class="action-btn primary" 
                @click="handleTaskAction(task, 'arrive')"
              >
                已到达
              </button>
              <button 
                class="action-btn cancel" 
                @click="handleTaskAction(task, 'forceCancel')"
              >
                强制结束
              </button>
            </template>
            
            <!-- 已到达状态: 显示已返程 -->
            <template v-else-if="task.taskStatus === 'ARRIVED'">
              <button 
                class="action-btn primary" 
                @click="handleTaskAction(task, 'return')"
              >
                已返程
              </button>
            </template>
            
            <!-- 返程中状态: 显示已完成 -->
            <template v-else-if="task.taskStatus === 'RETURNING'">
              <button 
                class="action-btn primary" 
                @click="handleTaskAction(task, 'complete')"
              >
                已完成
              </button>
            </template>
            
            <!-- 已完成/已取消: 不显示按钮 -->
          </view>
        </view>
        
@@ -132,128 +159,210 @@

<script>
  import { mapState } from 'vuex'
  import { getMyTasks, changeTaskStatus } from '@/api/task'
  import { getUserProfile } from '@/api/system/user'
  import { getUserBoundVehicle } from '@/api/vehicle'
  import { getUnreadCount } from '@/api/message'
  
  export default {
    data() {
      return {
        // 模拟用户绑定的车辆信息
        boundVehicle: '粤A12345', // 模拟已绑定车辆
        // 用户绑定的车辆信息
        boundVehicle: '',
        boundVehicleId: null,
        
        // 模拟消息数据
        messages: [
          {
            id: 1,
            type: 'create', // 创建成功
            content: 'TD 1011 广州天河->广州东站，时间：13：20 任务创建成功',
            time: '2023-05-15 13:20',
            read: false,
            taskId: 1
          },
          {
            id: 2,
            type: 'push', // 任务推送
            content: 'TD1021 广州天河->广州东站，时间：13：20 出发，请及时处理',
            time: '2023-05-15 13:25',
            read: false,
            taskId: 2
          },
          {
            id: 3,
            type: 'status', // 任务状态变更
            content: 'TD1021 广州天河->广州东站，时间：13：20，任务正在转运中',
            time: '2023-05-15 14:30',
            read: true,
            taskId: 2
          },
          {
            id: 4,
            type: 'create', // 创建成功
            content: 'TD 1022 深圳南山->深圳福田，时间：15：10 任务创建成功',
            time: '2023-05-15 15:10',
            read: false,
            taskId: 3
          },
          {
            id: 5,
            type: 'push', // 任务推送
            content: 'TD1023 深圳南山->深圳福田，时间：16：00 出发，请及时处理',
            time: '2023-05-15 16:00',
            read: true,
            taskId: 4
          }
        ],
        // 消息数据
        messages: [],
        unreadMessageCount: 0,
        
        // 模拟正在运行的任务列表
        taskList: [
          {
            id: 1,
            title: '紧急维修任务',
            type: 'maintenance', // 维修保养
            startLocation: '广州市天河区XX路123号',
            endLocation: '广州市白云区YY路456号',
            startTime: '2023-05-15 15:00',
            assignee: '张三',
            status: 'pending',
            vehicle: '粤A12345',
            taskNo: 'RW20230515001'
          },
          {
            id: 2,
            title: '定期保养任务',
            type: 'maintenance', // 维修保养
            startLocation: '深圳市南山区XX路789号',
            endLocation: '深圳市福田区YY路999号',
            startTime: '2023-05-14 10:00',
            assignee: '李四',
            status: 'processing',
            vehicle: '粤B67890',
            taskNo: 'RW20230514002'
          },
          {
            id: 5,
            title: '急救转运任务',
            type: 'emergency', // 急救转运
            startLocation: '广州市越秀区医院路1号',
            endLocation: '广州市海珠区医院路2号',
            startTime: '2023-05-16 14:00',
            assignee: '张医生,李护士',
            status: 'pending',
            vehicle: '粤E33333',
            taskNo: 'RW20230516005'
          },
          {
            id: 6,
            title: '福祉车任务',
            type: 'welfare', // 福祉车
            startLocation: '广州市荔湾区社区路10号',
            endLocation: '广州市天河区养老院路20号',
            startTime: '2023-05-17 08:00',
            assignee: '王司机',
            status: 'processing',
            vehicle: '粤F44444',
            taskNo: 'RW20230517006'
          }
        ]
        // 正在运行的任务列表
        taskList: [],
        loading: false
      }
    },
    computed: {
      ...mapState({
        userName: state => state.user.name
        userName: state => state.user.nickName,
        currentUser: state => state.user
      }),
      
      // 正在运行的任务（待处理和处理中的任务）
      // 正在运行的任务（待处理和各种处理中的任务）
      runningTasks() {
        return this.taskList.filter(task => 
          task.status === 'pending' || task.status === 'processing'
        );
      },
      
      // 未读消息数量
      unreadMessageCount() {
        return this.messages.filter(message => !message.read).length;
        return this.taskList.filter(task => {
          // 包含待处理、出发中、已到达、返程中等所有未完成的状态
          return ['PENDING', 'DEPARTING', 'ARRIVED', 'RETURNING', 'IN_PROGRESS'].includes(task.taskStatus)
        });
      }
    },
    onLoad() {
      // 加载用户绑定车辆信息
      this.loadUserVehicle()
      // 加载正在运行的任务
      this.loadRunningTasks()
      // 加载未读消息数量
      this.loadUnreadMessageCount()
    },
    onShow() {
      // 每次显示页面时刷新任务列表、绑定车辆和消息数量
      this.loadUserVehicle()
      this.loadRunningTasks()
      this.loadUnreadMessageCount()
    },
    onPullDownRefresh() {
      // 下拉刷新
      this.loadRunningTasks()
      setTimeout(() => {
        uni.stopPullDownRefresh()
      }, 1000)
    },
    methods: {
      // 加载用户绑定的车辆信息
      loadUserVehicle() {
        const userId = this.currentUser.userId
        if (!userId) {
          console.error('用户未登录，无法获取绑定车辆信息')
          this.boundVehicle = ''
          this.boundVehicleId = null
          return
        }
        
        getUserBoundVehicle(userId).then(response => {
          if (response.code === 200 && response.data) {
            const vehicle = response.data
            this.boundVehicle = vehicle.vehicleNumber || '未知车牌'
            this.boundVehicleId = vehicle.vehicleId
            console.log('用户绑定车辆:', this.boundVehicle)
          } else {
            this.boundVehicle = ''
            this.boundVehicleId = null
          }
        }).catch(error => {
          console.error('获取绑定车辆信息失败:', error)
          this.boundVehicle = ''
          this.boundVehicleId = null
        })
      },
      
      // 加载未读消息数量
      loadUnreadMessageCount() {
        getUnreadCount().then(response => {
          if (response.code === 200) {
            this.unreadMessageCount = response.data || 0
          }
        }).catch(error => {
          console.error('获取未读消息数量失败:', error)
        })
      },
      
      // 加载用户信息（保留以兼容之前的代码）
      loadUserProfile() {
        const userId = this.currentUser.userId
        if (!userId) {
          console.error('用户未登录，无法获取用户信息')
          return
        }
        
        getUserProfile().then(response => {
          const userInfo = response.data || response
          // 获取用户绑定的车辆信息
          if (userInfo.boundVehicle) {
            this.boundVehicle = userInfo.boundVehicle.vehicleNumber
            this.boundVehicleId = userInfo.boundVehicle.vehicleId
          }
        }).catch(error => {
          console.error('获取用户信息失败:', error)
        })
      },
      
      // 加载正在运行的任务
      loadRunningTasks() {
        const userId = this.currentUser.userId
        if (!userId) {
          console.error('用户未登录，无法加载任务列表')
          return
        }
        
        this.loading = true
        // 使用 /task/my 接口获取当前用户相关的所有任务（用户创建、分配给用户、执行人是用户）
        getMyTasks().then(response => {
          this.loading = false
          // 根据后端返回的数据结构进行解析
          const data = response.data || response.rows || response || []
          // 过滤出未完成的任务
          const allTasks = Array.isArray(data) ? data : []
          this.taskList = allTasks
            .filter(task => {
              // 只显示未完成和未取消的任务
              return task.taskStatus !== 'COMPLETED' && task.taskStatus !== 'CANCELLED'
            })
            .map(task => {
              // 从assignedVehicles数组中获取车辆信息
              let vehicleInfo = '未分配车辆'
              if (task.assignedVehicles && task.assignedVehicles.length > 0) {
                const firstVehicle = task.assignedVehicles[0]
                vehicleInfo = firstVehicle.vehicleNo || '未知车牌'
                if (task.assignedVehicles.length > 1) {
                  vehicleInfo += ` 等${task.assignedVehicles.length}辆`
                }
              }
              
              return {
                ...task,
                // 格式化显示字段
                id: task.taskId,
                type: task.taskType,
                vehicle: vehicleInfo,
                vehicleList: task.assignedVehicles || [],
                startLocation: this.formatAddress(task.departureAddress || task.startLocation || '未设置'),
                endLocation: this.formatAddress(task.destinationAddress || task.endLocation || '未设置'),
                startTime: task.plannedStartTime ? this.formatDateTime(task.plannedStartTime) : '未设置',
                assignee: task.assigneeName || '未分配',
                taskNo: task.taskCode || '未知编号',
                status: this.convertStatus(task.taskStatus) // 转换状态格式以兼容旧UI
              }
            })
        }).catch(error => {
          this.loading = false
          console.error('加载任务列表失败:', error)
        })
      },
      
      // 格式化日期时间
      formatDateTime(dateTime) {
        if (!dateTime) return ''
        const date = new Date(dateTime)
        return date.toLocaleString('zh-CN', {
          year: 'numeric',
          month: '2-digit',
          day: '2-digit',
          hour: '2-digit',
          minute: '2-digit'
        })
      },
      
      // 格式化地址 - 只显示-前面的部分
      formatAddress(address) {
        if (!address) return '未设置'
        const dashIndex = address.indexOf('-')
        if (dashIndex > 0) {
          return address.substring(0, dashIndex)
        }
        return address
      },
      
      // 转换状态格式（将数据库状态转换为UI使用的状态）
      convertStatus(dbStatus) {
        const statusMap = {
          'PENDING': 'pending',
          'DEPARTING': 'processing',
          'ARRIVED': 'processing',
          'RETURNING': 'processing',
          'IN_PROGRESS': 'processing',
          'COMPLETED': 'completed',
          'CANCELLED': 'cancelled'
        }
        return statusMap[dbStatus] || 'pending'
      },
      // 跳转到绑定车辆页面
      goToBindVehicle() {
        // 跳转到绑定车辆的页面
@@ -267,79 +376,145 @@
      
      // 查看任务详情
      viewTaskDetail(task) {
        // 跳转到任务详情页面
        this.$tab.navigateTo(`/pages/task/detail?id=${task.id}`);
      },
      
      // 判断操作按钮是否禁用
      isActionDisabled(task, action) {
        // 根据任务状态和操作类型判断是否禁用
        switch (action) {
          case 'depart':
            return task.status !== 'pending';
          case 'arrive':
            return task.status !== 'processing';
          case 'return':
            return task.status !== 'processing';
          case 'settle':
            return task.status !== 'processing';
          case 'complete':
            return task.status !== 'processing';
          default:
            return false;
        }
        // 跳转到任务详情页面 - 使用taskId
        this.$tab.navigateTo(`/pages/task/detail?id=${task.taskId || task.id}`);
      },
      
      // 处理任务操作
      handleTaskAction(task, action) {
        if (this.isActionDisabled(task, action)) {
          return;
        }
        
        switch (action) {
          case 'depart':
            // 出发操作，根据任务类型显示不同的确认信息
            let departMessage = '确定要标记为已出发吗？';
            if (task.type !== 'maintenance' && task.type !== 'refuel' && task.type !== 'inspection') {
              departMessage = '发出去目的地,确认？';
            }
            this.$modal.confirm(departMessage).then(() => {
              task.status = 'processing';
              this.$modal.showToast('已出发');
              // 这里可以调用API更新任务状态
            // 出发 -> 状态变为出发中
            this.$modal.confirm('确定要出发吗？').then(() => {
              this.updateTaskStatus(task.taskId, 'DEPARTING', '任务已出发')
            }).catch(() => {});
            break;
            
          case 'cancel':
            // 取消 -> 二次确认后状态变为已取消
            this.$modal.confirm('确定要取消此任务吗？').then(() => {
              this.updateTaskStatus(task.taskId, 'CANCELLED', '任务已取消')
            }).catch(() => {});
            break;
            
          case 'arrive':
            // 已到达操作
            this.$modal.confirm('已经到达目的地，确认？').then(() => {
              this.$modal.showToast('已到达');
              // 这里可以调用API更新任务状态
            // 已到达 -> 状态变为已到达
            this.$modal.confirm('确认已到达目的地？').then(() => {
              this.updateTaskStatus(task.taskId, 'ARRIVED', '已到达目的地')
            }).catch(() => {});
            break;
            
          case 'forceCancel':
            // 强制结束 -> 状态变为已取消
            this.$modal.confirm('确定要强制结束此任务吗？').then(() => {
              this.updateTaskStatus(task.taskId, 'CANCELLED', '任务已强制结束')
            }).catch(() => {});
            break;
            
          case 'return':
            // 返程操作
            this.$modal.confirm('现在已经返程中，确认？').then(() => {
              this.$modal.showToast('返程中');
              // 这里可以调用API更新任务状态
            // 已返程 -> 状态变为返程中
            this.$modal.confirm('确认开始返程？').then(() => {
              this.updateTaskStatus(task.taskId, 'RETURNING', '已开始返程')
            }).catch(() => {});
            break;
          case 'settle':
            // 结算操作，跳转到结算页面
            this.$tab.navigateTo(`/pages/task/settlement?id=${task.id}`);
            break;
            
          case 'complete':
            // 已完成操作
            this.$modal.confirm('任务是否已经全部完成，确认？').then(() => {
              task.status = 'completed';
              this.$modal.showToast('任务已完成');
              // 这里可以调用API更新任务状态
            // 已完成 -> 状态变为已完成
            this.$modal.confirm('确认任务已完成？').then(() => {
              this.updateTaskStatus(task.taskId, 'COMPLETED', '任务已完成')
            }).catch(() => {});
            break;
        }
      },
      
      // 更新任务状态
      updateTaskStatus(taskId, status, remark) {
        // 获取GPS位置信息
        this.getLocationAndUpdateStatus(taskId, status, remark)
      },
      
      // 获取位置信息并更新状态
      getLocationAndUpdateStatus(taskId, status, remark) {
        const that = this
        
        // 使用uni.getLocation获取GPS位置
        uni.getLocation({
          type: 'gcj02',
          geocode: true,
          altitude: true,
          success: function(res) {
            console.log('GPS定位成功:', res)
            
            const statusData = {
              taskStatus: status,
              remark: remark,
              latitude: res.latitude,
              longitude: res.longitude,
              locationAddress: res.address ? res.address.street || res.address.poiName || '' : '',
              locationProvince: res.address ? res.address.province || '' : '',
              locationCity: res.address ? res.address.city || '' : '',
              locationDistrict: res.address ? res.address.district || '' : '',
              gpsAccuracy: res.accuracy,
              altitude: res.altitude,
              speed: res.speed,
              heading: res.direction || res.heading
            }
            
            changeTaskStatus(taskId, statusData).then(response => {
              that.$modal.showToast('状态更新成功')
              that.loadRunningTasks()
            }).catch(error => {
              console.error('更新任务状态失败:', error)
              that.$modal.showToast('状态更新失败，请重试')
            })
          },
          fail: function(err) {
            console.error('GPS定位失败:', err)
            
            that.$modal.confirm('GPS定位失败，是否继续更新状态？').then(() => {
              const statusData = {
                taskStatus: status,
                remark: remark
              }
              
              changeTaskStatus(taskId, statusData).then(response => {
                that.$modal.showToast('状态更新成功')
                that.loadRunningTasks()
              }).catch(error => {
                console.error('更新任务状态失败:', error)
                that.$modal.showToast('状态更新失败，请重试')
              })
            }).catch(() => {})
          }
        })
      },
      
      // 获取状态样式类
      getStatusClass(status) {
        const statusClassMap = {
          'PENDING': 'status-pending',
          'DEPARTING': 'status-departing',
          'ARRIVED': 'status-arrived',
          'RETURNING': 'status-returning',
          'COMPLETED': 'status-completed',
          'CANCELLED': 'status-cancelled',
          'IN_PROGRESS': 'status-in-progress'
        }
        return statusClassMap[status] || 'status-default'
      },
      
      getStatusText(status) {
        // 支持新旧两种状态格式
        const statusMap = {
          // 新格式（数据库状态）
          'PENDING': '待处理',
          'DEPARTING': '出发中',
          'ARRIVED': '已到达',
          'RETURNING': '返程中',
          'COMPLETED': '已完成',
          'CANCELLED': '已取消',
          'IN_PROGRESS': '处理中',
          // 旧格式（UI状态）
          'pending': '待处理',
          'processing': '处理中',
          'completed': '已完成'
@@ -349,6 +524,13 @@
      
      getTaskTypeText(type) {
        const typeMap = {
          // 新格式（数据库类型）
          'MAINTENANCE': '维修保养',
          'FUEL': '加油',
          'OTHER': '其他',
          'EMERGENCY_TRANSFER': '急救转运',
          'WELFARE': '福祉车',
          // 旧格式（UI类型）
          'maintenance': '维修保养',
          'refuel': '加油',
          'inspection': '巡检',
@@ -402,25 +584,51 @@
      align-items: center;
      
      .user-details {
        .user-name {
          font-size: 36rpx;
          font-weight: bold;
          margin-bottom: 10rpx;
          color: #333;
        flex: 1;
        
        .user-info-row {
          display: flex;
          align-items: center;
          flex-wrap: wrap;
          margin-bottom: 12rpx;
          
          .user-name {
            font-size: 32rpx;
            font-weight: bold;
            color: #333;
          }
          
          .separator {
            margin: 0 12rpx;
            color: #ddd;
            font-size: 28rpx;
          }
          
          .branch-company {
            font-size: 26rpx;
            color: #666;
            display: flex;
            align-items: center;
          }
          
          .vehicle-info {
            font-size: 26rpx;
            color: #007AFF;
            display: flex;
            align-items: center;
          }
        }
        
        .vehicle-info {
          font-size: 28rpx;
          color: #666;
        .bind-vehicle-btn {
          font-size: 26rpx;
          color: #007AFF;
          display: flex;
          align-items: center;
          
          &:active {
            opacity: 0.7;
          }
        }
      }
      
      .bind-vehicle-btn {
        background-color: #007AFF;
        color: white;
        border-radius: 10rpx;
        padding: 15rpx 30rpx;
        font-size: 28rpx;
      }
    }
  }
@@ -514,10 +722,90 @@
          padding: 30rpx;
          border-bottom: 1rpx solid #f0f0f0;
          
          .task-title {
            font-size: 32rpx;
            font-weight: bold;
            margin-bottom: 20rpx;
          // 任务头部：标题和状态
          .task-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            margin-bottom: 15rpx;
            
            .task-title {
              flex: 1;
              font-size: 32rpx;
              font-weight: bold;
              padding-right: 20rpx;
              line-height: 1.4;
            }
            
            .task-status {
              padding: 8rpx 20rpx;
              border-radius: 30rpx;
              font-size: 24rpx;
              white-space: nowrap;
              flex-shrink: 0;
              
              // 待处理 - 橙色
              &.status-pending {
                background-color: #fff3e0;
                color: #ff9500;
              }
              
              // 出发中 - 蓝色
              &.status-departing {
                background-color: #e3f2fd;
                color: #007AFF;
              }
              
              // 已到达 - 紫色
              &.status-arrived {
                background-color: #f3e5f5;
                color: #9c27b0;
              }
              
              // 返程中 - 青色
              &.status-returning {
                background-color: #e0f2f1;
                color: #009688;
              }
              
              // 已完成 - 绿色
              &.status-completed {
                background-color: #e8f5e9;
                color: #34C759;
              }
              
              // 已取消 - 灰色
              &.status-cancelled {
                background-color: #f5f5f5;
                color: #999;
              }
              
              // 处理中 (兼容旧数据) - 蓝色
              &.status-in-progress {
                background-color: #e3f2fd;
                color: #007AFF;
              }
              
              // 默认样式
              &.status-default {
                background-color: #f5f5f5;
                color: #666;
              }
            }
          }
          
          // 任务编号单独一行
          .task-code-row {
            margin-bottom: 15rpx;
            padding: 10rpx 0;
            border-bottom: 1rpx dashed #e0e0e0;
            
            .task-code {
              font-size: 28rpx;
              color: #333;
              font-weight: 500;
              font-family: monospace;
            }
          }
          
          .task-info {
@@ -568,6 +856,11 @@
              color: white;
            }
            
            &.cancel {
              background-color: #ff3b30;
              color: white;
            }
            
            &.disabled {
              opacity: 0.5;
            }