优化优化

src/modules/container-loading/pages/ContainersView.test.ts

@@ -3,12 +3,19 @@ import { createPinia, setActivePinia } from 'pinia'
 import { createMemoryHistory, createRouter } from 'vue-router'
 import { flushPromises, mount } from '@vue/test-utils'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
 import ContainersView from './ContainersView.vue'
 import { listAllPlatformWarehouses } from '@/modules/warehouses'
+import { listPlatformPartners } from '@/modules/master-data'
+import { listOceanBookings } from '@/modules/ocean-bookings'
 import { listContainers } from '../api/platformContainerLoading'
 
 vi.mock('@/modules/warehouses', () => ({ listAllPlatformWarehouses: vi.fn() }))
-vi.mock('@/core/access/accessPreview', () => ({ useAccessPreviewStore: () => ({ can: () => true }) }))
+vi.mock('@/modules/master-data', () => ({ listPlatformPartners: vi.fn() }))
+vi.mock('@/modules/ocean-bookings', () => ({ listOceanBookings: vi.fn() }))
+const accessCan = vi.hoisted(() => vi.fn())
+vi.mock('@/core/access/accessPreview', () => ({ useAccessPreviewStore: () => ({ can: accessCan }) }))
 vi.mock('../api/platformContainerLoading', () => ({ listContainers: vi.fn(), getContainer: vi.fn(), createContainer: vi.fn(), updateContainer: vi.fn(), updateContainerTransport: vi.fn() }))
 
 function createTestRouter() {
@@ -23,7 +30,10 @@ function createTestRouter() {
 describe('ContainersView', () => {
   beforeEach(() => {
     setActivePinia(createPinia())
+    accessCan.mockReset(); accessCan.mockReturnValue(true)
     vi.mocked(listAllPlatformWarehouses).mockResolvedValue([])
+    vi.mocked(listPlatformPartners).mockResolvedValue({ records: [], page: 1, size: 200, total: 0, pages: 1 })
+    vi.mocked(listOceanBookings).mockResolvedValue({ records: [], page: 1, size: 200, total: 0, pages: 1 })
     vi.mocked(listContainers).mockResolvedValue({ records: [{ id: '9001', planId: null, bookingNo: 'BK-1', cabinetNo: 'CB-1', containerNo: 'MSCU-1', warehouseId: '8', warehouseName: '义乌仓', containerType: '40HQ', planStatus: 'WAIT_LOADING', version: 0, billOfLadingNo: null, vesselName: null, voyageNo: null, shippingCompanyId: null, shippingCompanyName: null, departurePortCode: null, departurePortName: '宁波', destinationPortCode: null, destinationPortName: '长滩', destinationWarehouseCode: null, destinationWarehouseName: null, capacityCbm: 68, maxWeightKg: 28000, terminalTruckingCompany: null, loadingAt: null, estimatedSailingAt: null, actualSailingAt: null, estimatedPortArrivalAt: null, actualPortArrivalAt: null, estimatedWarehouseArrivalAt: null, actualWarehouseArrivalAt: null }], page: 1, size: 20, total: 1, pages: 1 })
   })
 
@@ -115,4 +125,37 @@ describe('ContainersView', () => {
     expect(push).toHaveBeenNthCalledWith(2, { name: 'loading-plans', query: { planId: '9102', warehouseId: '8' } })
     expect(push).toHaveBeenNthCalledWith(3, { name: 'loading-lists', query: { planId: '9103', warehouseId: '8' } })
   })
+
+  it('keeps view and edit operations behind their own backend permissions', async () => {
+    accessCan.mockImplementation((permission: string) => permission !== 'platform:firstleg:container:view')
+    const router = createTestRouter()
+    await router.push('/'); await router.isReady()
+    const wrapper = mount(ContainersView, { global: { plugins: [ElementPlus, router] } })
+    await flushPromises()
+
+    expect(wrapper.find('button[aria-label="查看 CB-1"]').exists()).toBe(false)
+    expect(wrapper.findAll('button').some((button) => button.text().trim() === '编辑')).toBe(false)
+  })
+
+  it('uses business selectors and keeps code/name pairs internal', () => {
+    const source = readFileSync(resolve(process.cwd(), 'src/modules/container-loading/pages/ContainersView.vue'), 'utf8')
+    expect(source).toContain('placeholder="请选择船公司"')
+    expect(source).toContain('placeholder="请选择起运港"')
+    expect(source).toContain('placeholder="请选择目的港"')
+    expect(source).toContain('placeholder="请选择目的仓"')
+    expect(source).toContain("selectPort('departure'")
+    expect(source).toContain('selectDestinationWarehouse')
+    expect(source).toContain('重新加载业务选项')
+    expect(source).not.toContain('label="起运港代码"')
+    expect(source).not.toContain('label="起运港名称"')
+    expect(source).not.toContain('label="目的仓代码"')
+    expect(source).not.toContain('label="目的仓名称"')
+  })
+
+  it('keeps query and pagination on a single list request path', () => {
+    const source = readFileSync(resolve(process.cwd(), 'src/modules/container-loading/pages/ContainersView.vue'), 'utf8')
+    expect(source).toContain("if (page.value === 1) void loadRows(); else page.value = 1")
+    expect(source).toContain("if (nextPage !== previousPage || nextSize !== previousSize) void loadRows()")
+    expect(source).not.toContain('@reset=')
+  })
 })

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

@@ -5,6 +5,8 @@ import { Boxes, Eye, ListChecks, Pencil, Plus, Sparkles } from '@lucide/vue'
 import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
 import { useAccessPreviewStore } from '@/core/access/accessPreview'
 import { listAllPlatformWarehouses, type PlatformWarehouseSummaryResource } from '@/modules/warehouses'
+import { listPlatformPartners, type PlatformPartnerResource } from '@/modules/master-data'
+import { listOceanBookings, type OceanBookingResource } from '@/modules/ocean-bookings'
 import AdminPage from '@/shared/components/AdminPage.vue'
 import ApiErrorMeta from '@/shared/components/ApiErrorMeta.vue'
 import AppDrawer from '@/shared/components/AppDrawer.vue'
@@ -23,10 +25,15 @@ const router = useRouter()
 const access = useAccessPreviewStore()
 const rows = ref<ContainerBookingResource[]>([])
 const warehouses = ref<PlatformWarehouseSummaryResource[]>([])
+const destinationWarehouses = ref<PlatformWarehouseSummaryResource[]>([])
+const partners = ref<PlatformPartnerResource[]>([])
+const oceanBookings = ref<OceanBookingResource[]>([])
 const loading = ref(false)
 const warehouseLoading = ref(false)
 const loadError = ref<ApiErrorDetails | null>(null)
 const warehouseError = ref<ApiErrorDetails | null>(null)
+const businessOptionsLoading = ref(false)
+const businessOptionsError = ref('')
 const page = ref(1)
 const pageSize = ref(20)
 const total = ref(0)
@@ -63,12 +70,40 @@ const rules: FormRules<ContainerForm> = {
 }
 
 const canCreate = computed(() => access.can('platform:firstleg:container:create'))
+const canView = computed(() => access.can('platform:firstleg:container:view'))
 const canEdit = computed(() => access.can('platform:firstleg:container:edit'))
 const canSmartLoading = computed(() => access.can('platform:firstleg:smart-loading:list'))
 const canViewPreload = computed(() => access.can('platform:firstleg:preload:list'))
 const canViewLoadingList = computed(() => access.can('platform:firstleg:loading-list:list'))
 const editorTitle = computed(() => form.id ? (detail.value?.planStatus === 'LOADING' ? '修改运输信息' : '编辑货柜') : '新增货柜')
 const transportOnly = computed(() => Boolean(form.id) && detail.value?.planStatus === 'LOADING')
+const shippingCompanies = computed(() => partners.value.filter((partner) => partner.status === 'ACTIVE' && partner.types.includes('CARRIER')))
+const truckingCompanies = computed(() => partners.value.filter((partner) => partner.status === 'ACTIVE' && partner.types.some((type) => ['CARRIER', 'SUPPLIER'].includes(type))))
+
+interface PortOption { value: string; code: string | null; name: string | null }
+function portValue(code: string | null | undefined, name: string | null | undefined) { return code || name ? JSON.stringify([code || '', name || '']) : '' }
+function collectPorts(direction: 'departure' | 'destination'): PortOption[] {
+  const entries = oceanBookings.value.map((booking) => direction === 'departure'
+    ? { code: booking.departurePortCode, name: booking.departurePortName }
+    : { code: booking.destinationPortCode, name: booking.destinationPortName })
+  const current = direction === 'departure'
+    ? { code: form.departurePortCode, name: form.departurePortName }
+    : { code: form.destinationPortCode, name: form.destinationPortName }
+  entries.push(current)
+  const options = new Map<string, PortOption>()
+  for (const entry of entries) {
+    if (!entry.code && !entry.name) continue
+    const value = portValue(entry.code, entry.name)
+    options.set(value, { value, code: entry.code || null, name: entry.name || null })
+  }
+  return [...options.values()].sort((left, right) => (left.name || left.code || '').localeCompare(right.name || right.code || '', 'zh-CN'))
+}
+const departurePorts = computed(() => collectPorts('departure'))
+const destinationPorts = computed(() => collectPorts('destination'))
+const departurePortValue = computed(() => portValue(form.departurePortCode, form.departurePortName))
+const destinationPortValue = computed(() => portValue(form.destinationPortCode, form.destinationPortName))
+const shippingCompanyValue = computed(() => form.shippingCompanyId || (form.shippingCompanyName ? `name:${form.shippingCompanyName}` : ''))
+const destinationWarehouseValue = computed(() => form.destinationWarehouseCode || (form.destinationWarehouseName ? `name:${form.destinationWarehouseName}` : ''))
 
 const queryFields = computed<QueryField[]>(() => [
   { key: 'keyword', type: 'input', label: '关键词', width: 220, placeholder: '柜次号、柜号或提单号', props: { 'aria-label': '关键词', maxlength: 128 } },
@@ -119,12 +154,80 @@ function payload(): ContainerSaveRequest {
   }
 }
 
+function partnerLabel(partner: PlatformPartnerResource) {
+  return `${partner.partnerName}${partner.partnerCode ? `（${partner.partnerCode}）` : ''}`
+}
+function portLabel(port: PortOption) {
+  return port.name && port.code ? `${port.name}（${port.code}）` : port.name || port.code || '未命名港口'
+}
+function selectShippingCompany(partnerId: string) {
+  if (partnerId.startsWith('name:')) {
+    form.shippingCompanyId = null
+    form.shippingCompanyName = partnerId.slice(5) || null
+    return
+  }
+  const partner = partners.value.find((item) => String(item.id) === partnerId)
+  form.shippingCompanyId = partnerId || null
+  form.shippingCompanyName = partner?.partnerName || null
+}
+function selectPort(direction: 'departure' | 'destination', value: string) {
+  const option = (direction === 'departure' ? departurePorts.value : destinationPorts.value).find((item) => item.value === value)
+  if (direction === 'departure') {
+    form.departurePortCode = option?.code || null
+    form.departurePortName = option?.name || null
+  } else {
+    form.destinationPortCode = option?.code || null
+    form.destinationPortName = option?.name || null
+  }
+}
+function selectDestinationWarehouse(warehouseCode: string) {
+  if (warehouseCode.startsWith('name:')) {
+    form.destinationWarehouseCode = null
+    form.destinationWarehouseName = warehouseCode.slice(5) || null
+    return
+  }
+  const warehouse = destinationWarehouses.value.find((item) => item.warehouseCode === warehouseCode)
+  form.destinationWarehouseCode = warehouseCode || null
+  form.destinationWarehouseName = warehouse?.warehouseName || null
+}
+
 async function loadWarehouses() {
   warehouseLoading.value = true; warehouseError.value = null
-  try { warehouses.value = await listAllPlatformWarehouses({ warehouseType: 'DOMESTIC', status: 'ACTIVE' }) }
+  try {
+    const records = await listAllPlatformWarehouses({ status: 'ACTIVE' })
+    warehouses.value = records.filter((warehouse) => warehouse.warehouseType === 'DOMESTIC')
+    destinationWarehouses.value = records.filter((warehouse) => warehouse.warehouseType !== 'DOMESTIC')
+  }
   catch (error) { warehouseError.value = getApiErrorDetails(error, '装柜仓库加载失败') }
   finally { warehouseLoading.value = false }
 }
+async function loadBusinessOptions() {
+  businessOptionsLoading.value = true
+  businessOptionsError.value = ''
+  const errors: string[] = []
+  const [partnerResult, bookingResult] = await Promise.allSettled([
+    loadAllPartners(),
+    loadAllOceanBookings(),
+  ])
+  if (partnerResult.status === 'fulfilled') partners.value = partnerResult.value
+  else errors.push(getApiErrorDetails(partnerResult.reason, '船公司与拖车公司加载失败').message)
+  if (bookingResult.status === 'fulfilled') oceanBookings.value = bookingResult.value
+  else errors.push(getApiErrorDetails(bookingResult.reason, '港口候选加载失败').message)
+  businessOptionsError.value = errors.join('；')
+  businessOptionsLoading.value = false
+}
+async function loadAllPartners() {
+  const firstPage = await listPlatformPartners({ page: 1, size: 200, status: 'ACTIVE' })
+  if (firstPage.pages <= 1) return firstPage.records
+  const remaining = await Promise.all(Array.from({ length: firstPage.pages - 1 }, (_, index) => listPlatformPartners({ page: index + 2, size: 200, status: 'ACTIVE' })))
+  return [firstPage, ...remaining].flatMap((pageResult) => pageResult.records)
+}
+async function loadAllOceanBookings() {
+  const firstPage = await listOceanBookings({ page: 1, size: 200 })
+  if (firstPage.pages <= 1) return firstPage.records
+  const remaining = await Promise.all(Array.from({ length: firstPage.pages - 1 }, (_, index) => listOceanBookings({ page: index + 2, size: 200 })))
+  return [firstPage, ...remaining].flatMap((pageResult) => pageResult.records)
+}
 async function loadRows() {
   const sequence = ++listSequence
   loading.value = true; loadError.value = null
@@ -205,7 +308,7 @@ function goContainerProcess(source: object) {
 watch([page, pageSize], ([nextPage, nextSize], [previousPage, previousSize]) => {
   if (nextPage !== previousPage || nextSize !== previousSize) void loadRows()
 })
-onMounted(() => { void Promise.all([loadWarehouses(), loadRows()]) })
+onMounted(() => { void Promise.all([loadWarehouses(), loadBusinessOptions(), loadRows()]) })
 </script>
 
 <template>
@@ -221,7 +324,7 @@ onMounted(() => { void Promise.all([loadWarehouses(), loadRows()]) })
         <section v-if="!loadError" class="surface-panel table-panel">
           <DataTable v-model:page="page" v-model:page-size="pageSize" :data="rows" :columns="columns" :total="total" :loading="loading" preference-key="container-loading-table" empty-text="暂无货柜">
             <template #toolbar-actions><el-button v-if="canCreate" type="primary" @click="openCreate"><Plus :size="16" />新增货柜</el-button></template>
-            <template #actions="{ row }"><div class="row-actions"><el-button link type="primary" :aria-label="containerViewLabel(row as ContainerBookingResource)" @click="openDetail(row)"><Eye :size="15" />查看</el-button><el-button v-if="canEdit && row.planStatus !== 'COMPLETED'" link type="primary" @click="openEdit(row)"><Pencil :size="15" />编辑</el-button><el-button v-if="row.planStatus === 'EDITING' && canSmartLoading" link type="primary" @click="goContainerProcess(row)"><Sparkles :size="15" />排柜</el-button><el-button v-else-if="row.planStatus === 'LOADING' && canViewPreload" link type="primary" @click="goContainerProcess(row)"><ListChecks :size="15" />查看预装清单</el-button><el-button v-else-if="row.planStatus === 'COMPLETED' && canViewLoadingList" link type="primary" @click="goContainerProcess(row)"><ListChecks :size="15" />查看装柜清单</el-button></div></template>
+            <template #actions="{ row }"><div class="row-actions"><el-button v-if="canView" link type="primary" :aria-label="containerViewLabel(row as ContainerBookingResource)" @click="openDetail(row)"><Eye :size="15" />查看</el-button><el-button v-if="canView && canEdit && row.planStatus !== 'COMPLETED'" link type="primary" @click="openEdit(row)"><Pencil :size="15" />编辑</el-button><el-button v-if="row.planStatus === 'EDITING' && canSmartLoading" link type="primary" @click="goContainerProcess(row)"><Sparkles :size="15" />排柜</el-button><el-button v-else-if="row.planStatus === 'LOADING' && canViewPreload" link type="primary" @click="goContainerProcess(row)"><ListChecks :size="15" />查看预装清单</el-button><el-button v-else-if="row.planStatus === 'COMPLETED' && canViewLoadingList" link type="primary" @click="goContainerProcess(row)"><ListChecks :size="15" />查看装柜清单</el-button></div></template>
             <template #cabinet="{ row }"><strong>{{ row.cabinetNo }}</strong><small>{{ row.bookingNo }}</small></template>
             <template #containerNo="{ row }">{{ row.containerNo || '待录入' }}</template>
             <template #status="{ row }"><el-tag :type="row.planStatus === 'COMPLETED' ? 'success' : row.planStatus === 'LOADING' ? 'warning' : 'info'">{{ statusText(row.planStatus) }}</el-tag></template>
@@ -242,27 +345,25 @@ onMounted(() => { void Promise.all([loadWarehouses(), loadRows()]) })
       <LoadErrorState v-if="editorError" title="货柜保存失败" :message="editorError.message" compact :retry-text="form.id ? '刷新最新数据' : '重试保存'" @retry="form.id ? openEdit({ id: form.id }) : save()"><template #details><ApiErrorMeta :details="editorError" /></template></LoadErrorState>
       <el-alert v-if="transportOnly" title="拣货中仅允许修改集装箱号和航次，其他字段已锁定。" type="warning" :closable="false" />
       <LoadErrorState v-if="warehouseError && !transportOnly" title="装柜仓库加载失败" :message="warehouseError.message" compact @retry="loadWarehouses"><template #details><ApiErrorMeta :details="warehouseError" /></template></LoadErrorState>
+      <el-alert v-if="businessOptionsError && !transportOnly" type="warning" :closable="false" show-icon :title="businessOptionsError"><el-button link type="warning" :loading="businessOptionsLoading" @click="loadBusinessOptions">重新加载业务选项</el-button></el-alert>
       <el-form v-if="!warehouseError || transportOnly" ref="formRef" :model="form" :rules="rules" label-position="top" class="form-grid">
-        <el-form-item label="柜次号" prop="cabinetNo"><el-input v-model="form.cabinetNo" maxlength="64" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="集装箱号"><el-input v-model="form.containerNo" maxlength="64" placeholder="开始装柜前必须填写" /></el-form-item>
-        <el-form-item label="装柜仓库" prop="warehouseId"><el-select v-model="form.warehouseId" filterable :disabled="transportOnly"><el-option v-for="warehouse in warehouses" :key="String(warehouse.id)" :label="`${warehouse.warehouseName}（${warehouse.warehouseCode}）`" :value="String(warehouse.id)" /></el-select></el-form-item>
-        <el-form-item label="柜型" prop="containerType"><el-select v-model="form.containerType" :disabled="transportOnly"><el-option v-for="value in ['20GP','40GP','40HQ','45HQ']" :key="value" :label="value" :value="value" /></el-select></el-form-item>
-        <el-form-item label="容量上限（m³）"><el-input-number v-model="form.capacityCbm" :min="0.001" :precision="3" controls-position="right" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="重量上限（kg）"><el-input-number v-model="form.maxWeightKg" :min="0.001" :precision="3" controls-position="right" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="提单号"><el-input v-model="form.billOfLadingNo" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="船公司"><el-input v-model="form.shippingCompanyName" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="船名"><el-input v-model="form.vesselName" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="航次"><el-input v-model="form.voyageNo" maxlength="64" /></el-form-item>
-        <el-form-item label="起运港代码"><el-input v-model="form.departurePortCode" maxlength="32" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="起运港名称"><el-input v-model="form.departurePortName" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="目的港代码"><el-input v-model="form.destinationPortCode" maxlength="32" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="目的港名称"><el-input v-model="form.destinationPortName" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="目的仓代码"><el-input v-model="form.destinationWarehouseCode" maxlength="64" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="目的仓名称"><el-input v-model="form.destinationWarehouseName" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="拖车公司"><el-input v-model="form.terminalTruckingCompany" maxlength="128" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="计划装柜时间"><el-date-picker v-model="form.loadingAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="预计开船时间"><el-date-picker v-model="form.estimatedSailingAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" :disabled="transportOnly" /></el-form-item>
-        <el-form-item label="预计到港时间"><el-date-picker v-model="form.estimatedPortArrivalAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="柜次号" prop="cabinetNo"><el-input v-model="form.cabinetNo" maxlength="64" placeholder="请输入柜次号" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="集装箱号"><el-input v-model="form.containerNo" maxlength="64" placeholder="请输入集装箱号，开始装柜前必填" /></el-form-item>
+        <el-form-item label="装柜仓库" prop="warehouseId"><el-select v-model="form.warehouseId" filterable placeholder="请选择装柜仓库" :loading="warehouseLoading" loading-text="仓库加载中" no-data-text="暂无可用国内仓库" :disabled="transportOnly"><el-option v-for="warehouse in warehouses" :key="String(warehouse.id)" :label="`${warehouse.warehouseName}（${warehouse.warehouseCode}）`" :value="String(warehouse.id)" /></el-select></el-form-item>
+        <el-form-item label="柜型" prop="containerType"><el-select v-model="form.containerType" placeholder="请选择柜型" :disabled="transportOnly"><el-option v-for="value in ['20GP','40GP','40HQ','45HQ']" :key="value" :label="value" :value="value" /></el-select></el-form-item>
+        <el-form-item label="容量上限（m³）"><el-input-number v-model="form.capacityCbm" :min="0.001" :precision="3" controls-position="right" placeholder="请输入容量上限" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="重量上限（kg）"><el-input-number v-model="form.maxWeightKg" :min="0.001" :precision="3" controls-position="right" placeholder="请输入重量上限" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="提单号"><el-input v-model="form.billOfLadingNo" maxlength="128" placeholder="请输入提单号（可选）" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="船公司"><el-select :model-value="shippingCompanyValue" filterable clearable placeholder="请选择船公司" :loading="businessOptionsLoading" loading-text="船公司加载中" no-data-text="暂无可用船公司" :disabled="transportOnly" @update:model-value="selectShippingCompany(String($event || ''))"><el-option v-if="shippingCompanyValue && !shippingCompanies.some((partner) => String(partner.id) === shippingCompanyValue)" :label="form.shippingCompanyName || '原船公司'" :value="shippingCompanyValue" /><el-option v-for="partner in shippingCompanies" :key="String(partner.id)" :label="partnerLabel(partner)" :value="String(partner.id)" /></el-select></el-form-item>
+        <el-form-item label="船名"><el-input v-model="form.vesselName" maxlength="128" placeholder="请输入船名" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="航次"><el-input v-model="form.voyageNo" maxlength="64" placeholder="请输入航次" /></el-form-item>
+        <el-form-item label="起运港"><el-select :model-value="departurePortValue" filterable clearable placeholder="请选择起运港" :loading="businessOptionsLoading" loading-text="港口加载中" no-data-text="暂无订舱港口数据" :disabled="transportOnly" @update:model-value="selectPort('departure', String($event || ''))"><el-option v-for="port in departurePorts" :key="port.value" :label="portLabel(port)" :value="port.value" /></el-select></el-form-item>
+        <el-form-item label="目的港"><el-select :model-value="destinationPortValue" filterable clearable placeholder="请选择目的港" :loading="businessOptionsLoading" loading-text="港口加载中" no-data-text="暂无订舱港口数据" :disabled="transportOnly" @update:model-value="selectPort('destination', String($event || ''))"><el-option v-for="port in destinationPorts" :key="port.value" :label="portLabel(port)" :value="port.value" /></el-select></el-form-item>
+        <el-form-item label="目的仓"><el-select :model-value="destinationWarehouseValue" filterable clearable placeholder="请选择目的仓" :loading="warehouseLoading" loading-text="目的仓加载中" no-data-text="暂无可用海外/FBA仓库" :disabled="transportOnly" @update:model-value="selectDestinationWarehouse(String($event || ''))"><el-option v-if="destinationWarehouseValue && !destinationWarehouses.some((warehouse) => warehouse.warehouseCode === destinationWarehouseValue)" :label="form.destinationWarehouseName || form.destinationWarehouseCode || '原目的仓'" :value="destinationWarehouseValue" /><el-option v-for="warehouse in destinationWarehouses" :key="String(warehouse.id)" :label="`${warehouse.warehouseName}（${warehouse.warehouseCode}）`" :value="warehouse.warehouseCode" /></el-select></el-form-item>
+        <el-form-item label="拖车公司"><el-select v-model="form.terminalTruckingCompany" filterable clearable allow-create default-first-option placeholder="请选择或输入拖车公司" :loading="businessOptionsLoading" loading-text="拖车公司加载中" no-data-text="暂无合作单位，可直接输入" :disabled="transportOnly"><el-option v-for="partner in truckingCompanies" :key="String(partner.id)" :label="partnerLabel(partner)" :value="partner.partnerName" /></el-select></el-form-item>
+        <el-form-item label="计划装柜时间"><el-date-picker v-model="form.loadingAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="请选择计划装柜时间" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="预计开船时间"><el-date-picker v-model="form.estimatedSailingAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="请选择预计开船时间" :disabled="transportOnly" /></el-form-item>
+        <el-form-item label="预计到港时间"><el-date-picker v-model="form.estimatedPortArrivalAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="请选择预计到港时间" :disabled="transportOnly" /></el-form-item>
       </el-form>
     </AppDrawer>
     </section>