高级查询排序修改

src/views/advancedQuery/views/advancedHome.vue

@@ -6,6 +6,7 @@
         <div class="interfaceLog_head_time_start mr10">
           <el-date-picker
             v-model="FlightDate[0]"
+            class="input-shadow"
             size="small"
             type="date"
             value-format="yyyy-MM-dd"
@@ -15,6 +16,7 @@
         <div class="interfaceLog_head_time_end">
           <el-date-picker
             v-model="FlightDate[1]"
+            class="input-shadow"
             size="small"
             type="date"
             value-format="yyyy-MM-dd"
@@ -55,7 +57,7 @@
         ref="table"
         max-height="100%"
         class="table"
-        :data="filteredTableData"
+        :data="dealedTableData"
         border
         stripe
         fit
@@ -65,6 +67,7 @@
         :cell-class-name="cellClass"
         :summary-method="summaryRow(tableData.length)"
         :span-method="objectSpanMethod"
+        :header-cell-class-name="headerCellClass"
         @cell-click="cellClickHandler"
       >
         <el-table-column
@@ -73,7 +76,6 @@
           :prop="col.prop"
           :label="col.label"
           :width="col.width"
-          :sortable="col.sortable"
         >
           <template #header>
             <div class="table-header-cell">
@@ -85,6 +87,15 @@
                   :filter-value.sync="filterValues[col.prop]"
                 />
               </template>
+              <template v-if="col.sortable">
+                <span
+                  class="caret-wrapper"
+                  @click="sortChange(col.prop)"
+                >
+                  <i class="sort-caret ascending" />
+                  <i class="sort-caret descending" />
+                </span>
+              </template>
             </div>
           </template>
         </el-table-column>
@@ -387,7 +398,8 @@ export default {
         },
         {
           prop: 'PassengerNameUpcase',
-          label: '旅客姓名'
+          label: '旅客姓名',
+          width: 150
         },
         {
           prop: 'BagSN',
@@ -396,7 +408,8 @@ export default {
         },
         {
           prop: 'SpecialType',
-          label: '特殊行李类型'
+          label: '特殊行李类型',
+          width: 115
         },
         {
           prop: 'deleted',
@@ -611,14 +624,17 @@ export default {
         PreFlightNONotNull: '',
         PreFlightNONull: ''
       },
+      tableDataSortRules: {
+        BagSN: ''
+      },
       spanArr: [],
       contactDot: 0
     }
   },
   computed: {
     ...mapGetters(['clickedCells', 'queryForm']),
-    filteredTableData() {
-      return this.tableData.filter(item => {
+    dealedTableData() {
+      const filtered = this.tableData.filter(item => {
         let flag = true
         Object.entries(this.filterValues).forEach(([key, value]) => {
           if (value !== '' && item[key] !== value) {
@@ -627,10 +643,19 @@ export default {
         })
         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: {
-    filteredTableData: {
+    dealedTableData: {
       handler(val) {
         this.spanArr = []
         let contactDot = this.contactDot
@@ -641,8 +666,7 @@ export default {
             if (
               item['FlightNO'] === arr[index - 1]['FlightNO'] &&
               item['FlightDate'] === arr[index - 1]['FlightDate'] &&
-              item['PassengerNameUpcase'] === arr[index - 1]['PassengerNameUpcase'] &&
-              item['BagWeight'] === arr[index - 1]['BagWeight']
+              item['CheckInNO'] === arr[index - 1]['CheckInNO']
             ) {
               this.spanArr[contactDot] += 1
               this.spanArr.push(0)
@@ -733,6 +757,14 @@ export default {
         }
       }
     },
+    headerCellClass({ row, column, rowIndex, columnIndex }) {
+      const classes = []
+      const rule = this.tableDataSortRules[column.property]
+      if (rule) {
+        classes.push(rule)
+      }
+      return classes.join(' ')
+    },
     cellClass({ row, column, rowIndex, columnIndex }) {
       const classes = []
       if (['FlightNO', 'TransferFlightNO', 'BagSN'].includes(column.property)) {
@@ -750,6 +782,10 @@ export default {
       }
       return classes.join(' ')
     },
+    sortChange(prop) {
+      this.tableDataSortRules[prop] =
+        this.tableDataSortRules[prop] === '' ? 'ascending' : this.tableDataSortRules[prop] === 'ascending' ? 'descending' : ''
+    },
     cellClickHandler(row, column, cell, event) {
       if (['FlightNO', 'TransferFlightNO', 'BagSN'].includes(column.property)) {
         this.$store.dispatch('keepAlive/addClickedCell', {
@@ -951,7 +987,7 @@ export default {
               }
             }
           }
-          const tableData = this._.sortBy(result, ['FlightDate', 'FlightNO', 'PassengerNameUpcase', 'BagWeight'])
+          const tableData = this._.sortBy(result, ['FlightDate', 'DepartureTime', 'PassengerNameUpcase', 'BagSN'])
           this.tableData = tableData.map((item, index, arr) => {
             item['deleted'] === 'DEL' || (item['deleted'] = '')
             item['activated'] = item['activated'] === 'I' ? '未激活' : '激活'

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-26 18:09:10
+ * @LastEditTime: 2022-05-27 09:36:44
  * @LastEditors: your name
  * @Description: 航班视图
 -->
@@ -178,6 +178,7 @@
           show-summary
           :summary-method="summaryMethod"
           :header-cell-style="{ color: '#101116' }"
+          :row-class-name="rowClass"
           @row-click="containeClick"
         >
           <el-table-column
@@ -293,6 +294,7 @@
           show-summary
           :summary-method="summaryRow(flightBaggageTableData.length)"
           :header-cell-style="{ color: '#101116' }"
+          :row-class-name="rowClass"
           :cell-class-name="cellClass"
           @cell-click="cellClickHandler"
         >
@@ -538,6 +540,13 @@ export default {
     })
   },
   methods: {
+    rowClass({ row, rowIndex }) {
+      const classes = []
+      if (this.warningContainers.includes(row['containerNumber']) || row['latestStatus'] === '待翻减') {
+        classes.push('row-warning')
+      }
+      return classes.join(' ')
+    },
     cellClass({ row, column, rowIndex, columnIndex }) {
       const classes = []
       if (
@@ -562,12 +571,6 @@ export default {
           classes.push('cell-clicked')
         }
       }
-      if (
-        (column.property === 'latestStatus' && row[column.property] === '待翻减') ||
-        this.warningContainers.includes(row['containerNumber'])
-      ) {
-        classes.push('cell-warning')
-      }
       return classes.join(' ')
     },
     cellClickHandler(row, column, cell, event) {
@@ -875,7 +878,7 @@ export default {
         color: purple;
       }
     }
-    .cell-warning {
+    .row-warning .el-table__cell {
       background: orange;
     }
   }

src/views/baggageManagement/mixins/terminal.js

@@ -1,7 +1,7 @@
 /*
  * @Author: Badguy
  * @Date: 2022-03-04 11:41:55
- * @LastEditTime: 2022-05-27 09:15:40
+ * @LastEditTime: 2022-05-27 09:49:24
  * @LastEditors: your name
  * @Description: 航站视图通用部分
  * have a nice day!
@@ -337,6 +337,9 @@ export default {
           this.$router.push({
             path: '/advance',
             query: {
+              FlightNO: row.FlightNO,
+              startDate: row.FlightDate,
+              endDate: row.FlightDate,
               status: reflect[column.property]
             }
           })