feat: connect plan-level preload confirmation

src/modules/loading-lists/components/LoadingListDetailDrawer.vue

@@ -17,11 +17,12 @@ const props = defineProps<{
   detail: LoadingDetail | null
   error: ApiErrorDetails | null
   canEdit: boolean
+  confirmSaving?: boolean
   canManageCustoms?: boolean
   customsSaving?: boolean
 }>()
 
-const emit = defineEmits<{ retry: []; edit: []; attachCustoms: []; completeCustoms: [] }>()
+const emit = defineEmits<{ retry: []; edit: []; confirmPreload: []; attachCustoms: []; completeCustoms: [] }>()
 
 const itemColumns: DataTableColumn[] = [
   { key: 'sequence', prop: 'loadSequence', label: '装柜顺序', fixed: 'left', width: 92, hideable: false, movable: false },
@@ -45,6 +46,28 @@ const itemColumns: DataTableColumn[] = [
 
 const summary = computed<LoadingListSummary | null>(() => props.detail?.summary || null)
 const preloadSummary = computed(() => props.mode === 'preload' ? summary.value as PreloadSummary | null : null)
+const blockingReasonLabels: Record<string, string> = {
+  PRELOAD_NOT_PUSHED: '尚未推送预装清单',
+  LOADING_PLAN_NOT_EDITING: '装柜计划已不在可确认的编辑状态',
+  CONTAINER_NO_MISSING: '尚未录入集装箱号',
+  PRELOAD_LINK_MISSING: '装柜明细尚未完整关联入库预装票据',
+  OCEAN_BOOKING_NOT_LINKED: '尚未关联真实订舱',
+  OCEAN_BOOKING_NOT_RELEASED: '关联订舱尚未放舱',
+  PDA_TASK_ALREADY_CREATED: 'PDA 任务已创建，无需重复确认',
+  PRELOAD_ALREADY_CONFIRMED: '整份预装计划已经确认',
+}
+const confirmationStatusLabels: Record<string, string> = {
+  PENDING: '待确认', PARTIALLY_CONFIRMED: '部分票据已确认', CONFIRMED: '已确认',
+}
+const oceanBookingStatusLabels: Record<string, string> = {
+  CONFIRMED: '已确认', CHANGE_PENDING: '改船处理中', RELEASED: '已放舱', CANCELLED: '已取消',
+}
+const pdaTaskStatusLabels: Record<string, string> = {
+  PENDING: '待领取', CLAIMED: '已领取', LOADING: '作业中', AWAITING_REVIEW: '待人工复核', COMPLETED: '已完成',
+}
+const blockingReasonText = computed(() => (preloadSummary.value?.readiness.blockingReasons || [])
+  .map((reason) => blockingReasonLabels[reason] || '存在未满足的确认条件')
+  .join('；'))
 const feeCustomers = computed(() => {
   const customers = new Map<string, string | null>()
   for (const item of props.detail?.items || []) if (item.accountId) customers.set(item.accountId, item.customerName)
@@ -62,6 +85,7 @@ function actionLabel(action: string) {
   return ({
     CREATE: '创建计划', ASSIGN: '分配货物', ADJUST: '调整货物', DELETE: '移除货物',
     RECOMMEND: '智能排柜', PUSH_PRELOAD: '推送预装', UPDATE_TRANSPORT: '修改运输信息',
+    CONFIRM_PRELOAD: '确认预装',
     START_LOADING: '开始拣货', COMPLETE: '完成装柜',
   } as Record<string, string>)[action] || '状态更新'
 }
@@ -86,13 +110,16 @@ function formatNumber(value?: number | null, digits = 3) {
       <DetailPageLayout :ariaLabel="title">
       <template #summary>
       <section class="detail-summary" aria-label="清单基本信息">
+        <div><span>柜次号</span><strong>{{ summary.cabinetNo || '—' }}</strong></div>
+        <div><span>集装箱号</span><strong>{{ summary.containerNo || '待录入' }}</strong></div>
         <div><span>仓库</span><strong>{{ summary.warehouseName || '—' }}</strong></div>
-        <div><span>集装箱号</span><strong>{{ summary.containerNo || '—' }}</strong></div>
-        <div><span>柜号</span><strong>{{ summary.internalContainerNo || '—' }}</strong></div>
         <div><span>状态</span><StatusBadge :status="loadingListStatusLabel(summary.status)" /></div>
         <template v-if="preloadSummary">
           <div><span>船名 / 航次</span><strong>{{ preloadSummary.vesselName || '—' }} / {{ preloadSummary.voyageNo || '—' }}</strong></div>
           <div><span>箱型</span><strong>{{ preloadSummary.containerType || '—' }}</strong></div>
+          <div><span>预装确认</span><StatusBadge :status="confirmationStatusLabels[preloadSummary.readiness.confirmationStatus] || '未知状态'" /></div>
+          <div><span>订舱状态</span><strong>{{ preloadSummary.readiness.oceanBookingStatus ? (oceanBookingStatusLabels[preloadSummary.readiness.oceanBookingStatus] || '未知状态') : '未关联' }}</strong></div>
+          <div><span>PDA 状态</span><strong>{{ preloadSummary.readiness.pdaTaskStatus ? (pdaTaskStatusLabels[preloadSummary.readiness.pdaTaskStatus] || '未知状态') : (preloadSummary.readiness.readyForPda ? '可下发' : '未就绪') }}</strong></div>
           <div class="detail-summary__wide"><span>客户</span><strong>{{ preloadSummary.customers.map((item) => item.customerName || '客户信息缺失').join('、') || '客户信息缺失' }}</strong></div>
         </template>
         <div><span>创建时间</span><strong>{{ formatDateTime(summary.createdAt) }}</strong></div>
@@ -100,8 +127,11 @@ function formatNumber(value?: number | null, digits = 3) {
       </template>
 
       <div v-if="mode === 'preload' && canEdit && ['EDITING', 'LOADING'].includes(summary.status)" class="detail-actions">
-        <el-button type="primary" @click="emit('edit')"><Pencil :size="16" />编辑运输信息</el-button>
+        <el-button type="primary" @click="emit('edit')"><Pencil :size="16" />{{ preloadSummary?.containerNo ? '修改集装箱号 / 航次' : '录入集装箱号' }}</el-button>
+        <el-button type="success" :loading="confirmSaving" :disabled="!preloadSummary?.readiness.canConfirm" @click="emit('confirmPreload')"><Check :size="16" />确认预装</el-button>
       </div>
+      <el-alert v-if="preloadSummary?.readiness.confirmationStatus === 'CONFIRMED'" type="success" :closable="false" show-icon title="整份预装计划已确认" :description="preloadSummary.readiness.pdaTaskStatus ? `PDA 任务状态：${pdaTaskStatusLabels[preloadSummary.readiness.pdaTaskStatus] || '未知状态'}` : 'PDA 前置条件已满足，等待服务端生成任务。'" />
+      <el-alert v-else-if="preloadSummary && !preloadSummary.readiness.canConfirm" type="warning" :closable="false" show-icon title="当前暂不能确认预装" :description="blockingReasonText || '请刷新详情获取最新确认条件。'" />
       <div v-else-if="mode === 'confirmed'" class="detail-actions"><el-button v-if="canManageCustoms && !detail.customsDocument?.completedAt" @click="emit('attachCustoms')"><FileUp :size="16" />{{ detail.customsDocument ? '更换报关资料' : '上传报关资料' }}</el-button><el-button v-if="canManageCustoms && detail.customsDocument && !detail.customsDocument.completedAt" type="primary" :loading="customsSaving" @click="emit('completeCustoms')"><Check :size="16" />完成报关</el-button><StatusBadge v-if="detail.customsDocument?.completedAt" status="报关完成" /></div>
 
       <section class="detail-section surface-panel">