5.23问题修改

src/components/TableHeaderCellWithFilter/index.vue

@@ -0,0 +1,94 @@
+<!--
+ * @Author: Badguy
+ * @Date: 2022-05-25 14:09:35
+ * @LastEditTime: 2022-05-25 14:53:56
+ * @LastEditors: your name
+ * @Description: 表头下拉筛选
+ * have a nice day!
+-->
+<template>
+  <el-popover
+    placement="bottom"
+    trigger="click"
+    @show="expand = true"
+    @hide="expand = false"
+  >
+    <i
+      slot="reference"
+      :class="['filter-arrow', 'el-icon-arrow-down', { 'arrow-active': active, 'arrow-expand': expand }]"
+    />
+    <el-form>
+      <el-form-item :label="label">
+        <el-select
+          v-model="selection"
+          size="small"
+          placeholder="筛选"
+          default-first-option
+          filterable
+          clearable
+          @change="newVal => { $emit('update:filter-value', newVal) }"
+        >
+          <el-option
+            v-for="(option, optionIndex) in filterOptions"
+            :key="option.value + optionIndex"
+            :value="option.value"
+            :label="option.text"
+          />
+        </el-select>
+      </el-form-item>
+    </el-form>
+  </el-popover>
+</template>
+
+<script>
+export default {
+  name: 'TableHeaderCellWithFilter',
+  props: {
+    filterOptions: {
+      type: Array,
+      required: true
+    },
+    filterValue: {
+      type: String || Number,
+      required: true
+    },
+    label: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      selection: '',
+      expand: false
+    }
+  },
+  computed: {
+    active() {
+      return (this.selection ?? '') !== ''
+    }
+  },
+  watch: {
+    filterValue(val) {
+      this.selection = val
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.filter-arrow {
+  cursor: pointer;
+  transition: 0.3s transform;
+  &.arrow-expand {
+    transform: rotate(-180deg);
+  }
+  &.arrow-active {
+    color: #2d7cff;
+    font-weight: bold;
+  }
+}
+.el-select-dropdown__item.hover {
+  background: #d2d6df;
+}
+</style>

src/utils/table.js

@@ -1,7 +1,7 @@
 /*
  * @Author: Badguy
  * @Date: 2022-02-11 09:20:58
- * @LastEditTime: 2022-05-24 15:32:16
+ * @LastEditTime: 2022-05-25 17:55:05
  * @LastEditors: your name
  * @Description: 表格用
  * have a nice day!
@@ -65,11 +65,11 @@ export function mergeTableRow(config) {
 
 // 表格单元格class设置
 export function commonTableCellClass({ row, column, rowIndex, columnIndex }) {
-  let classString = ''
+  const classes = []
   if (['ActualDepartureTime', 'ActualLandingTime'].includes(column.property)) {
-    classString += 'pre-line'
+    classes.push('pre-line')
   }
-  return classString
+  return classes
 }
 
 // 获取对应时区的时间

src/views/advancedQuery/views/advancedHome.vue

@@ -63,23 +63,29 @@
         show-summary
         :cell-class-name="cellClass"
         :summary-method="summaryRow(tableData.length)"
-        :span-method="arraySpanMethod"
-        @cell-click="cellClick"
+        :span-method="objectSpanMethod"
+        @cell-click="cellClickHandler"
       >
         <el-table-column
-          v-for="item in tableCols"
-          :key="item.prop"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
-          :sortable="item.sortable"
-          :filters="tableDataFilters[item.prop]"
-          :filter-method="tableDataFilters[item.prop] && filterHandler"
-          filter-placement="top"
+          v-for="col in tableCols"
+          :key="col.prop"
+          :prop="col.prop"
+          :label="col.label"
+          :width="col.width"
+          :sortable="col.sortable"
         >
-          <!-- <template slot-scope="scope">
-            <a href="javascript:void(0);">{{ scope.row[item.prop] }}</a>
-          </template> -->
+          <template #header>
+            <div class="table-header-cell">
+              <span>{{ col.label }}</span>
+              <template v-if="tableDataFilters[col.prop]">
+                <TableHeaderCellWithFilter
+                  :label="col.label"
+                  :filter-options="tableDataFilters[col.prop]"
+                  :filter-value.sync="filterValues[col.prop]"
+                />
+              </template>
+            </div>
+          </template>
         </el-table-column>
       </el-table>
     </div>
@@ -128,7 +134,7 @@
         ref="dialog"
         class="rowDialog"
         :tabindex="0"
-        @keyup.enter="onCheckGj"
+        @keyup.enter="onCheckGj(1)"
         @keyup.self.esc="gjFlag=false"
       >
         <div class="title">高级查询</div>
@@ -308,7 +314,7 @@
             size="medium"
             class="r24"
             type="primary"
-            @click="onCheckGj"
+            @click="onCheckGj(1)"
           >确定</el-button>
           <el-button
             size="medium"
@@ -326,11 +332,12 @@ import Dialog from '@/layout/components/Dialog'
 import { parseTime } from '@/utils/index'
 import { queryMap, myQuery } from '@/api/dataIntegration'
 import { mapGetters } from 'vuex'
+import TableHeaderCellWithFilter from '@/components/TableHeaderCellWithFilter'
 import { setTableFilters } from '@/utils/table'
 
 export default {
   name: 'Advance',
-  components: { Search, Dialog },
+  components: { Search, Dialog, TableHeaderCellWithFilter },
   data() {
     return {
       loading: false,
@@ -588,6 +595,21 @@ export default {
         PreFlightNONotNull: [],
         PreFlightNONull: []
       },
+      filterValues: {
+        FlightNO: '',
+        FlightDate: '',
+        SourceAirport: '',
+        TargetAirport: '',
+        PassengerNameUpcase: '',
+        SpecialType: '',
+        deleted: '',
+        activated: '',
+        latestStatus: '',
+        bagLocation: '',
+        U_Device_ID: '',
+        PreFlightNONotNull: '',
+        PreFlightNONull: ''
+      },
       spanArr: [],
       contactDot: 0
     }
@@ -666,15 +688,17 @@ export default {
     dialogFocus() {
       this.$refs['dialog'].focus()
     },
-    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
-      for (let i = 0; i < 5; i++) {
-        if (columnIndex === i) {
-          const _row = this.spanArr[rowIndex]
-          const _col = _row > 0 ? 1 : 0
-          return {
-            rowspan: _row,
-            colspan: _col
-          }
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      if (
+        ['FlightDate', 'DepartureTime', 'SourceAirport', 'TargetAirport', 'PassengerNameUpcase', 'BagWeight'].includes(
+          column.property
+        )
+      ) {
+        const _row = this.spanArr[rowIndex]
+        const _col = _row > 0 ? 1 : 0
+        return {
+          rowspan: _row,
+          colspan: _col
         }
       }
     },
@@ -695,7 +719,7 @@ export default {
       }
       return classString
     },
-    cellClick(row, column, cell, event) {
+    cellClickHandler(row, column, cell, event) {
       if (['FlightNO', 'TransferFlightNO', 'BagSN'].includes(column.property)) {
         this.$store.dispatch('keepAlive/addClickedCell', {
           row,
@@ -755,18 +779,19 @@ export default {
         // const top2 = /^[a-zA-Z]{2}\w*$/
         const top2 = /^([a-zA-Z][0-9])|([0-9][a-zA-Z])|([a-zA-Z]{2})/
         const num = /^[0-9]+$/
+        const bagNo = /^[a-zA-Z]{2}[0-9]{6}$/
         // 纯字母则为旅客姓名
         if (az.test(val)) {
           this.form['passengerName'] = val
-          this.onCheckGj()
+          this.onCheckGj(1)
         } else if (azNum.test(val) && top2.test(val)) {
           // 字母加数字且前两位为字母则为航班号
           this.form['FlightNO'] = val
-          this.onCheckGj()
-        } else if (num.test(val) && val.length === 10) {
+          this.onCheckGj(1)
+        } else if ((num.test(val) && val.length === 10) || bagNo.test(val)) {
           // 纯数字且位数等于10则为行李牌号
           this.form['baggageNO'] = val
-          this.onCheckGj()
+          this.onCheckGj(1)
         } else {
           this.$message.error('请先输入有效查询信息如航班号、旅客姓名首字母、行李牌号')
         }
@@ -778,7 +803,7 @@ export default {
       this.tableData = []
     },
     // 高级查询-确定
-    onCheckGj() {
+    onCheckGj(flag) {
       /* 参数顺序
       【航班开始日期，航班结束日期，航班号，航班号，行李牌号，行李牌号，起飞站，起飞站，目的站，目的站，特殊行李类型，特殊行李类型，旅客姓名大写拼音，旅客姓名大写拼音，
       PNR，PNR，值机号，值机号，中转进航班，中转进航班，中转出航班，中转出航班，容器编号，容器编号，
@@ -830,7 +855,7 @@ export default {
             canceled,
             status
           )
-          this.statItemsQueryByStatMain(this.dataContent)
+          this.statItemsQueryByStatMain(this.dataContent, flag)
           this.gjFlag = false
         }
       } else {
@@ -852,12 +877,47 @@ export default {
       })
     },
     // 数据查询
-    async statItemsQueryByStatMain(dataContent) {
+    async statItemsQueryByStatMain(dataContent, flag) {
       this.loading = true
       this.tableData = []
       try {
         const result = await myQuery(queryMap.advacedQuery, ...dataContent)
         if (result.length) {
+          if (flag) {
+            if (result.length === 1) {
+              this.$router.push({
+                path: '/advance/baggageView',
+                query: {
+                  BagSN: result[0].BagSN,
+                  FlightNO: result[0].FlightNO,
+                  FlightDate: result[0].FlightDate
+                }
+              })
+            } else {
+              const onlyFlight = result.reduce((pre, curr) => {
+                if (
+                  pre === null ||
+                  (curr.FlightNO &&
+                    curr.FlightDate &&
+                    curr.FlightNO === pre.FlightNO &&
+                    curr.FlightDate === pre.FlightDate)
+                ) {
+                  return {
+                    FlightNO: curr.FlightNO,
+                    FlightDate: curr.FlightDate
+                  }
+                } else {
+                  return {}
+                }
+              }, null)
+              if (onlyFlight.FlightNO) {
+                this.$router.push({
+                  path: '/advance/flightView',
+                  query: onlyFlight
+                })
+              }
+            }
+          }
           const tableData = this._.sortBy(result, ['FlightNO', 'FlightDate'])
           this.spanArr = []
           let contactDot = this.contactDot
@@ -912,10 +972,6 @@ export default {
     //     console.log('出错了', error)
     //   }
     // },
-    filterHandler(value, row, column) {
-      const property = column['property']
-      return row[property] === value
-    },
     // 统计行数
     summaryRow(num) {
       return function () {
@@ -982,6 +1038,9 @@ export default {
       .cell {
         font-weight: bold;
         color: #101116;
+        .table-header-cell {
+          display: inline-block;
+        }
       }
 
       .has-gutter {

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-24 18:05:27
+ * @LastEditTime: 2022-05-25 15:03:47
  * @LastEditors: your name
  * @Description: 进港01
 -->
@@ -156,59 +156,34 @@
         border
         stripe
         fit
-        @cell-click="cellClick"
+        @cell-click="cellClickHandler"
       >
         <el-table-column
-          v-for="(item, index) in tableColsCopy"
-          :key="index"
-          :prop="item.prop"
-          :label="item.label"
+          v-for="col in tableColsCopy"
+          :key="col.prop"
+          :prop="col.prop"
+          :label="col.label"
         >
           <el-table-column
-            v-for="(col, i) in item.children"
-            :key="i"
-            :prop="col.prop"
-            :label="col.label"
-            :width="col.width"
+            v-for="childCol in col.children"
+            :key="childCol.prop"
+            :prop="childCol.prop"
+            :label="childCol.label"
+            :width="childCol.width"
           >
             <template #header>
               <el-tooltip
-                :content="col.label"
+                :content="childCol.label"
                 placement="top"
               >
                 <div class="table-header-cell">
-                  <span>{{ col.label }}</span>
-                  <template v-if="tableDataFilters[col.prop]">
-                    <el-popover
-                      placement="bottom"
-                      trigger="click"
-                      @show="popoverShowHandler(col.prop)"
-                      @hide="popoverHideHandler"
-                    >
-                      <i
-                        slot="reference"
-                        :class="['filter-arrow', 'el-icon-arrow-down', arrowClass(col.prop)]"
-                      />
-                      <el-form>
-                        <el-form-item :label="col.label">
-                          <el-select
-                            v-model="filterValues[col.prop]"
-                            size="small"
-                            placeholder="筛选"
-                            default-first-option
-                            filterable
-                            clearable
-                          >
-                            <el-option
-                              v-for="(option, optionIndex) in tableDataFilters[col.prop]"
-                              :key="option.value + optionIndex"
-                              :value="option.value"
-                              :label="option.text"
-                            />
-                          </el-select>
-                        </el-form-item>
-                      </el-form>
-                    </el-popover>
+                  <span>{{ childCol.label }}</span>
+                  <template v-if="tableDataFilters[childCol.prop]">
+                    <TableHeaderCellWithFilter
+                      :label="childCol.label"
+                      :filter-options="tableDataFilters[childCol.prop]"
+                      :filter-value.sync="filterValues[childCol.prop]"
+                    />
                   </template>
                 </div>
               </el-tooltip>
@@ -263,11 +238,12 @@ import terminalMixin from '../../mixins/terminal'
 import formMixin from '../../mixins/form'
 import tableColsMixin from '../../mixins/tableCols'
 import { getQuery } from '@/api/flight'
+import TableHeaderCellWithFilter from '@/components/TableHeaderCellWithFilter'
 import { setTableFilters } from '@/utils/table'
 
 export default {
   name: 'DepartureTerminalView',
-  components: { Dialog, TimeZoneSelector },
+  components: { Dialog, TimeZoneSelector, TableHeaderCellWithFilter },
   mixins: [terminalMixin, formMixin, tableColsMixin],
   data() {
     return {
@@ -409,14 +385,6 @@ export default {
         }
       ],
       AirportList: [],
-      FlightNOFilterOptions: [],
-      FlightDateFilterOptions: [],
-      asarrivalTimeFilterOptions: [],
-      departureTerminalFilterOptions: [],
-      arrivalTerminalFilterOptions: [],
-      luggageCarouselFilterOptions: [],
-      parkingSpaceFilterOptions: [],
-      numberOfContainersFilterOptions: [],
       tableDataFilters: {
         FlightNO: [],
         FlightDate: [],
@@ -439,32 +407,10 @@ export default {
       },
       loopEvent: null,
       leaveCount: 0,
-      baggageCount: 0,
-      colShowFilter: ''
+      baggageCount: 0
     }
   },
   computed: {
-    arrowClass() {
-      return function (prop) {
-        let classString = ''
-        if (this.colShowFilter === prop) {
-          classString += ' arrow-active'
-        }
-        if (Object.entries(this.tableDataFilters).find(([key, arr]) => this.filterValues[prop])) {
-          classString += ' arrow-blue'
-        }
-        return classString
-      }
-    },
-    // filterOptions() {
-    //   return function (prop) {
-    //     if (Object.keys(this.filterValues).includes(prop)) {
-    //       return this[`${prop}FilterOptions`]
-    //     } else {
-    //       return false
-    //     }
-    //   }
-    // },
     filteredTableData() {
       return this.tableData.filter(item => {
         let flag = true
@@ -511,12 +457,6 @@ export default {
         console.log('出错了', error)
       }
     },
-    popoverShowHandler(prop) {
-      this.colShowFilter = prop
-    },
-    popoverHideHandler() {
-      this.colShowFilter = ''
-    },
     tableRowClassName({ row, rowIndex }) {
       if (row.hasTakenOff === 0) {
         if (rowIndex === this.leaveCount - 1) {
@@ -579,21 +519,6 @@ export default {
       this.tableData = this._.sortBy(tableData, ['FlightDate', 'PlanDepartureTime'])
       setTableFilters(this.tableData, this.tableDataFilters)
       this.toOrderNum(this.baggageCount)
-      // const tableDataFilters = setTableFilters(this.tableData, [
-      //   'FlightNO',
-      //   'FlightDate',
-      //   'asarrivalTime',
-      //   'departureTerminal',
-      //   'arrivalTerminal',
-      //   'luggageCarousel',
-      //   'parkingSpace',
-      //   'numberOfContainers'
-      // ])
-      // Object.entries(tableDataFilters).forEach(([key, arr]) => {
-      //   arr.forEach((item, index) => {
-      //     this.$set(this[`${key}FilterOptions`], index, item)
-      //   })
-      // })
       // setInterval(() => {
       //   this.baggageCount = this.baggageCount+1;
       //    // 这里输入数字即可调用
@@ -805,18 +730,4 @@ export default {
     }
   }
 }
-.filter-arrow {
-  cursor: pointer;
-  transition: 0.3s transform;
-  &.arrow-active {
-    transform: rotate(-180deg);
-  }
-  &.arrow-blue {
-    color: #2d7cff;
-    font-weight: bold;
-  }
-}
-.el-select-dropdown__item.hover {
-  background: #d2d6df;
-}
 </style>

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-24 15:44:20
+ * @LastEditTime: 2022-05-25 18:10:04
  * @LastEditors: your name
  * @Description: 行李视图
 -->
@@ -780,9 +780,6 @@ export default {
           width: 100%;
           overflow-x: scroll;
           overflow-y: hidden;
-          > span {
-            z-index: 1;
-          }
         }
         .stepLine {
           width: 100%;
@@ -814,6 +811,7 @@ export default {
           align-items: center;
           // padding-top: 19px;
           justify-content: center;
+          z-index: 1;
           .head {
             font-size: 14px;
           }

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-18 17:53:37
+ * @LastEditTime: 2022-05-25 17:55:08
  * @LastEditors: your name
  * @Description: 离港01
 -->
@@ -148,7 +148,7 @@
         ref="table"
         class="table"
         height="calc(100vh - 177px)"
-        :data="tableData"
+        :data="filteredTableData"
         :header-cell-class-name="headerCellClassName"
         :row-class-name="tableRowClassName"
         show-summary
@@ -157,20 +157,32 @@
         border
         stripe
         fit
-        @cell-click="cellClick"
+        @cell-click="cellClickHandler"
       >
         <el-table-column
-          v-for="(item,index) in tableColsCopy"
-          :key="index"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
+          v-for="col in tableColsCopy"
+          :key="col.prop"
+          :prop="col.prop"
+          :label="col.label"
+          :width="col.width"
           :formatter="tableFormat"
-          :filters="tableDataFilters[item.prop]"
-          :filter-method="tableDataFilters[item.prop] && filterHandler"
         >
           <template slot="header">
-            <el-tooltip :content="item.label" placement="top"><span>{{ item.label }}</span></el-tooltip>
+            <el-tooltip
+              :content="col.label"
+              placement="top"
+            >
+              <div class="table-header-cell">
+                <span>{{ col.label }}</span>
+                <template v-if="tableDataFilters[col.prop]">
+                  <TableHeaderCellWithFilter
+                    :label="col.label"
+                    :filter-options="tableDataFilters[col.prop]"
+                    :filter-value.sync="filterValues[col.prop]"
+                  />
+                </template>
+              </div>
+            </el-tooltip>
           </template>
         </el-table-column>
       </el-table>
@@ -222,11 +234,12 @@ import formMixin from '../../mixins/form'
 import tableColsMixin from '../../mixins/tableCols'
 import timeZoneMixin from '../../mixins/timeZone'
 import { getQuery } from '@/api/flight'
+import TableHeaderCellWithFilter from '@/components/TableHeaderCellWithFilter'
 import { setTableFilters } from '@/utils/table'
 
 export default {
   name: 'DepartureTerminalView',
-  components: { Dialog, TimeZoneSelector },
+  components: { Dialog, TimeZoneSelector, TableHeaderCellWithFilter },
   mixins: [terminalMixin, formMixin, tableColsMixin, timeZoneMixin],
   data() {
     return {
@@ -293,7 +306,7 @@ export default {
           label: '装车'
         },
         {
-          prop: 'loadNumber',
+          prop: 'loadNumberCopy',
           label: '装机'
         },
         {
@@ -335,11 +348,33 @@ export default {
         StandForDepartrue: [],
         DepartureBuild: []
       },
+      filterValues: {
+        FlightNO: '',
+        FlightDate: '',
+        PlanDepartureTime: '',
+        TargetAirport: '',
+        BordingGate: '',
+        StandForDepartrue: '',
+        DepartureBuild: ''
+      },
       loopEvent: null,
       leaveCount: 0,
       baggageCount: 0
     }
   },
+  computed: {
+    filteredTableData() {
+      return this.tableData.filter(item => {
+        let flag = true
+        Object.entries(this.filterValues).forEach(([key, value]) => {
+          if (value !== '' && item[key] !== value) {
+            flag = false
+          }
+        })
+        return flag
+      })
+    }
+  },
   created() {
     this.getAirPortData()
   },
@@ -375,7 +410,7 @@ export default {
     },
     tableRowClassName({ row, rowIndex }) {
       if (row.flightStatus === 'DLY') {
-        return 'bgl-orange'
+        return 'bgl-huang'
       }
       if (row.hasTakenOff === 0) {
         if (rowIndex === this.leaveCount - 1) {
@@ -429,6 +464,7 @@ export default {
           this.leaveCount++
         }
         item['waitfanj'] = item['noCheckInNumber'] - item['unLoad']
+        item['loadNumberCopy'] = item['loadNumber']
         this.baggageCount = this.baggageCount + item.preLoad
       })
       this.tableData = this._.sortBy(tableData, ['hasTakenOff', 'PlanDepartureTime'])
@@ -641,7 +677,10 @@ export default {
           }
         }
       }
-      tr.bgl-orange td {
+      tr.bgl-huang td {
+        background: #fcf0b1;
+      }
+      .cell-warning {
         background: orange;
       }
     }

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-20 18:01:29
+ * @LastEditTime: 2022-05-25 18:41:54
  * @LastEditors: your name
  * @Description: 航班视图
 -->
@@ -181,11 +181,11 @@
           @row-click="containeClick"
         >
           <el-table-column
-            v-for="item in containerTableColumn"
-            :key="item.id"
-            :prop="item.prop"
-            :label="item.name"
-            :align="item.align || 'center'"
+            v-for="col in containerTableColumn"
+            :key="col.id"
+            :prop="col.prop"
+            :label="col.name"
+            :align="col.align || 'center'"
             :show-overflow-tooltip="true"
           />
         </el-table>
@@ -206,14 +206,15 @@
           show-summary
           :summary-method="summaryMethod"
           :header-cell-style="{ color: '#101116' }"
-          @row-click="transferBaggageInTableClickHandler"
+          :cell-class-name="cellClass"
+          @cell-click="cellClickHandler"
         >
           <el-table-column
-            v-for="item in transferInTableColumn"
-            :key="item.id"
-            :prop="item.prop"
-            :label="item.name"
-            :align="item.align || 'center'"
+            v-for="col in transferInTableColumn"
+            :key="col.id"
+            :prop="col.prop"
+            :label="col.name"
+            :align="col.align || 'center'"
             :show-overflow-tooltip="true"
           />
         </el-table>
@@ -234,14 +235,15 @@
           show-summary
           :summary-method="summaryMethod"
           :header-cell-style="{ color: '#101116' }"
-          @row-click="transferBaggageOutTableClickHandler"
+          :cell-class-name="cellClass"
+          @cell-click="cellClickHandler"
         >
           <el-table-column
-            v-for="item in transferOutTableColumn"
-            :key="item.id"
-            :prop="item.prop"
-            :label="item.name"
-            :align="item.align || 'center'"
+            v-for="col in transferOutTableColumn"
+            :key="col.id"
+            :prop="col.prop"
+            :label="col.name"
+            :align="col.align || 'center'"
             :show-overflow-tooltip="true"
           />
         </el-table>
@@ -292,20 +294,30 @@
           :summary-method="summaryRow(flightBaggageTableData.length)"
           :header-cell-style="{ color: '#101116' }"
           :cell-class-name="cellClass"
-          @row-click="flightBaggageTableClickHandler"
+          @cell-click="cellClickHandler"
         >
           <el-table-column
-            v-for="item in tableColsCopy"
-            :key="item.index"
-            :prop="item.prop"
-            :label="item.name"
-            :align="item.align || 'center'"
-            :width="item.width"
+            v-for="col in tableColsCopy"
+            :key="col.index"
+            :prop="col.prop"
+            :label="col.name"
+            :align="col.align || 'center'"
+            :width="col.width"
             :formatter="tableFormat"
-            :filters="flightBaggageTableFilters[item.prop]"
-            :filter-method="flightBaggageTableFilters[item.prop] && filterHandler"
-            filter-placement="top"
-          />
+          >
+            <template #header>
+              <div class="table-header-cell">
+                <span>{{ col.name }}</span>
+                <template v-if="flightBaggageTableFilters[col.prop]">
+                  <TableHeaderCellWithFilter
+                    :label="col.name"
+                    :filter-options="flightBaggageTableFilters[col.prop]"
+                    :filter-value.sync="filterValues[col.prop]"
+                  />
+                </template>
+              </div>
+            </template>
+          </el-table-column>
         </el-table>
       </div>
     </div>
@@ -353,6 +365,7 @@ import TimeZoneSelector from '@/components/TimeZoneSelector'
 import { queryMap, myQuery } from '@/api/dataIntegration'
 import tableColsMixin from '../../mixins/tableCols'
 import timeZoneMixin from '../../mixins/timeZone'
+import TableHeaderCellWithFilter from '@/components/TableHeaderCellWithFilter'
 import { setTableFilters } from '@/utils/table'
 
 // const arrivalBaggageTableColumn = [
@@ -405,7 +418,8 @@ export default {
   name: 'FlightView',
   components: {
     Dialog,
-    TimeZoneSelector
+    TimeZoneSelector,
+    TableHeaderCellWithFilter
   },
   mixins: [tableColsMixin, timeZoneMixin],
   data() {
@@ -455,7 +469,15 @@ export default {
         SpecialType: [],
         U_Device_ID: [],
         latestStatus: []
-      }
+      },
+      filterValues: {
+        PassengerNameUpcase: '',
+        BagSN: '',
+        SpecialType: '',
+        U_Device_ID: '',
+        latestStatus: ''
+      },
+      warningContainers: []
     }
   },
   created() {
@@ -474,8 +496,82 @@ export default {
   },
   methods: {
     cellClass({ row, column, rowIndex, columnIndex }) {
+      const classes = []
       if (['checkIn', 'security', 'sorting', 'loading', 'installed'].includes(column.property)) {
-        return 'pre-line'
+        classes.push('pre-line')
+      }
+      if (
+        ['PreFlightNO', 'totalNumber', 'TransferFlightNO', 'transferNumber', 'PassengerNameUpcase', 'BagSN'].includes(
+          column.property
+        )
+      ) {
+        classes.push('cell-click')
+      }
+      if (
+        (column.property === 'latestStatus' && row[column.property] === '待翻减') ||
+        this.warningContainers.includes(row['containerNumber'])
+      ) {
+        classes.push('cell-warning')
+      }
+      return classes.join(' ')
+    },
+    cellClickHandler(row, column, cell, event) {
+      switch (column.property) {
+        case 'PreFlightNO':
+          this.$router.push({
+            path: '/advance/flightView',
+            query: {
+              FlightNO: row.PreFlightNO,
+              FlightDate: row.PreFlightDate
+            }
+          })
+          break
+        case 'totalNumber':
+          this.$router.push({
+            path: '/advance',
+            query: {
+              FlightNO: this.queryData.FlightNO,
+              startDate: this.queryData.FlightDate,
+              endDate: this.queryData.FlightDate,
+              transferArrival: row.PreFlightNO
+            }
+          })
+          break
+        case 'TransferFlightNO':
+          this.$router.push({
+            path: '/advance/flightView',
+            query: {
+              FlightNO: row.TransferFlightNO,
+              FlightDate: row.TransferFlightDate
+            }
+          })
+          break
+        case 'transferNumber':
+          this.$router.push({
+            path: '/advance',
+            query: {
+              FlightNO: this.queryData.FlightNO,
+              startDate: this.queryData.FlightDate,
+              endDate: this.queryData.FlightDate,
+              transferDeparture: row.TransferFlightNO
+            }
+          })
+          break
+        case 'PassengerNameUpcase':
+          this.$message.info('开发中')
+          break
+        case 'BagSN':
+          this.$router.push({
+            path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/baggageView`,
+            query: {
+              BagSN: row.BagSN,
+              FlightNO: this.queryData.FlightNO,
+              FlightDate: this.queryData.FlightDate
+            }
+          })
+          break
+        default:
+          break
       }
     },
     // 合计行
@@ -531,38 +627,6 @@ export default {
         }
       })
     },
-    transferBaggageInTableClickHandler(row) {
-      this.$router.push({
-        path: '/advance',
-        query: {
-          FlightNO: this.queryData.FlightNO,
-          transferArrival: row.PreFlightNO,
-          startDate: this.queryData.FlightDate,
-          endDate: this.queryData.FlightDate
-        }
-      })
-    },
-    transferBaggageOutTableClickHandler(row) {
-      this.$router.push({
-        path: '/advance',
-        query: {
-          FlightNO: this.queryData.FlightNO,
-          transferDeparture: row.TransferFlightNO,
-          startDate: this.queryData.FlightDate,
-          endDate: this.queryData.FlightDate
-        }
-      })
-    },
-    flightBaggageTableClickHandler(row) {
-      this.$router.push({
-        path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/baggageView`,
-        query: {
-          BagSN: row.BagSN,
-          FlightNO: this.queryData.FlightNO,
-          FlightDate: this.queryData.FlightDate
-        }
-      })
-    },
     queryflightInfo(dataContent) {
       return myQuery(queryMap.flightInfo, ...dataContent)
     },
@@ -603,7 +667,11 @@ export default {
           item['flightTime'] = item['flightDate'] ? item['flightDate'].split('T')[1] : ''
           return item
         })
+
+        this.warningContainers = []
         this.flightBaggageTableData = flightBaggageTableData.map((item, index) => {
+          item['latestStatus'] === '待翻减' && this.warningContainers.push(item['U_Device_ID'])
+
           item['checkIn'] = `${item['checkIn'] ?? ''}\n${item['checkInTime'] ?? ''}`
           // item['latestStatus'] = item['Status'] === 'DEL' ? '删除' : item['latestStatus']
           item['security'] = `${item['DealInfo'] ?? ''}\n${item['DealTime'] ?? ''}`
@@ -743,5 +811,17 @@ export default {
       }
     }
   }
+  ::v-deep .el-table {
+    .cell-click {
+      cursor: pointer;
+      color: #2d7cff;
+      &.cell-clicked {
+        color: purple;
+      }
+    }
+    .cell-warning {
+      background: orange;
+    }
+  }
 }
 </style>

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-18 17:08:25
+ * @LastEditTime: 2022-05-25 16:28:12
  * @LastEditors: your name
  * @Description: 离港01
 -->
@@ -187,7 +187,7 @@
         border
         stripe
         fit
-        @cell-click="cellClick"
+        @cell-click="cellClickHandler"
       >
         <el-table-column
           v-for="(item, index) in tableColsCopy"
@@ -380,15 +380,15 @@ export default {
       AirportList: [],
       carrierProps: [],
       carrierPropsop: [],
-      tableDataFilters: {
-        FlightNO: [],
-        FlightDate: [],
-        PlanDepartureTime: [],
-        TargetAirport: [],
-        BordingGate: [],
-        StandForDepartrue: [],
-        DepartureBuild: []
-      },
+      // tableDataFilters: {
+      //   FlightNO: [],
+      //   FlightDate: [],
+      //   PlanDepartureTime: [],
+      //   TargetAirport: [],
+      //   BordingGate: [],
+      //   StandForDepartrue: [],
+      //   DepartureBuild: []
+      // },
       loopEvent: null,
       leaveCount: 0,
       baggageCount: 0,
@@ -402,6 +402,11 @@ export default {
     // this.getAviationData();
     // this.upAviationData();
     this.getAirPortData()
+    Object.entries(this.$route.query).forEach(([key, value]) => {
+      if (JSON.stringify(value) !== '[]') {
+        this.formData[key] = value
+      }
+    })
   },
   mounted() {
     // this.arraySpanMethod();
@@ -423,7 +428,8 @@ export default {
   methods: {
     changeView() {
       this.$router.replace({
-        path: '/transfer/departure'
+        path: '/transfer/departure',
+        query: this.formData
       })
     },
     airPortChange() {
@@ -438,7 +444,7 @@ export default {
           id: 72,
           dataContent: []
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.AirportList = res.returnData
           this.formData.currentAirport = 'PEK'
           this.getAviationData()
@@ -458,7 +464,7 @@ export default {
           id: 71,
           dataContent: [this.formData.currentAirport]
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.carrierProps = res.returnData
           // this.getTableData();
         } else {
@@ -475,7 +481,7 @@ export default {
           id: 74,
           dataContent: [this.formData.currentAirport]
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.carrierPropsop = res.returnData
           // this.getTableData();
         } else {
@@ -540,7 +546,7 @@ export default {
           id: 69,
           dataContent: [...arr]
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           // this.tableData = this._.sortBy(res.returnData, [
           //   "FlightDate",
           //   "PlanDepartureTime",
@@ -581,17 +587,13 @@ export default {
         // item["waitfanj"] = item["noCheckInNumber"] - item["unLoad"];
         this.baggageCount = this.baggageCount + item.preLoad
       })
-      this.tableData = this._.sortBy(tableData, ['PreFlightNO', 'PreFlightDate'])
+      this.tableData = this._.sortBy(tableData, ['PreFlightDate', 'ActualLandingTime', 'FlightDate', 'ActualDepartureTime'])
       // this.toOrderNum(this.baggageCount);
       // setInterval(() => {
       //   this.baggageCount = this.baggageCount+1;
       //    // 这里输入数字即可调用
       // }, 2000);
     },
-    filterHandler(value, row, column) {
-      const property = column['property']
-      return row[property] === value
-    },
     setNumberTransform() {
       const numberItems = this.$refs.numberItem // 拿到数字的ref，计算元素数量
       const numberArr = this.orderNum.filter(item => !isNaN(item))

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-18 17:08:24
+ * @LastEditTime: 2022-05-25 16:30:40
  * @LastEditors: your name
  * @Description: 离港01
 -->
@@ -187,7 +187,7 @@
         border
         stripe
         fit
-        @cell-click="cellClick"
+        @cell-click="cellClickHandler"
       >
         <el-table-column
           v-for="(item, index) in tableColsCopy"
@@ -379,15 +379,15 @@ export default {
       AirportList: [],
       carrierProps: [],
       carrierPropsop: [],
-      tableDataFilters: {
-        FlightNO: [],
-        FlightDate: [],
-        PlanDepartureTime: [],
-        TargetAirport: [],
-        BordingGate: [],
-        StandForDepartrue: [],
-        DepartureBuild: []
-      },
+      // tableDataFilters: {
+      //   FlightNO: [],
+      //   FlightDate: [],
+      //   PlanDepartureTime: [],
+      //   TargetAirport: [],
+      //   BordingGate: [],
+      //   StandForDepartrue: [],
+      //   DepartureBuild: []
+      // },
       loopEvent: null,
       leaveCount: 0,
       baggageCount: 0,
@@ -398,6 +398,11 @@ export default {
   },
   created() {
     this.getAirPortData()
+    Object.entries(this.$route.query).forEach(([key, value]) => {
+      if (JSON.stringify(value) !== '[]') {
+        this.formData[key] = value
+      }
+    })
   },
   mounted() {
     const that = this
@@ -411,7 +416,8 @@ export default {
   methods: {
     changeView() {
       this.$router.replace({
-        path: '/transfer/arrival'
+        path: '/transfer/arrival',
+        query: this.formData
       })
     },
     airPortChange() {
@@ -426,7 +432,7 @@ export default {
           id: 72,
           dataContent: []
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.AirportList = res.returnData
           this.formData.currentAirport = 'PEK'
           this.getAviationData()
@@ -446,7 +452,7 @@ export default {
           id: 71,
           dataContent: [this.formData.currentAirport]
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.carrierProps = res.returnData
           // this.getTableData();
         } else {
@@ -463,7 +469,7 @@ export default {
           id: 74,
           dataContent: [this.formData.currentAirport]
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.carrierPropsop = res.returnData
           // this.getTableData();
         } else {
@@ -532,7 +538,7 @@ export default {
           id: 68,
           dataContent: [...arr]
         })
-        if (res.code == 0) {
+        if (Number(res.code) === 0) {
           this.tableData = res.returnData
           let contactDot = this.contactDot
           this.spanArr = []
@@ -569,7 +575,7 @@ export default {
         // item["waitfanj"] = item["noCheckInNumber"] - item["unLoad"];
         this.baggageCount = this.baggageCount + item.preLoad
       })
-      this.tableData = this._.sortBy(tableData, ['FlightDate', 'PlanDepartureTime'])
+      this.tableData = this._.sortBy(tableData, ['FlightDate', 'ActualDepartureTime', 'PreFlightDate', 'ActualLandingTime'])
       // this.toOrderNum(this.baggageCount);
       // setInterval(() => {
       //   this.baggageCount = this.baggageCount+1;

src/views/baggageManagement/mixins/form.js

@@ -1,7 +1,7 @@
 /*
  * @Author: Badguy
  * @Date: 2022-03-04 14:45:03
- * @LastEditTime: 2022-05-18 09:34:03
+ * @LastEditTime: 2022-05-25 15:36:56
  * @LastEditors: your name
  * @Description: 航站视图通用表单部分
  * have a nice day!
@@ -24,8 +24,7 @@ export default {
         flightAttr: [],
         startDate: defaultDate,
         endDate: defaultDate,
-        search: '',
-        switch: true
+        search: ''
       },
       currentAirportList: [],
       relatedAirportList: [],

src/views/baggageManagement/mixins/terminal.js

@@ -1,7 +1,7 @@
 /*
  * @Author: Badguy
  * @Date: 2022-03-04 11:41:55
- * @LastEditTime: 2022-05-19 11:52:28
+ * @LastEditTime: 2022-05-25 17:55:03
  * @LastEditors: your name
  * @Description: 航站视图通用部分
  * have a nice day!
@@ -153,12 +153,13 @@ export default {
       return sums
     },
     cellClass({ row, column, rowIndex, columnIndex }) {
-      let classString = commonTableCellClass({ row, column, rowIndex, columnIndex })
+      const classes = commonTableCellClass({ row, column, rowIndex, columnIndex })
       if (
         [
           'FlightNO',
           'PreFlightNO',
           'inTransferBaggageCount',
+          'inTransferredBaggageCount',
           'tounLoad',
           'unLoad',
           'checkInNumber',
@@ -168,7 +169,7 @@ export default {
         ].includes(column.property) &&
         row[column.property]
       ) {
-        classString += 'cell-click'
+        classes.push('cell-click')
         if (
           this.clickedCells.some(
             cell =>
@@ -177,17 +178,21 @@ export default {
               cell.columnProp === column.property
           )
         ) {
-          classString += ' cell-clicked'
+          classes.push('cell-clicked')
         }
       }
-      return classString
+      if (column === 'tounLoad' && row[column.property]) {
+        classes.push('cell-warning')
+      }
+      return classes.join(' ')
     },
-    cellClick(row, column, cell, event) {
+    cellClickHandler(row, column, cell, event) {
       if (
         [
           'FlightNO',
           'PreFlightNO',
           'inTransferBaggageCount',
+          'inTransferredBaggageCount',
           'tounLoad',
           'unLoad',
           'checkInNumber',
@@ -232,6 +237,17 @@ export default {
             }
           })
           break
+        case 'inTransferredBaggageCount':
+          this.$router.push({
+            path: '/advance',
+            query: {
+              FlightNO: row.PreFlightNO,
+              transferDeparture: row.FlightNO,
+              startDate: row.PreFlightDate,
+              endDate: row.PreFlightDate
+            }
+          })
+          break
         case 'tounLoad':
           this.$router.push({
             path: '/advance',