航班视图修改

src/layout/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-wrapper" @change="eveclk">
-    <sidebar class="sidebar-container" id="sidebar-container" />
+    <sidebar class="sidebar-container"/>
     <div class="main-container">
       <navbar />
       <app-main id="main-containers" />

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-06 13:38:45
+ * @LastEditTime: 2022-05-06 15:11:47
  * @LastEditors: your name
  * @Description: 行李视图
 -->
@@ -323,7 +323,7 @@ export default {
         {
           label: '投诉标记',
           content: 'complaintSign'
-      },
+        },
         {
           label: '赔偿标记',
           content: 'compensationSign'
@@ -349,7 +349,7 @@ export default {
         // }
       ],
       checkList: [],
-      stepData: new Array(11).fill({}),
+      stepData: new Array(9).fill({}),
       tableCols: [
         {
           name: '航班号',
@@ -395,7 +395,12 @@ export default {
   },
   computed: {
     lineWidth() {
-      return ((this.stepData.filter(item => item.NodeNameEN).length - 1) * 100) / 10.0 + '%'
+      for (let i = this.stepData.length - 1; i > -1; i--) {
+        if (this.stepData[i].DealTime) {
+          return (i * 100) / (this.stepData.length - 1) + '%'
+        }
+      }
+      return 0
     }
   },
   // watch: {
@@ -440,25 +445,33 @@ export default {
       const { FlightNO, FlightDate, BagSN } = queryData
       const dataContent = [FlightNO, FlightDate, BagSN]
       try {
-        const [baggageBasicInfo, baggageTrack, baggageDetails] = await Promise.all([
+        const [
+          baggageBasicInfo,
+          // baggageTrack,
+          baggageDetails
+        ] = await Promise.all([
           this.queryBaggageBasicInfo(dataContent),
-          this.queryBaggageTrack(new Array(2).fill(dataContent).flat()),
+          // this.queryBaggageTrack(new Array(2).fill(dataContent).flat()),
           this.queryBaggageDetails(new Array(6).fill(dataContent).flat())
         ])
         baggageBasicInfo.length && (this.baggageBasicInfo = baggageBasicInfo[0])
         // this._.sortBy(baggageTrack, item => item.DealTime).forEach((item, index) => {
+        //   item['DealTime'] = item['DealTime'].replace('T', '\n')
         //   item.NodeNameEN && this.stepData.splice(index, 1, item)
         // })
-        this.baggageTableData = this._.sortBy(baggageDetails, item => item.dealTime).map(item => {
-          item['dealTime'] = item['dealTime'].split('T')[1]
-          item['departureAirport'] = `${item['departureAirport']}\n${item['departureTime'].split('T')[1]}`
-          item['landingAirport'] = `${item['landingAirport']}\n${item['landingTime'].split('T')[1]}`
-          return item
-        })
-        baggageTrack.forEach((item, index) => {
-          item['DealTime'] = item['DealTime'].replace('T', '\n')
-          this.stepData.splice(index, 1, item)
-        })
+        this.baggageTableData = this._.orderBy(baggageDetails, item => new Date(item.dealTime.replace('T', ' ')).getTime()).map(
+          (item, index) => {
+            this.stepData.splice(index, 1, {
+              NodeNameEN: item.nodeCode,
+              DealTime: item.dealTime.replace('T', '\n')
+            })
+
+            item['dealTime'] = item['dealTime'].split('T')[1]
+            item['departureAirport'] = `${item['departureAirport']}\n${item['departureTime'].split('T')[1]}`
+            item['landingAirport'] = `${item['landingAirport']}\n${item['landingTime'].split('T')[1]}`
+            return item
+          }
+        )
       } catch (error) {
         console.log('错误', error)
       }

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

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-06 13:28:30
+ * @LastEditTime: 2022-05-06 16:02:54
  * @LastEditors: your name
  * @Description: 航班视图
 -->
@@ -90,7 +90,7 @@
                 <span>托运旅客数：</span>
               </el-col>
               <el-col :span="12">
-                <span>{{ flightInfo.passagernum }}</span>
+                <span>{{ flightInfo.count1 }}</span>
               </el-col>
             </el-row>
 
@@ -99,7 +99,7 @@
                 <span>终点行李数：</span>
               </el-col>
               <el-col :span="12">
-                <span>{{ flightInfo.terminus }}</span>
+                <span>{{ flightInfo.count2 }}</span>
               </el-col>
             </el-row>
 
@@ -108,7 +108,7 @@
                 <span>中转行李数：</span>
               </el-col>
               <el-col :span="12">
-                <span>{{ flightInfo.transfer_all }}</span>
+                <span>{{ flightInfo.count3 }}</span>
               </el-col>
             </el-row>
           </div>
@@ -144,13 +144,13 @@
               <el-col :span="12">
                 <span>
                   日期：
-                  {{ flightInfo.PlanLandingTime && flightInfo.PlanLandingTime.split("T")[0] }}
+                  {{ flightInfo.ExpectLandingTime && flightInfo.ExpectLandingTime.split("T")[0] }}
                 </span>
               </el-col>
               <el-col :span="12">
                 <span>
                   时间：
-                  {{ flightInfo.PlanLandingTime && flightInfo.PlanLandingTime.split("T")[1] }}
+                  {{ flightInfo.ExpectLandingTime && flightInfo.ExpectLandingTime.split("T")[1] }}
                 </span>
               </el-col>
             </el-row>
@@ -303,7 +303,9 @@
             :prop="item.prop"
             :label="item.name"
             :align="item.align"
-            :sortable="item.sortable"
+            :filters="flightBaggageTableFilters[item.prop]"
+            :filter-method="flightBaggageTableFilters[item.prop] && filterHandler"
+            filter-placement="top"
           />
         </el-table>
       </div>
@@ -375,17 +377,17 @@ import tableColsMixin from '../../mixins/tableCols'
 //   { name: '卷宗号', prop: 'fileNumber', align: 'center' }
 // ]
 const departureBaggageTableColumn = [
-  { name: '旅客姓名', prop: 'name', align: 'center', sortable: 'custom' },
-  { name: '行李牌号', prop: 'bagNo', align: 'center' },
+  { name: '旅客姓名', prop: 'PassengerNameUpcase', align: 'center', sortable: 'custom' },
+  { name: '行李牌号', prop: 'BagSN', align: 'center' },
   {
     name: '特殊行李类型',
-    prop: 'specialType',
+    prop: 'SpecialType',
     align: 'center',
     sortable: 'custom'
   },
   {
     name: '容器编号',
-    prop: 'containerNo',
+    prop: 'U_Device_ID',
     align: 'center',
     sortable: 'custom'
   },
@@ -444,7 +446,13 @@ export default {
       containerTableData: [], // 容器统计
       transferInBaggageTableData: [], // 中转进
       transferOutBaggageTableData: [], // 中转出
-      flightBaggageTableData: [] // 行李列表
+      flightBaggageTableData: [], // 行李列表
+      flightBaggageTableFilters: {
+        PassengerNameUpcase: [],
+        BagSN: [],
+        SpecialType: [],
+        U_Device_ID: []
+      }
     }
   },
   created() {
@@ -494,6 +502,23 @@ export default {
       }
       return sums
     },
+    // 表格添加过滤条件
+    setTableFilters() {
+      this.flightBaggageTableData.forEach(item => {
+        Object.keys(this.flightBaggageTableFilters).forEach(key => {
+          if ((item[key] ?? '') !== '' && this.flightBaggageTableFilters[key].every(obj => obj.value !== item[key])) {
+            this.flightBaggageTableFilters[key].push({
+              text: item[key],
+              value: item[key]
+            })
+          }
+        })
+      })
+    },
+    filterHandler(value, row, column) {
+      const property = column['property']
+      return row[property] === value
+    },
     // async getBaggageSearchIOAll(data) {
     //   const getNodeInfo = node => `${node.locationPointDescribe ? node.locationPointDescribe : node.locationPoint}\n
     //         ${node.realTime}`
@@ -546,11 +571,13 @@ export default {
     //   }
     // },
     rowClick(row) {
-      row['flightNo'] = this.queryData.FlightNO
-      row['flightDate'] = this.queryData.FlightDate
       this.$router.push({
         path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/baggageView`,
-        query: row
+        query: {
+          BagSN: this.queryData.BagSN,
+          FlightNO: this.queryData.FlightNO,
+          FlightDate: this.queryData.FlightDate
+        }
       })
     },
     queryflightInfo(dataContent) {
@@ -583,14 +610,29 @@ export default {
           this.queryTrasferInBaggage(dataContent),
           this.queryBaggageByFlightNO(dataContent)
         ])
-        this.flightInfo = flightInfo
+        this.flightInfo = flightInfo[0]
         this.containerTableData = containerTableDataData
         this.transferOutBaggageTableData = transferOutBaggageTableData.map(item => {
           item['flightTime'] = item['flightDate'].split('T')[1]
           return item
         })
         this.transferInBaggageTableData = transferInBaggageTableData
-        this.flightBaggageTableData = flightBaggageTableData
+        this.flightBaggageTableData = flightBaggageTableData.map(item => {
+          item['checkIn'] = `${item['checkIn'] ?? ''}\n${item['checkInTime'] ? item['checkInTime'].split('T')[1] : ''}`
+          item['security'] = `${item['DealInfo'] ?? ''}\n${item['DealTime'] ? item['DealTime'].split('T')[1] : ''}`
+          item['sorting'] = `${item['sortLocationMark'] ?? ''}\n${
+            item['sortDealTime'] ? item['sortDealTime'].split('T')[1] : ''
+          }`
+          item['loading'] = `${item['loadLocationMark'] ?? ''}\n${
+            item['loadDealTime'] ? item['loadDealTime'].split('T')[1] : ''
+          }`
+          item['installed'] = `${item['inflLocationMark'] ?? ''}\n${
+            item['inflLoadDealTime'] ? item['inflLoadDealTime'].split('T')[1] : ''
+          }`
+          return item
+        })
+
+        this.setTableFilters()
       } catch (error) {
         console.log('错误', error)
       }
@@ -601,10 +643,11 @@ export default {
 
 <style lang="scss" scoped>
 .flight-view {
-  padding: 16px 8px 44px;
+  padding: 16px 0 44px 8px;
   overflow: hidden;
   background: #dfe3ea;
   .flight-wrap {
+    padding-right: 8px;
     width: 100%;
     height: calc(100vh - 140px);
     display: flex;