优化

src/modules/container-loading/pages/ContainersView.vue

@@ -52,6 +52,8 @@ const warehouses = ref<PlatformWarehouseSummaryResource[]>([])
 const destinationWarehouses = ref<PlatformWarehouseSummaryResource[]>([])
 const partners = ref<PlatformPartnerResource[]>([])
 const truckingSuppliers = ref<Supplier[]>([])
+const terminalFleetOptions = ref<Supplier[]>([])
+const terminalFleetLoading = ref(false)
 const oceanBookings = ref<OceanBookingResource[]>([])
 const loading = ref(false)
 const warehouseLoading = ref(false)
@@ -161,6 +163,7 @@ let warehouseOptionsPromise: Promise<void> | null = null
 let partnersLoaded = false
 let truckingSuppliersLoaded = false
 let truckingSuppliersPromise: Promise<Supplier[]> | null = null
+let terminalFleetSearchSequence = 0
 let oceanBookingsLoaded = false
 let businessOptionsPromise: Promise<void> | null = null
 
@@ -473,10 +476,26 @@ async function loadTruckingSuppliers(): Promise<Supplier[]> {
   try { return await truckingSuppliersPromise }
   finally { truckingSuppliersPromise = null }
 }
-async function ensureTruckingSuppliers(open: unknown = true) {
-  if (!open) return false
-  try { await loadTruckingSuppliers(); return true }
-  catch (error) { ElMessage.error(getApiErrorDetails(error, '拖车供应商加载失败').message); return false }
+async function searchTerminalFleets(keyword = '') {
+  const sequence = ++terminalFleetSearchSequence
+  terminalFleetLoading.value = true
+  try {
+    const result = await listSuppliers({
+      page: 1, size: 20, category: 'TRUCKING', status: 'ACTIVE', keyword: keyword.trim() || undefined,
+    })
+    if (sequence !== terminalFleetSearchSequence) return
+    terminalFleetOptions.value = result.records.filter((supplier) => supplier.category === 'TRUCKING' && supplier.status === 'ACTIVE')
+  } catch (error) {
+    if (sequence !== terminalFleetSearchSequence) return
+    terminalFleetOptions.value = []
+    ElMessage.error(getApiErrorDetails(error, '码头车队搜索失败').message)
+  } finally {
+    if (sequence === terminalFleetSearchSequence) terminalFleetLoading.value = false
+  }
+}
+function handleTerminalFleetVisible(open: boolean) {
+  if (open) void searchTerminalFleets()
+  else { terminalFleetSearchSequence++; terminalFleetLoading.value = false }
 }
 async function loadAllPartners() {
   const firstPage = await listPlatformPartners({ page: 1, size: 200, status: 'ACTIVE' })
@@ -562,8 +581,9 @@ async function refreshDrayage(containerBookingId: string) {
 async function selectRowFleet(source: object, supplierIdValue: unknown) {
   const row = source as ContainerBookingResource
   const current = drayageFor(row.id)
-  if (!(await ensureTruckingSuppliers())) return
-  const supplier = truckingCompanies.value.find((item) => item.id === String(supplierIdValue || ''))
+  const supplierId = String(supplierIdValue || '')
+  const supplier = terminalFleetOptions.value.find((item) => item.id === supplierId)
+    || truckingCompanies.value.find((item) => item.id === supplierId)
   if (!current || !supplier || !canDrayage(row, 'SELECT_FLEET') || drayageSavingIds.value.includes(row.id)) return
   drayageSavingIds.value = [...drayageSavingIds.value, row.id]
   try {
@@ -759,7 +779,7 @@ onMounted(async () => {
             <template #cabinet="{ row }"><strong>{{ row.cabinetNo }}</strong><small>系统生成</small></template>
             <template #oceanBooking="{ row }"><span v-if="row.oceanBookingId"><strong>{{ row.billOfLadingNo || '已关联订舱' }}</strong><small>{{ row.containerNo ? `集装箱号：${row.containerNo}` : '集装箱号：待补录' }}</small></span><span v-else>未关联</span></template>
             <template #containerNo="{ row }">{{ row.containerNo || '待补录' }}</template>
-            <template #terminalTruckingCompany="{ row }"><el-select class="fleet-select" :model-value="drayageFor(row.id)?.fleetSupplierId || ''" filterable placeholder="请选择车队" :loading="drayageSavingIds.includes(row.id)" :disabled="!canDrayage(row as ContainerBookingResource, 'SELECT_FLEET') || drayageSavingIds.includes(row.id)" @visible-change="ensureTruckingSuppliers" @update:model-value="selectRowFleet(row, $event)"><el-option v-if="drayageFor(row.id)?.fleetSupplierName && !truckingCompanies.some((item) => item.id === drayageFor(row.id)?.fleetSupplierId)" :label="drayageFor(row.id)?.fleetSupplierName || '原码头车队'" :value="drayageFor(row.id)?.fleetSupplierId || ''" disabled /><el-option v-for="supplier in truckingCompanies" :key="supplier.id" :label="supplier.name" :value="supplier.id" /></el-select></template>
+            <template #terminalTruckingCompany="{ row }"><el-select class="fleet-select" :model-value="drayageFor(row.id)?.fleetSupplierId || ''" filterable remote reserve-keyword remote-show-suffix placeholder="输入车队名称或联系人搜索" :remote-method="searchTerminalFleets" :loading="terminalFleetLoading || drayageSavingIds.includes(row.id)" :disabled="!canDrayage(row as ContainerBookingResource, 'SELECT_FLEET') || drayageSavingIds.includes(row.id)" no-data-text="未找到合作中的码头车队" @visible-change="handleTerminalFleetVisible" @update:model-value="selectRowFleet(row, $event)"><el-option v-if="drayageFor(row.id)?.fleetSupplierName && !terminalFleetOptions.some((item) => item.id === drayageFor(row.id)?.fleetSupplierId)" :label="drayageFor(row.id)?.fleetSupplierName || '原码头车队'" :value="drayageFor(row.id)?.fleetSupplierId || ''" disabled /><el-option v-for="supplier in terminalFleetOptions" :key="supplier.id" :label="supplier.name" :value="supplier.id" /></el-select></template>
             <template #pickupAppointmentAt="{ row }">{{ formatTime(drayageFor(row.id)?.pickupAppointmentAt) }}</template>
             <template #actualPickupAt="{ row }">{{ formatTime(drayageFor(row.id)?.actualPickupAt) }}</template>
             <template #estimatedEmptyReturnAt="{ row }">{{ formatTime(drayageFor(row.id)?.estimatedEmptyReturnAt) }}</template>