模拟数据修改

src/components/SimpleTable/index.vue

@@ -174,7 +174,7 @@ const props = withDefaults(
     columns: (CommonTableColumn & TableColumnProps<CommonData>)[]
   }>(),
   {
-    size: 'small',
+    size: 'default',
     height: '100%',
     maxHeight: '100%',
     stripe: true,

src/components/steps/index.vue

@@ -5,14 +5,13 @@
         <span class="icon"></span>
       </div>
       <div v-else class="node-status-default"></div>
-      <div
-        v-if="step.flag && steps.length != index + 1"
-        class="node-status-success-line"
-      ></div>
-      <div
-        v-if="!step.flag && steps.length != index + 1"
-        class="node-status-default-line"
-      ></div>
+      <template v-if="index < steps.length - 1">
+        <div
+          v-if="step.flag && steps[index + 1] && steps[index + 1].flag"
+          class="node-status-success-line"
+        ></div>
+        <div v-else class="node-status-default-line"></div>
+      </template>
       <div
         :style="{
           width: step.labelWidth ? step.labelWidth + 'px' : 60 + 'px',

src/views/realTime/arrival/goods/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <GoodsView />
+  <GoodsView name="ArrivalGoods" />
 </template>
 
 <script setup lang="ts">

src/views/realTime/arrival/waybill/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <WaybillView />
+  <WaybillView name="ArrivalWaybill" />
 </template>
 
 <script setup lang="ts">

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

@@ -114,7 +114,7 @@ const dataContent = [
 
 const airLine = ref('SZX - CA4120 - NKG')
 const flightInfo = reactive<CommonData>({
-  C0: '深圳机场',
+  C0: props.name.includes('Departure') ? '深圳机场' : '南京机场',
   C1: '2021-12-24',
   C2: '19 : 30 : 25',
   C3: '012',
@@ -124,7 +124,7 @@ const flightInfo = reactive<CommonData>({
   C7: '0',
   C8: '0',
   C9: '0',
-  C10: '南京机场',
+  C10: props.name.includes('Departure') ? '南京机场' : '深圳机场',
   C11: '2021-12-24',
   C12: '22 : 25 : 25',
 })
@@ -168,18 +168,15 @@ const {
 
 const UTCFlag = ref(true)
 
-const refreshHandler = () => {}
+const refreshHandler = () => {
+  ElMessage.info('开发中')
+}
 
 const {
   filteredColumns: filteredWaybillColumns,
   columnChecked,
 } = useTableColumnSet(waybillTableColumns)
 
-//点击刷新按钮
-const refresh = data => {
-  console.log(data)
-}
-
 const waybillTableRef = ref<InstanceType<typeof SimpleTable> | null>(null)
 const { exportToExcel } = useTableExport()
 //点击下载按钮
@@ -223,7 +220,7 @@ const { cellClickHandler: flightWaybillCellClickHandler } = useTableCellClick(
     height: 345px;
     display: flex;
     .flight-info-wrapper {
-      flex: 0 1 1040px;
+      flex: 1 1 1040px;
       height: 100%;
       background: #410425;
       box-sizing: border-box;

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

@@ -51,7 +51,11 @@
                 <span v-if="index === 0" class="title-span"
                   >航班号：{{ trackAirline.flightNO }}</span
                 >
-                <span class="title-span">出港：{{ trackAirport.airport }}</span>
+                <span class="title-span"
+                  >{{ trackAirport.isDeparture ? '出港' : '进港' }}：{{
+                    trackAirport.airport
+                  }}</span
+                >
                 <span class="title-span"
                   >日期：{{ trackAirline.flightDate }}</span
                 >
@@ -96,7 +100,7 @@ import { ElMessage } from 'element-plus'
 const props = defineProps({
   name: {
     type: String,
-    // required: true,
+    required: true,
   },
 })
 
@@ -182,7 +186,7 @@ const trackDataContentList = computed(() =>
   }))
 )
 const { trackAirlines, trackBoxStyle } = useTrackData(
-  'goodsTrack',
+  props.name,
   trackDataContentList
 )
 
@@ -283,7 +287,7 @@ const { cellClickHandler } = useTableCellClick('goodsFlight')
         font-weight: bold;
         color: #101116;
         margin-bottom: 10px;
-        &-span {
+        &-span:not(:last-of-type) {
           margin-right: 50px;
         }
       }

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

@@ -51,7 +51,11 @@
                 <span v-if="index === 0" class="title-span"
                   >航班号：{{ trackAirline.flightNO }}</span
                 >
-                <span class="title-span">出港：{{ trackAirport.airport }}</span>
+                <span class="title-span"
+                  >{{ trackAirport.isDeparture ? '出港' : '进港' }}：{{
+                    trackAirport.airport
+                  }}</span
+                >
                 <span class="title-span"
                   >日期：{{ trackAirline.flightDate }}</span
                 >
@@ -96,7 +100,7 @@ import { ElMessage } from 'element-plus'
 const props = defineProps({
   name: {
     type: String,
-    // required: true,
+    required: true,
   },
 })
 
@@ -149,7 +153,7 @@ const waybillInfo = reactive<CommonData>({
   C3: '电路板、手机外壳',
   C4: '特',
   C5: 'SZX',
-  C6: 'CTU',
+  C6: 'NKG',
   C7: '7件',
   C8: '82KG',
 })
@@ -218,7 +222,7 @@ const trackDataContentList = computed(() =>
   }))
 )
 const { trackAirlines, trackBoxStyle } = useTrackData(
-  'waybillTrack',
+  props.name,
   trackDataContentList
 )
 
@@ -322,7 +326,7 @@ const { cellClickHandler } = useTableCellClick('waybillGoods')
         font-weight: bold;
         color: #101116;
         margin-bottom: 10px;
-        &-span {
+        &-span:not(:last-of-type) {
           margin-right: 50px;
         }
       }

src/views/realTime/departure/goods/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <GoodsView />
+  <GoodsView name="DepartureGoods" />
 </template>
 
 <script setup lang="ts">

src/views/realTime/departure/waybill/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <WaybillView/>
+  <WaybillView name="DepartureWaybill" />
 </template>
 
 <script setup lang="ts">

src/views/realTime/hooks/useTableCellClick.ts

@@ -1,3 +1,4 @@
+import { ElMessage } from 'element-plus'
 import type { CellSlotProps } from '../type'
 
 export default function useTableCellClick(tableName?: string) {
@@ -15,10 +16,19 @@ export default function useTableCellClick(tableName?: string) {
               },
             })
             break
+          case 'C1':
+            ElMessage.info('开发中')
+            break
           default:
             break
         }
         break
+      case 'flightContainer':
+        switch (column.property) {
+          case 'C0':
+            ElMessage.info('开发中')
+        }
+        break
       case 'waybillGoods':
         switch (column.property) {
           case 'C2':

src/views/realTime/hooks/useTableStyle.ts

@@ -43,7 +43,7 @@ export default function useTableStyle(tableName?: string) {
         }
         break
       case 'flightContainer':
-        if (['C1'].includes(column.property)) {
+        if (['C0'].includes(column.property)) {
           classes.push('cell-click')
         }
         break

src/views/realTime/hooks/useTrackData.ts

@@ -47,31 +47,31 @@ const simulateDepartureTrackNodes = [
   },
   {
     id: 3,
-    name: '安检',
+    name: '理货',
     flag: true,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
   {
     id: 4,
-    name: '安检',
+    name: '待运区',
     flag: true,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
   {
     id: 5,
-    name: '安检',
+    name: '货站交接',
     flag: true,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
   {
     id: 6,
-    name: '安检',
+    name: '机下交接',
     flag: false,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
   {
     id: 7,
-    name: '安检安检',
+    name: '装机',
     flag: false,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
@@ -85,19 +85,19 @@ const simulateArrivalTrackNodes = [
   },
   {
     id: 2,
-    name: '安检',
+    name: '机下交接',
     flag: true,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
   {
     id: 3,
-    name: '安检',
+    name: '货站交接',
     flag: true,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
   {
     id: 4,
-    name: '安检',
+    name: '提取',
     flag: false,
     descriptions: ['A32', '534件', '通过', '10:25'],
   },
@@ -117,7 +117,9 @@ export default function useTrackData(
         ) => {
           const airlines = await pre
           const trackNodeList = await getTrackData(
-            DATACONTENT_ID[trackName],
+            DATACONTENT_ID[
+              trackName.endsWith('Waybill') ? 'waybillTrack' : 'goodsTrack'
+            ],
             dataContent
           )
           const trackAirport = {
@@ -178,15 +180,26 @@ export default function useTrackData(
   // })
 
   const getSimulateTrackData = () => {
-    const length = trackName === 'waybillTrack' ? 2 : 1
+    const length = trackName.endsWith('Waybill') ? 2 : 1
     trackAirlines.value = Array.from({ length }).map((_, index) => ({
       flightNO: index < 1 ? 'CA1001' : 'CA1003',
       flightDate: '2022/09/10',
       airports: Array.from({ length: 2 }).map((_, i) => ({
         airport: i < 1 ? '深圳机场' : '南京机场',
-        isDeparture: i < 1 ? 1 : 0,
-        trackSteps:
-          i < 1 ? simulateDepartureTrackNodes : simulateArrivalTrackNodes,
+        isDeparture: trackName.includes('Departure')
+          ? i < 1
+            ? 1
+            : 0
+          : i < 1
+          ? 0
+          : 1,
+        trackSteps: trackName.includes('Departure')
+          ? i < 1
+            ? simulateDepartureTrackNodes
+            : simulateArrivalTrackNodes
+          : i < 1
+          ? simulateArrivalTrackNodes
+          : simulateDepartureTrackNodes,
       })),
     }))
   }

src/views/realTime/internationalArrival/goods/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <GoodsView />
+  <GoodsView name="InternationalArrivalGoods" />
 </template>
 
 <script setup lang="ts">

src/views/realTime/internationalArrival/waybill/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <WaybillView/>
+  <WaybillView name="InternationalArrivalWaybill" />
 </template>
 
 <script setup lang="ts">

src/views/realTime/internationalDeparture/goods/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <GoodsView />
+  <GoodsView name="InternationalDepartureGoods" />
 </template>
 
 <script setup lang="ts">

src/views/realTime/internationalDeparture/waybill/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <WaybillView />
+  <WaybillView name="InternationalDepartureWaybill" />
 </template>
 
 <script setup lang="ts">