feat(web-admin): show this-trip driver and escort on plan view

Add a「本次安排」row above the vehicle personnel strip so the
selected driver and escort are visible separately from vehicle bindings.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
wuzilongandCursor committed 2026-09-13 12:28:04 +08:00
1 parent 7f25ff0fc0
commit c580bdf03f
1 file changed
+72
@@ -57,6 +57,21 @@
</div>
</div>
<div
v-if="showTripPersonnelRow"
class="pl-plan-trip-personnel pl-plan-transport-block"
>
<span class="pl-plan-trip-personnel__label">本次安排</span>
<span class="pl-plan-trip-personnel__item">
<el-tag type="primary" size="small">司机</el-tag>
<span class="pl-plan-trip-personnel__value">{{ tripDriverDisplay }}</span>
</span>
<span class="pl-plan-trip-personnel__item">
<el-tag type="warning" size="small">押运员</el-tag>
<span class="pl-plan-trip-personnel__value">{{ tripEscortDisplay }}</span>
</span>
</div>
<PlVehicleSummaryStrip
v-if="vehicleBundle"
class="pl-plan-transport-block"
@@ -1455,6 +1470,34 @@
return ''
})
/** 已安排运输时展示本次选中的司机/押运(非车辆关联全员) */
const showTripPersonnelRow = computed(
() =>
plan.value?.transportStatus === 'arranged' || Boolean(plan.value?.transportId)
)
function formatTripPerson(name?: string | null, phone?: string | null) {
const n = (name || '').trim()
const p = (phone || '').trim()
if (!n && !p) return '—'
if (n && p) return `${n} ${p}`
return n || p
}
const tripDriverDisplay = computed(() =>
formatTripPerson(
transport.value?.driverName || plan.value?.driverName,
transport.value?.driverPhone
)
)
const tripEscortDisplay = computed(() =>
formatTripPerson(
transport.value?.escortName || plan.value?.escortName,
transport.value?.escortPhone || plan.value?.escortPhone
)
)
const displayFreightType = computed(() => transport.value?.freightType || 'by_weight')
const displayDistanceKm = computed(() => {
@@ -1617,6 +1660,35 @@
}
}
.pl-plan-trip-personnel {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px 16px;
padding: 10px 12px;
border: 1px solid #a7f3d0;
border-radius: 8px;
background: #ecfdf5;
}
.pl-plan-trip-personnel__label {
font-size: 12px;
font-weight: 600;
color: #047857;
}
.pl-plan-trip-personnel__item {
display: inline-flex;
align-items: center;
gap: 6px;
min-width: 0;
}
.pl-plan-trip-personnel__value {
font-size: 13px;
color: #1e293b;
}
.pl-plan-view-stop-block {
display: flex;
flex-direction: column;