/* * @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 } }, created() { this.setFilterAndSort(this.tableCols) }, updated() { this.setTableHeight() }, activated() { this.setTableHeight() }, 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(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: { // 设置表格高度 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 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' ].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', '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') } return classes.join(' ') }, cellClickHandler(row, column, cell, event) { if ( [ 'flightNO', 'preFlightNO', 'inTransferBaggageCount', 'inTransferredBaggageCount', 'outTransferBaggageCount', 'outTransferredBaggageCount', 'tounLoad', 'OFFCount', 'checkInNumber', 'unActive', 'preLoad', '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 }) switch (column.property) { case 'flightNO': this.$router.push({ path: `${this.$route.path}/flightView`, query: { flightNO: row.flightNO, flightDate: row.flightDate } }) break case 'preFlightNO': this.$router.push({ path: '/transfer/arrival/flightView', query: { flightNO: row.preFlightNO, flightDate: row.flightDate } }) break case 'inTransferBaggageCount': this.$router.push({ path: '/advance', query: { flightNO: row.preFlightNO, transferDeparture: row.flightNO, startDate: row.preFlightDate, endDate: row.preFlightDate, departureStation: row.preAirport, destination: this.formData.currentAirport } }) break case 'inTransferredBaggageCount': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, transferArrival: row.preFlightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport } }) break case 'outTransferBaggageCount': this.$router.push({ path: '/advance', query: { flightNO: row.preFlightNO, transferDeparture: row.flightNO, startDate: row.preFlightDate, endDate: row.preFlightDate, departureStation: row.preAirport, destination: this.formData.currentAirport } }) break case 'outTransferredBaggageCount': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, transferArrival: row.preFlightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport } }) break case 'tounLoad': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, unLoad: 0 } }) break case 'OFFCount': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, unLoad: 1 } }) break // case 'checkInNumber': // this.$router.push({ // path: '/advance', // query: { // flightNO: row.flightNO, // startDate: row.flightDate, // endDate: row.flightDate, // departureStation: this.formData.currentAirport, // destination: row.targetAirport, // checkIn: 1 // } // }) // break case 'unActive': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, active: 0 } }) break case 'preLoad': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, active: 1, canceled: 0 } }) break case 'midIn': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, transferIn: 1 } }) break case 'noCheckInNumber': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, canceled: 1 } }) break case 'noBSM': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, noBSM: 0 } }) break case 'checkInNumber': case 'checkNumber': case 'sortNumber': { const reflect = { checkInNumber: '值机', checkNumber: '安检', sortNumber: '分拣' } this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, status: reflect[column.property] } }) } break case 'loadNumber': case 'boardID': { const reflect = { loadNumber: '装车', boardID: '装机' } this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: this.formData.currentAirport, destination: row.targetAirport, status: reflect[column.property], canceled: 0 } }) } break case 'checkIns': case 'numberOfDestinationArrivals': case 'uninstalled': { const reflect = { checkIns: '值机', numberOfDestinationArrivals: '到达', uninstalled: '卸机' } this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: row.departureAirport, destination: this.formData.currentAirport, status: reflect[column.property] } }) } break case 'projectedLoad': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: row.departureAirport, destination: this.formData.currentAirport, active: 1, canceled: 0 } }) break case 'loadedQuantity': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: row.departureAirport, destination: this.formData.currentAirport, status: '装车', canceled: 0 } }) break case 'terminateArrivalQuantity': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: row.departureAirport, destination: this.formData.currentAirport, status: '到达', transferIn: 0 } }) break case 'numberOfContainers': case 'numberOfBulk': this.$router.push({ path: '/advance', query: { flightNO: row.flightNO, startDate: row.flightDate, endDate: row.flightDate, departureStation: row.departureAirport, destination: this.formData.currentAirport, loadType: column.property === 'numberOfContainers' ? 0 : 1 } }) break default: break } } } } }