CABaggageData2.0/src/views/baggageManagement/mixins/terminal.js

/*
 * @Author: Badguy
 * @Date: 2022-03-04 11:41:55
 * @LastEditTime: 2022-08-26 15:32:54
 * @LastEditors: your name
 * @Description: 航站视图通用部分
 * have a nice day!
 */

import { mapGetters } from 'vuex'
import { commonTableCellClass } from '@/utils/table'

export default {
  data() {
    return {
      // 表格数据
      tableData: [],
      tableDataFilters: {},
      filterValues: {},
      tableDataSortRules: {},
      spanArr: [],
      pos: 0,
      loading: false,
      computedTableHeight: undefined,
      debounceTime: 300
    }
  },
  created() {
    this.setFilterAndSort(this.tableCols)
  },
  activated() {
    this.resizeHandler()
    this.debouncedResizeHandler = this._.debounce(this.resizeHandler, this.debounceTime)
    window.addEventListener('resize', this.debouncedResizeHandler)
  },
  deactivated() {
    window.removeEventListener('resize', this.debouncedResizeHandler)
  },
  computed: {
    ...mapGetters(['clickedCells']),
    dealedTableData() {
      const filtered = this.tableData.filter(item => {
        let flag = true
        Object.entries(this.filterValues).forEach(([key, arr]) => {
          if (arr.length && !arr.includes(String(item[key]))) {
            flag = false
          }
        })
        return flag
      })
      const sortRules = Object.entries(this.tableDataSortRules).reduce(
        (pre, [key, value]) => {
          if (value) {
            pre[0].push(key)
            value = value === 'ascending' ? 'asc' : 'desc'
            pre[1].push(value)
          }
          return pre
        },
        [[], []]
      )
      return this._.orderBy(filtered, sortRules[0], sortRules[1])
    }
  },
  watch: {
    dealedTableData: {
      handler(val) {
        this.spanArr = []
        let contactDot = this.contactDot
        val.forEach((item, index, arr) => {
          if (index === 0) {
            this.spanArr.push(1)
          } else {
            if (
              item['flightNO'] === arr[index - 1]['flightNO'] &&
              item['flightDate'] === arr[index - 1]['flightDate']
            ) {
              this.spanArr[contactDot] += 1
              this.spanArr.push(0)
            } else {
              this.spanArr.push(1)
              contactDot = index
            }
          }
        })
      },
      deep: true
    }
  },
  methods: {
    // 设置表格高度
    resizeHandler() {
      const headerHeight = 80
      const bottomBlankHeight = 41
      const formWrapHeight = this.$refs['formWrap'].offsetHeight
      this.computedTableHeight = `calc(100vh - ${headerHeight + bottomBlankHeight + formWrapHeight}px)`
      this.$refs.table?.doLayout()
    },
    // 设置筛选和排序
    setFilterAndSort(tableCols) {
      const self = this
      Object.values(tableCols).forEach(({ prop, filterable, sortable, children }) => {
        if (children) {
          self.setFilterAndSort(children)
        } else {
          if (filterable) {
            self.$set(self.tableDataFilters, prop, [])
            self.$set(self.filterValues, prop, [])
          }
          if (sortable) {
            self.$set(self.tableDataSortRules, prop, '')
          }
        }
      })
    },
    // 合计行
    summaryMethod({ columns, data }) {
      const sums = []
      if (columns.length > 0) {
        columns.forEach((column, index) => {
          if (index === 0) {
            sums[index] = '合计'
          } else if (index === 1) {
            sums[index] = '航班数：' + this.tableData.length
          } else if (
            // 需要计算的列
            [
              'passagernum',
              'checkNumber',
              'not_actived',
              'expect_load',
              'security_all',
              'sortNumber',
              'loadNumber',
              'boardID',
              'toUnload',
              'OFFCount',
              'delbag',
              'noBSM',
              'reach',
              'did_not_arrive',
              'special',
              'claim',
              'uninstalled',
              'terminateArrive',
              'terminatedNotArrived',
              'delivered',
              'not_shipped',
              'container',
              'bulk',
              'checkInTravellerNumber',
              'checkInNumber',
              'unActive',
              'preLoad',
              'noCheckInNumber',
              'midIn',
              'checkIns',
              'projectedLoad',
              'loadedQuantity',
              'numberOfDestinationArrivals',
              'endPointNotReached',
              'specialQuantity',
              'numberOfClaims',
              'numberToBeUninstalled',
              'terminateArrivalQuantity',
              'terminateUnreachedQuantity',
              'quantityShipped',
              'undeliveredQuantity',
              'numberOfContainers',
              'numberOfBulk',
              'inTransferBaggageCount',
              'inTransferredBaggageCount',
              'outTransferBaggageCount',
              'outTransferredBaggageCount',
              'exceptions',
              'warning'
            ].includes(column.property)
          ) {
            const values = data.map(item => Number(item[column.property]))
            if (values.some(value => !isNaN(value))) {
              sums[index] = values.reduce((prev, curr) => {
                const value = Number(curr)
                if (!isNaN(value)) {
                  return Number(prev) + Number(curr)
                } else {
                  return Number(prev)
                }
              }, 0)
            } else {
              sums[index] = 0
            }
          } else {
            // 过滤某些字段不参与计算
            sums[index] = '-'
          }
        })
      }
      return sums
    },
    cellClass({ row, column, rowIndex, columnIndex }) {
      const classes = commonTableCellClass({
        row,
        column,
        rowIndex,
        columnIndex
      })
      if (
        [
          'flightNO',
          'preFlightNO',
          'inTransferBaggageCount',
          'inTransferredBaggageCount',
          'outTransferBaggageCount',
          'outTransferredBaggageCount',
          'toUnload',
          'OFFCount',
          'checkInNumber',
          'unActive',
          'preLoad',
          'warning',
          'midIn',
          'noCheckInNumber',
          'checkNumber',
          'sortNumber',
          'loadNumber',
          'boardID',
          'checkIns',
          'terminateArrivalQuantity',
          'projectedLoad',
          'loadedQuantity',
          'numberOfDestinationArrivals',
          'uninstalled',
          'numberOfContainers',
          'numberOfBulk',
          'noBSM'
        ].includes(column.property) &&
        row[column.property]
      ) {
        classes.push('cell-click')
        if (
          this.clickedCells.some(
            cell =>
              cell.pageName === this.$route.name &&
              Object.entries(cell.row).every(([key, value]) => row[key] === value) &&
              cell.columnProp === column.property
          )
        ) {
          classes.push('cell-clicked')
        }
      }
      if (column.property === 'toUnload' && row[column.property]) {
        classes.push('cell-toUnload')
      }
      if (column.property === 'warning' && row['warningState'] && row['warningState'] == 2) {
        classes.push('cell-toUnload')
      }
      if (column.property === 'warning' && row['warningState'] && row['warningState'] == 1) {
        classes.push('cell-toUnloadNew')
      }
      if (column.property === 'outTransferredBaggageCount' && row['warningState'] && row['warningState'] == 2) {
        classes.push('cell-toUnload')
      }
      if (column.property === 'outTransferredBaggageCount' && row['warningState'] && row['warningState'] == 1) {
        classes.push('cell-toUnloadNew')
      }
      if (column.property === 'outTransferBaggageCount' && row['sharpSign']) {
        classes.push('cell-toUnloadNew')
      }
      if (column.property === 'inTransferredBaggageCount' && row['warningState'] && row['warningState'] == 2) {
        classes.push('cell-toUnload')
      }
      if (column.property === 'inTransferredBaggageCount' && row['warningState'] && row['warningState'] == 1) {
        classes.push('cell-toUnloadNew')
      }
      if (column.property === 'inTransferBaggageCount' && row['sharpSign']) {
        classes.push('cell-toUnloadNew')
      }
      return classes.join(' ')
    },
    cellClickHandler(row, column, cell, event) {
      if (
        [
          'flightNO',
          'preFlightNO',
          'inTransferBaggageCount',
          'inTransferredBaggageCount',
          'outTransferBaggageCount',
          'outTransferredBaggageCount',
          'toUnload',
          'OFFCount',
          'checkInNumber',
          'unActive',
          'preLoad',
          'warning',
          'midIn',
          'noCheckInNumber',
          'checkNumber',
          'sortNumber',
          'loadNumber',
          'boardID',
          'checkIns',
          'terminateArrivalQuantity',
          'projectedLoad',
          'loadedQuantity',
          'numberOfDestinationArrivals',
          'uninstalled',
          'numberOfContainers',
          'numberOfBulk',
          'noBSM'
        ].includes(column.property) &&
        row[column.property]
      ) {
        this.$store.dispatch('keepAlive/addClickedCell', {
          row,
          columnProp: column.property,
          pageName: this.$route.name
        })
        const path = `${this.$route.path}/flightView`
        const query = {}
        switch (column.property) {
          case 'flightNO':
            Object.assign(query, {
              flightNO: row.flightNO,
              flightDate: row.flightDate
            })
            break
          case 'preFlightNO':
            Object.assign(query, {
              flightNO: row.preFlightNO,
              flightDate: row.preFlightDate
            })
            break
          case 'inTransferBaggageCount':
          case 'outTransferBaggageCount':
            Object.assign(query, {
              flightNO: row.preFlightNO,
              flightDate: row.preFlightDate,
              fastFilter: `transferFlightNO,${row.flightNO}`
            })
            break
          case 'inTransferredBaggageCount':
          case 'outTransferredBaggageCount':
            Object.assign(query, {
              flightNO: row.flightNO,
              flightDate: row.flightDate,
              fastFilter: `inFlightNO,${row.preFlightNO}`
            })
            break
          case 'warning':
            Object.assign(query, {
              flightNO: row.flightNO,
              flightDate: row.flightDate,
              fastFilter: row['warningState'] === 1 ? 'warning' : 'alarm'
            })
            break
          default: {
            const reflect = {
              toUnload: 'toUnload', // 装车或装机后，isDEL为'DEL'，waitOFF为1
              OFFCount: 'unloaded', // 装车或装机后，isDEL为'DEL'，waitOFF为0
              unActive: 'unActive', // STATUS为'I'
              preLoad: 'preLoad', // STATUS不为'I'，isDEL不为'del'
              projectedLoad: 'preLoad',
              midIn: 'inFlightNO',
              noCheckInNumber: 'canceled', // isDEL为'DEL'
              noBSM: 'NOBSM', // 1/0
              checkInNumber: 'checkInTime',
              checkNumber: 'securityTime',
              sortNumber: 'sortTime',
              loadNumber: 'loadTime',
              boardID: 'inflTime',
              checkIns: 'checkInTime',
              numberOfDestinationArrivals: 'arrivedID', // 1/0
              uninstalled: 'unloadID', // 1/0
              loadedQuantity: 'loaded', // 'loadTime'不为空，isDEL不为'DEL'
              terminateArrivalQuantity: 'destination', // 'arrivedID'为1，transferFlightNO为null
              numberOfContainers: 'inContainer', // 有容器ID
              numberOfBulk: 'FBULK' // 容器ID为'FBULK'
            }
            Object.assign(query, {
              flightNO: row.flightNO,
              flightDate: row.flightDate,
              fastFilter: reflect[column.property]
            })
            break
          }
        }
        switch (this.$route.path.split('/').at(-1)) {
          case 'departure':
            Object.assign(query, {
              departureAirport: this.formData.currentAirport ?? '',
              landingAirport: row.targetAirport ?? ''
            })
            break
          case 'arrival':
            Object.assign(query, {
              departureAirport: row.departureAirport ?? '',
              landingAirport: this.formData.currentAirport ?? ''
            })
            break
          case 'transferDeparture':
          case 'transferArrival':
            Object.assign(query, {
              departureAirport: row.preAirport ?? '',
              landingAirport: row.targetAirport ?? ''
            })
            break
          default:
            break
        }
        this.$router.push({
          path,
          query
        })
      }
    }
  }
}