国际运单节点修改

src/views/realTime/components/AirportView/index.vue

@@ -32,7 +32,9 @@
       <el-auto-resizer>
         <template #default="{ height, width }">
           <el-table-v2
-            :columns="tableColumns"
+            ref="tableRef"
+            :style="{ visibility }"
+            :columns="customRendererColumns"
             :data="dealedTableData"
             :width="width"
             :height="height"
@@ -40,33 +42,8 @@
             :footer-height="60"
             :row-class="rowClassV2"
             :cell-props="cellPropsGetter"
+            @scroll="tableScrollHandler"
           >
-            <template #header-cell="{ column }: HeaderCellSlotProps">
-              <TableHeaderCell
-                v-model:filter-values="filterValueMap[column.columnName]"
-                v-model:sort-rule="tableDataSortRuleMap[column.columnName]"
-                :label="tableColumnFormatter(column.columnLabel)"
-                :desc="column.columnDescribe"
-                :filter-options="filterOptionMap[column.columnName]"
-                :sortable="column.needSort"
-                filter-style="arrow"
-              />
-            </template>
-            <template #cell="slot: CellSlotProps">
-              <div
-                class="el-table-v2__cell-text"
-                @click="cellClickHandlerV2(slot)"
-              >
-                <!-- <el-tooltip
-                  v-if="slot.column.columnName.includes('Time')"
-                  :content="tableDataFormatter(slot)"
-                >
-                  {{ tableDataFormatter(slot) }}
-                </el-tooltip>
-                <span v-else>{{ tableDataFormatter(slot) }}</span> -->
-                {{ tableDataFormatter(slot) }}
-              </div>
-            </template>
             <template #footer>
               <div class="table-footer">
                 <!-- <span class="table-footer-count">航班总数：{{ tableDataCount.flightCount }}</span> -->
@@ -90,8 +67,7 @@
     </div>
   </div>
 </template>
-<script lang="ts" setup>
-import type { CellSlotProps } from '../../type'
+<script lang="tsx" setup>
 import AirportForm from './AirportForm.vue'
 import ColumnSet from '../../components/ColumnSet/index.vue'
 import CountBox from '../../components/CountBox/index.vue'
@@ -103,8 +79,9 @@ import { useTableStyle } from '../../hooks/useTableStyle'
 import { useTableCellClick } from '../../hooks/useTableCellClick'
 import { useTableFilterAndSort } from '@/hooks/useTableFilterAndSort'
 import { useCount } from './useCount'
-import { HeaderCellSlotProps } from 'element-plus'
+import { ElTableV2, TableV2Instance } from 'element-plus'
 import { CommonData } from '~/common'
+import type { HeaderRenderProps, CellRenderProps, ScrollParams } from '../../type'
 import { useLoop } from '@/hooks/useLoop'
 
 const props = defineProps({
@@ -114,7 +91,6 @@ const props = defineProps({
   },
 })
 
-
 const isDeparture = props.name.includes('Departure')
 
 const formData: CommonData = reactive({})
@@ -122,15 +98,41 @@ const formDataChangeHandler = (data: CommonData) => {
   Object.assign(formData, data)
 }
 
+const { tableColumns, tableData, getTableData } = useAirportTable(
+  props.name,
+  formData
+)
+
+const customRendererColumns = computed(() =>
+  tableColumns.value.map(column => ({
+    ...column,
+    headerCellRenderer: ({column}: HeaderRenderProps) => (
+      <TableHeaderCell
+        v-model:filterValues={filterValueMap[column.columnName]}
+        v-model:sortRule={tableDataSortRuleMap[column.columnName]}
+        label={tableColumnFormatter(column.columnLabel)}
+        desc={column.columnDescribe}
+        filterOptions={filterOptionMap[column.columnName]}
+        sortable={Boolean(column.needSort)}
+        filterStyle="arrow"
+      />
+    ),
+    cellRenderer: (cell: CellRenderProps) => (
+      <div
+        class="el-table-v2__cell-text"
+        onClick={() => cellClickHandlerV2(cell)}
+      >
+        {tableDataFormatter(cell)}
+      </div>
+    ),
+  }))
+)
+
 const countFlag = ref(true)
 const { tableColumnFormatter, tableDataFormatter } = useCount(countFlag)
 
 const UTCFlag = ref(true)
 
-const { tableColumns, tableData, getTableData } = useAirportTable(
-  props.name,
-  formData
-)
 useLoop([getTableData], 'airport', [formData])
 const { columnChecked } = useTableColumnSet(tableColumns)
 const { rowClassV2, cellClassV2 } = useTableStyle(props.name)
@@ -216,6 +218,34 @@ const permissionMap = {
 const getPermission = (type?: string) => {
   return [permissionMap[props.name][type]]
 }
+
+// 因为使用了keepalive，需要记录下滚动位置，返回时先滚动到初始位置，再滚动到记录的位置，不然表格会变成空白
+const tableRef = ref<TableV2Instance | null>(null)
+const visibility = ref('visible')
+const scrollPosition = reactive({
+  x: 0,
+  y: 0,
+})
+const tableScrollHandler = ({ scrollLeft, scrollTop }: ScrollParams) => {
+  scrollPosition.x = scrollLeft
+  scrollPosition.y = scrollTop
+}
+onActivated(() => {
+  visibility.value = 'hidden'
+  const { x, y } = scrollPosition
+  tableRef.value?.scrollTo({ scrollLeft: 0, scrollTop: 0 })
+  // 不加延迟的话横向滚动会出错
+  // 等待滚动完成再显示，一定要使用visibility，使用v-show或者说display: none一样会变空白
+  setTimeout(() => {
+    if (x > 0 || y > 0) {
+      tableRef.value?.scrollTo({
+        scrollLeft: x,
+        scrollTop: y,
+      })
+    }
+    visibility.value = 'visible'
+  }, 0)
+})
 </script>
 <style lang="scss" scoped>
 @import './index.scss';

src/views/realTime/components/AirportView/useCount.ts

@@ -1,5 +1,5 @@
 import { Ref } from 'vue'
-import { CellSlotProps } from '../../type'
+import { CellRenderProps } from '../../type'
 
 export function useCount(flag: Ref<boolean>) {
   const tableColumnFormatter = (columnLabel: string) => {
@@ -9,7 +9,7 @@ export function useCount(flag: Ref<boolean>) {
   const tableDataFormatter = ({
     rowData,
     column: { columnName, columnLabel },
-  }: CellSlotProps) => {
+  }: CellRenderProps) => {
     const cellValue = rowData[columnName]
     if (!unref(flag)) {
       const matched = columnLabel.match(/(?<=\()\S+(?=\))/)

src/views/realTime/components/WaybillView/index.vue

@@ -157,7 +157,7 @@ const tableData = computed(() =>
       pullMark,
       returnMark,
       // transMark,
-      // exceptionCustomsMark,
+      exceptionCustomsMark,
       execPosition, // 读取位置
       nodeCode, // 节点名称
       ConsignmentItemPackagingQuantityQuantity, // 跟踪节点件数

src/views/realTime/hooks/useTable.ts

@@ -275,8 +275,8 @@ const tableColumnsMap: {
     {
       columnLabel: '货物编码',
       columnName: 'CargoSN',
-      width: 100,
       needFilters: 1,
+      width: 100,
     },
     // { columnLabel: '中转', columnName: 'transMark', needFilters: 1 },
     { columnLabel: '拉下', columnName: 'pullMark', needFilters: 1, width: 60 },
@@ -409,121 +409,154 @@ const tableColumnsMap: {
     { columnLabel: '发往位置描述', columnName: 'C13' },
   ],
   InternationalDepartureFlightContainer: [
-    { columnLabel: '集装器编号', columnName: 'C0', width: 120 },
-    { columnLabel: '运单数', columnName: 'C1', width: 60, needCount: 1 },
-    { columnLabel: '件数', columnName: 'C2', width: 60, needCount: 1 },
+    { columnLabel: '集装器编号', columnName: 'stowageNo', width: 120 },
+    { columnLabel: '运单数', columnName: 'list', width: 60, needCount: 1 },
+    { columnLabel: '件数', columnName: 'number', width: 60, needCount: 1 },
     {
-      columnLabel: '理货',
-      columnName: 'C3',
+      columnLabel: '加货',
+      columnName: 'tally',
       className: 'cell-filter cell-filter-yellow',
     },
     {
       columnLabel: '拉下',
-      columnName: 'C4',
+      columnName: 'pull',
       className: 'cell-filter cell-filter-yellow',
     },
+    // {
+    //   columnLabel: '待运区',
+    //   columnName: 'wait',
+    //   className: 'cell-filter cell-filter-yellow',
+    // },
     {
-      columnLabel: '待运区',
-      columnName: 'C5',
+      columnLabel: '预配载',
+      columnName: 'stowage',
       className: 'cell-filter cell-filter-yellow',
     },
     {
       columnLabel: '货站交接',
-      columnName: 'C6',
+      columnName: 'depot',
+      className: 'cell-filter cell-filter-yellow',
+    },
+    {
+      columnLabel: '运输前复核',
+      columnName: 'resure',
       className: 'cell-filter cell-filter-yellow',
     },
     {
       columnLabel: '机下交接',
-      columnName: 'C7',
+      columnName: 'planeDown',
       className: 'cell-filter cell-filter-yellow',
     },
     {
       columnLabel: '装机',
-      columnName: 'C8',
+      columnName: 'loadPlane',
+      className: 'cell-filter cell-filter-yellow',
+    },
+    {
+      columnLabel: '拉回确认',
+      columnName: 'pullSure',
       className: 'cell-filter cell-filter-yellow',
     },
   ],
   InternationalDepartureFlightWaybill: [
-    { columnLabel: '运单号', columnName: 'C0', width: 120 },
-    { columnLabel: '运单类型', columnName: 'C1', needCount: 1 },
-    { columnLabel: '集装器数量', columnName: 'C2', needCount: 1 },
+    { columnLabel: '运单号', columnName: 'stockCode', width: 120 },
+    { columnLabel: '集装器数量', columnName: 'stowageNum', needCount: 1 },
     {
       columnLabel: '品名',
-      columnName: 'C3',
-      width: 160,
+      columnName: 'typeCode',
+      width: 300,
       showOverflowTooltip: true,
     },
-    { columnLabel: '特货信息', columnName: 'C4' },
-    { columnLabel: '货物件数', columnName: 'C5', needCount: 1 },
-    { columnLabel: '拉下件数', columnName: 'C6', needCount: 1 },
-    { columnLabel: '退运件数', columnName: 'C7', needCount: 1 },
-    { columnLabel: '最新节点', columnName: 'C8' },
-    { columnLabel: '最新位置', columnName: 'C9' },
-    { columnLabel: '处理结果', columnName: 'C10' },
-    { columnLabel: '处理时间', columnName: 'C11', width: 130 },
-    { columnLabel: '中转进航班号', columnName: 'C12' },
-    { columnLabel: '中转航班降落时间', columnName: 'C13', width: 130 },
-    { columnLabel: '装载序号', columnName: 'C14' },
+    { columnLabel: '特货信息', columnName: 'speCargoInfo' },
+    { columnLabel: '货物件数', columnName: 'luggageCount', needCount: 1 },
+    { columnLabel: '拉下件数', columnName: 'pullNum', needCount: 1 },
+    { columnLabel: '退运件数', columnName: 'returnNum', needCount: 1 },
+    { columnLabel: '最新节点', columnName: 'nodeCode' },
+    { columnLabel: '最新位置', columnName: 'execPosition' },
+    { columnLabel: '处理结果', columnName: 'execResult' },
+    { columnLabel: '处理时间', columnName: 'execTime', width: 130 },
+    // { columnLabel: '中转进航班号', columnName: 'inFlightNO' },
+    // {
+    //   columnLabel: '中转航班降落时间',
+    //   columnName: 'inFlightNOLandTime',
+    //   width: 130,
+    // },
+    // { columnLabel: '装载序号', columnName: 'queueNo' },
   ],
   InternationalDepartureWaybillGoods: [
-    { columnLabel: '航班号', columnName: 'C0', needFilters: 1 },
-    { columnLabel: '集装器编号', columnName: 'C1', width: 120, needFilters: 1 },
-    { columnLabel: '货物编码', columnName: 'C2', needFilters: 1 },
-    { columnLabel: '拉下', columnName: 'C3', needFilters: 1 },
-    { columnLabel: '退运', columnName: 'C4', needFilters: 1 },
+    {
+      columnLabel: '航班号',
+      columnName: 'flightNO',
+      needFilters: 1,
+      width: 70,
+    },
+    {
+      columnLabel: '集装器编号',
+      columnName: 'ULDNO',
+      width: 100,
+      needFilters: 1,
+    },
+    { columnLabel: '货物编码', columnName: 'CargoSN', needFilters: 1 },
+    { columnLabel: '拉下', columnName: 'pullMark', needFilters: 1, width: 60 },
+    {
+      columnLabel: '退运',
+      columnName: 'returnMark',
+      needFilters: 1,
+      width: 60,
+    },
     {
       columnLabel: '入园',
-      columnName: 'C5',
+      columnName: 'EPORTREL',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '海关',
-      columnName: 'C6',
+      columnName: 'MTREL',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '运抵',
-      columnName: 'C7',
+      columnName: 'FOH',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '安检',
-      columnName: 'C8',
+      columnName: 'REH',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '收运核单',
-      columnName: 'C9',
+      columnName: 'RCS',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '理货',
-      columnName: 'C10',
+      columnName: '板箱清单XML',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '拉下',
-      columnName: 'C11',
+      columnName: 'CARGOS_OFFLOAD',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '待运区',
-      columnName: 'C12',
+      columnName: 'WAT_LOC',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '货站交接',
-      columnName: 'C13',
+      columnName: 'CARGOS_HANDOVER_STATUS_02',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '机下交接',
-      columnName: 'C14',
+      columnName: '出港货邮',
       className: 'cell-filter cell-filter-green',
     },
     {
-      columnLabel: '提取',
-      columnName: 'C15',
+      columnLabel: '装机',
+      columnName: '装载完成',
       className: 'cell-filter cell-filter-green',
     },
   ],
@@ -576,46 +609,61 @@ const tableColumnsMap: {
     { columnLabel: '装载序号', columnName: 'queueNo' },
   ],
   InternationalArrivalWaybillGoods: [
-    { columnLabel: '航班号', columnName: 'C0', needFilters: 1 },
-    { columnLabel: '货物编码', columnName: 'C1', needFilters: 1 },
-    { columnLabel: '中转', columnName: 'C2', needFilters: 1 },
-    { columnLabel: '退运', columnName: 'C3', needFilters: 1 },
-    { columnLabel: '海关异常', columnName: 'C4', needFilters: 1 },
+    {
+      columnLabel: '航班号',
+      columnName: 'flightNO',
+      needFilters: 1,
+      width: 70,
+    },
+    { columnLabel: '货物编码', columnName: 'C1', needFilters: 1, width: 100 },
+    // { columnLabel: '中转', columnName: 'C2', needFilters: 1 },
+    {
+      columnLabel: '退运',
+      columnName: 'returnMark',
+      needFilters: 1,
+      width: 60,
+    },
+    {
+      columnLabel: '海关异常',
+      columnName: 'exceptionCustomsMark',
+      needFilters: 1,
+      width: 60,
+    },
     {
       columnLabel: '卸机',
-      columnName: 'C5',
+      columnName: 'FFM',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '机下交接',
-      columnName: 'C6',
+      columnName: 'CARGOS_HANDOVER_STATUS_01',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '货站交接',
-      columnName: 'C7',
+      columnName: 'CARGOS_HANDOVER_STATUS_99',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '理货',
-      columnName: 'C8',
+      columnName: 'RCF报',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '海关放行',
-      columnName: 'C9',
+      columnName: 'MTREL',
       className: 'cell-filter cell-filter-green',
     },
     {
       columnLabel: '出库',
-      columnName: 'C10',
-      className: 'cell-filter cell-filter-green',
-    },
-    {
-      columnLabel: '海关罚没',
-      columnName: 'C11',
+      columnName: 'DLV报',
       className: 'cell-filter cell-filter-green',
     },
+    // {
+    //   columnLabel: '海关罚没',
+    //   columnName: 'C11',
+    //   className: 'cell-filter cell-filter-green',
+    // },
   ],
   InternationalArrivalGoodsFlight: [
     { columnLabel: '航班号', columnName: 'C0' },
@@ -634,231 +682,6 @@ const tableColumnsMap: {
     { columnLabel: '发往位置描述', columnName: 'C13' },
   ],
 }
-const simulateTableDataMap: {
-  [tableName: string]: CommonData[]
-} = {
-  DepartureFlightContainer: Array.from({ length: 2 }, () => ({
-    C0: 'DOU29800001',
-    C1: '5',
-    C2: '50',
-    C3: 'C24  11:01',
-    C4: 'F24  12:05',
-    C5: 'D32  11:25',
-    C6: 'E24  11:40',
-    C7: 'F24  12:01',
-    C8: 'G32  12:25',
-  })),
-  DepartureFlightWaybill: Array.from({ length: 3 }, () => ({
-    C0: '32535234445',
-    C1: '5',
-    C2: '手机、充电器',
-    C3: '特',
-    C4: '5',
-    C5: '2',
-    C6: '2',
-    C7: '待运区',
-    C8: 'A13',
-    C9: '通过',
-    C10: '2022/9/10 10:01',
-    C11: 'ZH5466',
-    C12: '2022/9/10 16:01',
-    C13: '3',
-  })),
-  DepartureWaybillGoods: Array.from({ length: 4 }, () => ({
-    C0: 'CA1001',
-    C1: 'DOU2424U2',
-    C2: '56888829',
-    C3: 'Y',
-    C4: 'Y',
-    C5: 'A203-未通过-15:40',
-    C6: 'A203-未通过-15:40',
-    C7: 'A203-未通过-15:40',
-    C8: 'A203-未通过-15:40',
-    C9: 'A203-未通过-15:40',
-    C10: 'A203-未通过-15:40',
-    C11: 'A203-未通过-15:40',
-    C12: 'A203-未通过-15:40',
-    C13: 'A203-未通过-15:40',
-    C14: 'A203-未通过-15:40',
-    C15: 'A203-未通过-15:40',
-    C16: 'A203-未通过-15:40',
-  })),
-  DepartureGoodsFlight: Array.from({ length: 3 }, () => ({
-    C0: 'CA1001',
-    C1: '2022/9/10',
-    C2: 'SZX-11:35',
-    C3: 'PEK-14:35',
-    C4: '机下交接',
-    C5: 'A03',
-    C6: 'A区03闸口',
-    C7: '2022/09/10 07:10',
-    C8: '通过',
-    C9: '人工扫描',
-    C10: '56',
-    C11: '张伯伦',
-    C12: 'B12',
-    C13: '货站B12闸口',
-    C14: 'DOU2329U2',
-  })),
-  ArrivalFlightWaybill: Array.from({ length: 3 }, () => ({
-    C0: '32535234445',
-    C1: '手机、充电器',
-    C2: '特',
-    C3: '5',
-    C4: '5',
-    C5: '待运区',
-    C6: 'A13',
-    C7: '通过',
-    C8: '2022/9/10 10:01',
-    C9: 'ZH5466',
-    C10: '2022/9/10 16:01',
-    C11: '3',
-  })),
-  ArrivalWaybillGoods: Array.from({ length: 4 }, () => ({
-    C0: 'CA1001',
-    C1: '56888829',
-    C2: 'Y',
-    C3: 'Y',
-    C4: 'Y',
-    C5: 'A203-未通过-15:40',
-    C6: 'A203-未通过-15:40',
-    C7: 'A203-未通过-15:40',
-    C8: 'A203-未通过-15:40',
-    C9: 'A203-未通过-15:40',
-    C10: 'A203-未通过-15:40',
-    C11: 'A203-未通过-15:40',
-    C12: 'A203-未通过-15:40',
-    C13: 'A203-未通过-15:40',
-    C14: 'A203-未通过-15:40',
-    C15: 'A203-未通过-15:40',
-    C16: 'A203-未通过-15:40',
-  })),
-  ArrivalGoodsFlight: Array.from({ length: 3 }, () => ({
-    C0: 'CA1001',
-    C1: '2022/9/10',
-    C2: 'SZX-11:35',
-    C3: 'PEK-14:35',
-    C4: '机下交接',
-    C5: 'A03',
-    C6: 'A区03闸口',
-    C7: '2022/09/10 07:10',
-    C8: '通过',
-    C9: '人工扫描',
-    C10: '56',
-    C11: '张伯伦',
-    C12: 'B12',
-    C13: '货站B12闸口',
-    C14: 'DOU2329U2',
-  })),
-  InternationalDepartureFlightContainer: Array.from({ length: 2 }, () => ({
-    C0: 'DOU29800001',
-    C1: '5',
-    C2: '50',
-    C3: 'C24  11:01',
-    C4: 'F24  12:05',
-    C5: 'D32  11:25',
-    C6: 'E24  11:40',
-    C7: 'F24  12:01',
-    C8: 'G32  12:25',
-  })),
-  InternationalDepartureFlightWaybill: Array.from({ length: 3 }, () => ({
-    C0: '32535234445',
-    C1: '国际普货',
-    C2: '5',
-    C3: '手机、充电器',
-    C4: '特',
-    C5: '5',
-    C6: '2',
-    C7: '2',
-    C8: '待运区',
-    C9: 'A13',
-    C10: '通过',
-    C11: '2022/9/10 10:01',
-    C12: 'ZH5466',
-    C13: '2022/9/10 16:01',
-    C14: '3',
-  })),
-  InternationalDepartureWaybillGoods: Array.from({ length: 4 }, () => ({
-    C0: 'CA1001',
-    C1: 'DOU2424U2',
-    C2: '56888829',
-    C3: 'Y',
-    C4: 'Y',
-    C5: 'A203-未通过-15:40',
-    C6: 'A203-未通过-15:40',
-    C7: 'A203-未通过-15:40',
-    C8: 'A203-未通过-15:40',
-    C9: 'A203-未通过-15:40',
-    C10: 'A203-未通过-15:40',
-    C11: 'A203-未通过-15:40',
-    C12: 'A203-未通过-15:40',
-    C13: 'A203-未通过-15:40',
-    C14: 'A203-未通过-15:40',
-    C15: 'A203-未通过-15:40',
-  })),
-  InternationalDepartureGoodsFlight: Array.from({ length: 3 }, () => ({
-    C0: 'CA1001',
-    C1: '2022/9/10',
-    C2: 'SZX-11:35',
-    C3: 'PEK-14:35',
-    C4: '机下交接',
-    C5: 'A03',
-    C6: 'A区03闸口',
-    C7: '2022/09/10 07:10',
-    C8: '通过',
-    C9: '人工扫描',
-    C10: '56',
-    C11: '张伯伦',
-    C12: 'B12',
-    C13: '货站B12闸口',
-    C14: 'DOU2329U2',
-  })),
-  InternationalArrivalFlightWaybill: Array.from({ length: 3 }, () => ({
-    C0: '32535234445',
-    C1: '国际普货',
-    C2: '手机、充电器',
-    C3: '特',
-    C4: '5',
-    C5: '2',
-    C6: '理货',
-    C7: 'A13',
-    C8: '通过',
-    C9: '2022/9/10 10:01',
-    C10: 'ZH5466',
-    C11: '2022/9/10 16:01',
-    C12: '3',
-  })),
-  InternationalArrivalWaybillGoods: Array.from({ length: 4 }, () => ({
-    C0: 'CA1001',
-    C1: '56888829',
-    C2: 'Y',
-    C3: 'Y',
-    C4: 'Y',
-    C5: 'A203-未通过-15:40',
-    C6: 'A203-未通过-15:40',
-    C7: 'A203-未通过-15:40',
-    C8: 'A203-未通过-15:40',
-    C9: 'A203-未通过-15:40',
-    C10: 'A203-未通过-15:40',
-    C11: 'A203-未通过-15:40',
-  })),
-  InternationalArrivalGoodsFlight: Array.from({ length: 3 }, () => ({
-    C0: 'CA1001',
-    C1: '2022/9/10',
-    C2: 'SZX-11:35',
-    C3: 'PEK-14:35',
-    C4: '机下交接',
-    C5: 'A03',
-    C6: 'A区03闸口',
-    C7: '2022/09/10 07:10',
-    C8: '通过',
-    C9: '人工扫描',
-    C10: '56',
-    C11: '张伯伦',
-    C12: 'B12',
-    C13: '货站B12闸口',
-  })),
-}
 
 export function useTable(tableName: string, dataContent?: CommonValue[]) {
   const tableColumns = ref<CommonTableColumn[]>([])
@@ -907,15 +730,11 @@ export function useTable(tableName: string, dataContent?: CommonValue[]) {
       console.error(error)
     }
   }
-  const getSimulateTableData = () => {
-    tableData.value = simulateTableDataMap[tableName]
-  }
 
   onMounted(() => {
     if (tableColumnsMap[tableName]) {
       getTableColumns()
       // getTableData()
-      // getSimulateTableData()
     }
   })
 

src/views/realTime/hooks/useTableCellClick.ts

@@ -1,5 +1,5 @@
-import { ElMessage } from 'element-plus'
-import type { CellSlotProps } from '../type'
+// import { ElMessage } from 'element-plus'
+import type { CellRenderProps } from '../type'
 
 export function useTableCellClick(tableName?: string) {
   const router = useRouter()
@@ -52,7 +52,7 @@ export function useTableCellClick(tableName?: string) {
     //   }
     // }
   }
-  const cellClickHandlerV2 = ({ column, rowData }: CellSlotProps) => {
+  const cellClickHandlerV2 = ({ column, rowData }: CellRenderProps) => {
     if (tableName?.includes('Airport')) {
       switch (column.columnName) {
         case 'flightNO':
@@ -60,7 +60,7 @@ export function useTableCellClick(tableName?: string) {
             path: `${route.path.split('/').slice(0, -1).join('/')}/flight`,
             query: {
               flightDate: rowData.flightDate,
-              flightNO: rowData.IATACode + rowData.flightNO,
+              flightNO: String(rowData.IATACode) + String(rowData.flightNO),
             },
           })
           break
@@ -74,6 +74,6 @@ export function useTableCellClick(tableName?: string) {
     cellClickHandler,
     cellClickHandlerV2,
     dialogFlag,
-    containerNO
+    containerNO,
   }
 }

src/views/realTime/hooks/useTrackData.ts

@@ -106,15 +106,83 @@ const trackNodesMap = {
       nodeCode: 'FSUDLV',
     },
   ],
-  internationalDeparture: [],
-  internationalArrival: [],
+  internationalDeparture: [
+    {
+      name: '入园',
+      nodeCode: 'EPORTREL',
+    },
+    {
+      name: '海关',
+      nodeCode: 'MTREL',
+    },
+    {
+      name: '运抵',
+      nodeCode: 'FOH',
+    },
+    {
+      name: '安检',
+      nodeCode: 'REH',
+    },
+    {
+      name: '收运核单',
+      nodeCode: 'RCS',
+    },
+    {
+      name: '理货',
+      nodeCode: '板箱清单XML',
+    },
+    {
+      name: '拉下',
+      nodeCode: 'CARGOS_OFFLOAD',
+    },
+    {
+      name: '待运区',
+      nodeCode: 'WAT_LOC',
+    },
+    {
+      name: '货站交接',
+      nodeCode: 'CARGOS_HANDOVER_STATUS_02',
+    },
+    {
+      name: '机下交接',
+      nodeCode: '出港货邮',
+    },
+    {
+      name: '装机',
+      nodeCode: '装载完成',
+    },
+  ],
+  internationalArrival: [
+    {
+      name: '卸机',
+      nodeCode: 'FFM',
+    },
+    {
+      name: '机下交接',
+      nodeCode: 'CARGOS_HANDOVER_STATUS_01',
+    },
+    {
+      name: '货站交接',
+      nodeCode: 'CARGOS_HANDOVER_STATUS_99',
+    },
+    {
+      name: '理货',
+      nodeCode: 'RCF报',
+    },
+    {
+      name: '海关放行',
+      nodeCode: 'MTREL',
+    },
+    {
+      name: '出库',
+      nodeCode: 'DLV报',
+    },
+  ],
 }
 
 export function useTrackData(name: string, trackData: MaybeRef<CommonData[]>) {
   const isInternational = name.includes('International')
-  
-  // const defaultTrackAirlines = []
-  
+
   const trackAirlines = ref<TrackAirline[]>([])
   const getTrackAirlines = () => {
     const airlines = unref(trackData).reduce(

src/views/realTime/type.d.ts

@@ -1,27 +1,24 @@
 import type { Ref, CSSProperties } from 'vue'
 import { ElTable } from 'element-plus'
-import { CommonTableColumn, MaybeRef } from '~/common'
+import { CommonData, CommonTableColumn, CommonValue, MaybeRef } from '~/common'
 
-interface tableColumnGroup {
+type tableColumnGroup = {
   title: string
   columns: CommonTableColumn[]
 }
-type CellSlotProps = {
+type HeaderRenderProps = {
   column: CommonTableColumn
   columns: CommonTableColumn[]
   columnIndex: number
-  depth: number
-  style: CSSProperties
-  rowData: any
+  headerIndex: number
+}
+type CellRenderProps = {
+  cellData: CommonValue
+  column: CommonTableColumn
+  columns: CommonTableColumn[]
+  columnIndex: number
+  rowData: CommonData
   rowIndex: number
-  isScrolling: boolean
-  expandIconProps?:
-    | {
-        rowData: any
-        rowIndex: number
-        onExpand: (expand: boolean) => void
-      }
-    | undefined
 }
 type ExportOptions = {
   table: MaybeRef<InstanceType<typeof ElTable>>
@@ -30,3 +27,9 @@ type ExportOptions = {
   headerRowNumber?: number
 }
 type ExportHandler = (option: ExportOptions) => void
+type ScrollParams = {
+  xAxisScrollDir: 'forward' | 'backward'
+  scrollLeft: number
+  yAxisScrollDir: 'forward' | 'backward'
+  scrollTop: number
+}