综合可视化-航站视图修改

public/demo.js

@@ -146,6 +146,12 @@ const DATACONTENT_ID = {
   containerHistory: 18026,
   containerBaggage: 18027,
 
+  /***-----综合可视化------***/
+  departureAirport: 1803446, // 国内出港航站
+  internationalDepartureAirport: 1803447, // 国际出港航站
+  arrivalAirport: 1803448, // 国内进港航站
+  internationalArrivalAirport: 1803449, // 国际进港航站
+
   /***-----统计分析------***/
   stOrderId: 18012,
   stOrderChartId: 18013,

src/components/TableHeaderCell/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="table-header-cell el-table-v2__header-cell-text">
     <template v-if="!filterable || filterStyle === 'arrow'">
-      <span>{{ label }}</span>
+      {{ label }}
     </template>
     <template v-if="filterable">
       <el-popover

src/utils/axiosReq.ts

@@ -75,7 +75,7 @@ service.interceptors.response.use(
           router.push(`/login`)
         })
       }
-      return Promise.reject(new Error(res.message || 'Error'))
+      return Promise.reject((res.message || res.returnData?.message || 'Error'))
     } else {
       return res
     }

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

@@ -22,8 +22,8 @@
           >
             <el-checkbox
               v-for="column in columnGroup.columns"
-              :key="column.dataKey"
-              :label="column.dataKey"
+              :key="column.columnName"
+              :label="column.columnName"
               >{{ column.title.replace('\n', '') }}</el-checkbox
             >
           </el-checkbox-group>
@@ -32,9 +32,9 @@
       <template v-else>
         <el-checkbox-group v-model="tempKeys" size="large">
           <el-checkbox
-            v-for="column in tableColumns"
-            :key="column.dataKey"
-            :label="column.dataKey"
+            v-for="column in needShowColumns"
+            :key="column.columnName"
+            :label="column.columnName"
           >
             {{ column.title?.replace('\n', '') }}
           </el-checkbox>
@@ -45,21 +45,27 @@
 </template>
 
 <script setup lang="ts">
-import type { KeyType, TableColumn, TableColumnInGroup, tableColumnGroup } from '../../type'
 import { Tools } from '@element-plus/icons-vue'
 import Dialog from '@/components/dialog/index.vue'
+import { PropType } from 'vue'
+import { CommonTableColumn } from '~/common'
+import { tableColumnGroup } from '../../type'
 
 const props = defineProps({
   tableColumns: {
-    type: Array<TableColumnInGroup | TableColumn>,
+    type: Array as PropType<CommonTableColumn[]>,
     required: true,
-  }
+  },
 })
 
+const needShowColumns = computed(() =>
+  props.tableColumns.filter(column => column.needShow)
+)
+
 const emits = defineEmits(['checkedSubmit'])
 
 const inGroup = computed(() => {
-  return 'groupTitle' in props.tableColumns[0]
+  return 'groupName' in needShowColumns.value[0]
 })
 
 const simpleClone = (obj: any) => JSON.parse(JSON.stringify(obj))
@@ -82,14 +88,16 @@ const submitHandler = () => {
 
 const columnGroups = computed(() => {
   if (inGroup.value) {
-    return (props.tableColumns as TableColumnInGroup[]).reduce((pre: tableColumnGroup[], curr) => {
-      const theGroup = pre.find(columnGroup => columnGroup.title === curr.groupTitle)
+    return needShowColumns.value.reduce((pre: tableColumnGroup[], curr) => {
+      const theGroup = pre.find(
+        columnGroup => columnGroup.title === curr.groupName
+      )
       if (theGroup) {
         theGroup.columns.push(curr)
       } else {
         pre.push({
-          title: curr.groupTitle,
-          columns: [curr]
+          title: curr.groupName,
+          columns: [curr],
         })
       }
       return pre
@@ -103,28 +111,33 @@ const columnGroups = computed(() => {
 const checkedGroups = ref<any>({})
 const tempGroups = ref<any>({})
 //不分组的选择框
-const checkedKeys = ref<KeyType[]>([])
-const tempKeys = ref<KeyType[]>([])
+const checkedKeys = ref<string[]>([])
+const tempKeys = ref<string[]>([])
 
-const checkedColumnKeys = computed<KeyType[]>(() => {
+const checkedColumnKeys = computed<string[]>(() => {
   if (inGroup.value) {
-    return Object.getOwnPropertyNames(checkedGroups.value).map(prop => checkedGroups.value[prop]).flat()
+    return Object.getOwnPropertyNames(checkedGroups.value)
+      .map(prop => checkedGroups.value[prop])
+      .flat()
   } else {
     return checkedKeys.value
   }
 })
-watch(() => props.tableColumns, columns => {
+watch(needShowColumns, columns => {
   if (inGroup.value) {
     checkedGroups.value = {}
-    columns.forEach(({ dataKey, groupTitle }) => {
-      if (checkedGroups.value[groupTitle] && checkedGroups.value[groupTitle] instanceof Array) {
-        checkedGroups.value[groupTitle].push(dataKey)
+    columns.forEach(({ columnName, groupName }) => {
+      if (
+        checkedGroups.value[groupName] &&
+        checkedGroups.value[groupName] instanceof Array
+      ) {
+        checkedGroups.value[groupName].push(columnName)
       } else {
-        checkedGroups.value[groupTitle] = [dataKey]
+        checkedGroups.value[groupName] = [columnName]
       }
     })
   } else {
-    checkedKeys.value = columns.map(({ dataKey }) => dataKey)
+    checkedKeys.value = columns.map(({ columnName }) => columnName)
   }
   emits('checkedSubmit', checkedColumnKeys.value)
 })

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

@@ -70,8 +70,8 @@
 </template>
 
 <script setup lang="ts">
+import { SelectOption } from '~/common'
 import { parseTime } from '@/utils/validate'
-import type { selectOptions } from '../../type'
 
 const props = defineProps({
   international: {
@@ -85,17 +85,22 @@ const emit = defineEmits(['formDataChange'])
 const formData = reactive({
   startDate: parseTime(new Date(), '{y}-{m}-{d} {h}:{i}'),
   endDate: parseTime(new Date(), '{y}-{m}-{d} {h}:{i}'),
-  flightStatus: '',
-  flightWarning: '',
-  waybillType: '',
+  flightStatus: null,
+  flightWarning: null,
+  waybillType: null,
 })
 watchEffect(() => {
+  Object.keys(formData).forEach(key => {
+    if (formData[key] === '') {
+      formData[key] = null
+    }
+  })
   emit('formDataChange', formData)
 })
 
-const flightStatusOptions = ref<selectOptions>([])
-const flightWarningOptions = ref<selectOptions>([])
-const waybillTypeOptions = ref<selectOptions>([])
+const flightStatusOptions = ref<SelectOption[]>([])
+const flightWarningOptions = ref<SelectOption[]>([])
+const waybillTypeOptions = ref<SelectOption[]>([])
 const getFlightStatusOptions = async () => {}
 const getFlightWarningOptions = async () => {}
 const getWaybillTypeOptions = async () => {}
@@ -130,4 +135,3 @@ onMounted(() => {
   }
 }
 </style>
-

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

@@ -35,7 +35,6 @@
             :height="height"
             :footer-height="60"
             :row-class="rowClass"
-            fixed
           >
             <template #header-cell="slot: HeaderCellSlotProps">
               <TableHeaderCell
@@ -49,7 +48,7 @@
             <template #cell="slot: CellSlotProps">
               <div :class="cellClass(slot)" @click="cellClickHandler(slot)">
                 <span class="cell-text">
-                  {{ slot.rowData[slot.column.dataKey] }}
+                  {{ slot.rowData[slot.column.columnName] }}
                 </span>
                 <div class="cell-background" />
               </div>
@@ -78,7 +77,7 @@
 </template>
 <script lang="ts" setup>
 import { PropType } from 'vue'
-import type { StationFormData, CellSlotProps } from '../../type'
+import type { CellSlotProps } from '../../type'
 import StationForm from '../../components/StationForm/index.vue'
 import ColumnSet from '../../components/ColumnSet/index.vue'
 import CountBox from '../../components/CountBox/index.vue'
@@ -90,7 +89,7 @@ import useTableStyle from '../../hooks/useTableStyle'
 import useTableCellClick from '../../hooks/useTableCellClick'
 import useTableFilter from '../../hooks/useTableFilter'
 import { HeaderCellSlotProps } from 'element-plus'
-import { Query } from '@/api/dataIntegration'
+import { CommonData } from '~/common'
 
 type StationViewName =
   | 'departure'
@@ -110,17 +109,9 @@ const international = computed(() =>
     props.stationViewName
   )
 )
-const formData: StationFormData = {
-  startDate: '',
-  endDate: '',
-  flightStatus: '',
-  flightWarning: '',
-  waybillType: '',
-}
-const formDataChangeHandler = (data: StationFormData) => {
-  Object.keys(data).forEach(key => {
-    formData[key] = data[key]
-  })
+const formData = reactive<CommonData>({})
+const formDataChangeHandler = (data: CommonData) => {
+  Object.assign(formData, data)
 }
 
 const goodsCountFlag = ref(true)
@@ -128,27 +119,20 @@ const UTCFlag = ref(true)
 
 const { tableColumns, tableData } = useTableData(
   props.stationViewName,
-  formData
+  formData,
+  international
 )
 const { columnChecked, filteredColumns } = useTableColumnSet(tableColumns)
 const { rowClass, cellClass } = useTableStyle()
 
-const tableDataCount = reactive({
-  waybillCount: 0,
-  goodsCount: 0,
-  flightCount: 0,
-  freightFlightCount: 0,
-  loadCount: 0,
-  takeOffCount: 0,
-})
-watch(tableData, records => {
-  tableDataCount.waybillCount = records.length
-  tableDataCount.goodsCount = records.length
-  tableDataCount.flightCount = records.length
-  tableDataCount.freightFlightCount = records.length
-  tableDataCount.loadCount = records.length
-  tableDataCount.takeOffCount = records.length
-})
+const tableDataCount = computed(() => ({
+  waybillCount: tableData.value.length,
+  goodsCount: tableData.value.length,
+  flightCount: tableData.value.length,
+  freightFlightCount: tableData.value.length,
+  loadCount: tableData.value.length,
+  takeOffCount: tableData.value.length,
+}))
 
 const { cellClickHandler } = useTableCellClick()
 

src/views/realTime/hooks/useTableCellClick.ts

@@ -4,7 +4,7 @@ export default function useTableCellClick() {
   const router = useRouter()
   const route = useRoute()
   const cellClickHandler = ({ column, rowData }: CellSlotProps) => {
-    switch (column.dataKey) {
+    switch (column.columnName) {
       case 'flightNO':
         router.push({
           path: `${route.path.split('/').slice(0, -1).join('/')}/flight`,

src/views/realTime/hooks/useTableColumnSet.ts

@@ -1,17 +1,13 @@
-import type {
-  KeyType,
-  TableColumn,
-  TableColumnInGroup,
-} from '../type'
 import { Ref } from 'vue'
+import { CommonTableColumn } from '~/common'
 
 export default function useTableColumnSet(
-  tableColumns: Ref<TableColumnInGroup[] | TableColumn[]>
+  tableColumns: Ref<CommonTableColumn[]>
 ) {
-  const filterColumnKeys = ref<KeyType[]>([])
+  const filterColumnKeys = ref<string[]>([])
   const filteredColumns = computed(() =>
-    tableColumns.value.filter(({ dataKey }) =>
-      filterColumnKeys.value.includes(dataKey)
+    tableColumns.value.filter(({ columnName }) =>
+      filterColumnKeys.value.includes(columnName)
     )
   )
   const columnChecked = (checkedColumnKeys: string[]) => {

src/views/realTime/hooks/useTableData.ts

@@ -1,589 +1,57 @@
-import type {
-  KeyType,
-  TableColumn,
-  TableColumnInGroup,
-  StationFormData,
-} from '../type'
+import { Ref } from 'vue'
+import { Query } from '@/api/webApi'
+import { CommonData, CommonTableColumn } from '~/common'
 
-type TableColumnsGroup = {
-  groupTitle: string
-  children: {
-    key: KeyType
-    title: string
-    width?: number
-    headerClass?: string
-  }[]
-}
-enum Alignment {
-  LEFT = 'left',
-  CENTER = 'center',
-  RIGHT = 'right',
-}
 type TableDataSource =
   | 'departure'
   | 'arrival'
   | 'internationalDeparture'
   | 'internationalArrival'
-  | 'test'
 
 const headerClassReflect = ['bg-yellow', 'bg-green', 'bg-cyan']
-
-const departureColumnGroups = [
-  {
-    groupTitle: '航班相关',
-    children: [
-      {
-        key: 'flightNO',
-        title: '航班号',
-      },
-      {
-        key: 'flightDate',
-        title: '执飞日期',
-      },
-      {
-        key: 'takeOffTime',
-        title: '起飞时间',
-      },
-      {
-        key: 'desitination',
-        title: '目的站',
-      },
-      {
-        key: 'gate',
-        title: '停机位',
-      },
-      {
-        key: 'preFlightNO',
-        title: '前序航班',
-      },
-      {
-        key: 'landingTime',
-        title: '实际降落\n时间',
-      },
-    ],
-  },
-  {
-    groupTitle: '货站相关',
-    children: [
-      {
-        key: 'special',
-        title: '特货信息',
-      },
-      {
-        key: 'projectLoad',
-        title: '预计装载数\n(运单/件)',
-        width: 100,
-      },
-      {
-        key: 'transferIn',
-        title: '中转进\n(运单/件)',
-        width: 100,
-      },
-      {
-        key: 'cancel',
-        title: '退运\n(板卡/件)',
-        width: 100,
-      },
-    ],
-  },
-  {
-    groupTitle: '地服相关',
-    children: [
-      {
-        key: 'receive',
-        title: '收运核单\n(运单/件/重量)',
-        width: 140,
-      },
-      {
-        key: 'check',
-        title: '查验\n(拒运/查验)',
-        width: 120,
-      },
-      {
-        key: 'security',
-        title: '安检\n(运单/件)',
-        width: 100,
-      },
-      {
-        key: 'add',
-        title: '加货\n(运单/板卡/件/重量)',
-        width: 160,
-      },
-      {
-        key: 'wait',
-        title: '待运区\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'stowage',
-        title: '配载\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'handOverTime',
-        title: '计划交接\n时间',
-      },
-      {
-        key: 'stationHandOver',
-        title: '货站交接\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'recheck',
-        title: '运输前复核\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'flightHandOver',
-        title: '机下交接\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'load',
-        title: '装机\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'goodsRegister',
-        title: '拉货登记\n(板卡/件)',
-        width: 100,
-      },
-      {
-        key: 'pullBack',
-        title: '拉回确认\n(板卡/件)',
-        width: 100,
-      },
-    ],
-  },
-]
-const arrivalColumnGroups = [
-  {
-    groupTitle: '航班相关',
-    children: [
-      {
-        key: 'flightNO',
-        title: '航班号',
-      },
-      {
-        key: 'flightDate',
-        title: '执飞日期',
-        width: 100,
-      },
-      {
-        key: 'landingTime',
-        title: '降落时间',
-        width: 100,
-      },
-      {
-        key: 'desitination',
-        title: '目的站',
-        width: 100,
-      },
-      {
-        key: 'gate',
-        title: '停机位',
-      },
-    ],
-  },
-  {
-    groupTitle: '货站相关',
-    children: [
-      {
-        key: 'special',
-        title: '特货信息',
-        width: 100,
-      },
-      {
-        key: 'projectUnload',
-        title: '预计卸载数\n(运单/件)',
-        width: 100,
-      },
-      {
-        key: 'transferOut',
-        title: '中转出\n(运单/件)',
-        width: 100,
-      },
-      {
-        key: 'difference',
-        title: '收货差异\n(板卡/件)',
-        width: 100,
-      },
-    ],
-  },
-  {
-    groupTitle: '地服相关',
-    children: [
-      {
-        key: 'unload',
-        title: '卸机\n(板/箱/卡)',
-        width: 160,
-      },
-      {
-        key: 'flightHandOver',
-        title: '机下交接\n(板/箱/卡)',
-        width: 160,
-      },
-      {
-        key: 'stationHandOver',
-        title: '货站交接\n(板/箱/卡)',
-        width: 160,
-      },
-      {
-        key: 'settle',
-        title: '理货\n(板卡/运单/件/重量)',
-        width: 160,
-      },
-      {
-        key: 'outCargo',
-        title: '出库\n(批/运单/件)',
-        width: 160,
-      },
-    ],
-  },
-]
-const groupsObj = {
-  departure: departureColumnGroups,
-  arrival: arrivalColumnGroups,
-  internationalDeparture: departureColumnGroups,
-  internationalArrival: arrivalColumnGroups,
-}
-const tableDatas = {
-  departure: [
-    {
-      flightNO: 'ZH3423',
-      flightDate: '2022/09/10',
-      takeOffTime: '22/09/10 12:01',
-      desitination: '-NGK-PEK',
-      gate: '84',
-      preFlightNO: 'HU2451',
-      landingTime: '2022/09/10 11:01',
-      special: '锂2/冷1',
-      projectLoad: '365/536',
-      transferIn: '1/2',
-      cancel: '',
-      receive: '364/534/1254KG',
-      check: '0/7',
-      security: '364/534',
-      add: '8/365/536/1254KG',
-      wait: '8/536',
-      stowage: '8/536',
-      handOverTime: '11:45',
-      stationHandOver: '8/536',
-      recheck: '8/536',
-      flightHandOver: '8/536',
-      load: '8/536',
-      goodsRegister: '0/358/5',
-      pullBack: '0/5',
-    },
-    {
-      flightNO: 'CA1512',
-      flightDate: '2022/09/10',
-      takeOffTime: '22/09/10 12:01',
-      desitination: '-NGK-PEK',
-      gate: '84',
-      preFlightNO: 'HU2451',
-      landingTime: '2022/09/10 11:01',
-      special: '锂2/冷1',
-      projectLoad: '365/536',
-      transferIn: '1/2',
-      cancel: '',
-      receive: '364/534/1254KG',
-      check: '0/7',
-      security: '364/534',
-      add: '8/365/536/1254KG',
-      wait: '4/243',
-      stowage: '8/536',
-      handOverTime: '11:45',
-      stationHandOver: '8/536',
-      recheck: '8/536',
-      flightHandOver: '8/536',
-      load: '8/536',
-      goodsRegister: '0/358/5',
-      pullBack: '0/5',
-    },
-    {
-      flightNO: 'ZH3456',
-      flightDate: '2022/09/10',
-      takeOffTime: '22/09/10 12:01',
-      desitination: '-NGK-PEK',
-      gate: '84',
-      preFlightNO: 'HU2451',
-      landingTime: '2022/09/10 11:01',
-      special: '锂2/冷1',
-      projectLoad: '365/536',
-      transferIn: '1/2',
-      cancel: '',
-      receive: '364/534/1254KG',
-      check: '0/7',
-      security: '364/534',
-      add: '8/365/536/1254KG',
-      wait: '8/536',
-      stowage: '5/357',
-      handOverTime: '11:45',
-      stationHandOver: '8/536',
-      recheck: '8/536',
-      flightHandOver: '8/536',
-      load: '8/536',
-      goodsRegister: '0/358/5',
-      pullBack: '0/5',
-    },
-  ],
-  arrival: [
-    {
-      flightNO: 'ZH3423',
-      flightDate: '2022/09/10',
-      landingTime: '22/09/10 12:01',
-      desitination: 'NKG-PEK-',
-      gate: '84',
-      special: '锂2/冷1',
-      projectUnload: '363/543',
-      transferOut: '',
-      difference: '0/6',
-      unload: '8/8/8',
-      flightHandOver: '8/8/8',
-      stationHandOver: '8/8/8',
-      settle: '8/363/537/1254KG',
-      outCargo: '3/363/537',
-    },
-    {
-      flightNO: 'CA1512',
-      flightDate: '2022/09/10',
-      landingTime: '22/09/10 12:01',
-      desitination: 'NKG-PEK-',
-      gate: '84',
-      special: '锂2/冷1',
-      projectUnload: '363/543',
-      transferOut: '',
-      difference: '',
-      unload: '8/8/8',
-      flightHandOver: '8/8/8',
-      stationHandOver: '8/8/8',
-      settle: '8/363/537/1254KG',
-      outCargo: '3/363/537',
-    },
-    {
-      flightNO: 'ZH3456',
-      flightDate: '2022/09/10',
-      landingTime: '22/09/10 12:01',
-      desitination: 'NKG-PEK-',
-      gate: '84',
-      special: '锂2/冷1',
-      projectUnload: '363/543',
-      transferOut: '',
-      difference: '',
-      unload: '8/8/8',
-      flightHandOver: '8/8/8',
-      stationHandOver: '8/8/8',
-      settle: '8/363/537/1254KG',
-      outCargo: '3/363/537',
-    },
-  ],
-  internationalDeparture: [
-    {
-      flightNO: 'ZH3423',
-      flightDate: '2022/09/10',
-      takeOffTime: '22/09/10 12:01',
-      desitination: '-NGK-PEK',
-      gate: '84',
-      preFlightNO: 'HU2451',
-      landingTime: '2022/09/10 11:01',
-      special: '锂2/冷1',
-      projectLoad: '365/536',
-      transferIn: '1/2',
-      cancel: '',
-      receive: '364/534/1254KG',
-      check: '0/7',
-      security: '364/534',
-      add: '8/365/536/1254KG',
-      wait: '8/536',
-      stowage: '8/536',
-      handOverTime: '11:45',
-      stationHandOver: '8/536',
-      recheck: '8/536',
-      flightHandOver: '8/536',
-      load: '8/536',
-      goodsRegister: '0/358/5',
-      pullBack: '0/5',
-    },
-    {
-      flightNO: 'CA1512',
-      flightDate: '2022/09/10',
-      takeOffTime: '22/09/10 12:01',
-      desitination: '-NGK-PEK',
-      gate: '84',
-      preFlightNO: 'HU2451',
-      landingTime: '2022/09/10 11:01',
-      special: '锂2/冷1',
-      projectLoad: '365/536',
-      transferIn: '1/2',
-      cancel: '',
-      receive: '364/534/1254KG',
-      check: '0/7',
-      security: '364/534',
-      add: '8/365/536/1254KG',
-      wait: '4/243',
-      stowage: '8/536',
-      handOverTime: '11:45',
-      stationHandOver: '8/536',
-      recheck: '8/536',
-      flightHandOver: '8/536',
-      load: '8/536',
-      goodsRegister: '0/358/5',
-      pullBack: '0/5',
-    },
-    {
-      flightNO: 'ZH3456',
-      flightDate: '2022/09/10',
-      takeOffTime: '22/09/10 12:01',
-      desitination: '-NGK-PEK',
-      gate: '84',
-      preFlightNO: 'HU2451',
-      landingTime: '2022/09/10 11:01',
-      special: '锂2/冷1',
-      projectLoad: '365/536',
-      transferIn: '1/2',
-      cancel: '',
-      receive: '364/534/1254KG',
-      check: '0/7',
-      security: '364/534',
-      add: '8/365/536/1254KG',
-      wait: '8/536',
-      stowage: '5/357',
-      handOverTime: '11:45',
-      stationHandOver: '8/536',
-      recheck: '8/536',
-      flightHandOver: '8/536',
-      load: '8/536',
-      goodsRegister: '0/358/5',
-      pullBack: '0/5',
-    },
-  ],
-  internationalArrival: [
-    {
-      flightNO: 'ZH3423',
-      flightDate: '2022/09/10',
-      landingTime: '22/09/10 12:01',
-      desitination: 'NKG-PEK-',
-      gate: '84',
-      special: '锂2/冷1',
-      projectUnload: '363/543',
-      transferOut: '',
-      difference: '0/6',
-      unload: '8/8/8',
-      flightHandOver: '8/8/8',
-      stationHandOver: '8/8/8',
-      settle: '8/363/537/1254KG',
-      outCargo: '3/363/537',
-    },
-    {
-      flightNO: 'CA1512',
-      flightDate: '2022/09/10',
-      landingTime: '22/09/10 12:01',
-      desitination: 'NKG-PEK-',
-      gate: '84',
-      special: '锂2/冷1',
-      projectUnload: '363/543',
-      transferOut: '',
-      difference: '',
-      unload: '8/8/8',
-      flightHandOver: '8/8/8',
-      stationHandOver: '8/8/8',
-      settle: '8/363/537/1254KG',
-      outCargo: '3/363/537',
-    },
-    {
-      flightNO: 'ZH3456',
-      flightDate: '2022/09/10',
-      landingTime: '22/09/10 12:01',
-      desitination: 'NKG-PEK-',
-      gate: '84',
-      special: '锂2/冷1',
-      projectUnload: '363/543',
-      transferOut: '',
-      difference: '',
-      unload: '8/8/8',
-      flightHandOver: '8/8/8',
-      stationHandOver: '8/8/8',
-      settle: '8/363/537/1254KG',
-      outCargo: '3/363/537',
-    },
-  ],
-}
-
 export default function useTableData(
   tableDataSource: TableDataSource,
-  formData: StationFormData
+  formData: CommonData,
+  international: Ref<boolean>
 ) {
-  const tableColumns = ref<TableColumnInGroup[] | TableColumn[]>([])
-  const tableData = ref<{}[]>([])
-  const getTableData = () => {
-    if (tableDataSource === 'test') {
-      tableColumns.value = [
-        {
-          key: 'flightNO',
-          title: '航班号',
-        },
-        {
-          key: 'flightDate',
-          title: '执飞日期',
-        },
-        {
-          key: 'takeOffTime',
-          title: '起飞时间',
-        },
-        {
-          key: 'desitination',
-          title: '目的站',
-        },
-        {
-          key: 'gate',
-          title: '停机位',
-        },
-        {
-          key: 'preFlightNO',
-          title: '前序航班',
-        },
-        {
-          key: 'landingTime',
-          title: '实际降落\n时间',
-        },
-      ].map(({ key, title }) => ({
-        key,
-        dataKey: key,
-        title,
-        width: 80,
-        align: Alignment.CENTER,
+  const tableColumns = ref<CommonTableColumn[]>([])
+  const tableData = ref<CommonData[]>([])
+  const getTableData = async () => {
+    try {
+      const {
+        startDate,
+        endDate,
+        flightStatus,
+        flightWarning,
+        waybillType,
+      } = formData
+      const dataContent = [startDate, endDate, flightStatus, flightWarning]
+      if (international.value) {
+        dataContent.push(waybillType)
+      }
+      const {
+        code,
+        returnData: { columnSet, listValues },
+        message,
+      } = await Query({
+        id: DATACONTENT_ID[`${tableDataSource}Airport`],
+        dataContent,
+      })
+      if (Number(code) !== 0) {
+        throw new Error(message || '失败')
+      }
+      tableColumns.value = columnSet.map(column => ({
+        key: column.columnName,
+        dataKey: column.columnName,
+        title: column.columnLabel,
+        width: 200,
+        align: 'center',
+        ...column,
       }))
-      tableData.value = tableDatas.arrival
-      return
+      tableData.value = listValues
+    } catch (error) {
+      console.error(error)
     }
-
-    const groups: TableColumnsGroup[] = groupsObj[tableDataSource].map(
-      (group: TableColumnsGroup, groupIndex: number) => {
-        group.children.forEach(column => {
-          column.headerClass = headerClassReflect[groupIndex]
-        })
-        return group
-      }
-    )
-    tableColumns.value = groups.reduce(
-      (columns: TableColumnInGroup[], group) => {
-        columns.push(
-          ...group.children.map(({ key, title, width, headerClass }) => ({
-            key,
-            dataKey: key,
-            title,
-            width: width ?? 80,
-            headerClass,
-            align: Alignment.CENTER,
-            groupTitle: group.groupTitle,
-          }))
-        )
-        return columns
-      },
-      []
-    )
-    tableData.value = tableDatas[tableDataSource]
   }
   onMounted(() => {
     getTableData()

src/views/realTime/hooks/useTableFilter.ts

@@ -1,12 +1,13 @@
 import { Ref } from 'vue'
 import _ from 'lodash'
-import type { TableColumn, TableColumnInGroup } from '../type'
+import { CommonData, CommonTableColumn } from '~/common'
 
 export default function useTableFilter(
-  tableColumns: Ref<TableColumnInGroup[] | TableColumn[]>,
-  tableData: Ref<any[]>
+  tableColumns: Ref<CommonTableColumn[]>,
+  tableData: Ref<CommonData[]>
 ) {
   watch([tableColumns, tableData], ([columns, records]) => {
+    console.log(columns, records)
     const tempSets = {}
     columns.forEach(column => {
       if (column.needFilters) {
@@ -27,6 +28,7 @@ export default function useTableFilter(
         o => o.value
       )
     })
+    console.log(filterOptionMap)
   })
 
   const filterOptionMap = {}

src/views/realTime/hooks/useTableStyle.ts

@@ -1,11 +1,8 @@
-import type {
-  TableColumn,
-  TableColumnInGroup,
-  CellSlotProps
-} from '../type'
+import { CommonTableColumn } from '~/common'
+import type { CellSlotProps } from '../type'
 
 type RowClassGetter = (param: {
-  columns: TableColumn[] | TableColumnInGroup[]
+  columns: CommonTableColumn[]
   rowData: any
   rowIndex: number
 }) => string
@@ -34,13 +31,13 @@ export default function useTableStyle() {
     rowIndex,
   }) => {
     const classes: string[] = [defaultCellClass]
-    if (['4/243', '0/6'].includes(rowData[column.dataKey])) {
+    if (['4/243', '0/6'].includes(rowData[column.columnName])) {
       classes.push('cell-warning')
     }
-    if (['5/357'].includes(rowData[column.dataKey])) {
+    if (['5/357'].includes(rowData[column.columnName])) {
       classes.push('cell-error')
     }
-    if (['flightNO'].includes(column.dataKey)) {
+    if (['flightNO'].includes(column.columnName)) {
       classes.push('cell-click')
     }
     return classes.join(' ')

src/views/realTime/type.d.ts

@@ -1,28 +1,10 @@
 import type { Ref, CSSProperties } from 'vue'
 import { TableInstance, Column } from 'element-plus'
+import { CommonTableColumn } from '~/common'
 
-type StationFormData = {
-  startDate: string
-  endDate: string
-  flightStatus: string
-  flightWarning: string
-  waybillType: string
-}
-type selectOptions = {
-  label: string | number
-  value: string | number | boolean | object
-}[]
-type KeyType = string | number | symbol
-interface TableColumn<T = any> extends Column<T> {
-  dataKey: KeyType
-  title: string
-}
-interface TableColumnInGroup<T = any> extends TableColumn<T> {
-  groupTitle: string
-}
 interface tableColumnGroup {
   title: string
-  columns: TableColumnInGroup[]
+  columns: CommonTableColumn[]
 }
 type CellSlotProps = {
   column: TableColumn | TableColumnInGroup

src/views/systemSettings/components/AutoForm.vue

@@ -73,11 +73,11 @@
 
 <script setup lang="ts">
 import { PropType } from 'vue'
-import { CommonTableColumn, SelectOption, FormData } from '~/common'
+import { CommonTableColumn, SelectOption, CommonData } from '~/common'
 
 const props = defineProps({
   model: {
-    type: Object as PropType<FormData>,
+    type: Object as PropType<CommonData>,
     required: true,
   },
   items: {

src/views/systemSettings/messageTemplate/index.vue

@@ -1,26 +1,26 @@
 <template>
   <div class="airportInfo scroll-y">
     <div class="wrap">
-      <Minheader :is-auth="true" :is-statuser="true" @addForm="addForm">
+      <Minheader :is-auth="true" :is-statuser="true" @addForm="addDialogShow">
         <template #header>
           <div class="status flex-wrap">
             <div class="manageTitle">消息模板</div>
           </div>
-        </template></Minheader
-      >
+        </template>
+      </Minheader>
       <div class="app-containers">
         <DataTable
-          :tableHeader="tableCols"
+          :tableHeader="tableColumns"
           :tableData="tableData"
           :tableBtnGroup="tableBtnGroup"
-          :tableProperty="{ rowKey: 'ID' }"
           @btnClick="btnClick"
         />
       </div>
       <Dialog
-        :flag="flag"
-        :type="type"
+        :flag="dialogFlag"
+        :type="dialogType"
         :msgTitle="msgTitle"
+        :del-name="delName"
         @resetForm="resetForm"
         @delRest="delRest"
         @submitForm="submitForm"
@@ -28,7 +28,7 @@
       >
         <div class="diacont">
           <el-form
-            :model="tableForm"
+            :model="messageForm"
             :rules="formRules"
             ref="messageTemplateForm"
           >
@@ -41,7 +41,7 @@
                   :rules="formRules.isNotNull"
                 >
                   <el-input
-                    v-model="tableForm.newsTitle"
+                    v-model="messageForm.newsTitle"
                     placeholder="请输入名称"
                   />
                 </el-form-item>
@@ -55,7 +55,7 @@
                 >
                   <el-input
                     type="textarea"
-                    v-model="tableForm.newContent"
+                    v-model="messageForm.newContent"
                     placeholder="请输入消息内容"
                   />
                 </el-form-item>
@@ -68,200 +68,153 @@
   </div>
 </template>
 <script setup lang="ts">
-import DataTable from "@/components/tableTemp/index.vue";
-import Minheader from "@/components/minheader/index.vue";
-import Dialog from "@/components/dialog/index.vue";
-import { Query, GeneralDataReception } from "@/api/webApi";
-import { ElMessage } from "element-plus";
-const formRules = useElement().formRules;
-const page = ref<number>(0); //分页参数
-const dataContent = ref<object>({});
-const noMore = ref<Boolean>(false);
-const rowTitle = ref<String>("");
-const tableCols = ref([]); //表头数据
-const serviceId = ref<String>("");
-const tableObj = ref({}); //增删改数据缓存
-const flag = ref<Boolean>(false); //弹窗开关
-const type = ref<String>(""); //判断是否删除
-const msgTitle = ref<String>("新增消息模板"); //弹窗标题
-const tableColsCopys = reactive<Object>({}); //弹窗
-const tableForm = reactive({
-  newsId: "",
-  newsTitle: "",
-  newContent: "",
-  event: "",
-}); //弹窗内容
-//列表
-const tableData = ref([]);
-//表头
-const state = reactive({
-  list: [
-    { label: "名称", key: "name" },
-    { label: "描述", key: "china" },
-  ],
-  listLoading: true,
-});
+import DataTable from '@/components/tableTemp/index.vue'
+import Minheader from '@/components/minheader/index.vue'
+import Dialog from '@/components/dialog/index.vue'
+import { Query, GeneralDataReception } from '@/api/webApi'
+import { ElMessage } from 'element-plus'
+import { CommonData, CommonTableColumn } from '~/common'
+
+const tableColumns = ref<CommonTableColumn[]>([]) // 表头数据
+const tableData = ref<any[]>([]) // 表格数据
+const page = ref(0) // 分页参数
+const noMore = ref(false)
+const rowTitle = ref('')
+const serviceId = ref<number>()
+const dialogFlag = ref(false) // 弹窗开关
+const dialogType = ref('') // 判断是否删除
+const formRules = useElement().formRules
+const msgTitle = ref('新增消息模板') // 弹窗标题
+const delName = ref('')
+const messageForm = reactive<CommonData>({
+  newsId: null,
+  newsTitle: null,
+  newContent: null,
+  event: null,
+}) //弹窗内容
 const tableBtnGroup = ref([
   {
-    name: "编辑",
-    className: "editBtn",
+    name: '编辑',
+    className: 'editBtn',
     param: 2,
   },
   {
-    name: "删除",
-    className: "delBtn",
+    name: '删除',
+    className: 'delBtn',
     param: 3,
   },
-]);
+])
 //新增
-const addForm = () => {
-  msgTitle.value = "新增消息模板";
-  flag.value = true;
-  tableForm.event = 1;
-  type.value = "";
-};
+const addDialogShow = () => {
+  msgTitle.value = '新增消息模板'
+  dialogFlag.value = true
+  messageForm.event = 1
+  dialogType.value = ''
+}
 //取消
 const resetForm = () => {
-  flag.value = false;
-  tableForm.newsId = "";
-  tableForm.newsTitle = "";
-  tableForm.newContent = "";
-};
-//编辑
-// const editDialog = (data) => {
-//   msgTitle.value = "编辑航司信息维护";
-//   flag.value = true;
-//   type.value = "";
-//   tableForm.name = data.name;
-//   tableForm.china = data.china;
-//   tableForm.englin = data.englin;
-//   tableForm.two = data.two;
-//   tableForm.three = data.three;
-//   tableForm.text = data.text;
-// };
-//编辑-删除
-const btnClick = (row, index, param) => {
+  dialogFlag.value = false
+  Object.keys(messageForm).forEach(key => {
+    console.log(key)
+  })
+}
+const btnClick = (rowIndex: number, row: any, param: number) => {
   if (param === 2) {
-    msgTitle.value = "编辑消息模板";
-    flag.value = true;
-    type.value = "";
-    tableForm.event = 2;
-    tableForm.newsId = index.newsId;
-    tableForm.newsTitle = index.newsTitle;
-    tableForm.newContent = index.newContent;
+    msgTitle.value = '编辑消息模板'
+    dialogFlag.value = true
+    dialogType.value = ''
+    messageForm.event = 2
+    messageForm.newsId = row.newsId
+    messageForm.newsTitle = row.newsTitle
+    messageForm.newContent = row.newContent
   } else if (param === 3) {
-    msgTitle.value = "删除消息模板";
-    flag.value = true;
-    type.value = "del";
-    tableForm.event = 3;
-    tableForm.newsId = index.newsId;
-    tableForm.newsTitle = index.newsTitle;
-    tableForm.newContent = index.newContent;
-  } else if (param === 4) {
+    msgTitle.value = '删除消息模板'
+    dialogFlag.value = true
+    dialogType.value = 'del'
+    messageForm.event = 3
   }
-};
-//删除
-const eleDialog = () => {
-  msgTitle.value = "删除消息模板";
-  flag.value = true;
-  type.value = "del";
-};
+}
 const delRemove = () => {
-  tableForm.event = 3;
-  generalDataReception(tableForm);
-};
+  messageForm.event = 3
+  generalDataReception(messageForm)
+}
 //删除
 const delRest = () => {
-  flag.value = false;
-};
+  dialogFlag.value = false
+}
 //获取表格数据
-const getQuery = async () => {
+const getTableData = async () => {
   try {
-    const { code, returnData } = await Query({
+    const {
+      code,
+      returnData: { columnSet, listValues },
+      submitID,
+    } = await Query({
       id: DATACONTENT_ID.messageQueryTabId,
       needPage: ++page.value,
-      dataContent: Object.values(dataContent.value),
-    });
-    if (code === "0") {
-      if (returnData.listValues.length === 0) {
-        page.value--;
-        noMore.value = true;
+      dataContent: [],
+    })
+    if (Number(code) === 0) {
+      if (listValues.length === 0) {
+        page.value--
+        noMore.value = true
       }
-      const titleColumn = returnData.columnSet.find(
-        (item) => item.needShow === 1
-      );
+      const titleColumn = columnSet.find(item => item.needShow === 1)
       if (titleColumn) {
-        rowTitle.value = titleColumn.columnName;
+        rowTitle.value = titleColumn.columnName
       }
-      tableData.value.push(...returnData.listValues);
-      tableCols.value = returnData.columnSet;
-      tableCols.value.forEach((element) => {
-        element.label = element.columnLabel;
-        element.key = element.columnName;
-        // if (element.columnName === "queryTemplate") {
-        //   element.width = "300px";
-        // }
-      });
-      serviceId.value = returnData.submitID;
+      tableData.value.push(...listValues)
+      tableColumns.value = columnSet
+      serviceId.value = submitID
     } else {
-      page.value--;
+      throw new Error('查询失败')
     }
-  } catch (error) {
-    page.value--;
+  } catch (error: any) {
+    ElMessage.error(error.message)
+    page.value--
   }
-};
+}
 //确认提交
-const messageTemplateForm: any = ref(null);
+const messageTemplateForm: any = ref(null)
 const submitForm = () => {
   messageTemplateForm.value.validate((valid: any) => {
     if (valid) {
-      generalDataReception(tableForm);
+      generalDataReception(messageForm)
     } else {
-      return false;
+      return false
     }
-  });
-};
+  })
+}
 const resetTable = () => {
-  page.value = 0;
-  noMore.value = false;
-  tableData.value = [];
-};
+  page.value = 0
+  noMore.value = false
+  tableData.value = []
+}
 //新增-编辑-删除
-const generalDataReception = async (data) => {
+const generalDataReception = async formData => {
   try {
-    data = {
-      ...data,
-    };
     const { code } = await GeneralDataReception({
       serviceId: serviceId.value,
-      dataContent: JSON.stringify(data),
-    });
+      dataContent: JSON.stringify(formData),
+    })
     if (code == 0) {
-      ElMessage.success(`操作成功`);
-      // this.$message.success("操作成功");
-      resetTable();
-      getQuery();
-      resetForm();
-      flag.value = false;
-      // rmFlag.value = false;
-      tableObj.value = {};
-      // this.$router.go(0);
+      ElMessage.success(`操作成功`)
+      resetTable()
+      getTableData()
+      resetForm()
+      dialogFlag.value = false
     } else {
-      ElMessage.error(`操作失败`);
-      // this.$message.error("操作失败");
-      // this.flag = false;
-      // this.rmFlag = false;
-      tableObj.value = {};
-      resetForm();
+      throw new Error('操作失败')
     }
-  } catch (error) {
-    flag.value = false;
-    //  rmFlag.value = false;
-    tableObj.value = {};
-    resetForm();
+  } catch (error: any) {
+    ElMessage.error(error.message)
+    dialogFlag.value = false
+    resetForm()
   }
-};
-getQuery();
+}
+onMounted(() => {
+  getTableData()
+})
 </script>
 <style lang="scss" scoped>
 ::v-deep .el-form-item__label {

src/views/systemSettings/serviceManagement/index.vue

@@ -92,7 +92,9 @@
                 <el-form-item label="数据来源" prop="dataSourceID">
                   <el-select v-model="serviceForm.dataSourceID" clearable>
                     <el-option
-                      v-for="dataSource in dataSourceList"
+                      v-for="dataSource in selectOptionMap[
+                        queryTemplateIDMap.dataSourceName
+                      ]"
                       :key="dataSource.dataSourceID"
                       :value="dataSource.dataSourceID"
                       :label="dataSource.dataSourceName"
@@ -246,7 +248,9 @@
               >
                 <el-select v-model="serviceForm.logDataSourceID">
                   <el-option
-                    v-for="dataSource in dataSourceList"
+                    v-for="dataSource in selectOptionMap[
+                      queryTemplateIDMap.dataSourceName
+                    ]"
                     :key="dataSource.dataSourceID"
                     :value="dataSource.dataSourceID"
                     :label="dataSource.dataSourceName"
@@ -286,11 +290,13 @@
             <el-select
               size="small"
               style="width: 100%"
-              v-model="sourceForm.protocolName"
+              v-model="sourceForm.protocolID"
               placeholder="请选择活动区域"
             >
               <el-option
-                v-for="protocol in protocolList"
+                v-for="protocol in selectOptionMap[
+                  queryTemplateIDMap.protocolName
+                ]"
                 :key="protocol.protocolID"
                 :label="protocol.protocolName"
                 :value="protocol.protocolID"
@@ -318,21 +324,66 @@ import { ElMessage, FormInstance } from 'element-plus'
 import {
   CommonTableColumn,
   CommonQueryResult,
+  SelectOption,
   SelectOptionQueryResult,
 } from '~/common'
 import request from '@/utils/axiosReq'
 import { Query, GeneralDataReception } from '@/api/webApi'
 
-interface DataSource {
-  dataSourceID: string | number
-  dataSourceName: string
+const router = useRouter()
+
+const queryTemplateIDMap = reactive<{
+  [x: string]: number
+}>({})
+const selectOptionMap = reactive<{
+  [id: number]: SelectOption[]
+}>({})
+const getSelectOptionOfColumn = (columns: CommonTableColumn[]) => {
+  columns.forEach(async ({ columnName, listqueryTemplateID }) => {
+    if (listqueryTemplateID !== null && !queryTemplateIDMap[columnName]) {
+      queryTemplateIDMap[columnName] = listqueryTemplateID
+      if (!selectOptionMap[listqueryTemplateID]) {
+        selectOptionMap[listqueryTemplateID] = []
+        selectOptionMap[listqueryTemplateID] = await getSelectOptions(
+          listqueryTemplateID
+        )
+      }
+    }
+  })
 }
-interface Protocol {
-  protocolID: string | number
-  protocolName: string
+const getSelectOptions = async (id: number) => {
+  try {
+    const {
+      code,
+      returnData: { listValues },
+      message,
+    }: SelectOptionQueryResult = await Query({
+      id,
+      dataContent: [],
+    })
+    if (Number(code) !== 0) {
+      throw new Error(message ?? '失败')
+    }
+    const options = listValues.map(({ k, v, setlabel, setvalue }) => ({
+      k,
+      v,
+      setlabel,
+      setvalue,
+      [setlabel]: k,
+      [setvalue]: v,
+    }))
+    return options
+  } catch (error) {
+    console.error(error)
+    return []
+  }
 }
-
-const router = useRouter()
+onMounted(async () => {
+  queryTemplateIDMap.protocolName = DATACONTENT_ID.protocolOptions
+  selectOptionMap[queryTemplateIDMap.protocolName] = await getSelectOptions(
+    queryTemplateIDMap.protocolName
+  )
+})
 
 // 表格
 const tableColumns = ref<CommonTableColumn[]>([])
@@ -371,11 +422,8 @@ const getTableData = async () => {
     if (titleColumn) {
       rowTitle.value = titleColumn.columnName
     }
-    tableColumns.value = columnSet.map(column => ({
-      key: column.columnName,
-      label: column.columnLabel,
-      ...column,
-    }))
+    getSelectOptionOfColumn(columnSet)
+    tableColumns.value = columnSet
     tableData.value.push(...listValues)
   } catch (error) {
     page.value--
@@ -525,10 +573,10 @@ const deleteService = async () => {
   }
 }
 const addServiceDialogShow = () => {
-  getSelectOptions(DATACONTENT_ID.dataSourceOptions)
   serviceDialogType.value = 'add'
   msgTitle.value = '新增服务管理'
   serviceDialogVisible.value = true
+  console.log(queryTemplateIDMap, selectOptionMap)
 }
 const addServiceDialogHide = () => {
   serviceFormRef.value?.resetFields()
@@ -567,7 +615,6 @@ const serviceFormRules = {
     },
   ],
 }
-const dataSourceList = ref<DataSource[]>([])
 const serviceSubmitHandler = () => {
   serviceFormRef.value!.validate(async valid => {
     if (valid) {
@@ -615,7 +662,6 @@ const createService = async () => {
 // 新增数据来源-弹窗
 const dataSourceDialogVisible = ref(false)
 const addDataSourceDialogShow = () => {
-  getSelectOptions(DATACONTENT_ID.protocolOptions)
   dataSourceDialogVisible.value = true
 }
 const dataSourceDialogHide = () => {
@@ -625,46 +671,13 @@ const dataSourceDialogHide = () => {
 // 新增数据来源-表单
 const sourceFormRef = ref<FormInstance | null>(null)
 const sourceForm = reactive({
-  dataSourceName: '',
-  protocolName: '',
-  connectConfig: '',
+  dataSourceName: null,
+  protocolID: null,
+  connectConfig: null,
 })
-const protocolList = ref<Protocol[]>([])
 const dataSourceSubmitHandler = () => {
   dataSourceDialogHide()
 }
-
-const getSelectOptions = async (id: number) => {
-  try {
-    const {
-      code,
-      returnData: { listValues },
-      message,
-    }: SelectOptionQueryResult = await Query({
-      id,
-      dataContent: [],
-    })
-    if (Number(code) !== 0) {
-      throw new Error(message ?? '失败')
-    }
-    const options = listValues.map(item => ({
-      [item.setlabel]: item.k,
-      [item.setvalue]: item.v,
-    }))
-    switch (id) {
-      case DATACONTENT_ID.dataSourceOptions:
-        dataSourceList.value = options as DataSource[]
-        break
-      case DATACONTENT_ID.protocolOptions:
-        protocolList.value = options as Protocol[]
-        break
-      default:
-        break
-    }
-  } catch (error) {
-    console.error(error)
-  }
-}
 </script>
 <style lang="scss" scoped>
 .app-containers {

src/views/systemSettings/serviceManagement/serviceEdit.vue

@@ -556,7 +556,7 @@ import {
   CommonTableColumn,
   SelectOptionQueryResult,
   SelectOption,
-  FormData,
+  CommonData,
 } from '~/common'
 import { ElMessage } from 'element-plus'
 import { Query, GeneralDataReception } from '@/api/webApi'
@@ -802,7 +802,7 @@ const outputDialogHide = () => {
     outputForm[key] = null
   })
 }
-const outputForm = reactive<FormData>({})
+const outputForm = reactive<CommonData>({})
 const outputSubmitHandler = async () => {
   try {
     const dataContent = {}
@@ -987,7 +987,7 @@ const editSlotDialogShow = () => {
 const editSlotDialogHide = () => {
   editSlotDialogVisible.value = false
 }
-const slotForm = reactive<FormData>({})
+const slotForm = reactive<CommonData>({})
 const editSlotSubmitHandler = () => {
   editSlotDialogHide()
 }

src/views/systemSettings/serviceManagement/serviceTopology.vue

@@ -105,12 +105,12 @@
 import Minheader from '@/components/minheader/index.vue'
 import DataTable from '@/components/tableTemp/index.vue'
 import Dialog from '@/components/dialog/index.vue'
-import { Ref, provide } from 'vue'
+import { Ref } from 'vue'
 import * as echarts from 'echarts'
 import _ from 'lodash'
 import { ElMessage } from 'element-plus'
 import { Query } from '@/api/webApi'
-import { CommonTableColumn } from "~/common";
+import { CommonTableColumn } from '~/common'
 import img1 from '@/assets/integr/jiekou_blue.png'
 import img2 from '@/assets/integr/jiekou_red.png'
 import img3 from '@/assets/integr/pull_blue.png'
@@ -123,8 +123,26 @@ import img8 from '@/assets/integr/pull_red.png'
 const route = useRoute()
 const serviceID = Number(route.query.serviceID)
 const serviceName = String(route.query.serviceName)
+const getTopologyData = async () => {
+  try {
+    const {
+      code,
+      returnData: { listValues },
+      message,
+    } = await Query({
+      id: DATACONTENT_ID.sysServiceTopology,
+      dataContent: Array(6).fill(serviceID),
+    })
+    if (Number(code) !== 0) {
+      throw new Error(message ?? '失败')
+    }
+    console.log(listValues)
+  } catch (error: any) {
+    console.error(error)
+  }
+}
+getTopologyData()
 
-provide('echarts', echarts)
 const chartDom = ref<HTMLDivElement | null>(null)
 const myChart = ref<Ref<echarts.ECharts> | null>(null)
 const flag = ref(false) //弹窗开关
@@ -585,7 +603,7 @@ const getTableData = async () => {
       code,
       returnData: { columnSet, listValues },
     } = await Query({
-      id: DATACONTENT_ID.sysServiceTopTable,
+      id: DATACONTENT_ID.sysServiceTopologyTable,
       needPage: ++page,
       dataContent: [serviceID, timeStart.value, timeEnd.value],
     })
@@ -656,13 +674,13 @@ type progressItem = {
   resultDetails?: string
 }
 const progressList = ref<progressItem[]>([])
-progressList.value.push(
-  ...Array.from({ length: 3 }).map(() => ({
-    logType: '更新 Github 模板',
-    resultCode: '989665554',
-    logTime: '2022-4-26 15:48:55',
-  }))
-)
+// progressList.value.push(
+//   ...Array.from({ length: 3 }).map(() => ({
+//     logType: '更新 Github 模板',
+//     resultCode: '989665554',
+//     logTime: '2022-4-26 15:48:55',
+//   }))
+// )
 const rowClickHandler = (row, column, event) => {
   progressList.value = []
   if (row.logObject) {

typings/common.d.ts

@@ -73,7 +73,7 @@ interface CommonTableColumn {
   [propName: string]: any
 }
 
-interface FormData {
+interface CommonData {
   [x: string]: string | number | null
 }
 
@@ -93,7 +93,7 @@ interface CommonQueryResult<T = any> {
   }
   message?: string
   needPage?: number
-  submitiD?: number
+  submitID?: number
   [propName: string]: any
 }