优化

src/modules/inbounds/measurement/InboundMeasurementDialog.vue

@@ -84,6 +84,7 @@ function handleSubmitted() {
     <div class="measurement-dialog-workspace">
       <section class="measurement-dialog-weight" aria-label="称重图片、OCR 与托盘核对">
         <WeightOcrPanel
+          table-mode
           :customer-id="customerId"
           :inbound-id="inboundId"
           @changed="handleUpdated"
@@ -146,6 +147,15 @@ function handleSubmitted() {
 .inbound-measurement-workspace-dialog .measurement-panel { border: 0; border-radius: 0; box-shadow: none; }
 .inbound-measurement-workspace-dialog .measurement-panel__heading .measurement-panel__actions,
 .inbound-measurement-workspace-dialog .measurement-panel__footer { display: none; }
+.inbound-measurement-workspace-dialog .measurement-summary-section { margin: 0 -12px; padding: 10px 12px 13px; border: 1px solid #cce8df; border-left: 4px solid #20a477; border-radius: 8px; background: #f4fbf8; }
+.inbound-measurement-workspace-dialog .measurement-summary-context { min-height: 38px; }
+.inbound-measurement-workspace-dialog .measurement-subheading { color: #18795d; font-size: 15px; }
+.inbound-measurement-workspace-dialog .measurement-metrics { padding: 0; border: 1px solid #cce8df; border-radius: 8px; background: #fff; overflow: hidden; }
+.inbound-measurement-workspace-dialog .measurement-metrics > div { min-height: 58px; padding: 9px 14px; border-left: 1px solid #e8ecf2; }
+.inbound-measurement-workspace-dialog .measurement-metrics > div:first-child { border-left: 0; }
+.inbound-measurement-workspace-dialog .measurement-declaration { margin-top: 12px; padding: 10px 12px 0; border: 1px solid #d9e2fa; border-left: 4px solid #647fec; border-radius: 8px; background: #f7f9ff; }
+.inbound-measurement-workspace-dialog .measurement-items-section { margin-top: 12px; padding: 10px 12px 13px; border: 1px solid #eadfc9; border-left: 4px solid #c79643; border-radius: 8px; background: #fffbf4; }
+.inbound-measurement-workspace-dialog .measurement-items-section .measurement-section__heading { margin-bottom: 8px; }
 @media (max-width: 720px) {
   .inbound-measurement-workspace-dialog.el-dialog { width: calc(100vw - 20px) !important; max-width: calc(100vw - 20px); }
   .inbound-measurement-workspace-dialog .el-dialog__header { padding: 16px; }

src/modules/inbounds/review/MeasurementReviewPanel.vue

@@ -52,13 +52,8 @@ const isRejected = computed(() => detail.value?.measureReviewStatus === 'REJECTE
 const reviewStatusLabel = computed(() => inboundStatusLabel(detail.value?.measureReviewStatus, inboundReviewStatusLabels, '未提交'))
 const displayCustomerName = computed(() => detail.value?.companyName?.trim() || props.customerName?.trim() || '客户未命名')
 const displayChannelName = computed(() => detail.value?.channelName?.trim() || detail.value?.channelCode?.trim() || props.channelName?.trim() || props.channelCode?.trim() || '渠道未填写')
-const sourceLabels: Record<string, string> = {
-  THIRD_PARTY: '第三方设备',
-  DEVICE: '第三方设备',
-  OPENAPI: '第三方设备',
-  MANUAL: '平台人工',
-}
-const sourceLabel = computed(() => sourceLabels[detail.value?.sourceType || ''] || (detail.value?.sourceType ? '未知来源' : '尚未记录'))
+const measurementCount = computed(() => detail.value?.items.length || 0)
+const weightCount = computed(() => detail.value?.weightResults.length || 0)
 
 function formatNumber(value: number | null | undefined, maximumFractionDigits = 3) {
   if (value === null || value === undefined || !Number.isFinite(value)) return '—'
@@ -180,18 +175,18 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
   <section class="review-panel" aria-labelledby="measurement-review-title">
     <h2 id="measurement-review-title" class="sr-only">测量审核内容</h2>
     <div class="review-toolbar" aria-label="测量审核操作">
+      <div class="review-toolbar__actions">
+        <el-button v-if="isPending && canReview" type="primary" plain @click="correctionMode = true"><Pencil :size="16" />修改重量</el-button>
+        <el-button v-if="isPending && canReview" type="primary" :loading="actionLoading === 'approve' || postApproveLoading" :disabled="approvalCompleted" @click="confirmApprove"><Check :size="16" />{{ approvalCompleted ? '审核已通过' : approvalButtonLabel }}</el-button>
+      </div>
       <div class="review-toolbar__status">
         <StatusBadge v-if="detail" :status="reviewStatusLabel" />
-        <span v-if="isPending">通过后进入待分柜</span>
+        <span v-if="isPending">通过后进入{{ approvalTargetLabel }}</span>
         <span v-else-if="isRejected">历史记录为审核驳回，仅供查看</span>
         <span v-else>当前记录不可审核</span>
         <span v-if="detail" class="review-toolbar__context">客户：{{ displayCustomerName }} · 渠道：{{ displayChannelName }}</span>
       </div>
-      <div class="review-toolbar__actions">
-        <el-button v-if="isPending && canReview" type="primary" plain @click="correctionMode = true"><Pencil :size="16" />修改重量</el-button>
-        <el-button v-if="isPending && canReview" type="primary" :loading="actionLoading === 'approve' || postApproveLoading" :disabled="approvalCompleted" @click="confirmApprove"><Check :size="16" />{{ approvalCompleted ? '审核已通过' : approvalButtonLabel }}</el-button>
-        <el-button :loading="loading" aria-label="刷新审核数据" @click="reload"><RotateCcw :size="16" />刷新</el-button>
-      </div>
+      <el-button class="review-refresh" :loading="loading" aria-label="刷新审核数据" @click="reload"><RotateCcw :size="16" />刷新</el-button>
     </div>
 
     <el-alert v-if="loadError" type="error" :closable="false" show-icon role="alert">
@@ -204,12 +199,7 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
       <el-alert v-if="detail.reviewReason" type="warning" :closable="false" show-icon :title="`最近审核说明：${detail.reviewReason}`" />
 
       <section class="review-data" aria-labelledby="review-data-title">
-        <header class="review-section-heading">
-          <div>
-            <h3 id="review-data-title">审核数据总览</h3>
-          </div>
-          <el-tag effect="plain">{{ sourceLabel }}</el-tag>
-        </header>
+        <header class="review-section-heading"><h3 id="review-data-title">审核数据总览</h3></header>
 
         <div class="review-comparison">
           <div class="review-comparison__row review-comparison__row--declared">
@@ -223,7 +213,7 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
           <div class="review-comparison__row">
             <strong>平台实测</strong>
             <dl class="review-metrics" aria-label="平台实测结果汇总">
-              <div><dt>箱数</dt><dd>{{ formatNumber(detail.actualPackageCount, 0) }} <small v-if="formatDifference(detail.actualPackageCount, detail.originalPackageCount, 0)">{{ formatDifference(detail.actualPackageCount, detail.originalPackageCount, 0) }}</small></dd></div>
+              <div><dt>箱数</dt><dd>{{ formatNumber(detail.actualPackageCount, 0) }}{{ formatDifference(detail.actualPackageCount, detail.originalPackageCount, 0) ? ` ${formatDifference(detail.actualPackageCount, detail.originalPackageCount, 0)}` : '' }}</dd></div>
               <div><dt>毛重</dt><dd>{{ formatNumber(detail.actualGrossWeightKg) }} <small>kg<span v-if="formatDifference(detail.actualGrossWeightKg, detail.originalGrossWeightKg, 3, ' kg')"> · {{ formatDifference(detail.actualGrossWeightKg, detail.originalGrossWeightKg, 3, ' kg') }}</span></small></dd></div>
               <div class="review-metric--primary"><dt>货物净重</dt><dd>{{ formatNumber(detail.actualNetWeightKg) }} <small>kg</small></dd></div>
               <div><dt>体积</dt><dd>{{ formatNumber(detail.actualVolumeCbm, 4) }} <small>m³<span v-if="formatDifference(detail.actualVolumeCbm, detail.originalVolumeCbm, 4, ' m³')"> · {{ formatDifference(detail.actualVolumeCbm, detail.originalVolumeCbm, 4, ' m³') }}</span></small></dd></div>
@@ -238,12 +228,12 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
           <div>
             <h3 id="review-items-title">箱规测量明细</h3>
           </div>
-          <span>{{ detail.items.length }} 条</span>
+          <span>{{ measurementCount }} 条</span>
         </header>
         <div v-if="detail.items.length" class="review-table-scroll">
           <el-table :data="detail.items" border stripe table-layout="fixed" class="review-table">
             <el-table-column type="index" label="#" width="44" align="center" />
-            <el-table-column label="箱号" width="240" show-overflow-tooltip>
+            <el-table-column label="箱号" width="160" show-overflow-tooltip>
               <template #default="{ row }">{{ row.boxCode || row.itemNo || '—' }}</template>
             </el-table-column>
             <el-table-column label="测量图片" width="98" align="center">
@@ -281,12 +271,31 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
         <el-empty v-else description="暂无箱规测量明细" :image-size="48" />
       </section>
 
+      <section class="review-items review-weight-items" aria-labelledby="review-weight-title">
+        <header class="review-section-heading"><h3 id="review-weight-title">⚖ 称重明细</h3><div class="review-weight-totals"><span>实测毛重 <strong>{{ formatNumber(detail.actualGrossWeightKg, 3) }} KG</strong></span><span>货物重量 <strong>{{ formatNumber(detail.actualNetWeightKg, 3) }} KG</strong></span></div></header>
+        <div v-if="weightCount" class="review-table-scroll">
+          <el-table :data="detail.weightResults" border stripe table-layout="fixed" class="review-table review-weight-table">
+            <el-table-column type="index" label="#" width="44" align="center" />
+            <el-table-column label="称重图片" width="112" align="center"><template #default="{ row }"><MeasurementEvidenceThumbnail :customer-id="customerId" :inbound-id="inboundId" :file-id="row.fileId" :alt="`${row.palletCode || '托盘'}称重图片`" empty-text="无图片" @open="openImagePreview(row.fileId, row.palletCode || '托盘')" /></template></el-table-column>
+            <el-table-column prop="palletCode" label="托盘编码" min-width="120" />
+            <el-table-column prop="palletType" label="托盘类型" min-width="120" />
+            <el-table-column label="库位" min-width="130"><template #default="{ row }"><span class="review-location">{{ row.locationCode || '—' }}<template v-if="row.locationCode"> · {{ row.slotStatus === 'BOUND' ? '待上架' : row.slotStatus || '待上架' }}</template></span></template></el-table-column>
+            <el-table-column label="毛重（KG）" min-width="120" align="right"><template #default="{ row }">{{ formatNumber(row.grossWeightKg, 3) }}</template></el-table-column>
+            <el-table-column label="托盘皮重(kg)" min-width="120" align="right"><template #default="{ row }">{{ formatNumber(row.palletTareWeightKg, 3) }}</template></el-table-column>
+            <el-table-column label="货物重量(kg)" min-width="120" align="right"><template #default="{ row }"><strong class="review-weight-value">{{ formatNumber(row.netWeightKg, 3) }}</strong></template></el-table-column>
+            <el-table-column label="称重时间" min-width="150"><template #default="{ row }">{{ formatDate(row.confirmedAt || row.adjustedAt) }}</template></el-table-column>
+          </el-table>
+        </div>
+        <el-empty v-else description="暂无称重明细" :image-size="48" />
+      </section>
+
       <WeightOcrPanel
         review-mode
         :correction-mode="correctionMode"
         :customer-id="customerId"
         :inbound-id="inboundId"
         @changed="handleWeightChanged"
+        :class="{ 'review-weight-editor--hidden': !correctionMode }"
       />
     </template>
 
@@ -306,7 +315,7 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
 
 <style scoped>
 .review-panel { display: grid; gap: var(--admin-space-5, 12px); color: var(--cc-text); }
-.review-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; position: sticky; top: -12px; z-index: 3; flex-wrap: wrap; margin: -var(--admin-space-5, 12px) -var(--admin-space-6, 16px) 0; padding: var(--admin-space-3, 8px) var(--admin-space-6, 16px); border-bottom: 1px solid var(--cc-border); background: var(--admin-surface, #fff); }
+.review-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; position: sticky; top: -12px; z-index: 3; flex-wrap: wrap; margin: -var(--admin-space-5, 12px) -var(--admin-space-6, 16px) 0; padding: var(--admin-space-3, 8px) var(--admin-space-6, 16px); border-bottom: 1px solid var(--cc-border); background: linear-gradient(100deg, #f3f6ff 0%, #fff 48%, #eefaf7 100%); }
 .review-toolbar__status, .review-toolbar__actions { display: flex; min-width: 0; align-items: center; flex-wrap: wrap; gap: var(--admin-space-3, 8px); }
 .review-toolbar__status > span { color: var(--cc-muted); font-size: var(--admin-font-caption, 12px); }
 .review-toolbar__actions { justify-content: flex-end; }
@@ -337,6 +346,23 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
 .review-table :deep(.el-table__cell) { padding: 7px 0; }
 .review-table :deep(.review-time-cell .cell) { white-space: nowrap; }
 .review-table :deep(.measurement-evidence-thumb) { min-width: 72px; border-radius: var(--admin-radius, 4px); }
+.review-data { border: 1px solid #dfe5ef; border-radius: 8px; overflow: hidden; background: #fff; }
+.review-data .review-section-heading { margin: 0; padding: 10px 14px 6px; border-bottom: 0; }
+.review-comparison__row { padding: 10px 14px; }
+.review-comparison__row--declared { background: linear-gradient(90deg, #ddf5e9, #eaf9f1); box-shadow: inset 4px 0 #25a879; }
+.review-comparison__row--declared > strong { color: #16845d; }
+.review-comparison__row + .review-comparison__row { border-top: 1px dashed #dfe4ed; }
+.review-comparison__row > strong { font-size: 14px; }
+.review-declaration dd, .review-metrics dd { font-size: 16px; }
+.review-metric--primary dd, .review-weight-value, .review-weight-totals strong { color: #138154 !important; font-weight: 750; }
+.review-weight-items { padding-top: 0; }
+.review-weight-totals { display: flex; gap: 18px; color: var(--cc-muted); font-size: 12px; }
+.review-weight-totals span { padding: 4px 8px; border-radius: 7px; background: #f0faf5; }
+.review-weight-totals strong { margin-left: 6px; font-size: 16px; }
+.review-weight-table :deep(.el-table__header th) { background: linear-gradient(180deg, #f1f4fc, #e9eef8); }
+.review-weight-table :deep(.el-table__cell) { padding: 9px 0; }
+.review-location { display: inline-block; padding: 3px 7px; border: 1px solid #e2e8f2; border-radius: 5px; background: #f3f6fb; color: #53627a; white-space: nowrap; }
+.review-weight-editor--hidden { display: none; }
 .review-image-preview { display: grid; min-height: 240px; place-items: center; }
 .review-image-preview img { display: block; width: auto; max-width: 100%; max-height: 70vh; object-fit: contain; }
 .review-image-preview__error { display: grid; justify-items: center; gap: var(--admin-space-3, 8px); color: var(--el-color-danger); }
@@ -346,6 +372,7 @@ defineExpose({ confirmApprove, isPending, canReview, actionLoading })
   .review-toolbar__actions { display: grid; width: 100%; grid-template-columns: 1fr; justify-content: stretch; }
   .review-toolbar__actions :deep(.el-button) { width: 100%; min-height: 44px; }
   .review-section-heading { align-items: stretch; flex-direction: column; }
+  .review-weight-totals { flex-wrap: wrap; gap: 6px; }
   .review-comparison__row { grid-template-columns: 78px minmax(0, 1fr); align-items: start; }
   .review-metrics, .review-declaration { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 }

src/modules/inbounds/weight/components/WeightOcrPanel.vue

@@ -36,9 +36,11 @@ const props = withDefaults(defineProps<{
   inboundId: string
   reviewMode?: boolean
   correctionMode?: boolean
+  tableMode?: boolean
 }>(), {
   reviewMode: false,
   correctionMode: false,
+  tableMode: false,
 })
 const emit = defineEmits<{
   changed: []
@@ -577,6 +579,25 @@ defineExpose({ reload: loadWorkspace })
             <strong>尚未上传称重图片</strong>
           </div>
 
+          <div v-else-if="tableMode" class="weight-table-wrap">
+            <table class="weight-data-table">
+              <thead><tr><th>#</th><th>称重图片</th><th>托盘编码</th><th>托盘类型</th><th>库位</th><th>实测毛重(KG)</th><th>服务端确认毛重(KG)</th><th>托盘皮重(KG)</th><th>货物重量(KG)</th><th>操作</th></tr></thead>
+              <tbody>
+                <tr v-for="(row, index) in rows" :key="row.id">
+                  <td>{{ index + 1 }}</td>
+                  <td><WeightImageThumbnail :customer-id="customerId" :inbound-id="inboundId" :file-id="row.fileId" :alt="`称重图片 ${index + 1}`" @open="openPreview(row)" /></td>
+                  <td>{{ row.palletCode || '—' }}</td>
+                  <td>{{ row.palletType || '—' }}</td>
+                  <td><span class="weight-location">{{ row.locationCode || '未分配' }}<template v-if="row.locationCode"> · {{ putawayStatusLabel(row.slotStatus) }}</template></span></td>
+                  <td class="weight-gross-value">{{ formatWeight(row.adjustedWeightValue ?? row.ocrWeightValue, row.adjustedWeightUnit || row.ocrWeightUnit || 'KG') }}</td>
+                  <td>{{ formatWeight(row.grossWeightKg) }}</td>
+                  <td>{{ formatWeight(row.palletTareWeightKg) }}</td>
+                  <td class="weight-net-value">{{ formatWeight(row.netWeightKg) }}</td>
+                  <td><el-tooltip v-if="canEdit && editable && !reviewMode" content="删除图片" placement="top"><el-button text type="danger" :aria-label="`删除称重图片 ${index + 1}`" :loading="isActionLoading('delete', row.id)" :disabled="Boolean(activeAction)" @click="removeResult(row)"><Trash2 :size="16" /></el-button></el-tooltip><span v-else>—</span></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
           <div v-else class="weight-grid">
             <article v-for="(row, index) in rows" :key="row.id" class="weight-card">
               <WeightImageThumbnail
@@ -711,6 +732,17 @@ defineExpose({ reload: loadWorkspace })
 .weight-card__facts dt { color: var(--cc-muted); }
 .weight-card__facts dd { min-width: 0; margin: 0; color: #344054; overflow-wrap: anywhere; text-align: right; }
 .weight-card__correct { width: 100%; margin: var(--admin-space-5, 12px) 0 0; }
+.weight-table-wrap { overflow-x: auto; border: 1px solid #d7e0ef; border-radius: 8px; background: #fff; }
+.weight-data-table { width: 100%; min-width: 1180px; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: var(--admin-font-caption, 12px); }
+.weight-data-table th { height: 42px; padding: 0 8px; border-bottom: 1px solid #d5dfee; background: linear-gradient(180deg, #f1f4fc, #e9eef8); color: #405473; font-weight: 700; white-space: nowrap; }
+.weight-data-table td { height: 76px; padding: 6px 8px; border-top: 1px solid #ebeff5; color: #4b5870; text-align: center; vertical-align: middle; white-space: nowrap; }
+.weight-data-table th + th, .weight-data-table td + td { border-left: 1px solid #edf0f5; }
+.weight-data-table tbody tr:nth-child(even) td { background: #f8faff; }
+.weight-data-table tbody tr:hover td { background: #edf3ff; }
+.weight-data-table :deep(.weight-thumb) { width: 90px; height: 60px; margin: auto; border-radius: 8px; }
+.weight-data-table .weight-gross-value { color: #33425f; font-weight: 750; }
+.weight-data-table .weight-net-value { color: #16875b; font-weight: 750; }
+.weight-location { display: inline-block; padding: 3px 7px; border: 1px solid #e2e8f2; border-radius: 5px; background: #f3f6fb; color: #53627a; }
 .weight-preview { display: block; width: 100%; max-height: min(50vh, 460px); object-fit: contain; border-radius: 6px; background: #f2f4f7; }
 .weight-key-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--admin-space-3, 8px) var(--admin-space-5, 12px); margin-top: var(--admin-space-3, 8px); padding: var(--admin-space-3, 8px) 0; border-block: 1px solid var(--cc-border); }
 .weight-key-facts div { display: grid; min-width: 0; gap: var(--admin-space-1, 4px); }