/* * @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", "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", "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", "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; } } }, }, };