表格高度问题修复

src/views/advancedQuery/mixins/tableCols.js

@@ -23,12 +23,6 @@ export default {
   created() {
     this.initTableCols()
   },
-  updated() {
-    // table数据更新
-    this.$nextTick(() => {
-      this.$refs.table?.doLayout()
-    })
-  },
   computed: {
     colsCheckClass() {
       return this.tableCols.some(col => col.children?.length) ? 'has-children' : 'no-children'
@@ -37,18 +31,18 @@ export default {
   methods: {
     // 列设置-初始化
     initTableCols() {
-      this.setTableCols(this.tableCols)
-      this.tableColsCopy = this._.cloneDeep(this.tableCols)
-      this.checkedKeysTemp = [...this.checkedKeys]
-    },
-    setTableCols(cols) {
-      for (const col of cols) {
-        col.index = this.checkedKeys.length
-        this.checkedKeys.push(this.checkedKeys.length)
-        if (col.children?.length) {
-          this.setTableCols(col.children)
+      function setTableCols(cols) {
+        for (const col of cols) {
+          col.index = this.checkedKeys.length
+          this.checkedKeys.push(this.checkedKeys.length)
+          if (col.children?.length) {
+            setTableCols(col.children)
+          }
         }
       }
+      setTableCols(this.tableCols)
+      this.tableColsCopy = this._.cloneDeep(this.tableCols)
+      this.checkedKeysTemp = [...this.checkedKeys]
     },
     // 列设置-确定
     handleCheck(data, checked) {

src/views/advancedQuery/views/advancedHome.vue

@@ -66,6 +66,7 @@
     >
       <el-table
         ref="table"
+        v-el-table-infinite-scroll="load"
         max-height="100%"
         class="table"
         :data="dealedTableData"
@@ -345,7 +346,7 @@
 import Search from '@/components/SearchWithTooltip'
 import Dialog from '@/layout/components/Dialog'
 import { parseTime } from '@/utils/index'
-import { myQuery } from '@/api/dataIntegration'
+import { Query, myQuery } from '@/api/dataIntegration'
 import { mapGetters } from 'vuex'
 import TableHeaderCell from '@/components/TableHeaderCell'
 import { setTableFilters } from '@/utils/table'
@@ -376,6 +377,8 @@ export default {
         //   transferFlightNO: ''
         // }
       ],
+      page: -1,
+      noMore: false,
       checkList: [],
       tableCols: [
         {
@@ -642,7 +645,7 @@ export default {
       tableDataSortRules: {},
       spanArr: [],
       contactDot: 0,
-      scrollTop:0,
+      scrollTop: 0,
       dom: null
     }
   },
@@ -728,19 +731,19 @@ export default {
   },
   mounted() {
     this.baggageTypeQuery()
-    this.dom = this.$refs.table.bodyWrapper;
+    this.dom = this.$refs.table.bodyWrapper
     let that = this
-    this.dom.addEventListener('scroll',()=>{
+    this.dom.addEventListener('scroll', () => {
       that.scrollTop = this.dom.scrollTop
     })
   },
-  activated(){
-    let flag = false
+  activated() {
+    let queryFlag = false
     const query = this.$route.query
     const { startDate, endDate, singleJump } = query
     Object.entries(query).forEach(([key, value]) => {
       if (!['startDate', 'endDate', 'singleJump'].includes(key) && (value ?? '') !== '') {
-        flag = true
+        queryFlag = true
         this.form[key] = ['unLoad', 'checkIn', 'active', 'transferIn', 'canceled'].includes(key) ? Number(value) : value
       }
     })
@@ -752,17 +755,19 @@ export default {
     }
     // startDate && (this.flightDate[0] = startDate)
     // endDate && (this.flightDate[1] = endDate)
-    if (flag) {
+    if (queryFlag) {
       this.onCheckGj(singleJump)
-    } else if (this.queryForm) {
-      Object.keys(this.form).forEach(key => {
-        this.form[key] = this.queryForm[key]
-      })
-      this.flightDate = this.queryForm.flightDate
-      this.onCheckGj()
+    } else {
+      this.dom = this.$refs.table.bodyWrapper
+      this.dom.scrollTop = this.scrollTop
     }
-    this.dom = this.$refs.table.bodyWrapper;
-    this.dom.scrollTop = this.scrollTop;
+    // else if (this.queryForm) {
+    //   Object.keys(this.form).forEach(key => {
+    //     this.form[key] = this.queryForm[key]
+    //   })
+    //   this.flightDate = this.queryForm.flightDate
+    //   this.onCheckGj()
+    // }
   },
   updated() {
     // table数据更新
@@ -782,6 +787,17 @@ export default {
     }
   },
   methods: {
+    load() {
+      if (this.noMore || this.loading || this.page < 0) {
+        return
+      }
+      this.statItemsQueryByStatMain(this.dataContent)
+    },
+    resetTable() {
+      this.page = 0
+      this.noMore = false
+      this.tableData = []
+    },
     dialogShow() {
       this.gjFlag = true
       this.$nextTick(() => {
@@ -973,7 +989,7 @@ export default {
     // 清除查询
     clearSearchData() {
       this.clearForm()
-      this.tableData = []
+      this.resetTable()
     },
     // 清除表单
     clearForm() {
@@ -983,6 +999,7 @@ export default {
     },
     // 高级查询-确定
     onCheckGj(singleJump) {
+      this.resetTable()
       /* 参数顺序
       【航班开始日期，航班结束日期，航班号，航班号，行李牌号，行李牌号，起飞站，起飞站，目的站，目的站，特殊行李类型，特殊行李类型，旅客姓名大写拼音，旅客姓名大写拼音，
       PNR，PNR，值机号，值机号，中转进航班，中转进航班，中转出航班，中转出航班，容器编号，容器编号，
@@ -1057,10 +1074,22 @@ export default {
     // 数据查询
     async statItemsQueryByStatMain(dataContent, singleJump) {
       this.loading = true
-      this.tableData = []
       try {
-        const result = await myQuery(DATACONTENT_ID.advacedQueryId, ...dataContent)
-        if (result.length) {
+        const {
+          code,
+          returnData: { listValues: result, needPage }
+        } = await Query({
+          id: DATACONTENT_ID.advacedQueryId,
+          needPage: ++this.page,
+          dataContent
+        })
+        if (Number(code) !== 0) {
+          this.page--
+          this.loading = false
+          this.$message.error('获取数据失败')
+          return
+        }
+        if (needPage === this.page && result.length) {
           if (singleJump) {
             if (result.length === 1) {
               this.$router.push({
@@ -1096,13 +1125,18 @@ export default {
               }
             }
           }
-          const tableData = this._.sortBy(result, ['flightDate', 'departureTime', 'passengerNameUpcase', 'bagSN'])
-          this.tableData = tableData
+          // const tableData = this._.sortBy(result, ['flightDate', 'departureTime', 'passengerNameUpcase', 'bagSN'])
+          this.tableData = [...this.tableData, ...result]
           setTableFilters(this.tableData, this.tableDataFilters)
         } else {
-          this.$message.info('未查询到匹配结果')
+          if (this.page === 1) {
+            this.$message.info('未查询到匹配结果')
+          }
+          this.page--
+          this.noMore = true
         }
       } catch (error) {
+        this.page--
         console.log('出错了', error)
       }
       this.loading = false

src/views/baggageManagement/components/departure/index.vue

@@ -404,6 +404,11 @@ export default {
       table: null
     }
   },
+  computed: {
+    singleDay() {
+      return this.startDate === this.endDate
+    }
+  },
   mounted() {
     this.getAirPortData()
     this.table = this.$refs.table.bodyWrapper
@@ -427,11 +432,6 @@ export default {
       this.loopEvent = null
     }
   },
-  computed: {
-    singleDay() {
-      return this.startDate === this.endDate
-    }
-  },
   methods: {
     resetLoopEvent() {
       this.loading = true

src/views/baggageManagement/mixins/terminal.js

@@ -21,23 +21,17 @@ export default {
       spanArr: [],
       pos: 0,
       loading: false,
-      computedTableHeight: 0
+      computedTableHeight: undefined
     }
   },
   created() {
     this.setFilterAndSort(this.tableCols)
   },
   updated() {
-    const headerHeight = 80
-    const bottomBlankHeight = 41
-    const formWrapHeight = this.$refs['formWrap'].offsetHeight
-    this.computedTableHeight = `calc(100vh - ${headerHeight + bottomBlankHeight + formWrapHeight}px)`
+    this.setTableHeight()
   },
   activated() {
-    const headerHeight = 80
-    const bottomBlankHeight = 41
-    const formWrapHeight = this.$refs['formWrap'].offsetHeight
-    this.computedTableHeight = `calc(100vh - ${headerHeight + bottomBlankHeight + formWrapHeight}px)`
+    this.setTableHeight()
   },
   computed: {
     ...mapGetters(['clickedCells']),
@@ -91,6 +85,16 @@ export default {
     }
   },
   methods: {
+    // 设置表格高度
+    setTableHeight() {
+      const headerHeight = 80
+      const bottomBlankHeight = 41
+      const formWrapHeight = this.$refs['formWrap'].offsetHeight
+      this.computedTableHeight = `calc(100vh - ${headerHeight + bottomBlankHeight + formWrapHeight}px)`
+      this.$nextTick(() => {
+        this.$refs.table?.doLayout()
+      })
+    },
     // 设置筛选和排序
     setFilterAndSort(tableCols) {
       const self = this