fix(admin): render container documents as table

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 { completeLoadingDeclaration, uploadLoadingDeclaration } from '@/modules/loading-lists'
+import { completeLoadingDeclaration, downloadLoadingDeclaration, 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'
@@ -34,6 +34,7 @@ const access = useAccessPreviewStore()
 const containerId = computed(() => String(route.params.containerId || ''))
 const canEdit = computed(() => access.can('platform:firstleg:container:edit'))
 const canManageCustoms = computed(() => access.can('platform:firstleg:customs:manage'))
+const canDownloadCustoms = computed(() => access.can('platform:firstleg:loading-list:list'))
 const canViewOutboundDispatch = computed(() => access.can('platform:firstleg:outbound-dispatch:view'))
 const canConfirmOutboundDispatch = computed(() => access.can('platform:firstleg:outbound-dispatch:confirm'))
 const loading = ref(false)
@@ -49,7 +50,8 @@ 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 customsActionError = ref<ApiErrorDetails | null>(null)
+const documentRefreshWarning = ref<ApiErrorDetails | null>(null)
 const clearanceOpen = ref(false)
 const clearanceDocument = ref<BusinessDocument | null>(null)
 const clearanceFile = ref<File | null>(null)
@@ -164,16 +166,33 @@ function selectDocumentFile(file: UploadFile) { documentFile.value = file.raw ||
 function removeDocumentFile() { documentFile.value = null }
 async function saveDocument() {
   if (!documentFile.value || !overview.value || !detail.value) { documentError.value = { code: 'FILE_REQUIRED', message: '请选择需要上传的资料文件' }; return }
-  documentSaving.value = true; documentError.value = null
+  documentSaving.value = true; documentError.value = null; documentRefreshWarning.value = null
   try {
     const expectedVersion = selectedDocument.value?.version || 0
     if (documentType.value === 'CUSTOMS_DECLARATION') {
       if (!overview.value.loadingPlanId) throw new Error('当前货柜没有装柜清单，无法上传国内出口报关附件')
-      await uploadLoadingDeclaration(overview.value.loadingPlanId, detail.value.warehouseId, documentFile.value, expectedVersion, '上传国内出口报关附件')
+      const uploaded = await uploadLoadingDeclaration(overview.value.loadingPlanId, detail.value.warehouseId, documentFile.value, expectedVersion, '上传国内出口报关附件')
+      if (!uploaded) throw new Error('报关附件上传成功但未返回附件信息')
+      const optimistic: ContainerOverviewDocument = {
+        id: uploaded.id || selectedDocument.value?.id || uploaded.fileId,
+        documentType: 'CUSTOMS_DECLARATION', fileId: uploaded.fileId, fileName: uploaded.fileName,
+        fileHash: uploaded.fileHash, uploadedBy: uploaded.uploadedBy, uploadedByName: uploaded.uploadedByName,
+        uploadedAt: uploaded.uploadedAt, version: uploaded.version, completed: Boolean(uploaded.completedAt),
+      }
+      overview.value = { ...overview.value, documents: [...overview.value.documents.filter((item) => item.documentType !== 'CUSTOMS_DECLARATION'), optimistic] }
+      try {
+        const refreshed = await getContainerOverview(containerId.value)
+        if (refreshed.documents.some((item) => item.documentType === 'CUSTOMS_DECLARATION')) overview.value = refreshed
+        else {
+          overview.value = { ...refreshed, documents: [...refreshed.documents, optimistic] }
+          documentRefreshWarning.value = { code: 'CUSTOMS_DOCUMENT_STALE', message: '附件已上传，但资料汇总尚未同步；当前已保留本次上传结果' }
+        }
+      }
+      catch (cause) { documentRefreshWarning.value = getApiErrorDetails(cause, '附件已上传，但最新资料刷新失败；当前已保留本次上传结果') }
     } else {
       await uploadContainerDocument(containerId.value, documentType.value, documentFile.value, expectedVersion, `上传${documentTitle.value}`)
+      overview.value = await getContainerOverview(containerId.value)
     }
-    overview.value = await getContainerOverview(containerId.value)
     documentOpen.value = false; documentFile.value = null; ElMessage.success(`${documentTitle.value}已上传`)
   } catch (cause) { documentError.value = getApiErrorDetails(cause, `${documentTitle.value}上传失败`) }
   finally { documentSaving.value = false }
@@ -185,31 +204,44 @@ async function refreshCustomsFacts() {
 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: '当前货柜没有装柜清单，无法确认报关完成' }
+    customsActionError.value = { code: 'LOADING_PLAN_REQUIRED', message: '当前货柜没有装柜清单，无法确认报关完成' }
     return
   }
-  customsCompleting.value = true; customsCompletionError.value = null
+  customsCompleting.value = true; customsActionError.value = null; documentRefreshWarning.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()
+    try { await refreshCustomsFacts() }
+    catch (cause) { documentRefreshWarning.value = getApiErrorDetails(cause, '报关完成已确认，但最新资料刷新失败，请稍后重新加载') }
     ElMessage.success('已确认装柜清单报关协同完成；正式报关放行仍由报关业务事实核验')
   } catch (cause) {
     const details = getApiErrorDetails(cause, '确认报关完成失败')
     if (details.code === 'A0409') {
       try { await refreshCustomsFacts() } catch { /* 保留原并发错误证据 */ }
     }
-    customsCompletionError.value = details
+    customsActionError.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
+  if (!['DELIVERY_ORDER', 'PICKUP_ORDER', 'CUSTOMS_DECLARATION'].includes(item.documentType)) return
+  if (item.documentType === 'CUSTOMS_DECLARATION' && (!overview.value?.loadingPlanId || !detail.value)) {
+    customsActionError.value = { code: 'LOADING_PLAN_REQUIRED', message: '当前货柜没有装柜清单，无法下载国内出口报关附件' }
+    return
+  }
   documentDownloading.value = true
-  try { await saveBlob(await downloadContainerDocument(containerId.value, item.documentType as 'DELIVERY_ORDER' | 'PICKUP_ORDER', item.fileId), item.fileName); ElMessage.success('资料下载已开始') }
-  catch (cause) { ElMessage.error(getApiErrorDetails(cause, '资料下载失败').message) }
+  try {
+    const blob = item.documentType === 'CUSTOMS_DECLARATION'
+      ? await downloadLoadingDeclaration(overview.value!.loadingPlanId!, detail.value!.warehouseId, item.fileId)
+      : await downloadContainerDocument(containerId.value, item.documentType as 'DELIVERY_ORDER' | 'PICKUP_ORDER', item.fileId)
+    await saveBlob(blob, item.fileName); ElMessage.success('资料下载已开始')
+  } catch (cause) {
+    const details = getApiErrorDetails(cause, '资料下载失败')
+    if (item.documentType === 'CUSTOMS_DECLARATION') customsActionError.value = details
+    ElMessage.error(details.message)
+  }
   finally { documentDownloading.value = false }
 }
 function openException() { exceptionReason.value = ''; exceptionError.value = null; exceptionOpen.value = true }
@@ -261,8 +293,9 @@ 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" :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>
+      <ContainerOverviewPanel v-else-if="overview" :overview="overview" :can-manage-documents="canEdit" :can-manage-customs="canManageCustoms" :can-download-customs="canDownloadCustoms" :can-manage-exception="canEdit" :document-busy="documentDownloading" :customs-completing="customsCompleting" @upload-document="openDocument" @download-document="downloadDocument" @complete-customs="completeCustomsDeclaration" @manage-exception="openException" />
+      <el-alert v-if="documentRefreshWarning" type="warning" :closable="false" :title="documentRefreshWarning.message"><template #default><ApiErrorMeta :details="documentRefreshWarning" /></template></el-alert>
+      <LoadErrorState v-if="customsActionError" compact title="国内出口报关附件操作失败" :message="customsActionError.message" :show-retry="false"><template #details><ApiErrorMeta :details="customsActionError" /></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>