| | |
| | | <view class="user-info-section"> |
| | | <view class="user-info-content"> |
| | | <view class="user-details"> |
| | | <view class="user-name">{{ userName || '未登录' }}</view> |
| | | <view class="vehicle-info" @click="goToBindVehicle"> |
| | | <text v-if="boundVehicle">关联车牌号:{{ boundVehicle }}</text> |
| | | <text v-else>未绑定车牌号</text> |
| | | <uni-icons |
| | | :type="boundVehicle ? 'loop' : 'plus-filled'" |
| | | size="18" |
| | | :color="boundVehicle ? '#007AFF' : '#999'" |
| | | style="margin-left: 8rpx;" |
| | | ></uni-icons> |
| | | <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> |
| | | </view> |
| | |
| | | <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> |
| | |
| | | import { getMyTasks, changeTaskStatus } from '@/api/task' |
| | | import { getUserProfile } from '@/api/system/user' |
| | | import { getUserBoundVehicle } from '@/api/vehicle' |
| | | import { getUnreadCount } from '@/api/message' |
| | | import { formatDateTime } from '@/utils/common' |
| | | |
| | | export default { |
| | | data() { |
| | |
| | | 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: [], |
| | |
| | | }, |
| | | computed: { |
| | | ...mapState({ |
| | | userName: state => state.user.name, |
| | | userName: state => state.user.nickName, |
| | | currentUser: state => state.user |
| | | }), |
| | | |
| | |
| | | // 包含待处理、出发中、已到达、返程中等所有未完成的状态 |
| | | return ['PENDING', 'DEPARTING', 'ARRIVED', 'RETURNING', 'IN_PROGRESS'].includes(task.taskStatus) |
| | | }); |
| | | }, |
| | | |
| | | // 未读消息数量 |
| | | unreadMessageCount() { |
| | | return this.messages.filter(message => !message.read).length; |
| | | } |
| | | }, |
| | | onLoad() { |
| | |
| | | this.loadUserVehicle() |
| | | // 加载正在运行的任务 |
| | | this.loadRunningTasks() |
| | | // 加载未读消息数量 |
| | | this.loadUnreadMessageCount() |
| | | }, |
| | | onShow() { |
| | | // 每次显示页面时刷新任务列表和绑定车辆 |
| | | // 每次显示页面时刷新任务列表、绑定车辆和消息数量 |
| | | this.loadUserVehicle() |
| | | this.loadRunningTasks() |
| | | this.loadUnreadMessageCount() |
| | | }, |
| | | onPullDownRefresh() { |
| | | // 下拉刷新 |
| | |
| | | this.boundVehicle = '' |
| | | this.boundVehicleId = null |
| | | }) |
| | | }, |
| | | |
| | | // 加载未读消息数量 |
| | | loadUnreadMessageCount() { |
| | | getUnreadCount().then(response => { |
| | | if (response.code === 200) { |
| | | this.unreadMessageCount = response.data || 0 |
| | | // 更新TabBar徽标 |
| | | this.updateTabBarBadge(this.unreadMessageCount) |
| | | } |
| | | }).catch(error => { |
| | | console.error('获取未读消息数量失败:', error) |
| | | }) |
| | | }, |
| | | |
| | | // 更新TabBar徽标 |
| | | updateTabBarBadge(count) { |
| | | if (count > 0) { |
| | | uni.setTabBarBadge({ |
| | | index: 3, // 消息页面在tabBar中的索引 |
| | | text: count > 99 ? '99+' : count.toString() |
| | | }) |
| | | } else { |
| | | uni.removeTabBarBadge({ |
| | | index: 3 |
| | | }) |
| | | } |
| | | }, |
| | | |
| | | // 加载用户信息(保留以兼容之前的代码) |
| | |
| | | vehicleList: task.assignedVehicles || [], |
| | | startLocation: this.formatAddress(task.departureAddress || task.startLocation || '未设置'), |
| | | endLocation: this.formatAddress(task.destinationAddress || task.endLocation || '未设置'), |
| | | startTime: task.plannedStartTime ? this.formatDateTime(task.plannedStartTime) : '未设置', |
| | | startTime: task.plannedStartTime ? formatDateTime(task.plannedStartTime, 'YYYY-MM-DD HH:mm') : '未设置', |
| | | 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' |
| | | }) |
| | | }, |
| | | |
| | |
| | | }) |
| | | }, |
| | | |
| | | // 获取状态样式类 |
| | | 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 = { |
| | |
| | | 'MAINTENANCE': '维修保养', |
| | | 'FUEL': '加油', |
| | | 'OTHER': '其他', |
| | | 'EMERGENCY_TRANSFER': '急救转运', |
| | | 'EMERGENCY_TRANSFER': '转运任务', |
| | | 'WELFARE': '福祉车', |
| | | // 旧格式(UI类型) |
| | | 'maintenance': '维修保养', |
| | | 'refuel': '加油', |
| | | 'inspection': '巡检', |
| | | 'emergency': '急救转运', |
| | | 'emergency': '转运任务', |
| | | 'welfare': '福祉车' |
| | | } |
| | | return typeMap[type] || '未知类型' |
| | |
| | | .user-details { |
| | | flex: 1; |
| | | |
| | | .user-name { |
| | | font-size: 36rpx; |
| | | font-weight: bold; |
| | | margin-bottom: 10rpx; |
| | | color: #333; |
| | | } |
| | | |
| | | .vehicle-info { |
| | | font-size: 28rpx; |
| | | color: #666; |
| | | .user-info-row { |
| | | display: flex; |
| | | align-items: center; |
| | | cursor: pointer; |
| | | 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; |
| | | } |
| | | } |
| | | |
| | | .bind-vehicle-btn { |
| | | font-size: 26rpx; |
| | | color: #007AFF; |
| | | display: flex; |
| | | align-items: center; |
| | | |
| | | &:active { |
| | | opacity: 0.7; |
| | |
| | | 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 { |