优化

src/modules/overseas-warehouse/pages/LastMileOrderDetailView.vue

@@ -13,7 +13,7 @@ import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.v
 import LoadErrorState from '@/shared/components/LoadErrorState.vue'
 import OperationErrorToast from '@/shared/components/OperationErrorToast.vue'
 import { createLastMileOrderFee, getLastMileOrder, type LastMileOrderDetailDto } from '../api/lastMileOrders'
-import { formatOverseasDateTime, lastMileOrderReference, lastMileOrderTypeLabel, lastMileStatusLabel } from '../lastMilePresentation'
+import { formatOverseasDateTime, lastMileOrderReference, lastMileOrderTypeLabel, lastMileStatusLabel, packageDifferenceText } from '../lastMilePresentation'
 import { overseasWarehousePermissions as permission } from '../permissions'
 import OverseasDetailShell from '../components/OverseasDetailShell.vue'
 import OrderReferenceText from '../components/OrderReferenceText.vue'
@@ -56,7 +56,7 @@ function isSingleLineBusinessField(field: DetailField) { return field.label ===
 const referenceValue = computed(() => lastMileOrderReference(detail.value?.order.orderNo, '订单编码待补充'))
 const orderFields = computed<DetailField[]>(() => {
   const order = detail.value?.order
-  return [
+  const fields: DetailField[] = [
     { label: '订单类型', value: text(order?.orderTypeName || lastMileOrderTypeLabel(order?.orderType)) },
     { label: '入仓码', value: text(order?.inboundCode) },
     { label: '货主', value: text(order?.customerName) },
@@ -69,7 +69,14 @@ const orderFields = computed<DetailField[]>(() => {
     { label: '仓库异常作业备注', wide: true, value: text(order?.warehouseRemark) },
     { label: '备注（客户）', wide: true, value: text(order?.customerRemark) },
   ]
+  if (order?.orderType === 'WAREHOUSE_TRANSFER') fields.splice(6, 0,
+    { label: '客户预报箱数', value: order.packageCount == null ? '—' : order.packageCount },
+    { label: '实收箱数', value: order.receivedPackageCount == null ? '—' : order.receivedPackageCount },
+    { label: '箱数差异', value: packageDifferenceText(order.packageDifference) },
+  )
+  return fields
 })
+function isNonzeroDifference(field: DetailField) { return field.label === '箱数差异' && field.value !== '—' && field.value !== '0' }
 const containerFields = computed<DetailField[]>(() => {
   const order = detail.value?.order
   return [
@@ -87,10 +94,12 @@ const containerFields = computed<DetailField[]>(() => {
 const basicFields = computed(() => [...orderFields.value, ...containerFields.value])
 const overviewFields = computed(() => {
   const order = detail.value?.order
+  const warehouseTransfer = order?.orderType === 'WAREHOUSE_TRANSFER'
+  const hasReceivedPackages = warehouseTransfer && order?.receivedPackageCount != null
   return [
     { label: '客户', value: text(order?.customerName) },
     { label: '海外仓', value: text(order?.overseasWarehouseName) },
-    { label: '总箱数', value: order?.packageCount == null ? '—' : order.packageCount + ' 箱' },
+    { label: warehouseTransfer ? (hasReceivedPackages ? '实收总箱数' : '客户预报总箱数') : '总箱数', value: (hasReceivedPackages ? order?.receivedPackageCount : order?.packageCount) == null ? '—' : `${hasReceivedPackages ? order?.receivedPackageCount : order?.packageCount} 箱` },
     { label: '总托数', value: order?.palletCount == null ? '—' : order.palletCount + ' 托' },
     { label: '体积', value: order?.volumeCbm == null ? '—' : order.volumeCbm + ' m³' },
     { label: '最近更新', value: formatOverseasDateTime(order?.updatedAt) },
@@ -196,7 +205,7 @@ onMounted(load)
       <el-tabs v-model="activeTab" class="detail-tabs density-element-tabs density-contained-tabs">
         <el-tab-pane name="basic"><template #label><span class="density-tab-icon" aria-hidden="true">📋</span><span>基本信息</span></template>
           <dl class="detail-fields density-fields" aria-label="基本信息">
-            <div v-for="field in basicFields" :key="field.label" :class="{ wide: field.wide }"><dt>{{ field.label }}</dt><dd :class="{ 'detail-field-value--business': isSingleLineBusinessField(field) }" :title="isSingleLineBusinessField(field) ? String(field.value) : undefined">{{ field.value }}</dd></div>
+            <div v-for="field in basicFields" :key="field.label" :class="{ wide: field.wide }"><dt>{{ field.label }}</dt><dd :class="{ 'detail-field-value--business': isSingleLineBusinessField(field), 'package-difference--nonzero': isNonzeroDifference(field) }" :title="isSingleLineBusinessField(field) ? String(field.value) : undefined">{{ field.value }}</dd></div>
           </dl>
         </el-tab-pane>
         <el-tab-pane name="cargo"><template #label><span class="density-tab-icon" aria-hidden="true">📦</span><span>货物信息</span></template><section class="table-panel"><DataTable :data="cargo" :columns="cargoColumns" column-settings-mode="hide" row-key="id" empty-text="暂无货物明细"></DataTable></section></el-tab-pane>
@@ -226,6 +235,7 @@ onMounted(load)
 <style scoped>
 .detail-fields > div.wide { grid-column: span 2; }
 .detail-field-value--business { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.package-difference--nonzero { color: var(--el-color-danger); font-weight: 600; }
 .plan-panel { margin-bottom: var(--admin-space-5); }
 .related-panel { margin-top: var(--admin-space-5); }
 .fee-form { min-width: 0; overflow-x: hidden; }