b2894lxlx/tms-erp-web
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

🐛 修复车务非必填-1展示，并完善总单调度与运单表单体验

Browse Source 
调度页限制上一段到达后才可调度；司机候选项点击展开；车务多模块-1显示为空；同步配载/总单编辑与导入相关优化。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
b2894lxlx
2026-09-27 21:26:55 +08:00
parent c268d2e64d
commit 98fbf123f5
29 changed files with 1150 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/business/components/master-order-dispatch.vue
+189 -40
View File
@@ -51,9 +51,29 @@
<section v-for="(route, index) in routes" :key="route.segmentNo" class="dispatch-section" :data-segment="route.segmentNo">
<header class="segment-header">
<div>
<el-checkbox v-model="route.selected">
<el-tooltip
v-if="!canDispatchSegment(route)"
content="需等上一段运单完成到达后才能调度"
placement="top"
>
<span class="segment-checkbox-wrap">
<el-checkbox :model-value="false" disabled>
<span class="segment-checkbox-label">
<span class="segment-checkbox-no">{{ route.segmentNo }}：</span>
<span class="segment-checkbox-path"
>{{ dispatchLocationName(route, 'departure') }} → {{ dispatchLocationName(route, 'arrival') }}</span
>
</span>
</el-checkbox>
</span>
</el-tooltip>
<el-checkbox
v-else
v-model="route.selected"
@change="value => handleSegmentSelect(route, value)"
>
<span class="segment-checkbox-label">
<span>{{ route.segmentNo }}：</span>
<span class="segment-checkbox-no">{{ route.segmentNo }}：</span>
<el-tooltip
:content="`${dispatchLocationName(route, 'departure')} → ${dispatchLocationName(route, 'arrival')}`"
placement="top"
@@ -65,7 +85,15 @@
</span>
</el-checkbox>
</div>
<div>总量 {{ formatQuantity(totalQuantity) }} {{ quantityUnitLabel }}，已调度 <em>{{ formatQuantity(dispatchedQuantity(route)) }} {{ quantityUnitLabel }}</em>，剩余 <em>{{ formatQuantity(remaining(route)) }} {{ quantityUnitLabel }}</em></div>
<div>
总量 {{ formatQuantity(totalQuantity) }} {{ quantityUnitLabel }}，已调度
<em>{{ formatQuantity(dispatchedQuantity(route)) }} {{ quantityUnitLabel }}</em>，剩余
<em>{{ formatQuantity(remaining(route)) }} {{ quantityUnitLabel }}</em>
<template v-if="index > 0">
，上一段已到达
<em>{{ formatQuantity(previousArrivedQuantity(route)) }} {{ quantityUnitLabel }}</em>
</template>
</div>
</header>
<div v-show="route.selected" class="segment-content">
<el-form :model="route" label-position="right" label-width="auto" class="dispatch-form">
@@ -78,16 +106,28 @@
<el-col :span="12">
<el-form-item label="发货地址" required><el-input :model-value="addressText(route.departureName, route.departureAddress)" disabled /></el-form-item>
</el-col>
<el-col :span="4"><el-form-item label="联系人"><el-input v-model="route.departureContact" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="4"><el-form-item label="联系方式"><el-input v-model="route.departurePhone" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="4"
><el-form-item label="联系人" label-width="68px" class="dispatch-form__compact-label"
><el-input v-model="route.departureContact" placeholder="请输入" /></el-form-item
></el-col>
<el-col :span="4"
><el-form-item label="联系方式" label-width="80px" class="dispatch-form__compact-label"
><el-input v-model="route.departurePhone" placeholder="请输入" /></el-form-item
></el-col>
<el-col :span="4"><el-form-item :label="dateStartLabel(route)"><el-date-picker v-model="route.estimatedStartTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择" /></el-form-item></el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="收货地址" required><el-input :model-value="addressText(route.arrivalName, route.arrivalAddress)" disabled /></el-form-item>
</el-col>
<el-col :span="4"><el-form-item label="联系人"><el-input v-model="route.arrivalContact" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="4"><el-form-item label="联系方式"><el-input v-model="route.arrivalPhone" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="4"
><el-form-item label="联系人" label-width="68px" class="dispatch-form__compact-label"
><el-input v-model="route.arrivalContact" placeholder="请输入" /></el-form-item
></el-col>
<el-col :span="4"
><el-form-item label="联系方式" label-width="80px" class="dispatch-form__compact-label"
><el-input v-model="route.arrivalPhone" placeholder="请输入" /></el-form-item
></el-col>
<el-col :span="4"><el-form-item :label="dateEndLabel(route)"><el-date-picker v-model="route.estimatedEndTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择" /></el-form-item></el-col>
</el-row>
</el-form>
@@ -156,12 +196,55 @@
<el-row :gutter="16">
<template v-if="isRoad(route)">
<el-col :span="6"><el-form-item label="承运商" :required="route.carrierType !== '自运'"><el-select :model-value="route.carrierType !== '自运' ? route.carrierContractId : route.carrierName" filterable clearable placeholder="请选择" :loading="carrierLoading" @change="value => handleCarrierContractChange(route, value)"><el-option v-for="item in carrierOptions" :key="carrierOptionValue(item)" :label="carrierOptionLabel(item)" :value="route.carrierType !== '自运' ? carrierOptionValue(item) : item.carrierName" /></el-select></el-form-item></el-col>
<el-col :span="6"><el-form-item label="司机" :required="route.carrierType !== '承运商'"><el-autocomplete :ref="element => setDriverInput(route.segmentNo, element)" v-model="route.driverName" :debounce="300" :fetch-suggestions="(query, cb) => fetchDriverSuggestions(route, query, cb)" clearable placeholder="请输入司机" :loading="driverLoading" @select="item => handleDriverSuggestionSelect(route, item)" /></el-form-item></el-col>
<el-col :span="6"><el-form-item :label="route.carrierType === '承运商' ? '手机号' : '司机手机号'" :required="route.carrierType !== '承运商'"><el-input v-model="route.driverPhone" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="车牌号" required><el-input v-model="route.vehicleNo" placeholder="请输入" /></el-form-item></el-col>
<el-col v-if="route.carrierType !== '承运商'" :span="6"><el-form-item label="挂车车牌号"><el-input v-model="route.trailerVehicleNo" placeholder="请输入" /></el-form-item></el-col>
<el-col v-if="route.carrierType !== '承运商'" :span="6"><el-form-item label="押运人"><el-autocomplete v-model="route.escortName" :debounce="300" :fetch-suggestions="(query, cb) => fetchEscortSuggestions(route, query, cb)" clearable placeholder="请输入" :loading="escortLoading" @select="item => handleEscortSuggestionSelect(route, item)" /></el-form-item></el-col>
<el-col v-if="route.carrierType !== '承运商'" :span="6"><el-form-item label="押运人手机号"><el-input v-model="route.escortPhone" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="6"
><el-form-item label="司机" :required="route.carrierType !== '承运商'"
><el-autocomplete
:ref="element => setDriverInput(route.segmentNo, element)"
v-model="route.driverName"
clearable
trigger-on-focus
:debounce="300"
:fetch-suggestions="fetchDriverSuggestions"
:loading="driverLoading"
placeholder="请输入司机"
@mousedown="() => handleDriverFocus(route)"
@focus="() => handleDriverFocus(route)"
@select="handleDriverSuggestionSelect"
/></el-form-item
></el-col>
<el-col :span="6"
><el-form-item
:label="route.carrierType === '承运商' ? '手机号' : '司机手机号'"
:required="route.carrierType !== '承运商'"
><el-input v-model="route.driverPhone" placeholder="请输入" /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="车牌号" required
><el-input v-model="route.vehicleNo" placeholder="请输入" /></el-form-item
></el-col>
<el-col v-if="route.carrierType !== '承运商'" :span="6"
><el-form-item label="挂车车牌号"
><el-input v-model="route.trailerVehicleNo" placeholder="请输入" /></el-form-item
></el-col>
<el-col v-if="route.carrierType !== '承运商'" :span="6"
><el-form-item label="押运人"
><el-autocomplete
v-model="route.escortName"
clearable
trigger-on-focus
:debounce="300"
:fetch-suggestions="fetchEscortSuggestions"
:loading="escortLoading"
placeholder="请输入"
@mousedown="() => handleDriverFocus(route)"
@focus="() => handleDriverFocus(route)"
@select="handleEscortSuggestionSelect"
/></el-form-item
></el-col>
<el-col v-if="route.carrierType !== '承运商'" :span="6"
><el-form-item label="押运人手机号"
><el-input v-model="route.escortPhone" placeholder="请输入" /></el-form-item
></el-col>
</template>
<template v-else>
<el-col :span="6"><el-form-item label="承运商" :required="route.carrierType !== '自运'"><el-select :model-value="route.carrierType !== '自运' ? route.carrierContractId : route.carrierName" filterable clearable placeholder="请选择" :loading="carrierLoading" @change="value => handleCarrierContractChange(route, value)"><el-option v-for="item in carrierOptions" :key="carrierOptionValue(item)" :label="carrierOptionLabel(item)" :value="route.carrierType !== '自运' ? carrierOptionValue(item) : item.carrierName" /></el-select></el-form-item></el-col>
@@ -249,7 +332,23 @@ export default {
props: { id: [String, Number] },
emits: ['back'],
data() {
return { loading: false, submitting: false, master: null, routes: [], pending: [], pendingExpanded: false, editingId: null, driverInputs: {}, carrierOptions: [], driverOptions: [], carrierLoading: false, driverLoading: false, escortLoading: false, quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'] };
return {
loading: false,
submitting: false,
master: null,
routes: [],
pending: [],
pendingExpanded: false,
editingId: null,
driverInputs: {},
activeSuggestRoute: null,
carrierOptions: [],
driverOptions: [],
carrierLoading: false,
driverLoading: false,
escortLoading: false,
quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'],
};
},
computed: {
totalQuantity() { return (this.master?.goods || []).reduce((sum, item) => sum + Number(item.quantity || 0), 0); },
@@ -453,12 +552,29 @@ export default {
dispatchedQuantity(route) {
return this.quantityNumber(route.dispatchedQuantity) + this.pendingSegmentQuantity(route);
},
previousArrivedQuantity(route) {
const routeIndex = this.routes.indexOf(route);
if (routeIndex <= 0) return null;
return this.quantityNumber(this.routes[routeIndex - 1]?.arrivedQuantity);
},
canDispatchSegment(route) {
const previousArrived = this.previousArrivedQuantity(route);
if (previousArrived === null) return true;
return previousArrived > 0;
},
remaining(route) {
return Math.max(
0,
this.totalQuantity -
this.dispatchedQuantity(route)
);
const masterRemaining = Math.max(0, this.totalQuantity - this.dispatchedQuantity(route));
const previousArrived = this.previousArrivedQuantity(route);
if (previousArrived === null) return masterRemaining;
return Math.max(0, Math.min(masterRemaining, previousArrived - this.dispatchedQuantity(route)));
},
handleSegmentSelect(route, value) {
if (value && !this.canDispatchSegment(route)) {
route.selected = false;
this.$message.warning(
`${route.segmentNo}需等上一段运单完成到达后才能调度（上一段已到达 ${this.formatQuantity(this.previousArrivedQuantity(route))} ${this.quantityUnitLabel}）`
);
}
},
formatQuantity(value) { const number = Number(value || 0); return Number.isInteger(number) ? number : number.toFixed(3).replace(/\.?0+$/, ''); },
formatAmount(value) { return Number(value || 0).toFixed(2); },
@@ -518,7 +634,7 @@ export default {
})),
});
},
currencyLabel(value) { return ({ CNY: '人民币', RMB: '人民币', USD: '美元', EUR: '欧元' })[value] || value || '人民币'; },
currencyLabel(value) { return ({ CNY: '元', RMB: '元', USD: '美元', EUR: '欧元' })[value] || value || '元'; },
quantityNumber(value) { return Number(value || 0); },
goodsKey(goods = {}, includeUnit = true) {
return [
@@ -563,13 +679,14 @@ export default {
}, 0);
},
validatePreviousSegmentCompletedQuantity(route, goods) {
const routeIndex = this.routes.indexOf(route);
if (routeIndex <= 0) return true;
const previousCompletedQuantity = this.quantityNumber(
this.routes[routeIndex - 1]?.arrivedQuantity
);
const previousCompletedQuantity = this.previousArrivedQuantity(route);
if (previousCompletedQuantity === null) return true;
if (previousCompletedQuantity <= 0) {
this.$message.warning(`${route.segmentNo}需等上一段运单完成到达后才能调度`);
return false;
}
const currentDispatchQuantity = (goods || []).reduce(
(sum, item) => sum + this.quantityNumber(item.dispatchQuantity),
(sum, item) => sum + this.quantityNumber(item.dispatchQuantity ?? item.quantity),
0
);
const dispatchTotal =
@@ -578,7 +695,7 @@ export default {
currentDispatchQuantity;
if (dispatchTotal <= previousCompletedQuantity) return true;
this.$message.warning(
`${route.segmentNo}调度总量不能大于上一段已完成数量（${this.formatQuantity(previousCompletedQuantity)} ${this.quantityUnitLabel}）`
`${route.segmentNo}调度总量不能大于上一段已到达数量（${this.formatQuantity(previousCompletedQuantity)} ${this.quantityUnitLabel}）`
);
return false;
},
@@ -836,6 +953,9 @@ export default {
route.carrierContractId = '';
});
},
handleDriverFocus(route) {
this.activeSuggestRoute = route;
},
async loadDriverOptions(route = {}, keyword = '') {
const carrier = this.getRouteCarrierFilter(route);
if (!carrier.carrierId && !carrier.carrierName) {
@@ -853,35 +973,50 @@ export default {
this.driverLoading = false;
}
},
fetchDriverSuggestions(route, queryString, callback) {
fetchDriverSuggestions(queryString, callback) {
const route = this.activeSuggestRoute || {};
const carrier = this.getRouteCarrierFilter(route);
const keyword = String(queryString || '').trim();
if (!carrier.carrierId && !carrier.carrierName) {
callback([]);
if (!keyword) this.$message.warning('请先选择承运商');
return;
}
this.loadDriverOptions(route, String(queryString || '').trim())
.then(() =>
this.driverLoading = true;
fetchDriversByCarrierOrganizations(
{ size: 20, ...(keyword ? { driverName: keyword } : {}), posts: '司机' },
carrier
)
.then(records => {
this.driverOptions = records;
callback(
this.driverOptions.map(item => ({
records.map(item => ({
...item,
value: this.driverOptionLabel(item),
}))
)
)
.catch(() => callback([]));
);
})
.catch(() => callback([]))
.finally(() => {
this.driverLoading = false;
});
},
handleDriverSuggestionSelect(route, item = {}) {
handleDriverSuggestionSelect(item = {}) {
const route = this.activeSuggestRoute;
if (!route) return;
route.driverName = this.driverOptionLabel(item);
route.driverId = item.id || item.driverId || '';
route.driverPhone = item.mobile || item.driverPhone || item.phone || route.driverPhone || '';
const drivingVehicle = String(item.drivingVehicle || '').trim();
if (drivingVehicle) route.vehicleNo = drivingVehicle;
},
fetchEscortSuggestions(route, queryString, callback) {
fetchEscortSuggestions(queryString, callback) {
const route = this.activeSuggestRoute || {};
const keyword = String(queryString || '').trim();
const carrier = this.getRouteCarrierFilter(route);
if (!carrier.carrierId && !carrier.carrierName) {
callback([]);
if (!keyword) this.$message.warning('请先选择承运商');
return;
}
this.escortLoading = true;
@@ -902,7 +1037,9 @@ export default {
this.escortLoading = false;
});
},
handleEscortSuggestionSelect(route, item = {}) {
handleEscortSuggestionSelect(item = {}) {
const route = this.activeSuggestRoute;
if (!route) return;
route.escortName = this.driverOptionLabel(item);
const phone = item.mobile || item.driverPhone || item.phone || '';
if (phone) route.escortPhone = phone;
@@ -927,6 +1064,10 @@ export default {
addToPending(route, continueDispatch) {
const goods = route.goods.filter(item => Number(item.dispatchQuantity) > 0);
if (!goods.length) return this.$message.warning('请填写本次数量');
if (!this.canDispatchSegment(route)) {
return this.$message.warning(`${route.segmentNo}需等上一段运单完成到达后才能调度`);
}
if (!this.validatePreviousSegmentCompletedQuantity(route, goods)) return;
if (!this.validateDispatchGoods(route, goods)) return;
this.syncFreightItems(route);
if (!this.validateFreightItems(route)) return;
@@ -1041,9 +1182,11 @@ export default {
.pending-list-spacer { height: min(436px, calc(100vh - 130px)); }
.master-overview, .dispatch-section { margin-bottom: 8px; border: 1px solid #eff1f7; background: #fff; }
.overview-heading, .segment-header, .pending-bar { display: flex; align-items: center; justify-content: space-between; }
.segment-header :deep(.el-checkbox.is-checked .el-checkbox__label) { font-size: 16px; font-weight: 700; }
.segment-checkbox-label { display: inline-flex; align-items: center; min-width: 0; }
.segment-checkbox-path { display: inline-block; white-space: nowrap; }
.segment-checkbox-wrap { display: inline-flex; max-width: 100%; }
.segment-checkbox-label { display: inline-flex; align-items: center; min-width: 0; font-size: 14px; font-weight: 400; color: #303133; }
/* 仅「段X：」加粗加大，冒号右侧路线保持常规字号 */
.segment-checkbox-no { font-size: 16px; font-weight: 700; color: #303133; }
.segment-checkbox-path { display: inline-block; white-space: nowrap; font-size: 14px; font-weight: 400; }
.overview-heading { padding: 18px 24px 12px; h2 { display: inline-block; margin: 0 16px 0 0; font-size: 20px; } h2 span { margin: 0 8px; color: #909399; font-weight: 400; } }
.overview-content { display: grid; grid-template-columns: minmax(400px, .9fr) minmax(620px, 1.6fr); gap: 28px; padding: 8px 24px 20px; }
.overview-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 24px; margin: 0; dt { margin-bottom: 6px; color: #909399; font-size: 13px; } dd { margin: 0; color: #409eff; font-size: 14px; word-break: break-all; } }
@@ -1055,6 +1198,12 @@ export default {
.segment-header { min-height: 46px; padding: 0 20px; border-bottom: 1px solid #eff1f7; font-weight: 600; em { color: #409eff; font-style: normal; } }
.segment-content { padding: 16px 24px; }
.dispatch-form { :deep(.el-form-item) { margin-bottom: 14px; } :deep(.el-input), :deep(.el-select), :deep(.el-date-editor), :deep(.el-input-number) { width: 100%; } :deep(.el-input-group__append .el-select) { width: auto; } }
/* 短标签按自身宽度，避免被「预计发货日期」等长标签把左侧撑开 */
.dispatch-form__compact-label {
:deep(.el-form-item__label) {
justify-content: flex-end;
}
}
.transport-type-field :deep(.el-input) { width: 240px; }
.goods-heading { display: flex; align-items: center; justify-content: space-between; margin: 0 -24px 12px; padding: 14px 24px; border-top: 1px solid #eff1f7; border-bottom: 1px solid #eff1f7; h3 { margin: 0; padding-left: 12px; border-left: 4px solid #409eff; font-size: 16px; } span { color: #909399; font-size: 13px; } }
.freight-heading { margin: 16px 0 12px; h3 { margin: 0; padding-left: 12px; border-left: 4px solid #409eff; font-size: 16px; } }