From 8b005a808d6ab8fae1480ed57bdfd68af2dafcd4 Mon Sep 17 00:00:00 2001
From: wlzboy <66905212@qq.com>
Date: 星期六, 01 十一月 2025 23:07:49 +0800
Subject: [PATCH] feat:输入出入地址时，会自动计算距离
---
app/pages/task/detail.vue | 1149 ++++++++++++++++++++++++++++++++------------------------
1 files changed, 651 insertions(+), 498 deletions(-)
diff --git a/app/pages/task/detail.vue b/app/pages/task/detail.vue
index e23ecff..8598db2 100644
--- a/app/pages/task/detail.vue
+++ b/app/pages/task/detail.vue
@@ -1,464 +1,597 @@
<template>
<view class="task-detail-container">
- <view class="task-header">
- <text class="task-title">{{ task.title }}</text>
- <view class="task-status" :class="'status-' + task.status">
- {{ getStatusText(task.status) }}
+ <view class="detail-header">
+ <view class="back-btn" @click="goBack">
+ <uni-icons type="arrowleft" size="20"></uni-icons>
</view>
+ <view class="title">浠诲姟璇︽儏</view>
</view>
- <!-- 鏅�氫换鍔¤鎯� -->
- <view class="task-info-section" v-if="isNormalTask">
- <view class="info-item">
- <view class="label">浠诲姟缂栧彿:</view>
- <view class="value">{{ task.taskNo }}</view>
+ <scroll-view class="detail-content" scroll-y="true" v-if="taskDetail">
+ <view class="detail-section">
+ <view class="section-title">鍩烘湰淇℃伅</view>
+ <view class="info-item">
+ <view class="label">浠诲姟缂栧彿</view>
+ <view class="value">{{ taskDetail.taskCode }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">浠诲姟绫诲瀷</view>
+ <view class="value">{{ displayTaskType }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">浠诲姟鐘舵��</view>
+ <view class="value status" :class="statusClass">
+ {{ displayTaskStatus }}
+ </view>
+ </view>
+ <view class="info-item">
+ <view class="label">鎵ц杞﹁締</view>
+ <view class="value">{{ getVehicleInfo(taskDetail) }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">鎵ц浜哄憳</view>
+ <view class="value">{{ taskDetail.assigneeName || '鏈垎閰�' }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">浠诲姟绫诲瀷:</view>
- <view class="value">{{ getTaskTypeText(task.type) }}</view>
+ <view class="detail-section">
+ <view class="section-title">鏃堕棿淇℃伅</view>
+ <view class="info-item">
+ <view class="label">璁″垝寮�濮嬫椂闂�</view>
+ <view class="value">{{ displayPlannedStartTime }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">璁″垝缁撴潫鏃堕棿</view>
+ <view class="value">{{ displayPlannedEndTime }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.actualStartTime">
+ <view class="label">瀹為檯寮�濮嬫椂闂�</view>
+ <view class="value">{{ displayActualStartTime }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.actualEndTime">
+ <view class="label">瀹為檯缁撴潫鏃堕棿</view>
+ <view class="value">{{ displayActualEndTime }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">杞﹁締淇℃伅:</view>
- <view class="value">{{ task.vehicle }}</view>
+ <view class="detail-section">
+ <view class="section-title">浣嶇疆淇℃伅</view>
+ <!-- 杞繍浠诲姟锛氭樉绀鸿浆鍑�/杞叆鍖婚櫌鍦板潃 -->
+ <template v-if="taskDetail.taskType === 'EMERGENCY_TRANSFER' && taskDetail.emergencyInfo">
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalOutAddress">
+ <view class="label">杞嚭鍖婚櫌</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalOutAddress }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalInAddress">
+ <view class="label">杞叆鍖婚櫌</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalInAddress }}</view>
+ </view>
+ </template>
+ <!-- 绂忕杞︿换鍔★細鏄剧ず鎺ラ��/鐩殑鍦板潃 -->
+ <template v-else-if="taskDetail.taskType === 'WELFARE' && taskDetail.welfareInfo">
+ <view class="info-item" v-if="taskDetail.welfareInfo.pickupAddress">
+ <view class="label">鎺ラ�佸湴鍧�</view>
+ <view class="value">{{ taskDetail.welfareInfo.pickupAddress }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.destinationAddress">
+ <view class="label">鐩殑鍦板潃</view>
+ <view class="value">{{ taskDetail.welfareInfo.destinationAddress }}</view>
+ </view>
+ </template>
+ <!-- 鍏朵粬浠诲姟绫诲瀷锛氭樉绀洪�氱敤鍦板潃 -->
+ <template v-else>
+ <view class="info-item">
+ <view class="label">鍑哄彂鍦�</view>
+ <view class="value">{{ getDepartureAddress(taskDetail) }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">鐩殑鍦�</view>
+ <view class="value">{{ getDestinationAddress(taskDetail) }}</view>
+ </view>
+ </template>
+ <!-- 璺濈淇℃伅锛氭牴鎹换鍔＄被鍨嬫樉绀轰笉鍚屽瓧娈� -->
+ <view class="info-item" v-if="getDistanceInfo(taskDetail)">
+ <view class="label">璺濈</view>
+ <view class="value">{{ getDistanceInfo(taskDetail) }}鍏噷</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">鍑哄彂鍦�:</view>
- <view class="value">{{ task.startLocation }}</view>
+ <view class="detail-section" v-if="taskDetail.taskDescription">
+ <view class="section-title">浠诲姟鎻忚堪</view>
+ <view class="description">{{ taskDetail.taskDescription }}</view>
</view>
- <view class="info-item">
- <view class="label">鐩殑鍦�:</view>
- <view class="value">{{ task.endLocation }}</view>
+ <view class="detail-section" v-if="taskDetail.remark">
+ <view class="section-title">澶囨敞淇℃伅</view>
+ <view class="description">{{ taskDetail.remark }}</view>
</view>
- <view class="info-item">
- <view class="label">鍑哄彂鏃堕棿:</view>
- <view class="value">{{ task.startTime }}</view>
+ <!-- 杞繍浠诲姟鐗规湁淇℃伅 -->
+ <view class="detail-section" v-if="taskDetail.taskType === 'EMERGENCY_TRANSFER' && taskDetail.emergencyInfo">
+ <view class="section-title">鎮ｈ�呬俊鎭�</view>
+ <view class="info-item">
+ <view class="label">鑱旂郴浜�</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientContact || '鏈缃�' }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">鎮ｈ�呭鍚�</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientName || '鏈缃�' }}</view>
+ </view>
+ <view class="info-item">
+ <view class="label">鑱旂郴鐢佃瘽</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientPhone || '鏈缃�' }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.patientGender">
+ <view class="label">鎬у埆</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientGender === 'male' ? '鐢�' : '濂�' }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.patientAge">
+ <view class="label">骞撮緞</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientAge }}宀�</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.patientIdCard">
+ <view class="label">韬唤璇佸彿</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientIdCard }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.patientCondition">
+ <view class="label">鐥呮儏鎻忚堪</view>
+ <view class="value">{{ taskDetail.emergencyInfo.patientCondition }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">鎵ц浜哄憳:</view>
- <view class="value">{{ task.assignee }}</view>
+ <!-- 杞繍 - 杞嚭鍖婚櫌淇℃伅 -->
+ <view class="detail-section" v-if="taskDetail.taskType === 'EMERGENCY_TRANSFER' && taskDetail.emergencyInfo">
+ <view class="section-title">杞嚭鍖婚櫌淇℃伅</view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalOutName">
+ <view class="label">鍖婚櫌鍚嶇О</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalOutName }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalOutDepartment">
+ <view class="label">绉戝</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalOutDepartment }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalOutBedNumber">
+ <view class="label">搴婂彿</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalOutBedNumber }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalOutAddress">
+ <view class="label">鍖婚櫌鍦板潃</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalOutAddress }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">浠诲姟鎻忚堪:</view>
- <view class="value">{{ task.description || '鏃犳弿杩颁俊鎭�' }}</view>
+ <!-- 杞繍 - 杞叆鍖婚櫌淇℃伅 -->
+ <view class="detail-section" v-if="taskDetail.taskType === 'EMERGENCY_TRANSFER' && taskDetail.emergencyInfo">
+ <view class="section-title">杞叆鍖婚櫌淇℃伅</view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalInName">
+ <view class="label">鍖婚櫌鍚嶇О</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalInName }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalInDepartment">
+ <view class="label">绉戝</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalInDepartment }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalInBedNumber">
+ <view class="label">搴婂彿</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalInBedNumber }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.hospitalInAddress">
+ <view class="label">鍖婚櫌鍦板潃</view>
+ <view class="value">{{ taskDetail.emergencyInfo.hospitalInAddress }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">琛岄┒鍏噷鏁�:</view>
- <view class="value">{{ task.distance || '鏈～鍐�' }}</view>
+ <!-- 杞繍 - 璐圭敤淇℃伅 -->
+ <view class="detail-section" v-if="taskDetail.taskType === 'EMERGENCY_TRANSFER' && taskDetail.emergencyInfo">
+ <view class="section-title">璐圭敤淇℃伅</view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.transferDistance">
+ <view class="label">杞繍鍏噷鏁�</view>
+ <view class="value">{{ taskDetail.emergencyInfo.transferDistance }}鍏噷</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.emergencyInfo.transferPrice">
+ <view class="label">杞繍璐圭敤</view>
+ <view class="value">锟{ taskDetail.emergencyInfo.transferPrice }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">缁撴潫鏃堕棿:</view>
- <view class="value">{{ task.endTime || '鏈～鍐�' }}</view>
+ <!-- 绂忕杞︿换鍔＄壒鏈変俊鎭� -->
+ <view class="detail-section" v-if="taskDetail.taskType === 'WELFARE' && taskDetail.welfareInfo">
+ <view class="section-title">涔樺淇℃伅</view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.passengerContact">
+ <view class="label">鑱旂郴浜�</view>
+ <view class="value">{{ taskDetail.welfareInfo.passengerContact }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.passengerPhone">
+ <view class="label">鑱旂郴鐢佃瘽</view>
+ <view class="value">{{ taskDetail.welfareInfo.passengerPhone }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.passengerName">
+ <view class="label">涔樺濮撳悕</view>
+ <view class="value">{{ taskDetail.welfareInfo.passengerName }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.passengerAge">
+ <view class="label">骞撮緞</view>
+ <view class="value">{{ taskDetail.welfareInfo.passengerAge }}宀�</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.passengerGender">
+ <view class="label">鎬у埆</view>
+ <view class="value">{{ taskDetail.welfareInfo.passengerGender === 'male' ? '鐢�' : '濂�' }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.passengerIdCard">
+ <view class="label">韬唤璇佸彿</view>
+ <view class="value">{{ taskDetail.welfareInfo.passengerIdCard }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.specialNeeds">
+ <view class="label">鐗规畩闇�姹�</view>
+ <view class="value">{{ taskDetail.welfareInfo.specialNeeds }}</view>
+ </view>
</view>
- <view class="info-item">
- <view class="label">澶囨敞:</view>
- <view class="value">{{ task.remark || '鏃犲娉�' }}</view>
+ <!-- 绂忕杞� - 鏈嶅姟淇℃伅 -->
+ <view class="detail-section" v-if="taskDetail.taskType === 'WELFARE' && taskDetail.welfareInfo">
+ <view class="section-title">鏈嶅姟淇℃伅</view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.serviceType">
+ <view class="label">鏈嶅姟绫诲瀷</view>
+ <view class="value">{{ taskDetail.welfareInfo.serviceType }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.pickupAddress">
+ <view class="label">鎺ラ�佸湴鍧�</view>
+ <view class="value">{{ taskDetail.welfareInfo.pickupAddress }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.destinationAddress">
+ <view class="label">鐩殑鍦板潃</view>
+ <view class="value">{{ taskDetail.welfareInfo.destinationAddress }}</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.serviceDistance">
+ <view class="label">鏈嶅姟鍏噷鏁�</view>
+ <view class="value">{{ taskDetail.welfareInfo.serviceDistance }}鍏噷</view>
+ </view>
+ <view class="info-item" v-if="taskDetail.welfareInfo.servicePrice">
+ <view class="label">鏈嶅姟璐圭敤</view>
+ <view class="value">锟{ taskDetail.welfareInfo.servicePrice }}</view>
+ </view>
</view>
+ </scroll-view>
+
+ <view class="loading" v-else>
+ <uni-icons type="spinner-cycle" size="40" color="#007AFF"></uni-icons>
+ <text>鍔犺浇涓�...</text>
</view>
- <!-- 鎬ユ晳杞繍浠诲姟璇︽儏 -->
- <view class="task-info-section" v-else-if="task.type === 'emergency'">
- <view class="info-item">
- <view class="label">浠诲姟缂栧彿:</view>
- <view class="value">{{ task.taskNo }}</view>
- </view>
+ <!-- 鎿嶄綔鎸夐挳鍖哄煙 -->
+ <view class="action-buttons" v-if="taskDetail">
+ <!-- 寰呭鐞嗙姸鎬�: 鏄剧ず鍑哄彂銆佸彇娑� -->
+ <template v-if="taskDetail.taskStatus === 'PENDING'">
+ <button
+ class="action-btn primary"
+ @click="handleTaskAction('depart')"
+ >
+ 鍑哄彂
+ </button>
+ <button
+ class="action-btn cancel"
+ @click="handleTaskAction('cancel')"
+ >
+ 鍙栨秷
+ </button>
+ </template>
- <view class="info-item">
- <view class="label">浠诲姟绫诲瀷:</view>
- <view class="value">{{ getTaskTypeText(task.type) }}</view>
- </view>
+ <!-- 鍑哄彂涓姸鎬�: 鏄剧ず宸插埌杈俱�佸己鍒剁粨鏉� -->
+ <template v-else-if="taskDetail.taskStatus === 'DEPARTING'">
+ <button
+ class="action-btn primary"
+ @click="handleTaskAction('arrive')"
+ >
+ 宸插埌杈�
+ </button>
+ <button
+ class="action-btn cancel"
+ @click="handleTaskAction('forceCancel')"
+ >
+ 寮哄埗缁撴潫
+ </button>
+ </template>
- <view class="info-item">
- <view class="label">杞﹁締淇℃伅:</view>
- <view class="value">{{ task.vehicle }}</view>
- </view>
+ <!-- 宸插埌杈剧姸鎬�: 鏄剧ず宸茶繑绋� -->
+ <template v-else-if="taskDetail.taskStatus === 'ARRIVED'">
+ <button
+ class="action-btn primary"
+ @click="handleTaskAction('return')"
+ >
+ 宸茶繑绋�
+ </button>
+ </template>
- <view class="info-item">
- <view class="label">鎵ц浜哄憳:</view>
- <view class="value">{{ task.assignee }}</view>
- </view>
+ <!-- 杩旂▼涓姸鎬�: 鏄剧ず宸插畬鎴� -->
+ <template v-else-if="taskDetail.taskStatus === 'RETURNING'">
+ <button
+ class="action-btn primary"
+ @click="handleTaskAction('complete')"
+ >
+ 宸插畬鎴�
+ </button>
+ </template>
- <view class="info-item">
- <view class="label">褰掑睘鏈烘瀯:</view>
- <view class="value">{{ task.organization || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">浠诲姟绫诲瀷:</view>
- <view class="value">{{ task.emergencyTaskType || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">杞繍鏃堕棿:</view>
- <view class="value">{{ task.transferTime || '鏈～鍐�' }}</view>
- </view>
-
- <view class="section-title">鎮ｈ�呬俊鎭�</view>
- <view class="info-item">
- <view class="label">鑱旂郴浜�:</view>
- <view class="value">{{ task.patient.contact || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鑱旂郴鐢佃瘽:</view>
- <view class="value">{{ task.patient.phone || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鎮ｈ�呭鍚�:</view>
- <view class="value">{{ task.patient.name || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鎬у埆:</view>
- <view class="value">{{ task.patient.gender === 'male' ? '鐢�' : '濂�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">韬唤璇�:</view>
- <view class="value">{{ task.patient.idCard || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鐥呮儏:</view>
- <view class="value">{{ task.patient.condition || '鏈～鍐�' }}</view>
- </view>
-
- <view class="section-title">杞嚭鍖婚櫌淇℃伅</view>
- <view class="info-item">
- <view class="label">鍖婚櫌鍚嶇О:</view>
- <view class="value">{{ task.hospitalOut.name || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">绉戝:</view>
- <view class="value">{{ task.hospitalOut.department || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">搴婂彿:</view>
- <view class="value">{{ task.hospitalOut.bedNumber || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鍦板潃:</view>
- <view class="value">{{ task.hospitalOut.address || '鏈～鍐�' }}</view>
- </view>
-
- <view class="section-title">杞叆鍖婚櫌淇℃伅</view>
- <view class="info-item">
- <view class="label">鍖婚櫌鍚嶇О:</view>
- <view class="value">{{ task.hospitalIn.name || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">绉戝:</view>
- <view class="value">{{ task.hospitalIn.department || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">搴婂彿:</view>
- <view class="value">{{ task.hospitalIn.bedNumber || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鍦板潃:</view>
- <view class="value">{{ task.hospitalIn.address || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">杞繍鍏噷鏁�:</view>
- <view class="value">{{ task.transferDistance || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鎴愪氦浠�:</view>
- <view class="value">楼{{ task.price || '鏈～鍐�' }}</view>
- </view>
- </view>
-
- <!-- 绂忕杞︿换鍔¤鎯� -->
- <view class="task-info-section" v-else-if="task.type === 'welfare'">
- <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">{{ getTaskTypeText(task.type) }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">杞﹁締淇℃伅:</view>
- <view class="value">{{ task.vehicle }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鎵ц浜哄憳:</view>
- <view class="value">{{ task.assignee }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">褰掑睘鏈烘瀯:</view>
- <view class="value">{{ task.organization || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鏈嶅姟鏃堕棿:</view>
- <view class="value">{{ task.serviceTime || '鏈～鍐�' }}</view>
- </view>
-
- <view class="section-title">涔樺淇℃伅</view>
- <view class="info-item">
- <view class="label">鑱旂郴浜�:</view>
- <view class="value">{{ task.passenger.contact || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鑱旂郴鐢佃瘽:</view>
- <view class="value">{{ task.passenger.phone || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鍑哄彂鍦板潃:</view>
- <view class="value">{{ task.startAddress || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鐩殑鍦板潃:</view>
- <view class="value">{{ task.endAddress || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鍏噷鏁�:</view>
- <view class="value">{{ task.distance || '鏈～鍐�' }}</view>
- </view>
-
- <view class="info-item">
- <view class="label">鎴愪氦浠�:</view>
- <view class="value">楼{{ task.price || '鏈～鍐�' }}</view>
- </view>
- </view>
-
- <!-- 浠诲姟鎿嶄綔鎸夐挳 (浠诲姟鏈畬鎴愭椂鏄剧ず) -->
- <view class="task-actions" v-if="task.status !== 'completed'">
- <button
- class="action-btn"
- :class="{ disabled: isActionDisabled('depart') }"
- @click="handleTaskAction('depart')"
- >
- 鍑哄彂
- </button>
- <button
- class="action-btn"
- :class="{ disabled: isActionDisabled('arrive') }"
- @click="handleTaskAction('arrive')"
- >
- 宸插埌杈�
- </button>
- <button
- class="action-btn"
- :class="{ disabled: isActionDisabled('return') }"
- @click="handleTaskAction('return')"
- >
- 杩旂▼
- </button>
- <button
- class="action-btn"
- :class="{ disabled: isActionDisabled('settle') }"
- @click="handleTaskAction('settle')"
- >
- 缁撶畻
- </button>
- <button
- class="action-btn primary"
- :class="{ disabled: isActionDisabled('complete') }"
- @click="handleTaskAction('complete')"
- >
- 宸插畬鎴�
- </button>
- </view>
-
- <view class="action-section">
- <button class="back-btn" @click="goBack">杩斿洖</button>
+ <!-- 宸插畬鎴�/宸插彇娑�: 涓嶆樉绀烘寜閽� -->
</view>
</view>
</template>
<script>
+ import { getTask, changeTaskStatus } from '@/api/task'
+ import { formatDateTime } from '@/utils/common'
+
export default {
data() {
return {
- task: {
- id: 1,
- title: '绱ф�ョ淮淇换鍔�',
- type: 'maintenance',
- startLocation: '骞垮窞甯傚ぉ娌冲尯XX璺�123鍙�',
- endLocation: '骞垮窞甯傜櫧浜戝尯YY璺�456鍙�',
- startTime: '2023-05-15 15:00',
- assignee: '寮犱笁',
- status: 'pending',
- vehicle: '绮12345',
- taskNo: 'RW20230515001',
- description: '璁惧鏁呴殰锛岄渶瑕佺揣鎬ョ淮淇�',
- // 鏅�氫换鍔″瓧娈�
- distance: '25',
- endTime: '2023-05-15 17:00',
- remark: '缁翠慨瀹屾垚鍚庨渶瑕佹祴璇�',
- // 鎬ユ晳杞繍浠诲姟瀛楁
- organization: '骞垮窞鎬ユ晳涓績',
- emergencyTaskType: '鎬ユ晳杞繍',
- transferTime: '2023-05-15 16:00',
- patient: {
- contact: '鏉庡洓',
- phone: '13800138000',
- name: '鐜嬩簲',
- gender: 'male',
- idCard: '440100198001011234',
- condition: '绐佸彂蹇冭剰鐥�'
- },
- hospitalOut: {
- name: '骞垮窞甯傜涓�浜烘皯鍖婚櫌',
- department: '蹇冨唴绉�',
- bedNumber: '101',
- address: '骞垮窞甯傝秺绉�鍖哄尰闄㈣矾1鍙�'
- },
- hospitalIn: {
- name: '骞夸笢鐪佷汉姘戝尰闄�',
- department: '蹇冨唴绉�',
- bedNumber: '205',
- address: '骞垮窞甯傚ぉ娌冲尯鍖婚櫌璺�2鍙�'
- },
- transferDistance: '15',
- price: '800',
- // 绂忕杞︿换鍔″瓧娈�
- serviceTime: '2023-05-16 09:00',
- passenger: {
- contact: '璧靛叚',
- phone: '13900139000'
- },
- startAddress: '骞垮窞甯傝崝婀惧尯绀惧尯璺�10鍙�',
- endAddress: '骞垮窞甯傚ぉ娌冲尯鍏昏�侀櫌璺�20鍙�'
- }
+ taskDetail: null,
+ taskId: null
}
},
computed: {
- // 鍒ゆ柇鏄惁涓烘櫘閫氫换鍔�
- isNormalTask() {
- return this.task.type === 'maintenance' || this.task.type === 'refuel' || this.task.type === 'inspection';
+ // 鏄剧ず浠诲姟绫诲瀷
+ displayTaskType() {
+ if (!this.taskDetail || !this.taskDetail.taskType) {
+ return '鏈缃�'
+ }
+ return this.getTaskTypeText(this.taskDetail.taskType)
+ },
+ // 鏄剧ず浠诲姟鐘舵��
+ displayTaskStatus() {
+ if (!this.taskDetail || !this.taskDetail.taskStatus) {
+ return '鏈缃�'
+ }
+ return this.getStatusText(this.taskDetail.taskStatus)
+ },
+ // 鐘舵�佹牱寮忕被
+ statusClass() {
+ if (!this.taskDetail || !this.taskDetail.taskStatus) {
+ return ''
+ }
+ const status = this.taskDetail.taskStatus
+ if (status === 'PENDING') return 'pending'
+ if (['DEPARTING', 'ARRIVED', 'RETURNING', 'IN_PROGRESS'].includes(status)) return 'in_progress'
+ if (status === 'COMPLETED') return 'completed'
+ if (status === 'CANCELLED') return 'cancelled'
+ return ''
+ },
+ // 鏄剧ず璁″垝寮�濮嬫椂闂�
+ displayPlannedStartTime() {
+ if (!this.taskDetail || !this.taskDetail.plannedStartTime) {
+ return '鏈缃�'
+ }
+ return formatDateTime(this.taskDetail.plannedStartTime, 'YYYY-MM-DD HH:mm')
+ },
+ // 鏄剧ず璁″垝缁撴潫鏃堕棿
+ displayPlannedEndTime() {
+ if (!this.taskDetail || !this.taskDetail.plannedEndTime) {
+ return '鏈缃�'
+ }
+ return formatDateTime(this.taskDetail.plannedEndTime, 'YYYY-MM-DD HH:mm')
+ },
+ // 鏄剧ず瀹為檯寮�濮嬫椂闂�
+ displayActualStartTime() {
+ if (!this.taskDetail || !this.taskDetail.actualStartTime) {
+ return '鏈缃�'
+ }
+ return formatDateTime(this.taskDetail.actualStartTime, 'YYYY-MM-DD HH:mm')
+ },
+ // 鏄剧ず瀹為檯缁撴潫鏃堕棿
+ displayActualEndTime() {
+ if (!this.taskDetail || !this.taskDetail.actualEndTime) {
+ return '鏈缃�'
+ }
+ return formatDateTime(this.taskDetail.actualEndTime, 'YYYY-MM-DD HH:mm')
}
},
onLoad(options) {
- // 瀹為檯椤圭洰涓繖閲屼細閫氳繃API鑾峰彇浠诲姟璇︽儏
- // const taskId = options.id;
- // this.getTaskDetail(taskId);
+ this.taskId = options.id
+ this.loadTaskDetail()
},
methods: {
- goBack() {
- this.$tab.navigateBack();
+ // 鍔犺浇浠诲姟璇︽儏
+ loadTaskDetail() {
+ if (!this.taskId) {
+ this.$modal.showToast('浠诲姟ID涓嶈兘涓虹┖')
+ return
+ }
+
+ getTask(this.taskId).then(response => {
+ this.taskDetail = response.data || response
+ // 璋冭瘯锛氭墦鍗拌繑鍥炵殑鏁版嵁
+ // console.log('浠诲姟璇︽儏瀹屾暣鏁版嵁:', JSON.stringify(this.taskDetail, null, 2))
+ // console.log('浠诲姟绫诲瀷瀛楁鍊�:', this.taskDetail.taskType)
+ // console.log('浠诲姟鐘舵�佸瓧娈靛��:', this.taskDetail.taskStatus)
+ // console.log('鍑哄彂鍦板潃:', this.taskDetail.departureAddress)
+ // console.log('鐩殑鍦板潃:', this.taskDetail.destinationAddress)
+ }).catch(error => {
+ console.error('鍔犺浇浠诲姟璇︽儏澶辫触:', error)
+ this.$modal.showToast('鍔犺浇浠诲姟璇︽儏澶辫触')
+ })
},
+ // 鑾峰彇杞﹁締淇℃伅
+ getVehicleInfo(task) {
+ if (task.assignedVehicles && task.assignedVehicles.length > 0) {
+ const firstVehicle = task.assignedVehicles[0]
+ let vehicleInfo = firstVehicle.vehicleNo || '鏈煡杞︾墝'
+ if (task.assignedVehicles.length > 1) {
+ vehicleInfo += ` 绛�${task.assignedVehicles.length}杈哷
+ }
+ return vehicleInfo
+ }
+ return '鏈垎閰嶈溅杈�'
+ },
+
+ // 鑾峰彇鍑哄彂鍦板潃
+ getDepartureAddress(task) {
+ // 浼樺厛浣跨敤departureAddress锛屽鏋滀负绌哄垯灏濊瘯鍏朵粬鍙兘鐨勫瓧娈�
+ return task.departureAddress || task.startAddress || task.startLocation || '鏈缃�'
+ },
+
+ // 鑾峰彇鐩殑鍦板潃
+ getDestinationAddress(task) {
+ // 浼樺厛浣跨敤destinationAddress锛屽鏋滀负绌哄垯灏濊瘯鍏朵粬鍙兘鐨勫瓧娈�
+ return task.destinationAddress || task.endAddress || task.endLocation || '鏈缃�'
+ },
+
+ // 鑾峰彇璺濈淇℃伅锛氭牴鎹换鍔＄被鍨嬭繑鍥炰笉鍚屽瓧娈�
+ getDistanceInfo(task) {
+ // 杞繍锛氫紭鍏堜娇鐢╰ransferDistance
+ if (task.taskType === 'EMERGENCY_TRANSFER' && task.emergencyInfo && task.emergencyInfo.transferDistance) {
+ return task.emergencyInfo.transferDistance
+ }
+ // 绂忕杞︼細浼樺厛浣跨敤serviceDistance
+ if (task.taskType === 'WELFARE' && task.welfareInfo && task.welfareInfo.serviceDistance) {
+ return task.welfareInfo.serviceDistance
+ }
+ // 鍏朵粬浠诲姟绫诲瀷锛氫娇鐢╡stimatedDistance
+ return task.estimatedDistance || null
+ },
+
+ // 杩斿洖涓婁竴椤�
+ goBack() {
+ uni.navigateBack()
+ },
+
+ // 鑾峰彇鐘舵�佹枃鏈�
getStatusText(status) {
const statusMap = {
- 'pending': '寰呭鐞�',
- 'processing': '澶勭悊涓�',
- 'completed': '宸插畬鎴�'
+ 'PENDING': '寰呭鐞�',
+ 'DEPARTING': '鍑哄彂涓�',
+ 'ARRIVED': '宸插埌杈�',
+ 'RETURNING': '杩旂▼涓�',
+ 'COMPLETED': '宸插畬鎴�',
+ 'CANCELLED': '宸插彇娑�',
+ 'IN_PROGRESS': '澶勭悊涓�' // 鍏煎鏃ф暟鎹�
}
return statusMap[status] || '鏈煡'
},
+ // 鑾峰彇浠诲姟绫诲瀷鏂囨湰
getTaskTypeText(type) {
const typeMap = {
- 'maintenance': '缁翠慨淇濆吇',
- 'refuel': '鍔犳补',
- 'inspection': '宸℃',
- 'emergency': '鎬ユ晳杞繍',
- 'welfare': '绂忕杞�'
+ 'MAINTENANCE': '缁翠慨淇濆吇',
+ 'FUEL': '鍔犳补',
+ 'OTHER': '鍏朵粬',
+ 'EMERGENCY_TRANSFER': '杞繍浠诲姟',
+ 'WELFARE': '绂忕杞�'
}
return typeMap[type] || '鏈煡绫诲瀷'
},
- // 鍒ゆ柇鎿嶄綔鎸夐挳鏄惁绂佺敤
- isActionDisabled(action) {
- // 鏍规嵁浠诲姟鐘舵�佸拰鎿嶄綔绫诲瀷鍒ゆ柇鏄惁绂佺敤
- switch (action) {
- case 'depart':
- return this.task.status !== 'pending';
- case 'arrive':
- return this.task.status !== 'processing';
- case 'return':
- return this.task.status !== 'processing';
- case 'settle':
- return this.task.status !== 'processing';
- case 'complete':
- return this.task.status !== 'processing';
- default:
- return false;
- }
- },
-
// 澶勭悊浠诲姟鎿嶄綔
handleTaskAction(action) {
- if (this.isActionDisabled(action)) {
- return;
- }
-
switch (action) {
case 'depart':
- // 鍑哄彂鎿嶄綔锛屾牴鎹换鍔＄被鍨嬫樉绀轰笉鍚岀殑纭淇℃伅
- let departMessage = '纭畾瑕佹爣璁颁负宸插嚭鍙戝悧锛�';
- if (this.task.type !== 'maintenance' && this.task.type !== 'refuel' && this.task.type !== 'inspection') {
- departMessage = '鍙戝嚭鍘荤洰鐨勫湴,纭锛�';
- }
- this.$modal.confirm(departMessage).then(() => {
- this.task.status = 'processing';
- this.$modal.showToast('宸插嚭鍙�');
- // 杩欓噷鍙互璋冪敤API鏇存柊浠诲姟鐘舵��
+ // 鍑哄彂 -> 鐘舵�佸彉涓哄嚭鍙戜腑
+ this.$modal.confirm('纭畾瑕佸嚭鍙戝悧锛�').then(() => {
+ this.updateTaskStatus('DEPARTING', '浠诲姟宸插嚭鍙�')
}).catch(() => {});
break;
+
+ case 'cancel':
+ // 鍙栨秷 -> 浜屾纭鍚庣姸鎬佸彉涓哄凡鍙栨秷
+ this.$modal.confirm('纭畾瑕佸彇娑堟浠诲姟鍚楋紵').then(() => {
+ this.updateTaskStatus('CANCELLED', '浠诲姟宸插彇娑�')
+ }).catch(() => {});
+ break;
+
case 'arrive':
- // 宸插埌杈炬搷浣�
- this.$modal.confirm('宸茬粡鍒拌揪鐩殑鍦帮紝纭锛�').then(() => {
- this.$modal.showToast('宸插埌杈�');
- // 杩欓噷鍙互璋冪敤API鏇存柊浠诲姟鐘舵��
+ // 宸插埌杈� -> 鐘舵�佸彉涓哄凡鍒拌揪
+ this.$modal.confirm('纭宸插埌杈剧洰鐨勫湴锛�').then(() => {
+ this.updateTaskStatus('ARRIVED', '宸插埌杈剧洰鐨勫湴')
}).catch(() => {});
break;
+
+ case 'forceCancel':
+ // 寮哄埗缁撴潫 -> 鐘舵�佸彉涓哄凡鍙栨秷
+ this.$modal.confirm('纭畾瑕佸己鍒剁粨鏉熸浠诲姟鍚楋紵').then(() => {
+ this.updateTaskStatus('CANCELLED', '浠诲姟宸插己鍒剁粨鏉�')
+ }).catch(() => {});
+ break;
+
case 'return':
- // 杩旂▼鎿嶄綔
- this.$modal.confirm('鐜板湪宸茬粡杩旂▼涓紝纭锛�').then(() => {
- this.$modal.showToast('杩旂▼涓�');
- // 杩欓噷鍙互璋冪敤API鏇存柊浠诲姟鐘舵��
+ // 宸茶繑绋� -> 鐘舵�佸彉涓鸿繑绋嬩腑
+ this.$modal.confirm('纭寮�濮嬭繑绋嬶紵').then(() => {
+ this.updateTaskStatus('RETURNING', '宸插紑濮嬭繑绋�')
}).catch(() => {});
break;
- case 'settle':
- // 缁撶畻鎿嶄綔锛岃烦杞埌缁撶畻椤甸潰
- this.$tab.navigateTo(`/pages/task/settlement?id=${this.task.id}`);
- break;
+
case 'complete':
- // 宸插畬鎴愭搷浣�
- this.$modal.confirm('浠诲姟鏄惁宸茬粡鍏ㄩ儴瀹屾垚锛岀‘璁わ紵').then(() => {
- this.task.status = 'completed';
- this.$modal.showToast('浠诲姟宸插畬鎴�');
- // 杩欓噷鍙互璋冪敤API鏇存柊浠诲姟鐘舵��
+ // 宸插畬鎴� -> 鐘舵�佸彉涓哄凡瀹屾垚
+ this.$modal.confirm('纭浠诲姟宸插畬鎴愶紵').then(() => {
+ this.updateTaskStatus('COMPLETED', '浠诲姟宸插畬鎴�')
}).catch(() => {});
break;
}
},
- // 妯℃嫙鑾峰彇浠诲姟璇︽儏
- getTaskDetail(taskId) {
- // 杩欓噷搴旇璋冪敤API鑾峰彇浠诲姟璇︽儏
- // 鏆傛椂浣跨敤妯℃嫙鏁版嵁
+ // 鏇存柊浠诲姟鐘舵��
+ updateTaskStatus(status, remark) {
+ // 鑾峰彇GPS浣嶇疆淇℃伅
+ this.getLocationAndUpdateStatus(status, remark)
+ },
+
+ // 鑾峰彇浣嶇疆淇℃伅骞舵洿鏂扮姸鎬�
+ getLocationAndUpdateStatus(status, remark) {
+ const that = this
+
+ // 浣跨敤uni.getLocation鑾峰彇GPS浣嶇疆
+ uni.getLocation({
+ type: 'gcj02', // 杩斿洖鍙互鐢ㄤ簬uni.openLocation鐨勫潗鏍�
+ geocode: true, // 瑙ｆ瀽鍦板潃淇℃伅
+ altitude: true, // 楂樼簿搴﹀畾浣嶏紝鍖呭惈楂樺害淇℃伅
+ success: function(res) {
+ console.log('GPS瀹氫綅鎴愬姛:', res)
+
+ const statusData = {
+ taskStatus: status,
+ remark: remark,
+ // GPS浣嶇疆淇℃伅
+ 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(that.taskId, statusData).then(response => {
+ that.$modal.showToast('鐘舵�佹洿鏂版垚鍔�')
+ // 閲嶆柊鍔犺浇浠诲姟璇︽儏
+ that.loadTaskDetail()
+ }).catch(error => {
+ console.error('鏇存柊浠诲姟鐘舵�佸け璐�:', error)
+ that.$modal.showToast('鐘舵�佹洿鏂板け璐ワ紝璇烽噸璇�')
+ })
+ },
+ fail: function(err) {
+ console.error('GPS瀹氫綅澶辫触:', err)
+
+ // 瀹氫綅澶辫触鏃舵彁绀虹敤鎴凤紝浣嗕粛鐒跺厑璁告洿鏂扮姸鎬侊紙涓嶅甫GPS淇℃伅锛�
+ that.$modal.confirm('GPS瀹氫綅澶辫触锛屾槸鍚︾户缁洿鏂扮姸鎬侊紵').then(() => {
+ const statusData = {
+ taskStatus: status,
+ remark: remark
+ }
+
+ changeTaskStatus(that.taskId, statusData).then(response => {
+ that.$modal.showToast('鐘舵�佹洿鏂版垚鍔�')
+ that.loadTaskDetail()
+ }).catch(error => {
+ console.error('鏇存柊浠诲姟鐘舵�佸け璐�:', error)
+ that.$modal.showToast('鐘舵�佹洿鏂板け璐ワ紝璇烽噸璇�')
+ })
+ }).catch(() => {
+ // 鐢ㄦ埛鍙栨秷鎿嶄綔
+ })
+ }
+ })
}
}
}
@@ -466,135 +599,155 @@
<style lang="scss">
.task-detail-container {
- padding: 20rpx;
background-color: #f5f5f5;
min-height: 100vh;
- }
-
- .task-header {
- background-color: white;
- border-radius: 15rpx;
- padding: 30rpx;
- margin-bottom: 20rpx;
- box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
- display: flex;
- justify-content: space-between;
- align-items: center;
- .task-title {
- font-size: 36rpx;
- font-weight: bold;
- color: #333;
- }
-
- .task-status {
- padding: 10rpx 20rpx;
- border-radius: 10rpx;
- font-size: 24rpx;
- font-weight: bold;
-
- &.status-pending {
- background-color: #fff3cd;
- color: #856404;
- }
-
- &.status-processing {
- background-color: #cce5ff;
- color: #004085;
- }
-
- &.status-completed {
- background-color: #d4edda;
- color: #155724;
- }
- }
- }
-
- .task-info-section {
- background-color: white;
- border-radius: 15rpx;
- padding: 30rpx;
- margin-bottom: 20rpx;
- box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
-
- .section-title {
- font-size: 32rpx;
- font-weight: bold;
- margin: 30rpx 0 20rpx 0;
- padding-bottom: 10rpx;
- border-bottom: 1rpx solid #f0f0f0;
- color: #333;
- }
-
- .info-item {
+ .detail-header {
display: flex;
- margin-bottom: 20rpx;
- padding-bottom: 20rpx;
+ align-items: center;
+ padding: 20rpx;
+ background-color: white;
border-bottom: 1rpx solid #f0f0f0;
- &:last-child {
- margin-bottom: 0;
- padding-bottom: 0;
- border-bottom: none;
- }
-
- .label {
- font-size: 28rpx;
- color: #666;
+ .back-btn {
+ width: 60rpx;
+ height: 60rpx;
+ border-radius: 50%;
+ background-color: #f0f0f0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
margin-right: 20rpx;
- white-space: nowrap;
- width: 150rpx;
}
- .value {
+ .title {
+ font-size: 36rpx;
+ font-weight: bold;
+ color: #333;
+ }
+ }
+
+ .detail-content {
+ padding: 20rpx;
+ height: calc(100vh - 220rpx); // 鍑忓幓header(100rpx)鍜屾寜閽尯鍩�(120rpx)鐨勯珮搴�
+ padding-bottom: 20rpx; // 搴曢儴鐣欏嚭绌洪棿
+ }
+
+ .detail-section {
+ background-color: white;
+ border-radius: 15rpx;
+ padding: 30rpx;
+ margin-bottom: 20rpx;
+ box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+
+ .section-title {
+ font-size: 32rpx;
+ font-weight: bold;
+ margin-bottom: 20rpx;
+ color: #333;
+ border-bottom: 1rpx solid #f0f0f0;
+ padding-bottom: 10rpx;
+ }
+
+ .info-item {
+ display: flex;
+ margin-bottom: 20rpx;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .label {
+ width: 200rpx;
+ font-size: 28rpx;
+ color: #666;
+ flex-shrink: 0;
+ }
+
+ .value {
+ flex: 1;
+ font-size: 28rpx;
+ color: #333;
+ word-break: break-all;
+
+ &.status {
+ &.pending {
+ color: #ff9500;
+ }
+ &.in_progress {
+ color: #007AFF;
+ }
+ &.completed {
+ color: #34C759;
+ }
+ &.cancelled {
+ color: #ff3b30;
+ }
+ }
+ }
+ }
+
+ .description {
font-size: 28rpx;
+ color: #333;
+ line-height: 1.6;
+ background-color: #f9f9f9;
+ padding: 20rpx;
+ border-radius: 10rpx;
+ }
+ }
+
+ .loading {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 400rpx;
+ color: #999;
+
+ text {
+ margin-top: 20rpx;
+ font-size: 28rpx;
+ }
+ }
+
+ .action-buttons {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ display: flex;
+ padding: 20rpx;
+ background-color: white;
+ box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
+
+ .action-btn {
flex: 1;
- word-break: break-all;
+ height: 80rpx;
+ border-radius: 10rpx;
+ font-size: 30rpx;
+ margin: 0 10rpx;
+ background-color: #f0f0f0;
+ color: #333;
+
+ &.primary {
+ background-color: #007AFF;
+ color: white;
+ }
+
+ &.cancel {
+ background-color: #ff3b30;
+ color: white;
+ }
+
+ &:first-child {
+ margin-left: 0;
+ }
+
+ &:last-child {
+ margin-right: 0;
+ }
}
- }
- }
-
- .task-actions {
- display: flex;
- flex-wrap: wrap;
- background-color: white;
- border-radius: 15rpx;
- padding: 30rpx;
- margin-bottom: 20rpx;
- box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
-
- .action-btn {
- flex: 1;
- min-width: 30%;
- height: 70rpx;
- border-radius: 10rpx;
- font-size: 26rpx;
- margin: 10rpx 5rpx;
- background-color: #f0f0f0;
- color: #333;
-
- &.primary {
- background-color: #007AFF;
- color: white;
- }
-
- &.disabled {
- opacity: 0.5;
- }
- }
- }
-
- .action-section {
- margin-top: 40rpx;
- text-align: center;
-
- .back-btn {
- width: 80%;
- height: 80rpx;
- background-color: #007AFF;
- color: white;
- border-radius: 10rpx;
- font-size: 32rpx;
}
}
</style>
\ No newline at end of file
--
Gitblit v1.9.1