提交

web-admin/src/views/pl/_shared/IoOrderListPage.vue

@@ -69,15 +69,17 @@
       </div>
 
       <div class="list-body list-wrap">
-        <ListTable table-key="pl--shared-io-order-list-page"
-          class="list-table"
-          :data="rows"
-          v-loading="loading"
-          stripe
-          row-key="id"
-          @selection-change="(val: PlIoOrder[]) => (selectedRows = val)"
-          @row-dblclick="openEdit"
-        >
+        <div ref="ioOrderTableWrapRef" class="table-scroll bx-list-table-wrap">
+          <ListTable :table-key="`pl-${kind}-io-order-list`"
+            class="list-table"
+            :data="rows"
+            v-loading="loading"
+            stripe
+            row-key="id"
+            @selection-change="(val: PlIoOrder[]) => (selectedRows = val)"
+            @row-dblclick="openEdit"
+            @header-dragend="() => ioOrderStatsRowRef?.resync?.()"
+          >
           <el-table-column type="selection" min-width="55" align="center" />
           <el-table-column
             type="index"
@@ -202,6 +204,15 @@
           <el-table-column prop="actualQtyTotal" label="实际数量合计" min-width="120" align="right" />
           <el-table-column prop="siteFeedbackTime" label="最近提交" min-width="160" show-overflow-tooltip />
         </ListTable>
+          <ListColumnStatsRow
+            ref="ioOrderStatsRowRef"
+            :storage-key="`pl-${kind}-column-stats`"
+            :columns="ioOrderStatsRowColumns"
+            :data="rows"
+            :table-wrap-el="ioOrderTableWrapRef"
+            :get-cell-value="getIoOrderStatCellValue"
+          />
+        </div>
 
         <div class="pagination list-pager-bar">
           <div class="list-pager-selected">
@@ -416,6 +427,8 @@
   } from '@/components/business/brand-qty-chips-field/index.vue'
   import ListQuickSearchInput from '@/components/business/list-quick-search-input/index.vue'
   import ListToolbarDateShortcuts from '@/components/core/list-toolbar-date-shortcuts/index.vue'
+  import ListColumnStatsRow from '@/components/business/list-column-stats-row/index.vue'
+  import type { StatsRowColumn } from '@/utils/list-column-stats'
   import ViewKvTable from '@/components/business/system-view-dialog/ViewKvTable.vue'
   import type { ViewField } from '@/components/business/system-view-dialog/types'
   import {
@@ -441,6 +454,61 @@
 
   const api = props.kind === 'inbound' ? inboundOrderApi : outboundOrderApi
 
+  const ioOrderTableWrapRef = ref<HTMLElement | null>(null)
+  const ioOrderStatsRowRef = ref<{ resync?: () => void } | null>(null)
+
+  const ioOrderStatsRowColumns = computed((): StatsRowColumn[] => [
+    { key: '__selection', interactive: false },
+    { key: '__index', interactive: false },
+    { key: 'orderNo', interactive: true, prop: 'orderNo' },
+    { key: 'status', interactive: true, prop: 'status' },
+    { key: 'planNo', interactive: true, prop: 'planNo' },
+    { key: 'partnerCompany', interactive: true, prop: 'partnerCompany' },
+    { key: 'vehicleNo', interactive: true, prop: 'vehicleNo' },
+    { key: 'pickupAddress', interactive: true, prop: 'pickupAddress' },
+    { key: '__destination', interactive: true, prop: '__destination' },
+    { key: 'productName', interactive: true, prop: 'productName' },
+    { key: 'brand', interactive: true, prop: 'brand' },
+    { key: 'brandQty', interactive: true, prop: 'brandQty' },
+    { key: 'productSpec', interactive: true, prop: 'productSpec' },
+    { key: 'productUnit', interactive: true, prop: 'productUnit' },
+    { key: 'packageSpec', interactive: true, prop: 'packageSpec' },
+    { key: 'deliveryMethod', interactive: true, prop: 'deliveryMethod' },
+    { key: 'actualQtyTotal', interactive: true, prop: 'actualQtyTotal' },
+    { key: 'siteFeedbackTime', interactive: true, prop: 'siteFeedbackTime' }
+  ])
+
+  function joinItemLines(row: PlIoOrder, mapper: (item: PlIoOrder['items'][number]) => string): string {
+    return (row.items || []).map(mapper).filter((s) => s && s !== '—').join('\n')
+  }
+
+  function getIoOrderStatCellValue(row: PlIoOrder, prop: string): unknown {
+    if (prop === 'status') return statusLabel(row.status)
+    if (prop === '__destination') return row.destinationAddress || row.destinationName || ''
+    if (prop === 'productName') {
+      return joinItemLines(row, (item) => item.productName || '')
+    }
+    if (prop === 'brand') {
+      return joinItemLines(row, (item) => brandConstraintLabel(item))
+    }
+    if (prop === 'brandQty') {
+      return joinItemLines(row, (item) => resolveIoBrandQtyDisplay(item))
+    }
+    if (prop === 'productSpec') {
+      return joinItemLines(row, (item) => item.specification || '')
+    }
+    if (prop === 'productUnit') {
+      return joinItemLines(row, (item) => item.unitLabel || item.unit || '')
+    }
+    if (prop === 'packageSpec') {
+      return joinItemLines(row, (item) => item.packageSpec || '')
+    }
+    if (prop === 'deliveryMethod') {
+      return joinItemLines(row, (item) => deliveryMethodLabel(item.deliveryMethod))
+    }
+    return (row as any)?.[prop]
+  }
+
   type IoOrderEditItem = PlIoOrder['items'][number] & {
     brandQtyRows?: BrandQtyRow[]
   }
@@ -809,6 +877,10 @@
 </style>
 
 <style scoped lang="scss">
+  .bx-list-table-wrap {
+    min-width: 0;
+  }
+
   .io-order-multi-cell {
     display: flex;
     flex-direction: column;