src/modules/container-loading/components/ContainerOverviewPanel.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, onBeforeUnmount, reactive, watch } from 'vue'
-import { Download, FileUp, TriangleAlert } from '@lucide/vue'
+import { Check, Download, FileUp, TriangleAlert } from '@lucide/vue'
 import { getApiErrorDetails } from '@/shared/api/http'
 import StatusBadge from '@/shared/components/StatusBadge.vue'
 import type { ContainerOverview, ContainerOverviewDocument, ContainerPdaPhoto } from '../types'
@@ -12,11 +12,13 @@ const props = defineProps<{
   canManageCustoms: boolean
   canManageException: boolean
   documentBusy?: boolean
+  customsCompleting?: boolean
 }>()
 
 const emit = defineEmits<{
   uploadDocument: [documentType: string]
   downloadDocument: [document: ContainerOverviewDocument]
+  completeCustoms: [document: ContainerOverviewDocument]
   manageException: []
 }>()
 
@@ -33,6 +35,12 @@ const customsTypes = new Set(['DESTINATION_CLEARANCE', 'CUSTOMS_DECLARATION'])
 function canUploadDocument(documentType: string) {
   return downloadableTypes.has(documentType) ? props.canManageDocuments : customsTypes.has(documentType) && props.canManageCustoms
 }
+function documentStatusText(documentType: string) {
+  const document = documentsByType.value.get(documentType)
+  if (documentType !== 'CUSTOMS_DECLARATION') return document ? formatTime(document.uploadedAt) : '等待上传'
+  if (!document) return '第一步上传附件，第二步确认报关完成'
+  return document.completed ? '已确认报关完成' : '附件已上传，待确认报关完成'
+}
 const pdaProgress = computed(() => {
   const pda = props.overview.pda
   if (!pda || pda.itemCount <= 0) return 0
@@ -107,8 +115,8 @@ onBeforeUnmount(() => { photoGeneration += 1; revokePhotoUrls() })
       <header><h3>业务资料</h3><span>{{ overview.documents.length }} 份</span></header>
       <div class="document-grid compact-document-list">
         <article v-for="item in documentTypes" :key="item.type" class="document-item">
-          <div><strong>{{ item.label }}</strong><span>{{ documentsByType.get(item.type)?.fileName || '未上传' }}</span><small>{{ documentsByType.get(item.type) ? formatTime(documentsByType.get(item.type)?.uploadedAt) : '等待上传' }}</small></div>
-          <div class="document-actions"><el-button v-if="documentsByType.get(item.type) && downloadableTypes.has(item.type)" size="small" :loading="documentBusy" @click="emit('downloadDocument', documentsByType.get(item.type)!)"><Download :size="15" />下载</el-button><el-button v-if="canUploadDocument(item.type)" size="small" @click="emit('uploadDocument', item.type)"><FileUp :size="15" />{{ documentsByType.get(item.type) ? '更新' : '上传' }}</el-button></div>
+          <div><strong>{{ item.label }}</strong><span>{{ documentsByType.get(item.type)?.fileName || '未上传' }}</span><small>{{ documentStatusText(item.type) }}</small></div>
+          <div class="document-actions"><el-button v-if="documentsByType.get(item.type) && downloadableTypes.has(item.type)" size="small" :loading="documentBusy" @click="emit('downloadDocument', documentsByType.get(item.type)!)"><Download :size="15" />下载</el-button><el-button v-if="canUploadDocument(item.type)" size="small" @click="emit('uploadDocument', item.type)"><FileUp :size="15" />{{ documentsByType.get(item.type) ? '更新附件' : '上传附件' }}</el-button><el-button v-if="item.type === 'CUSTOMS_DECLARATION' && canManageCustoms && documentsByType.get(item.type) && !documentsByType.get(item.type)?.completed" size="small" type="primary" :loading="customsCompleting" @click="emit('completeCustoms', documentsByType.get(item.type)!)"><Check :size="15" />确认报关完成</el-button></div>
         </article>
       </div>
     </section>

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

@@ -3,15 +3,16 @@ import { flushPromises, mount, type VueWrapper } from '@vue/test-utils'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import ContainerDetailView from './ContainerDetailView.vue'
 import { getContainer, getContainerClearance, getContainerOverview, uploadContainerClearance, uploadContainerDocument } from '../api/platformContainerLoading'
-import { uploadLoadingDeclaration } from '@/modules/loading-lists'
+import { completeLoadingDeclaration, uploadLoadingDeclaration } from '@/modules/loading-lists'
 import { confirmContainerOutboundDispatch, getContainerOutboundDispatch } from '@/modules/outbound-dispatch/api/platformOutboundDispatch'
 import type { ContainerOutboundDispatchDetail } from '@/modules/outbound-dispatch/types'
+import { ApiResponseError } from '@/shared/api/http'
 
 const { accessCan, routerPush, carrierMounts } = vi.hoisted(() => ({ accessCan: vi.fn(), routerPush: vi.fn(), carrierMounts: { value: 0 } }))
 vi.mock('vue-router', () => ({ useRoute: () => ({ params: { containerId: '2092438843630391297' }, query: {} }), useRouter: () => ({ push: routerPush }) }))
 vi.mock('@/core/access/accessPreview', () => ({ useAccessPreviewStore: () => ({ can: accessCan }) }))
 vi.mock('@/modules/port-schedules', () => ({ CarrierScheduleQueryPanel: { template: '<div data-test="carrier-panel" />', mounted: () => { carrierMounts.value += 1 } } }))
-vi.mock('@/modules/loading-lists', () => ({ uploadLoadingDeclaration: vi.fn() }))
+vi.mock('@/modules/loading-lists', () => ({ uploadLoadingDeclaration: vi.fn(), completeLoadingDeclaration: vi.fn() }))
 vi.mock('@/modules/outbound-dispatch/api/platformOutboundDispatch', () => ({ getContainerOutboundDispatch: vi.fn(), confirmContainerOutboundDispatch: vi.fn() }))
 vi.mock('../api/platformContainerLoading', () => ({
   getContainer: vi.fn(), getContainerOverview: vi.fn(), getContainerClearance: vi.fn(),
@@ -43,6 +44,7 @@ function mountView(customs = true, outbound = true) {
   return mount(ContainerDetailView, { global: { plugins: [ElementPlus] } })
 }
 function documentArticle(wrapper: VueWrapper, label: string) { return wrapper.findAll('.document-item').find((item) => item.text().includes(label))! }
+function documentButton(wrapper: VueWrapper, label: string, buttonText: string) { return documentArticle(wrapper, label).findAll('button').find((button) => button.text().includes(buttonText))! }
 
 describe('ContainerDetailView', () => {
   beforeEach(() => {
@@ -52,6 +54,7 @@ describe('ContainerDetailView', () => {
     vi.mocked(getContainerOverview).mockResolvedValue(overview as never)
     vi.mocked(getContainerClearance).mockResolvedValue(null)
     vi.mocked(uploadLoadingDeclaration).mockResolvedValue({} as never)
+    vi.mocked(completeLoadingDeclaration).mockResolvedValue({} as never)
     vi.mocked(uploadContainerDocument).mockResolvedValue({} as never)
     vi.mocked(uploadContainerClearance).mockResolvedValue({} as never)
     vi.mocked(getContainerOutboundDispatch).mockResolvedValue(outboundDetail)
@@ -95,6 +98,71 @@ describe('ContainerDetailView', () => {
     wrapper.unmount()
   })
 
+  it('keeps customs attachment upload and completion as two explicit steps with exact payload', async () => {
+    const completedOverview = { ...overview, documents: overview.documents.map((item) => ({ ...item, completed: true })) }
+    vi.mocked(getContainerOverview).mockResolvedValueOnce(overview as never).mockResolvedValue(completedOverview as never)
+    vi.spyOn(ElMessageBox, 'confirm').mockResolvedValueOnce({ action: 'confirm' } as never)
+    const wrapper = mountView(); await flushPromises()
+    const customs = documentArticle(wrapper, '国内出口报关附件')
+    expect(customs.text()).toContain('附件已上传，待确认报关完成')
+    expect(customs.text()).toContain('更新附件')
+    await documentButton(wrapper, '国内出口报关附件', '确认报关完成').trigger('click'); await flushPromises()
+    expect(completeLoadingDeclaration).toHaveBeenCalledOnce()
+    expect(completeLoadingDeclaration).toHaveBeenCalledWith('2092438843630391401', '193000000000200002', 5, '货柜详情确认国内出口报关完成')
+    expect(uploadLoadingDeclaration).not.toHaveBeenCalled()
+    expect(getContainerOverview).toHaveBeenCalledTimes(2)
+    expect(getContainerOutboundDispatch).toHaveBeenCalledTimes(2)
+    expect(documentArticle(wrapper, '国内出口报关附件').text()).toContain('已确认报关完成')
+    expect(documentButton(wrapper, '国内出口报关附件', '确认报关完成')).toBeUndefined()
+    wrapper.unmount()
+  })
+
+  it('shows customs completion only for an existing unfinished attachment with manage permission', async () => {
+    vi.mocked(getContainerOverview).mockResolvedValueOnce({ ...overview, documents: [] } as never)
+    let wrapper = mountView(); await flushPromises()
+    expect(documentArticle(wrapper, '国内出口报关附件').text()).toContain('第一步上传附件，第二步确认报关完成')
+    expect(documentButton(wrapper, '国内出口报关附件', '确认报关完成')).toBeUndefined()
+    wrapper.unmount()
+
+    vi.mocked(getContainerOverview).mockResolvedValueOnce({ ...overview, documents: overview.documents.map((item) => ({ ...item, completed: true })) } as never)
+    wrapper = mountView(); await flushPromises()
+    expect(documentButton(wrapper, '国内出口报关附件', '确认报关完成')).toBeUndefined()
+    wrapper.unmount()
+
+    wrapper = mountView(false); await flushPromises()
+    expect(documentButton(wrapper, '国内出口报关附件', '确认报关完成')).toBeUndefined()
+    wrapper.unmount()
+  })
+
+  it('shows a readable completion error without a loading plan and does not call the API', async () => {
+    vi.mocked(getContainerOverview).mockResolvedValueOnce({ ...overview, loadingPlanId: null } as never)
+    const wrapper = mountView(); await flushPromises()
+    await documentButton(wrapper, '国内出口报关附件', '确认报关完成').trigger('click'); await flushPromises()
+    expect(wrapper.text()).toContain('当前货柜没有装柜清单，无法确认报关完成')
+    expect(completeLoadingDeclaration).not.toHaveBeenCalled()
+    expect(ElMessageBox.confirm).not.toHaveBeenCalled()
+    wrapper.unmount()
+  })
+
+  it('prevents repeated customs completion and preserves A0409 evidence after refreshing facts', async () => {
+    let releasePrompt!: () => void
+    vi.spyOn(ElMessageBox, 'confirm').mockReturnValueOnce(new Promise<void>((resolve) => { releasePrompt = resolve }) as never)
+    const wrapper = mountView(); await flushPromises()
+    const button = documentButton(wrapper, '国内出口报关附件', '确认报关完成')
+    await button.trigger('click'); await button.trigger('click')
+    expect(ElMessageBox.confirm).toHaveBeenCalledOnce()
+    releasePrompt(); await flushPromises()
+    vi.mocked(completeLoadingDeclaration).mockRejectedValueOnce(new ApiResponseError('数据已变更', 'A0409', undefined, undefined, 'request-customs-409', 'trace-customs-409'))
+    vi.mocked(ElMessageBox.confirm).mockResolvedValueOnce({ action: 'confirm' } as never)
+    await documentButton(wrapper, '国内出口报关附件', '确认报关完成').trigger('click'); await flushPromises()
+    expect(completeLoadingDeclaration).toHaveBeenCalledTimes(2)
+    expect(wrapper.text()).toContain('A0409')
+    expect(wrapper.text()).toContain('request-customs-409')
+    expect(getContainerOverview).toHaveBeenCalledTimes(3)
+    expect(getContainerOutboundDispatch).toHaveBeenCalledTimes(3)
+    wrapper.unmount()
+  })
+
   it('loads and displays the whole-container gate without querying an inbound id', async () => {
     const wrapper = mountView(); await flushPromises()
     expect(getContainerOutboundDispatch).toHaveBeenCalledOnce()
@@ -148,20 +216,20 @@ describe('ContainerDetailView', () => {
       ...outboundDetail,
       aggregate: {
         ...outboundDetail.aggregate,
-        gate: { passed: false, checkedAt: '2026-08-26T12:00:00', inbounds: [{ inboundId: '2092438843630391501', inboundCode: 'IN-1', gate: { passed: false, checkedAt: '2026-08-26T12:00:00', items: [{ code: 'SAILING_SCHEDULE', name: '船期有效且未过期', passed: false, actual: 'EXPIRED', requirement: 'VALID' }] } }] },
+        gate: { passed: false, checkedAt: '2026-08-26T12:00:00', inbounds: [{ inboundId: '2092438843630391501', inboundCode: 'IN-1', gate: { passed: false, checkedAt: '2026-08-26T12:00:00', items: [{ code: 'CUSTOMS_CLEARANCE', name: '报关协同完成', passed: false, actual: 'MISSING', requirement: 'COMPLETED' }] } }] },
       },
     } as never)
     const wrapper = mountView(); await flushPromises()
-    expect(wrapper.text()).toContain('船期有效且未过期')
-    expect(wrapper.text()).toContain('EXPIRED')
-    expect(wrapper.text()).toContain('VALID')
+    expect(wrapper.text()).toContain('报关协同完成')
+    expect(wrapper.text()).toContain('MISSING')
+    expect(wrapper.text()).toContain('COMPLETED')
     expect(wrapper.find('.outbound-panel__actions button').exists()).toBe(false)
     wrapper.unmount()
   })
 
   it('deduplicates identical gates across inbounds and shows compact coverage counts', async () => {
     const blocked = { code: 'CUSTOMS_CLEARANCE', name: '报关协同完成', passed: false, actual: 'MISSING', requirement: 'COMPLETED' }
-    const passed = { code: 'SAILING_SCHEDULE', name: '船期有效且未过期', passed: true, actual: 'VALID', requirement: 'VALID' }
+    const passed = { code: 'LOADING_PLAN_COMPLETED', name: '柜次装柜计划完成', passed: true, actual: 'COMPLETED', requirement: 'COMPLETED' }
     vi.mocked(getContainerOutboundDispatch).mockResolvedValueOnce({
       ...outboundDetail,
       aggregate: {
@@ -218,7 +286,7 @@ describe('ContainerDetailView', () => {
     wrapper.unmount()
   })
 
-  it('keeps truck status as reference only and never counts the legacy truck gate as blocking', async () => {
+  it('keeps truck and sailing schedule as reference only and never counts legacy reference gates as blocking', async () => {
     vi.mocked(getContainerOutboundDispatch).mockResolvedValueOnce({
       ...outboundDetail,
       aggregate: {
@@ -229,6 +297,7 @@ describe('ContainerDetailView', () => {
           checkedAt: '2026-08-26T12:00:00',
           inbounds: [{ inboundId: '301', inboundCode: 'IN-301', gate: { passed: false, checkedAt: '2026-08-26T12:00:00', items: [
             { code: 'TRUCK_DEPARTED', name: '关联拖车已离仓', passed: false, actual: 'ARRIVED', requirement: 'DEPARTED或COMPLETED' },
+            { code: 'SAILING_SCHEDULE', name: '船期有效且未过期', passed: false, actual: 'EXPIRED', requirement: 'VALID' },
             { code: 'CUSTOMS_CLEARANCE', name: '报关协同完成', passed: true, actual: 'COMPLETED', requirement: 'COMPLETED' },
           ] } }],
         },
@@ -239,6 +308,7 @@ describe('ContainerDetailView', () => {
     expect(wrapper.find('.gate-summary').text()).toContain('阻断 0')
     expect(wrapper.find('.gate-summary').text()).toContain('拖车状态（参考）：已到仓')
     expect(wrapper.text()).not.toContain('关联拖车已离仓')
+    expect(wrapper.text()).not.toContain('船期有效且未过期')
     expect(wrapper.find('.outbound-panel__actions button').text()).toContain('确认离仓')
     wrapper.unmount()
   })

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

@@ -11,7 +11,7 @@ import AppDialog from '@/shared/components/AppDialog.vue'
 import LoadErrorState from '@/shared/components/LoadErrorState.vue'
 import StatusBadge from '@/shared/components/StatusBadge.vue'
 import { CarrierScheduleQueryPanel } from '@/modules/port-schedules'
-import { uploadLoadingDeclaration } from '@/modules/loading-lists'
+import { completeLoadingDeclaration, uploadLoadingDeclaration } from '@/modules/loading-lists'
 import { confirmContainerOutboundDispatch, getContainerOutboundDispatch } from '@/modules/outbound-dispatch/api/platformOutboundDispatch'
 import type { ContainerOutboundDispatchDetail, ContainerOutboundGateItem } from '@/modules/outbound-dispatch/types'
 import ContainerOverviewPanel from '../components/ContainerOverviewPanel.vue'
@@ -48,6 +48,8 @@ const documentFile = ref<File | null>(null)
 const documentSaving = ref(false)
 const documentDownloading = ref(false)
 const documentError = ref<ApiErrorDetails | null>(null)
+const customsCompleting = ref(false)
+const customsCompletionError = ref<ApiErrorDetails | null>(null)
 const clearanceOpen = ref(false)
 const clearanceDocument = ref<BusinessDocument | null>(null)
 const clearanceFile = ref<File | null>(null)
@@ -70,11 +72,12 @@ const documentTitle = computed(() => ({ DELIVERY_ORDER: 'DO 资料', PICKUP_ORDE
 const title = computed(() => detail.value?.containerNo || detail.value?.cabinetNo || '货柜详情')
 const exceptionTitle = computed(() => overview.value?.exception.active ? '取消货柜异常' : '标记货柜异常')
 type AggregatedGateRow = ContainerOutboundGateItem & { key: string; inboundCodes: string[] }
+const referenceOnlyGateCodes = new Set(['TRUCK_DEPARTED', 'SAILING_SCHEDULE'])
 const outboundGateRows = computed<AggregatedGateRow[]>(() => {
   const grouped = new Map<string, AggregatedGateRow>()
   for (const inbound of outboundDetail.value?.aggregate.gate.inbounds || []) {
     for (const item of inbound.gate.items || []) {
-      if (item.code === 'TRUCK_DEPARTED') continue
+      if (referenceOnlyGateCodes.has(item.code)) continue
       const key = JSON.stringify([item.code, item.passed, item.actual ?? null, item.requirement ?? null, item.name])
       const existing = grouped.get(key)
       if (existing) {
@@ -175,6 +178,32 @@ async function saveDocument() {
   } catch (cause) { documentError.value = getApiErrorDetails(cause, `${documentTitle.value}上传失败`) }
   finally { documentSaving.value = false }
 }
+async function refreshCustomsFacts() {
+  overview.value = await getContainerOverview(containerId.value)
+  await loadOutboundDispatch()
+}
+async function completeCustomsDeclaration(document: ContainerOverviewDocument) {
+  if (!canManageCustoms.value || customsCompleting.value || document.completed) return
+  if (!overview.value?.loadingPlanId || !detail.value) {
+    customsCompletionError.value = { code: 'LOADING_PLAN_REQUIRED', message: '当前货柜没有装柜清单，无法确认报关完成' }
+    return
+  }
+  customsCompleting.value = true; customsCompletionError.value = null
+  try {
+    await ElMessageBox.confirm('请确认装柜清单的国内出口报关协同已经完成。附件上传与确认报关完成是两个步骤；上传附件本身不代表正式报关放行。', '确认报关完成', { type: 'warning', confirmButtonText: '确认完成' })
+  } catch { customsCompleting.value = false; return }
+  try {
+    await completeLoadingDeclaration(overview.value.loadingPlanId, detail.value.warehouseId, document.version, '货柜详情确认国内出口报关完成')
+    await refreshCustomsFacts()
+    ElMessage.success('已确认装柜清单报关协同完成；正式报关放行仍由报关业务事实核验')
+  } catch (cause) {
+    const details = getApiErrorDetails(cause, '确认报关完成失败')
+    if (details.code === 'A0409') {
+      try { await refreshCustomsFacts() } catch { /* 保留原并发错误证据 */ }
+    }
+    customsCompletionError.value = details
+  } finally { customsCompleting.value = false }
+}
 async function saveBlob(blob: Blob, fileName: string) { const url = URL.createObjectURL(blob); const anchor = document.createElement('a'); anchor.href = url; anchor.download = fileName || '货柜资料'; anchor.click(); URL.revokeObjectURL(url) }
 async function downloadDocument(item: ContainerOverviewDocument) {
   if (!['DELIVERY_ORDER', 'PICKUP_ORDER'].includes(item.documentType)) return
@@ -232,7 +261,8 @@ onMounted(async () => { await load(); if (route.query.action === 'documents') op
     <template v-else-if="detail">
       <section class="detail-fields surface-panel"><h2>运输与单证快照</h2><dl><div><dt>真实订舱</dt><dd>{{ detail.oceanBookingId ? (detail.billOfLadingNo || '已关联') : '未关联' }}</dd></div><div><dt>异常状态</dt><dd>{{ detail.exceptionActive ? '异常' : '正常' }}</dd></div><div><dt>目的仓</dt><dd>{{ detail.destinationWarehouseName || detail.destinationWarehouseCode || '—' }}</dd></div><div><dt>船公司</dt><dd>{{ detail.shippingCompanyName || '—' }}</dd></div><div><dt>船名 / 航次</dt><dd>{{ [detail.vesselName, detail.voyageNo].filter(Boolean).join(' / ') || '—' }}</dd></div><div><dt>拖车公司</dt><dd>{{ detail.terminalTruckingCompany || '—' }}</dd></div><div><dt>预计开船</dt><dd>{{ formatTime(detail.estimatedSailingAt) }}</dd></div><div><dt>预计到港</dt><dd>{{ formatTime(detail.estimatedPortArrivalAt) }}</dd></div><div><dt>卸柜完成</dt><dd>{{ formatTime(detail.unloadingCompletedAt) }}</dd></div><div><dt>卸柜照片上传</dt><dd>{{ formatTime(detail.unloadingPhotoUploadedAt) }}</dd></div><div><dt>预计报空</dt><dd>{{ formatTime(detail.estimatedEmptyReportedAt) }}</dd></div><div><dt>实际报空</dt><dd>{{ formatTime(detail.actualEmptyReportedAt) }}</dd></div></dl></section>
       <LoadErrorState v-if="overviewError" compact title="履约摘要加载失败" :message="overviewError.message" :show-retry="false" />
-      <ContainerOverviewPanel v-else-if="overview" :overview="overview" :can-manage-documents="canEdit" :can-manage-customs="canManageCustoms" :can-manage-exception="canEdit" :document-busy="documentDownloading" @upload-document="openDocument" @download-document="downloadDocument" @manage-exception="openException" />
+      <ContainerOverviewPanel v-else-if="overview" :overview="overview" :can-manage-documents="canEdit" :can-manage-customs="canManageCustoms" :can-manage-exception="canEdit" :document-busy="documentDownloading" :customs-completing="customsCompleting" @upload-document="openDocument" @download-document="downloadDocument" @complete-customs="completeCustomsDeclaration" @manage-exception="openException" />
+      <LoadErrorState v-if="customsCompletionError" compact title="确认报关完成失败" :message="customsCompletionError.message" :show-retry="false"><template #details><ApiErrorMeta :details="customsCompletionError" /></template></LoadErrorState>
       <section v-if="detail.planStatus === 'COMPLETED' && canViewOutboundDispatch" class="outbound-panel surface-panel" aria-label="国内出仓门禁">
         <header class="outbound-panel__header"><div><h2>国内出仓门禁</h2><p>按整柜核验全部入库绑定，仅确认一次离仓。</p></div><div v-if="outboundDetail" class="outbound-panel__actions"><el-tag :type="outboundGateSummary.blocked === 0 ? 'success' : 'danger'">{{ outboundGateSummary.blocked === 0 ? '门禁通过' : '门禁阻断' }}</el-tag><StatusBadge :status="outboundStatusText(outboundDetail.aggregate.dispatchStatus)" /><el-button v-if="canConfirmDeparture" type="primary" :loading="outboundConfirming" @click="confirmDeparture">确认离仓</el-button></div></header>
         <LoadErrorState v-if="outboundError" compact title="国内出仓操作失败" :message="outboundError.message" :loading="outboundLoading" @retry="loadOutboundDispatch"><template #details><ApiErrorMeta :details="outboundError" /></template></LoadErrorState>