Merge branch 'master' of http://120.26.64.82:3000/BFFE/CABaggageData2.0

src/components/BackButton/index.vue

@@ -0,0 +1,33 @@
+<template>
+  <span
+    class="btn-back"
+    @click="goBackHandler"
+  ><i class="el-icon-arrow-left" />返回上一步</span>
+</template>
+
+<script>
+export default {
+  methods: {
+    goBackHandler() {
+      const pathArray = this.$route.path.split('/')
+      if (pathArray[1] === 'advance') {
+        this.$router.push('/advance')
+      } else if (pathArray.at(-1) === 'flightView') {
+        this.$router.push(`/${pathArray[1]}`)
+      } else if (['baggageView', 'containerView'].includes(pathArray.at(-1))) {
+        this.$router.push(`${pathArray.slice(0, -1).join('/')}/flightView`)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn-back {
+  margin-left: 24px;
+  font-size: 16px;
+  font-weight: normal;
+  color: #2d67e3;
+  cursor: pointer;
+}
+</style>

src/layout/components/Navbar.vue

@@ -13,20 +13,37 @@
       <div class="right-menu">
         <el-dropdown>
           <div class="user">
-            <img class="head-icon-img" src="../../assets/status/ic_user.png" alt="" />
+            <img
+              class="head-icon-img"
+              src="../../assets/status/ic_user.png"
+              alt=""
+            />
             <span class="name">{{ name }}</span>
             <i class="el-icon-arrow-down el-icon--right"></i>
           </div>
-          <el-dropdown-menu class="handleMsgMneu" slot="dropdown">
+          <el-dropdown-menu
+            class="handleMsgMneu"
+            slot="dropdown"
+          >
             <el-dropdown-item v-if="name != '匿名用户'">
-              <span class="editPwd" @click="dialogPwd">修改密码</span>
+              <span
+                class="editPwd"
+                @click="dialogPwd"
+              >修改密码</span>
             </el-dropdown-item>
             <el-dropdown-item>
-              <span @click="exitDialog" class="layoutSys">退出登录</span>
+              <span
+                @click="exitDialog"
+                class="layoutSys"
+              >退出登录</span>
             </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
-        <el-button @click="downFile" class="btn-help" plain>帮助</el-button>
+        <el-button
+          @click="downFile"
+          class="btn-help"
+          plain
+        >帮助</el-button>
         <!-- <div class="seting">
           <span @click="toSystem" class="img-icon"></span>
         </div> -->
@@ -38,10 +55,23 @@
         </div> -->
       </div>
     </div>
-    <div class="navbar_lower" id="navbar_lowers">
+    <div
+      class="navbar_lower"
+      id="navbar_lowers"
+    >
       <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item v-for="(item, index) in breadList" :key="index" :to="item.path">
-          {{ item.meta.title }}
+        <el-breadcrumb-item
+          v-for="(item, index) in breadList"
+          :key="index"
+          :to="index < breadList.length -1 ? item.path : undefined"
+        >
+          <span
+            v-if="withButtonBack(item, index)"
+            is="router-link"
+            class="btn-back"
+            :to="goBackHandler(item)"
+          ><i class="el-icon-arrow-left" />返回</span>
+          <span>{{ item.meta.title }}</span>
         </el-breadcrumb-item>
       </el-breadcrumb>
       <!-- <tags-view /> -->
@@ -51,83 +81,97 @@
 </template>
 
 <script>
-import { mapGetters } from "vuex";
-import Breadcrumb from "@/components/Breadcrumb";
-import Hamburger from "@/components/Hamburger";
+import { mapGetters } from 'vuex'
+import Breadcrumb from '@/components/Breadcrumb'
+import Hamburger from '@/components/Hamburger'
 // import { Format } from "../../config/util";
-import { timeInZone } from "@/utils/table"
+import { timeInZone } from '@/utils/table'
 // import TagsView from "./TagsView";
 
 export default {
-  props: ["logstart"],
-  data () {
+  props: ['logstart'],
+  data() {
     return {
-      newData: "",
+      newData: '',
       breadList: this.getBreadcrumb(),
       getTimeInterval: null
-    };
+    }
   },
   components: {
     Breadcrumb,
-    Hamburger,
+    Hamburger
     // TagsView,
   },
   watch: {
-    $route () {
-      this.breadList = this.getBreadcrumb();
-    },
+    $route(val) {
+      this.breadList = this.getBreadcrumb()
+    }
   },
   computed: {
-    ...mapGetters(["sidebar", "avatar", "name", "timeZone"]),
+    ...mapGetters(['sidebar', 'avatar', 'name', 'timeZone'])
   },
-  mounted () {
+  mounted() {
     this.getTimeInterval = setInterval(() => {
       // this.newData = Format("yyyy/MM/dd hh:mm:ss", new Date());
-      this.newData = timeInZone(new Date(), this.timeZone).replaceAll("-", "/");
-    });
+      this.newData = timeInZone(new Date(), this.timeZone).replaceAll('-', '/')
+    })
   },
-  beforeDestroy () {
-    this.getTimeInterval && clearInterval(this.getTimeInterval);
-    this.getTimeInterval = null;
+  beforeDestroy() {
+    this.getTimeInterval && clearInterval(this.getTimeInterval)
+    this.getTimeInterval = null
   },
   methods: {
-    toggleSideBar () {
-      this.$store.dispatch("app/toggleSideBar");
+    toggleSideBar() {
+      this.$store.dispatch('app/toggleSideBar')
     },
-    async logout () {
-      await this.$store.dispatch("user/logout");
-      this.$router.push(`/login?redirect=${this.$route.fullPath}`);
+    async logout() {
+      await this.$store.dispatch('user/logout')
+      this.$router.push(`/login?redirect=${this.$route.fullPath}`)
     },
-    getBreadcrumb () {
-      return this.$route.matched.filter((item) => item.name && item.meta.title);
+    getBreadcrumb() {
+      return this.$route.matched.filter(item => item.name && item.meta.title)
     },
     //修改密码
-    dialogPwd () {
-      this.$store.dispatch("app/togglePwdflag", true);
+    dialogPwd() {
+      this.$store.dispatch('app/togglePwdflag', true)
     },
     //退出系统-弹框
-    exitDialog () {
-      this.$store.dispatch("app/toggleOutflag", true);
+    exitDialog() {
+      this.$store.dispatch('app/toggleOutflag', true)
     },
     //下载
-    downFile () {
-      const a = document.createElement('a');
+    downFile() {
+      const a = document.createElement('a')
       // 给a标签的href属性值加上地址,注意:这里是绝对路径,不用加 点.
-      a.href = './国航行李整合及应用项目-用户使用手册V2.1.pdf';
+      a.href = './国航行李整合及应用项目-用户使用手册V2.1.pdf'
       // 设置下载文件文件名,这里加上.xlsx指定文件类型,pdf文件就指定.fpd即可
-      a.download = '国航行李整合及应用项目-用户使用手册V2.1.pdf';
+      a.download = '国航行李整合及应用项目-用户使用手册V2.1.pdf'
       // 障眼法藏起来a标签
-      a.style.display = 'none';
+      a.style.display = 'none'
       // 将a标签追加到文档对象中
-      document.body.appendChild(a);
+      document.body.appendChild(a)
       // 模拟点击了<a>标签,会触发<a>标签的href的读取,浏览器就会自动下载了
-      a.click();
+      a.click()
       // 一次性的,用完就删除a标签
-      a.remove();
+      a.remove()
       // window.location.href = './国航行李整合及应用项目-用户使用手册V2.1.pdf'
+    },
+    withButtonBack(item, index) {
+      if (['/systemSettings', '/BasicsData'].includes(this.$route.matched[0].path)) {
+        return false
+      }
+      return (
+        item.parent.path !== item.path &&
+        !item.parent.redirect &&
+        index > 0 &&
+        index === this.breadList.length - 1
+      )
+    },
+    goBackHandler(item) {
+      return item.parent?.path
     }
-  },
-};
+  }
+}
 </script>
 
 <style lang="scss" scoped>
@@ -156,7 +200,6 @@ export default {
       font-family: Microsoft YaHei;
       font-weight: 400;
       color: #101116;
-      pointer-events: none;
     }
   }
   > .navbar_top {
@@ -238,17 +281,17 @@ export default {
       }
       .lock {
         .img-icon {
-          background-image: url("../../assets/status/ic_password.png");
+          background-image: url('../../assets/status/ic_password.png');
           &:hover {
-            background-image: url("../../assets/status/ic_password_hovar.png");
+            background-image: url('../../assets/status/ic_password_hovar.png');
           }
         }
       }
       .exit {
         .img-icon {
-          background-image: url("../../assets/status/ic_exit.png");
+          background-image: url('../../assets/status/ic_exit.png');
           &:hover {
-            background-image: url("../../assets/status/ic_exit_hovar.png");
+            background-image: url('../../assets/status/ic_exit_hovar.png');
           }
         }
       }
@@ -328,7 +371,7 @@ export default {
           .search {
             width: 21px;
             height: 21px;
-            background: url("../../assets/header/ic_search_top.png") no-repeat;
+            background: url('../../assets/header/ic_search_top.png') no-repeat;
             background-size: 100% 100%;
             margin-top: 10px;
             margin-right: 41px;
@@ -336,8 +379,7 @@ export default {
           .fullscreen {
             width: 21px;
             height: 21px;
-            background: url("../../assets/header/ic_fullscreen_top.png")
-              no-repeat;
+            background: url('../../assets/header/ic_fullscreen_top.png') no-repeat;
             background-size: 100% 100%;
             margin-top: 10px;
             margin-right: 20px;
@@ -345,7 +387,7 @@ export default {
           .journaler {
             width: 21px;
             height: 21px;
-            background: url("../../assets/header/ic_data_top.png") no-repeat;
+            background: url('../../assets/header/ic_data_top.png') no-repeat;
             background-size: 100% 100%;
             margin-top: 10px;
             margin-right: 41px;
@@ -353,7 +395,7 @@ export default {
           .information {
             width: 21px;
             height: 21px;
-            background: url("../../assets/header/ic_message_top.png") no-repeat;
+            background: url('../../assets/header/ic_message_top.png') no-repeat;
             background-size: 100% 100%;
             margin-top: 10px;
             margin-right: 41px;
@@ -432,6 +474,13 @@ export default {
       //   font-size: 14px;
       //   color: #ffffff !important;
       // }
+      .btn-back {
+        margin-left: -30px;
+        margin-right: 10px;
+        font-size: 14px;
+        color: #2d67e3;
+        cursor: pointer;
+      }
     }
     > .newdata {
       font-size: 14px;

src/router/index.js

@@ -88,10 +88,27 @@ const createRouter = () =>
 const router = createRouter()
 
 router.beforeEach((to, from, next) => {
-  if (from.path.includes('flightView') && from.query.flightNO && from.query.flightDate) {
+  if (
+    (from.path.includes('flightView') && from.query.flightNO && from.query.flightDate) ||
+    (from.path.includes('containerView') &&
+      from.query.flightNO &&
+      from.query.flightDate &&
+      from.query.departureAirport &&
+      from.query.landingAirport &&
+      from.query.containerID)
+  ) {
     store.dispatch('keepAlive/savePage', from)
   }
-  if (to.path.includes('flightView') && (!to.query.flightNO || !to.query.flightDate) && from.meta?.keepAlive) {
+  if (
+    from.meta?.keepAlive &&
+    ((to.path.includes('flightView') && (!to.query.flightNO || !to.query.flightDate)) ||
+      (to.path.includes('containerView') &&
+        (!to.query.flightNO ||
+          !to.query.flightDate ||
+          !to.query.departureAirport ||
+          !to.query.landingAirport ||
+          !to.query.containerID)))
+  ) {
     const savedPage = store.getters.savedPages.find(savedPage => savedPage.name === to.name)
     if (savedPage) {
       next(savedPage.fullPath)

src/router/routes/routes-file-five.js

@@ -1,299 +1,357 @@
-/*
- * @Author: zk
- * @Date: 2022-01-17 10:40:48
- * @LastEditTime: 2022-09-13 16:35:22
- * @LastEditors: your name
- * @Description: 离港路由
- */
-import Layout from "@/layout";
+import Layout from '@/layout'
 
 const departureRoutes = {
-  path: "/departure",
-  name: "departure",
+  path: '/departure',
+  name: 'departure',
   component: Layout,
-  meta: { roles: ["departure_menu"] },
+  meta: { roles: ['departure_menu'] },
   children: [
     {
-      path: "/departure",
-      component: () => import("@/views/baggageManagement"),
+      path: '/departure',
+      component: () => import('@/views/baggageManagement'),
       meta: {
-        title: "离港管理",
-        imgstyle: "ic_list_nav_leave_default.png",
-        imgstyleup: "ic_list_nav_leave_check.png",
+        title: '离港管理',
+        imgstyle: 'ic_list_nav_leave_default.png',
+        imgstyleup: 'ic_list_nav_leave_check.png'
       },
       children: [
         {
-          path: "/departure",
-          name: "DepartureOne",
-          component: () => import("@/views/baggageManagement"),
+          path: '/departure',
+          name: 'DepartureNav',
+          component: () => import('@/views/baggageManagement'),
           meta: {
-            title: "离港视图",
+            title: '离港视图',
             // title: "行李视图",
-            roles: ["departure_page"],
-            keepAlive: true,
+            roles: ['departure_page'],
+            keepAlive: true
           },
           children: [
             {
-              path: "/departure",
-              name: "DepartureTerminalView",
-              component: () => import("@/views/baggageManagement/components/departure"),
-              meta: { keepAlive: true },
+              path: '/departure',
+              name: 'DepartureTerminalView',
+              component: () => import('@/views/baggageManagement/components/departure'),
+              meta: { keepAlive: true }
             },
             {
-              path: "/departure/flightView",
-              name: "DepartureParentSem",
-              component: () => import("@/views/baggageManagement"),
-              meta: { title: "航班视图", keepAlive: true },
+              path: '/departure/flightView',
+              name: 'DepartureFlightNav',
+              component: () => import('@/views/baggageManagement'),
+              meta: { title: '航班视图', keepAlive: true },
               children: [
                 {
-                  path: "/departure/flightView",
-                  name: "DepartureFlightView",
-                  component: () => import("@/views/baggageManagement/components/departure/flight"),
-                  meta: { keepAlive: true },
+                  path: '/departure/flightView',
+                  name: 'DepartureFlightView',
+                  component: () => import('@/views/baggageManagement/components/departure/flight'),
+                  meta: { keepAlive: true }
                 },
                 {
-                  path: "/departure/baggageView",
-                  name: "DepartureBaggageView",
-                  component: () => import("@/views/baggageManagement/components/departure/baggage"),
-                  meta: { title: "行李视图", keepAlive: true },
+                  path: '/departure/baggageView',
+                  name: 'DepartureBaggageView',
+                  component: () => import('@/views/baggageManagement/components/departure/baggage'),
+                  meta: { title: '行李视图', keepAlive: true }
                 },
                 {
-                  path: "/departure/newContainerView",
-                  name: "DepartureNewContainerView",
-                  component: () => import("@/views/baggageManagement/components/departure/newContainer"),
-                  meta: { title: "容器视图", keepAlive: true },
-                },
-                {
-                  path: "/departure/containerView",
-                  name: "DepartureContainerView",
-                  component: () => import("@/views/baggageManagement/components/departure/container"),
-                  meta: { title: "历史记录", keepAlive: true },
-                },
-              ],
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+                  path: '/departure/containerView',
+                  name: 'DepartureContainerNav',
+                  component: () => import('@/views/baggageManagement'),
+                  meta: { title: '容器视图', keepAlive: true },
+                  children: [
+                    {
+                      path: '/departure/containerView',
+                      name: 'DepartureContainerView',
+                      component: () => import('@/views/baggageManagement/components/departure/container'),
+                      meta: { keepAlive: true }
+                    },
+                    {
+                      path: '/departure/containerHistory',
+                      name: 'DepartureContainerHistory',
+                      component: () => import('@/views/baggageManagement/components/departure/containerHistory'),
+                      meta: { title: '历史记录', keepAlive: true }
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
 const arrivalRoutes = {
-  path: "/arrival",
-  name: "arrival",
+  path: '/arrival',
+  name: 'arrival',
   component: Layout,
-  meta: { roles: ["inbound_management"] },
+  meta: { roles: ['inbound_management'] },
   children: [
     {
-      path: "/arrival",
-      component: () => import("@/views/baggageManagement"),
+      path: '/arrival',
+      component: () => import('@/views/baggageManagement'),
       meta: {
-        title: "进港管理",
-        imgstyle: "ic_list_nav_arrive_default.png",
-        imgstyleup: "ic_list_nav_arrive_check.png",
+        title: '进港管理',
+        imgstyle: 'ic_list_nav_arrive_default.png',
+        imgstyleup: 'ic_list_nav_arrive_check.png'
       },
       children: [
         {
-          path: "/arrival",
-          name: "ArrivalOne",
-          component: () => import("@/views/baggageManagement"),
-          meta: { title: "进港视图", roles: ["inbound_search_page"], keepAlive: true },
+          path: '/arrival',
+          name: 'ArrivalNav',
+          component: () => import('@/views/baggageManagement'),
+          meta: { title: '进港视图', roles: ['inbound_search_page'], keepAlive: true },
           children: [
             {
-              path: "/arrival",
-              name: "ArrivalTerminalView",
-              component: () => import("@/views/baggageManagement/components/arrival"),
-              meta: { keepAlive: true },
+              path: '/arrival',
+              name: 'ArrivalTerminalView',
+              component: () => import('@/views/baggageManagement/components/arrival'),
+              meta: { keepAlive: true }
             },
             {
-              path: "/arrival/flightView",
-              name: "ArrivalFlightTwo",
-              component: () => import("@/views/baggageManagement"),
-              meta: { title: "航班视图", keepAlive: true },
+              path: '/arrival/flightView',
+              name: 'ArrivalFlightNav',
+              component: () => import('@/views/baggageManagement'),
+              meta: { title: '航班视图', keepAlive: true },
               children: [
                 {
-                  path: "/arrival/flightView",
-                  name: "ArrivalFlightView",
-                  component: () => import("@/views/baggageManagement/components/arrival/flight"),
-                  meta: { keepAlive: true },
+                  path: '/arrival/flightView',
+                  name: 'ArrivalFlightView',
+                  component: () => import('@/views/baggageManagement/components/arrival/flight'),
+                  meta: { keepAlive: true }
                 },
                 {
-                  path: "/arrival/baggageView",
-                  name: "ArrivalBaggageView",
-                  component: () => import("@/views/baggageManagement/components/arrival/baggage"),
-                  meta: { title: "行李视图", keepAlive: true },
+                  path: '/arrival/baggageView',
+                  name: 'ArrivalBaggageView',
+                  component: () => import('@/views/baggageManagement/components/arrival/baggage'),
+                  meta: { title: '行李视图', keepAlive: true }
                 },
                 {
-                  path: "/arrival/containerView",
-                  name: "ArrivalContainerView",
-                  component: () => import("@/views/baggageManagement/components/arrival/container"),
-                  meta: { title: "容器视图", keepAlive: true },
-                },
-              ],
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+                  path: '/arrival/containerView',
+                  name: 'ArrivalContainerNav',
+                  component: () => import('@/views/baggageManagement'),
+                  meta: { title: '容器视图', keepAlive: true },
+                  children: [
+                    {
+                      path: '/arrival/containerView',
+                      name: 'ArrivalContainerView',
+                      component: () => import('@/views/baggageManagement/components/arrival/container'),
+                      meta: { keepAlive: true }
+                    },
+                    {
+                      path: '/arrival/containerHistory',
+                      name: 'ArrivalContainerHistory',
+                      component: () => import('@/views/baggageManagement/components/arrival/containerHistory'),
+                      meta: { title: '容器历史', keepAlive: true }
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
 const transferRoutes = {
-  path: "/transfer",
+  path: '/transfer',
   component: Layout,
-  meta: { roles: ["ti_showTransit"] },
+  meta: { roles: ['ti_showTransit'] },
   children: [
     {
-      path: "/transfer",
-      component: () => import("@/views/baggageManagement"),
+      path: '/transfer',
+      component: () => import('@/views/baggageManagement'),
       meta: {
-        title: "中转管理",
-        imgstyle: "ic_list_nav_transit_default.png",
-        imgstyleup: "ic_list_nav_transit_check.png",
+        title: '中转管理',
+        imgstyle: 'ic_list_nav_transit_default.png',
+        imgstyleup: 'ic_list_nav_transit_check.png'
       },
-      redirect: "/transfer/arrival",
+      redirect: '/transfer/arrival',
       children: [
         {
-          path: "/transfer/arrival",
-          name: "TransferArrivalOne",
-          component: () => import("@/views/baggageManagement"),
-          meta: { title: "中转进港", roles: ["transit_inbound_page"], keepAlive: true },
+          path: '/transfer/arrival',
+          name: 'TransferArrivalNav',
+          component: () => import('@/views/baggageManagement'),
+          meta: { title: '中转进港', roles: ['transit_inbound_page'], keepAlive: true },
           children: [
             {
-              path: "/transfer/arrival",
-              name: "TransferArrivalTerminalView",
-              component: () => import("@/views/baggageManagement/components/transferArrival"),
-              meta: { keepAlive: true },
+              path: '/transfer/arrival',
+              name: 'TransferArrivalTerminalView',
+              component: () => import('@/views/baggageManagement/components/transferArrival'),
+              meta: { keepAlive: true }
             },
             {
-              path: "/transfer/arrival/flightView",
-              name: "TransferArrivalTwo",
-              component: () => import("@/views/baggageManagement"),
-              meta: { title: "航班视图", keepAlive: true },
+              path: '/transfer/arrival/flightView',
+              name: 'TransferArrivalFlightNav',
+              component: () => import('@/views/baggageManagement'),
+              meta: { title: '航班视图', keepAlive: true },
               children: [
                 {
-                  path: "/transfer/arrival/flightView",
-                  name: "TransferArrivalFlightView",
-                  component: () => import("@/views/baggageManagement/components/transferArrival/flight"),
-                  meta: { keepAlive: true },
+                  path: '/transfer/arrival/flightView',
+                  name: 'TransferArrivalFlightView',
+                  component: () => import('@/views/baggageManagement/components/transferArrival/flight'),
+                  meta: { keepAlive: true }
                 },
                 {
-                  path: "/transfer/arrival/baggageView",
-                  name: "TransferArrivalBaggageView",
-                  component: () => import("@/views/baggageManagement/components/transferArrival/baggage"),
-                  meta: { title: "行李视图", keepAlive: true },
+                  path: '/transfer/arrival/baggageView',
+                  name: 'TransferArrivalBaggageView',
+                  component: () => import('@/views/baggageManagement/components/transferArrival/baggage'),
+                  meta: { title: '行李视图', keepAlive: true }
                 },
                 {
-                  path: "/transfer/arrival/containerView",
-                  name: "TransferArrivalContainerView",
-                  component: () => import("@/views/baggageManagement/components/transferArrival/container"),
-                  meta: { title: "容器视图", keepAlive: true },
-                },
-              ],
-            },
-          ],
+                  path: '/transfer/arrival/containerView',
+                  name: 'TransferArrivalContainerNav',
+                  component: () => import('@/views/baggageManagement'),
+                  meta: { title: '容器视图', keepAlive: true },
+                  children: [
+                    {
+                      path: '/transfer/arrival/containerView',
+                      name: 'TransferArrivalContainerView',
+                      component: () => import('@/views/baggageManagement/components/arrival/container'),
+                      meta: { keepAlive: true }
+                    },
+                    {
+                      path: '/transfer/arrival/containerHistory',
+                      name: 'TransferArrivalContainerHistory',
+                      component: () => import('@/views/baggageManagement/components/transferArrival/containerHistory'),
+                      meta: { title: '容器历史', keepAlive: true }
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
         },
         {
-          path: "/transfer/departure",
-          name: "TransferDepartureOne",
-          component: () => import("@/views/baggageManagement"),
-          meta: { title: "中转离港", roles: ["transit_departure_page"], keepAlive: true },
+          path: '/transfer/departure',
+          name: 'TransferDepartureNav',
+          component: () => import('@/views/baggageManagement'),
+          meta: { title: '中转离港', roles: ['transit_departure_page'], keepAlive: true },
           children: [
             {
-              path: "/transfer/departure",
-              name: "TransferDepartureTerminalView",
-              component: () => import("@/views/baggageManagement/components/transferDeparture"),
-              meta: { keepAlive: true },
+              path: '/transfer/departure',
+              name: 'TransferDepartureTerminalView',
+              component: () => import('@/views/baggageManagement/components/transferDeparture'),
+              meta: { keepAlive: true }
             },
             {
-              path: "/transfer/departure/flightView",
-              name: "TransferDepartureTwo",
-              component: () => import("@/views/baggageManagement"),
-              meta: { title: "航班视图", keepAlive: true },
+              path: '/transfer/departure/flightView',
+              name: 'TransferDepartureFlightNav',
+              component: () => import('@/views/baggageManagement'),
+              meta: { title: '航班视图', keepAlive: true },
               children: [
                 {
-                  path: "/transfer/departure/flightView",
-                  name: "TransferDepartureFlightView",
-                  component: () => import("@/views/baggageManagement/components/transferDeparture/flight"),
-                  meta: { keepAlive: true },
+                  path: '/transfer/departure/flightView',
+                  name: 'TransferDepartureFlightView',
+                  component: () => import('@/views/baggageManagement/components/transferDeparture/flight'),
+                  meta: { keepAlive: true }
                 },
                 {
-                  path: "/transfer/departure/baggageView",
-                  name: "TransferDepartureBaggageView",
-                  component: () => import("@/views/baggageManagement/components/transferDeparture/baggage"),
-                  meta: { title: "行李视图", keepAlive: true },
+                  path: '/transfer/departure/baggageView',
+                  name: 'TransferDepartureBaggageView',
+                  component: () => import('@/views/baggageManagement/components/transferDeparture/baggage'),
+                  meta: { title: '行李视图', keepAlive: true }
                 },
                 {
-                  path: "/transfer/departure/containerView",
-                  name: "TransferDepartureContainerView",
-                  component: () => import("@/views/baggageManagement/components/transferDeparture/container"),
-                  meta: { title: "容器视图", keepAlive: true },
-                },
-              ],
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+                  path: '/transfer/departure/containerView',
+                  name: 'TransferDepartureContainerNav',
+                  component: () => import('@/views/baggageManagement'),
+                  meta: { title: '容器视图', keepAlive: true },
+                  children: [
+                    {
+                      path: '/transfer/departure/containerView',
+                      name: 'TransferDepartureContainerView',
+                      component: () => import('@/views/baggageManagement/components/transferDeparture/container'),
+                      meta: { keepAlive: true }
+                    },
+                    {
+                      path: '/transfer/departure/containerHistory',
+                      name: 'TransferDepartureContainerHistory',
+                      component: () =>
+                        import('@/views/baggageManagement/components/transferDeparture/containerHistory'),
+                      meta: { title: '容器历史', keepAlive: true }
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
 // 高级查询
 const advanceRoutes = {
-  path: "/",
-  redirect: "/advance",
+  path: '/',
+  redirect: '/advance',
   component: Layout,
   children: [
     {
-      path: "/advance",
-      component: () => import("@/views/advancedQuery/index.vue"),
+      path: '/advance',
+      component: () => import('@/views/advancedQuery'),
       meta: {
-        title: "高级查询",
-        imgstyle: "ic_list_nav_search_default.png",
-        imgstyleup: "ic_list_nav_search_check.png",
+        title: '高级查询',
+        imgstyle: 'ic_list_nav_search_default.png',
+        imgstyleup: 'ic_list_nav_search_check.png'
       },
       children: [
         {
-          path: "/advance",
-          name: "AdvancedQuery",
-          component: () => import("@/views/advancedQuery/index.vue"),
-          meta: { title: "高级查询", isPage: "advance_page", keepAlive: true },
+          path: '/advance',
+          name: 'AdvancedQuery',
+          component: () => import('@/views/advancedQuery'),
+          meta: { title: '高级查询', isPage: 'advance_page', keepAlive: true },
           children: [
             {
-              path: "/advance",
-              name: "AdvancedHome",
-              component: () => import("@/views/advancedQuery/views/advancedHome.vue"),
-              meta: { keepAlive: true },
+              path: '/advance',
+              name: 'AdvancedHome',
+              component: () => import('@/views/advancedQuery/views/advancedHome.vue'),
+              meta: { keepAlive: true }
             },
             {
-              path: "advanceNew",
-              name: "AdvancedNew",
-              component: () => import("@/views/advancedQuery/views/advancedNew.vue"),
-              meta: { keepAlive: true },
+              path: 'advanceNew',
+              name: 'AdvancedNew',
+              component: () => import('@/views/advancedQuery/views/advancedNew.vue'),
+              meta: { keepAlive: true }
             },
             {
-              path: "flightView",
-              name: "AdvancedFlight",
-              component: () => import("@/views/advancedQuery/views/advancedFlight.vue"),
-              meta: { title: "航班视图", keepAlive: true },
+              path: 'flightView',
+              name: 'AdvancedFlight',
+              component: () => import('@/views/advancedQuery/views/advancedFlight.vue'),
+              meta: { title: '航班视图', keepAlive: true }
             },
             {
-              path: "baggageView",
-              name: "AdvancedBag",
-              component: () => import("@/views/advancedQuery/views/advancedBag.vue"),
-              meta: { title: "行李视图", keepAlive: true },
+              path: 'baggageView',
+              name: 'AdvancedBag',
+              component: () => import('@/views/advancedQuery/views/advancedBag.vue'),
+              meta: { title: '行李视图', keepAlive: true }
             },
             {
-              path: "containerView",
-              name: "AdvancedContainer",
-              component: () => import("@/views/advancedQuery/views/advancedContainer.vue"),
-              meta: { title: "容器视图", keepAlive: true },
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+              path: 'containerView',
+              name: 'AdvancedContainerNav',
+              component: () => import('@/views/advancedQuery'),
+              meta: { title: '容器视图', keepAlive: true },
+              children: [
+                {
+                  path: '/advance/containerView',
+                  name: 'AdvancedContainerView',
+                  component: () => import('@/views/advancedQuery/views/advancedContainer.vue'),
+                  meta: { keepAlive: true }
+                },
+                {
+                  path: '/advance/containerHistory',
+                  name: 'AdvancedContainerHistory',
+                  component: () => import('@/views/advancedQuery/views/advancedContainerHistory.vue'),
+                  meta: { title: '容器历史', keepAlive: true }
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
-export default [departureRoutes, arrivalRoutes, transferRoutes, advanceRoutes];
+export default [departureRoutes, arrivalRoutes, transferRoutes, advanceRoutes]

src/router/routes/routes-file-four.js

@@ -1,243 +1,219 @@
-/*
- * @Author: Badguy
- * @Date: 2022-04-25 16:01:34
- * @LastEditTime: 2022-05-06 11:09:32
- * @LastEditors: your name
- * @Description: 账号管理
- * have a nice day!
- */
-
-import Layout from "@/layout";
+import Layout from '@/layout'
 
 // 权限管理
 const authorityRoutes = {
-  path: "/authority",
+  path: '/authority',
   component: Layout,
-  meta: { roles: ["authority_menu"], keepAlive: false },
+  meta: { roles: ['authority_menu'] },
   children: [
     {
-      path: "/authority",
-      component: () => import("@/views/authorityManagement/index"),
+      path: '/authority',
+      component: () => import('@/views/authorityManagement/index'),
       meta: {
-        title: "权限管理",
-        icon: "authority",
-        imgstyle: "ic_list_nav_permissions_default.png",
-        imgstyleup: "ic_list_nav_permissions_check.png",
-        keepAlive: false,
+        title: '权限管理',
+        icon: 'authority',
+        imgstyle: 'ic_list_nav_permissions_default.png',
+        imgstyleup: 'ic_list_nav_permissions_check.png'
       },
       children: [
         {
-          path: "/",
-          name: "AuthorityHome",
+          path: '/authority',
+          name: 'AuthorityNav',
           component: {
-            render (c) {
-              return c("router-view");
-            },
+            render(c) {
+              return c('router-view')
+            }
           },
-          redirect: "/",
-          meta: { title: "权限项管理", isPage: "authority_page", keepAlive: false, roles: ["authority_page"] },
+          meta: { title: '权限项管理', isPage: 'authority_page', roles: ['authority_page'] },
           children: [
             {
-              path: "/",
-              meta: { title: "权限项管理", isPage: "authority_page", keepAlive: false },
-              component: () => import("@/views/authorityManagement/components/authorityHome"),
+              path: '/authority',
+              name: 'AuthorityHome',
+              component: () => import('@/views/authorityManagement/components/authorityHome')
             },
             {
-              path: "appAdd",
-              name: "AuthorityAppAdd",
-              component: () => import("@/views/authorityManagement/components/authorityAppAdd"),
-              meta: { title: "新增应用", keepAlive: false },
+              path: 'appAdd',
+              name: 'AuthorityAppAdd',
+              component: () => import('@/views/authorityManagement/components/authorityAppAdd'),
+              meta: { title: '新增应用' }
             },
             {
-              path: "appEdit",
-              name: "AuthorityAppEdit",
-              component: () => import("@/views/authorityManagement/components/authorityAppEdit"),
-              meta: { title: "编辑应用", keepAlive: false },
+              path: 'appEdit',
+              name: 'AuthorityAppEdit',
+              component: () => import('@/views/authorityManagement/components/authorityAppEdit'),
+              meta: { title: '编辑应用' }
             },
             {
-              path: "addPower",
-              name: "AuthorityPowerAdd",
-              component: () => import("@/views/authorityManagement/components/authorityPowerAdd"),
-              meta: { title: "新增权限项", keepAlive: false },
+              path: 'addPower',
+              name: 'AuthorityPowerAdd',
+              component: () => import('@/views/authorityManagement/components/authorityPowerAdd'),
+              meta: { title: '新增权限项' }
             },
             {
-              path: "editPower",
-              name: "AuthorityPowerEdit",
-              component: () => import("@/views/authorityManagement/components/authorityPowerEdit"),
-              meta: { title: "编辑权限项", keepAlive: false },
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+              path: 'editPower',
+              name: 'AuthorityPowerEdit',
+              component: () => import('@/views/authorityManagement/components/authorityPowerEdit'),
+              meta: { title: '编辑权限项' }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
 // 角色管理
 const roleRoutes = {
-  path: "/role",
+  path: '/role',
   component: Layout,
-  meta: { roles: ["role_menu"], keepAlive: false },
+  meta: { roles: ['role_menu'] },
   children: [
     {
-      path: "/role",
-      component: () => import("@/views/authorityManagement/components/authorityRole"),
+      path: '/role',
+      component: () => import('@/views/authorityManagement/components/authorityRole'),
       meta: {
-        title: "角色管理",
-        icon: "role",
-        imgstyle: "ic_list_nav_character_default.png",
-        imgstyleup: "ic_list_nav_character_check.png",
-        keepAlive: false,
+        title: '角色管理',
+        icon: 'role',
+        imgstyle: 'ic_list_nav_character_default.png',
+        imgstyleup: 'ic_list_nav_character_check.png'
       },
       children: [
         {
-          path: "/",
-          name: "AuthorityRoleHome",
+          path: '/role',
+          name: 'AuthorityRoleNav',
           component: {
-            render (c) {
-              return c("router-view");
-            },
+            render(c) {
+              return c('router-view')
+            }
           },
-          redirect: "/",
-          meta: { title: "角色管理", isPage: "role_page", keepAlive: false, roles: ["role_page"] },
+          meta: { title: '角色管理', isPage: 'role_page', roles: ['role_page'] },
           children: [
             {
-              path: "/",
-              component: () => import("@/views/authorityManagement/components/authorityRoleHome"),
-              meta: { title: "角色管理", keepAlive: false },
+              path: '/role',
+              name: 'AuthorityRoleHome',
+              component: () => import('@/views/authorityManagement/components/authorityRoleHome')
             },
             {
-              path: "addRole",
-              name: "AuthorityRoleAdd",
-              component: () => import("@/views/authorityManagement/components/authorityRoleAdd"),
-              meta: { title: "新增角色", keepAlive: false },
+              path: 'addRole',
+              name: 'AuthorityRoleAdd',
+              component: () => import('@/views/authorityManagement/components/authorityRoleAdd'),
+              meta: { title: '新增角色' }
             },
             {
-              path: "editRole",
-              name: "AuthorityRoleEdit",
-              component: () => import("@/views/authorityManagement/components/authorityRoleEdit"),
-              meta: { title: "账号授权", keepAlive: false },
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+              path: 'editRole',
+              name: 'AuthorityRoleEdit',
+              component: () => import('@/views/authorityManagement/components/authorityRoleEdit'),
+              meta: { title: '账号授权' }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
 // 账号管理
 const accountRoutes = {
-  path: "/account",
+  path: '/account',
   component: Layout,
-  meta: { roles: ["account_menu"], keepAlive: false },
+  meta: { roles: ['account_menu'] },
   children: [
     {
-      path: "/account",
-      name: "accountManagement",
-      component: () => import("@/views/accountManagement"),
+      path: '/account',
+      component: () => import('@/views/accountManagement'),
       meta: {
-        title: "账号管理",
-        icon: "account",
-        imgstyle: "ic_list_nav_account_default.png",
-        imgstyleup: "ic_list_nav_account_check.png",
-        keepAlive: false,
+        title: '账号管理',
+        icon: 'account',
+        imgstyle: 'ic_list_nav_account_default.png',
+        imgstyleup: 'ic_list_nav_account_check.png'
       },
       children: [
         {
-          path: "/",
-          name: "accountHome",
+          path: '/account',
+          name: 'accountNav',
           component: {
-            render (c) {
-              return c("router-view");
-            },
+            render(c) {
+              return c('router-view')
+            }
           },
-          redirect: "/",
           meta: {
-            keepAlive: false,
-            roles: ["account_page"],
+            title: '账号管理',
+            roles: ['account_page']
           },
           children: [
             {
-              path: "/",
-              component: () => import("@/views/accountManagement/components/accountHome"),
-              meta: {
-                title: "账号管理",
-                keepAlive: false,
-              },
+              path: '/account',
+              name: 'accountHome',
+              component: () => import('@/views/accountManagement/components/accountHome')
             },
             {
-              path: "accountAdd",
-              name: "accountAdd",
-              component: () => import("@/views/accountManagement/components/accountEdit"),
+              path: 'accountAdd',
+              name: 'accountAdd',
+              component: () => import('@/views/accountManagement/components/accountEdit'),
               meta: {
-                title: "新增账号",
-                keepAlive: false,
-              },
+                title: '新增账号'
+              }
             },
             {
-              path: "accountEdit",
-              name: "accountEdit",
-              component: () => import("@/views/accountManagement/components/accountEdit"),
+              path: 'accountEdit',
+              name: 'accountEdit',
+              component: () => import('@/views/accountManagement/components/accountEdit'),
               meta: {
-                title: "编辑账号",
-                doesAccountExist: true,
-                keepAlive: false,
-              },
+                title: '编辑账号',
+                doesAccountExist: true
+              }
             },
             {
-              path: "accountAuth",
-              name: "accountAuth",
-              component: () => import("@/views/accountManagement/components/accountAuth"),
+              path: 'accountAuth',
+              name: 'accountAuth',
+              component: () => import('@/views/accountManagement/components/accountAuth'),
               meta: {
-                title: "账号授权",
-                keepAlive: false,
-              },
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+                title: '账号授权'
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
 // 账号管理
 const accountGroupRoutes = {
-  path: "/accountgroup",
+  path: '/accountgroup',
   component: Layout,
-  meta: { roles: ["group_menu"], keepAlive: false },
+  meta: { roles: ['group_menu'] },
   children: [
     {
-      path: "/accountgroup",
-      component: () => import("@/views/accountGroupManagement"),
+      path: '/accountgroup',
+      component: () => import('@/views/accountGroupManagement'),
       meta: {
-        title: "账号组管理",
-        icon: "role",
-        imgstyle: "ic_list_nav_group_default.png",
-        imgstyleup: "ic_list_nav_group_check.png",
-        keepAlive: false,
+        title: '账号组管理',
+        icon: 'role',
+        imgstyle: 'ic_list_nav_group_default.png',
+        imgstyleup: 'ic_list_nav_group_check.png'
       },
       children: [
         {
-          path: "/",
-          name: "accountgroupHome",
+          path: '/accountgroup',
+          name: 'accountgroupNav',
           component: {
-            render (c) {
-              return c("router-view");
-            },
+            render(c) {
+              return c('router-view')
+            }
           },
-          redirect: "/",
-          meta: { title: "账号组管理", keepAlive: false },
+          meta: { title: '账号组管理' },
           children: [
             {
-              path: "/",
-              component: () => import("@/views/accountGroupManagement/components/accountHome"),
-              meta: { title: "账号组管理", keepAlive: false },
-            },
-          ],
-        },
-      ],
-    },
-  ],
-};
+              path: '/accountgroup',
+              name: 'accountGroupHome',
+              component: () => import('@/views/accountGroupManagement/components/accountHome')
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
 
-export default [authorityRoutes, roleRoutes, accountRoutes, accountGroupRoutes];
+export default [authorityRoutes, roleRoutes, accountRoutes, accountGroupRoutes]

src/styles/index.scss

@@ -354,13 +354,6 @@ li {
     margin: auto;
     background: #2d67e3;
   }
-  .btn-back {
-    margin-left: 24px;
-    font-size: 16px;
-    font-weight: normal;
-    color: #2d67e3;
-    cursor: pointer;
-  }
 }
 
 /*鼠标样式-手*/

src/views/advancedQuery/views/advancedContainerHistory.vue

@@ -0,0 +1,14 @@
+<template>
+  <ContainerHistory />
+</template>
+
+<script>
+import ContainerHistory from '@/views/baggageManagement/components/containerHistory'
+
+export default {
+  name: 'AdvancedContainerHistory',
+  components: {
+    ContainerHistory
+  }
+}
+</script>

src/views/advancedQuery/views/advancedHome.vue

@@ -955,6 +955,10 @@ export default {
             this.$router.push({
               path: '/advance/containerView',
               query: {
+                flightNO: row.flightNO,
+                flightDate: row.flightDate,
+                departureAirport: row.sourceAirport,
+                landingAirport: row.targetAirport,
                 containerID: row.U_Device_ID
               }
             })
@@ -1199,7 +1203,9 @@ export default {
       try {
         const result = await myQuery(DATACONTENT_ID.baggageTypeId)
         this.baggageTypeList = result
-      } catch (error) {this.$message.error("失败");}
+      } catch (error) {
+        this.$message.error('失败')
+      }
     },
     // 统计行数
     summaryRow(num) {

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

@@ -0,0 +1,14 @@
+<template>
+  <ContainerHistory />
+</template>
+
+<script>
+import ContainerHistory from '../containerHistory'
+
+export default {
+  name: 'ArrivalContainerHistory',
+  components: {
+    ContainerHistory
+  }
+}
+</script>

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

@@ -26,6 +26,7 @@
             :label="item"
           />
         </el-radio-group>
+        <!-- <BackButton /> -->
       </div>
       <div class="part1_info">
         <el-row :gutter="12">
@@ -230,6 +231,7 @@
   </div>
 </template>
 <script>
+// import BackButton from '@/components/BackButton'
 import Dialog from '@/layout/components/Dialog/index.vue'
 import { myQuery } from '@/api/dataIntegration'
 import { BaggageMessageQuery } from '@/api/flight'
@@ -242,6 +244,7 @@ import FileSaver from 'file-saver'
 export default {
   name: 'BaggageView',
   components: {
+    // BackButton,
     Dialog
   },
   mixins: [tableColsMixin],
@@ -363,12 +366,12 @@ export default {
         { name: '航班日期', prop: 'flightDate', width: 100 },
         {
           name: '起飞航站\n起飞时间',
-          prop: 'departureAirport',
+          prop: 'departureInfo',
           width: 111
         },
         {
           name: '目的航站\n降落时间',
-          prop: 'landingAirport',
+          prop: 'landingInfo',
           sortable: 'custom',
           width: 111
         },
@@ -457,7 +460,7 @@ export default {
             this.queryAirline()
             this.infoBtn = this.infoRadios[0]
           } else {
-            this.$router.push('/advance')
+            this.$router.push('/')
           }
         }
       },
@@ -576,7 +579,7 @@ export default {
       this.pos = pos
     },
     headerCellClass({ row, column, rowIndex, columnIndex }) {
-      if (['departureAirport', 'landingAirport'].includes(column.property)) {
+      if (['departureInfo', 'landingInfo'].includes(column.property)) {
         return 'pre-line'
       }
     },
@@ -589,7 +592,7 @@ export default {
       ) {
         classes.push('cell-click')
       }
-      if (['departureAirport', 'landingAirport'].includes(column.property)) {
+      if (['departureInfo', 'landingInfo'].includes(column.property)) {
         classes.push('pre-line')
       }
       return classes.join(' ')
@@ -599,7 +602,7 @@ export default {
         switch (column.property) {
           case 'flightNO':
             this.$router.push({
-              path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/flightView`,
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/flightView`,
               query: {
                 flightNO: row.flightNO,
                 flightDate: row.flightDate
@@ -608,8 +611,12 @@ export default {
             break
           case 'U_Device_ID':
             this.$router.push({
-              path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/containerView`,
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/containerView`,
               query: {
+                flightNO: row.flightNO,
+                flightDate: row.flightDate,
+                departureAirport: row.departureAirport,
+                landingAirport: row.landingAirport,
                 containerID: row.U_Device_ID
               }
             })
@@ -620,7 +627,7 @@ export default {
       }
     },
     tableSpanMethod({ row, column, rowIndex, columnIndex }) {
-      if (['flightNO', 'flightDate', 'departureAirport', 'landingAirport'].includes(column['property'])) {
+      if (['flightNO', 'flightDate', 'departureInfo', 'landingInfo'].includes(column['property'])) {
         const _row = this.spanArr[rowIndex]
         const _col = _row > 0 ? 1 : 0
         return {
@@ -782,10 +789,10 @@ export default {
           if (item['dealTime']) {
             item['dealTime'] = item['dealTime'].replace('T', ' ')
           }
-          item['departureAirport'] = `${item['departureAirport']}\n${
+          item['departureInfo'] = `${item['departureAirport']}\n${
             item['departureTime'] ? item['departureTime'].replace('T', '\n') : ''
           }`
-          item['landingAirport'] = `${item['landingAirport']}\n${
+          item['landingInfo'] = `${item['landingAirport']}\n${
             item['landingTime'] ? item['landingTime'].replace('T', '\n') : ''
           }`
           if (item['DeviceCode'] === 'STARHUB') {
@@ -870,21 +877,6 @@ export default {
   }
 }
 </script>
-<style lang="scss">
-.radioBtn {
-  padding: 5px;
-  background: #000d2a;
-  .el-radio-button__inner {
-    background: #000d2a;
-    color: #fff;
-    border: none;
-    font-weight: bold;
-  }
-  .el-radio-button:first-child .el-radio-button__inner {
-    border: none;
-  }
-}
-</style>
 <style lang="scss" scoped>
 .baggage-view {
   width: 100%;
@@ -897,15 +889,30 @@ export default {
     // height: 232px;
     background: #041741;
     padding: 16px 30px;
-    .title {
+    ::v-deep .title {
       font-size: 18px;
       font-weight: bold;
       color: #ffffff;
-      width: 320px;
       display: flex;
       flex-direction: row;
-      justify-content: space-between;
       align-items: center;
+      .radioBtn {
+        margin-left: 32px;
+        padding: 5px;
+        background: #000d2a;
+        .el-radio-button__inner {
+          background: #000d2a;
+          color: #fff;
+          border: none;
+          font-weight: bold;
+        }
+        .el-radio-button:first-child .el-radio-button__inner {
+          border: none;
+        }
+      }
+      .btn-back {
+        color: #ffffff;
+      }
     }
     .part1_info {
       width: 100%;

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

@@ -1,71 +1,115 @@
 <template>
   <div class="container-view">
-    <div
-      v-loading="treeLoading"
-      element-loading-text="拼命加载中"
-      element-loading-spinner="el-icon-loading"
-      element-loading-background="rgba(0, 0, 0, 0.8)"
-      class="container-left"
-    >
-      <el-tree
-        :data="containerHistoryTree"
-        :props="defaultTreeProps"
-        node-key="index"
-        default-expand-all
-        :expand-on-click-node="false"
-        @current-change="currentChangeHandler"
+    <div class="container-basic">
+      <div class="title">
+        <div class="manageTitle">容器基本信息</div>
+        <el-button
+          type="primary"
+          size="small"
+          @click="toContainerHistory"
+        >历史记录</el-button>
+      </div>
+      <div
+        ref="basicBox"
+        class="basic-info-box"
       >
-        <span
-          slot-scope="{ node, data }"
-          class="el-tree-node__label"
-        >
-          <el-tooltip
-            v-if="data.index === -1"
-            class="item"
-            effect="dark"
-            :content="msg"
-            placement="top"
+        <el-row :gutter="10">
+          <el-col
+            :xs="6"
+            :sm="6"
+            :xl="4"
+          >
+            <div class="grid-content">容器编号：{{ $route.query.containerID }}</div>
+          </el-col>
+          <el-col
+            :xs="6"
+            :sm="6"
+            :xl="3"
+          >
+            <div class="grid-content">容器类型：{{ $route.query.containerType }}</div>
+          </el-col>
+          <el-col
+            :xs="6"
+            :sm="6"
+            :xl="3"
+          >
+            <div class="grid-content">舱位：{{ $route.query.containerSpace }}</div>
+          </el-col>
+          <el-col
+            :xs="6"
+            :sm="6"
+            :xl="3"
           >
-            <span>{{ node.label }}</span>
-          </el-tooltip>
-          <span v-else>{{ node.label }}</span>
-        </span>
-      </el-tree>
+            <div class="grid-content">航班号：{{ $route.query.flightNO }}</div>
+          </el-col>
+          <el-col
+            :xs="12"
+            :sm="12"
+            :xl="5"
+          >
+            <div class="grid-content">航班日期：{{ $route.query.flightDate }}</div>
+          </el-col>
+          <el-col
+            :xs="6"
+            :sm="6"
+            :xl="3"
+          >
+            <div class="grid-content">起飞站：{{ $route.query.departureAirport }}</div>
+          </el-col>
+          <el-col
+            :xs="6"
+            :sm="6"
+            :xl="3"
+          >
+            <div class="grid-content">目的站：{{ $route.query.landingAirport }}</div>
+          </el-col>
+        </el-row>
+      </div>
     </div>
-    <div
-      v-loading="tableLoading"
-      element-loading-text="拼命加载中"
-      element-loading-spinner="el-icon-loading"
-      element-loading-background="rgba(0, 0, 0, 0.8)"
-      class="container-right"
-    >
-
-      <el-table
-        ref="table"
-        :data="dealedTableData"
-        border
-        stripe
-        fit
-        height="calc(100vh - 80px - 17px - 20px)"
-        :header-cell-class-name="headerCellClass"
-        :row-class-name="tableRowClassName"
-        :cell-class-name="cellClass"
-        @cell-click="cellClickHandler"
-      >
-        <el-table-column
-          v-for="col in tableCols"
-          :key="col.prop"
-          :prop="col.prop"
-          :label="col.label"
-          :width="col.width"
-          :fixed="col.fixed"
-          :formatter="tableFormat"
+    <div class="container-table">
+      <div class="title">
+        <div class="manageTitle">容器行李列表</div>
+        <!-- <TimeZoneSelector /> -->
+        <img
+          class="btn-square btn-shadow"
+          src="@/assets/baggage/ic_export.png"
+          title="导出"
+          @click="exportHandler('table', '容器行李列表')"
+        >
+        <img
+          class="btn-square btn-shadow"
+          src="@/assets/baggage/ic_setting.png"
+          title="列设置"
+          @click="show"
+        >
+      </div>
+      <div class="table-wrapper">
+        <el-table
+          ref="table"
+          :data="dealedTableData"
+          :height="computedTableHeight"
+          border
+          stripe
+          size="mini"
+          show-summary
+          :summary-method="summaryRow(dealedTableData.length)"
+          :header-cell-class-name="headerCellClass"
+          :header-cell-style="{ color: '#101116' }"
+          :row-class-name="rowClass"
+          :cell-class-name="cellClass"
+          @cell-click="cellClickHandler"
         >
-          <template #header>
-            <el-tooltip
-              :content="col.desc || col.label"
-              placement="top"
-            >
+          <el-table-column
+            v-for="col in tableColsCopy"
+            :key="col.index"
+            :prop="col.prop"
+            :label="col.label"
+            :align="col.align || 'center'"
+            :width="col.width"
+            :fixed="col.fixed"
+            :formatter="tableFormat"
+          >
+            <template #header>
               <TableHeaderCell
                 :label="col.label"
                 :filter-options="tableDataFilters[col.prop]"
@@ -73,36 +117,73 @@
                 :sortable="col.sortable"
                 :sort-rule.sync="tableDataSortRules[col.prop]"
               />
-            </el-tooltip>
-          </template>
-        </el-table-column>
-      </el-table>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
     </div>
+    <!--列设置-->
+    <Dialog
+      :flag="dialogFlag"
+      class="dialog-check-group"
+    >
+      <div class="dialog-wrapper">
+        <div class="title">列设置</div>
+        <div class="content">
+          <el-tree
+            :data="tableCols"
+            :class="colsCheckClass"
+            show-checkbox
+            node-key="index"
+            :default-expand-all="true"
+            :props="{
+              label: 'label',
+              children: 'children',
+            }"
+            :default-checked-keys="checkedKeysTemp"
+            @check="handleCheck"
+          />
+        </div>
+        <div class="foot right t30">
+          <el-button
+            size="medium"
+            class="r24"
+            type="primary"
+            @click="onCheck('tableData')"
+          >确定</el-button>
+          <el-button
+            size="medium"
+            @click="hide"
+          >取消</el-button>
+        </div>
+      </div>
+    </Dialog>
   </div>
 </template>
 
 <script>
-import TableHeaderCell from '@/components/TableHeaderCell'
-import { mapGetters } from 'vuex'
+import Dialog from '@/layout/components/Dialog/index.vue'
+// import TimeZoneSelector from '@/components/TimeZoneSelector'
 import { myQuery } from '@/api/dataIntegration'
+import tableColsMixin from '../../mixins/tableCols'
+import timeZoneMixin from '../../mixins/timeZone'
+import TableHeaderCell from '@/components/TableHeaderCell'
 import { setTableFilters } from '@/utils/table'
-
+import { mapGetters } from 'vuex'
+import { throttledExportToExcel } from '@/utils/table'
 export default {
   name: 'ContainerView',
   components: {
+    // TimeZoneSelector,
+    Dialog,
     TableHeaderCell
   },
+  mixins: [tableColsMixin, timeZoneMixin],
   data() {
     return {
+      fullscreenLoading: false,
       queryData: {},
-      containerHistory: [],
-      selectedHistoryData: {},
-      defaultTreeProps: {
-        children: 'children',
-        label: 'label'
-      },
-      treeLoading: false,
-      tableLoading: false,
+      computedTableHeight: undefined,
       tableCols: [
         {
           prop: 'passengerName',
@@ -122,7 +203,7 @@ export default {
           prop: 'specialType',
           label: '特殊行李类型',
           desc: '指有别于普通托运行李的特殊行李分类，包括（装笼动物、机组行李、易碎行李、VIP行李等），参考BSM报文.E项说明',
-          width: 115,
+          width: 120,
           filterable: true,
           sortable: true
         },
@@ -179,24 +260,11 @@ export default {
       tableData: [],
       tableDataFilters: {},
       filterValues: {},
-      tableDataSortRules: {},
-      msg: '容器历史默认显示最近10条历史，如果需要可联系管理员进行配置'
+      tableDataSortRules: {}
     }
   },
   computed: {
     ...mapGetters(['clickedCells']),
-    containerHistoryTree() {
-      return [
-        {
-          index: -1,
-          label: `容器历史-${this.queryData.containerID}`,
-          children: this.containerHistory.map(({ flightNO, flightDate, departureAirport, arriveAirport }, index) => ({
-            index,
-            label: [flightNO, flightDate.replaceAll('-', '/'), departureAirport, arriveAirport].join('-')
-          }))
-        }
-      ]
-    },
     dealedTableData() {
       const filtered = this.tableData.filter(item => {
         let flag = true
@@ -225,12 +293,24 @@ export default {
     $route: {
       handler({ path, query }) {
         if (path.includes('containerView')) {
-          const { containerID } = query
-          if (containerID) {
-            const { containerID: oldContainerID } = this.queryData
-            if (containerID !== oldContainerID) {
-              this.queryData = { containerID }
-              this.queryContainerHistory([containerID])
+          const { flightNO, flightDate, departureAirport, landingAirport, containerID } = query
+          if (flightNO && flightDate && departureAirport && landingAirport && containerID) {
+            const {
+              flightNO: oldFlightNO,
+              flightDate: oldFlightDate,
+              departureAirport: oldDepartureAirport,
+              landingAirport: oldLandingAirport,
+              containerID: oldContainerID
+            } = this.queryData
+            if (
+              flightNO !== oldFlightNO ||
+              flightDate !== oldFlightDate ||
+              departureAirport !== oldDepartureAirport ||
+              landingAirport !== oldLandingAirport ||
+              containerID !== oldContainerID
+            ) {
+              this.queryData = { flightNO, flightDate, departureAirport, landingAirport, containerID }
+              this.queryContainerBaggage([flightNO, flightDate, departureAirport, landingAirport, containerID])
             }
           } else {
             this.$router.push('/')
@@ -239,6 +319,18 @@ export default {
       },
       deep: true,
       immediate: true
+    },
+    fullscreenLoading(val) {
+      if (val) {
+        this.loading = this.$loading({
+          lock: true,
+          text: '加载中',
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.7)'
+        })
+      } else {
+        this.loading?.close()
+      }
     }
   },
   created() {
@@ -252,28 +344,37 @@ export default {
       }
     })
   },
+  activated() {
+    this.setTableHeight()
+  },
   updated() {
-    // table数据更新
-    this.$nextTick(() => {
-      this.$refs.table.doLayout()
-    })
+    this.setTableHeight()
   },
   deactivated() {
-    this.treeLoading = false
-    this.tableLoading = false
+    this.loading?.close()
   },
   beforeDestroy() {
-    this.treeLoading = false
-    this.tableLoading = false
+    this.loading?.close()
   },
   methods: {
-    currentChangeHandler({ index }) {
-      if (index > -1) {
-        this.selectedHistoryData = this.containerHistory[index]
-        const { flightNO, flightDate, departureAirport, arriveAirport, containerID } = this.selectedHistoryData
-        const dataContent = [flightNO, flightDate, departureAirport, arriveAirport, containerID]
-        this.queryBaggageList(dataContent)
+    setTableHeight() {
+      const headerHeight = 80
+      const bottomBlankHeight = 16
+      const titleHeight = 64
+      const basicBoxHeight = this.$refs['basicBox'].offsetHeight
+      this.computedTableHeight = `calc(100vh - ${
+        headerHeight + bottomBlankHeight + titleHeight * 2 + basicBoxHeight
+      }px)`
+      this.$nextTick(() => {
+        this.$refs['table']?.doLayout()
+      })
+    },
+    rowClass({ row, rowIndex }) {
+      const classes = []
+      if (row['Status'] === 'DEL') {
+        classes.push('bgl-deleted')
       }
+      return classes.join(' ')
     },
     // 给表头单元格加上 ascending 或 descending 使用 element 自带的排序箭头变色
     headerCellClass({ row, column, rowIndex, columnIndex }) {
@@ -284,18 +385,18 @@ export default {
       }
       return classes.join(' ')
     },
-    tableRowClassName({ row, rowIndex }) {
-      const classes = []
-      if (row.isDEL === 'DEL') {
-        classes.push('bgl-deleted')
-      }
-      return classes.join(' ')
-    },
     cellClass({ row, column, rowIndex, columnIndex }) {
       const classes = []
+      if (
+        ['checkInTime', 'DealInfo', 'sortLocationMark', 'loadLocationMark', 'inflLocationMark'].includes(
+          column.property
+        )
+      ) {
+        classes.push('pre-line')
+      }
       if (
         [
-          'flightNO',
+          'passengerName',
           'luggageSN'
           // 'inFlightNO',
           // 'transferFlightNO'
@@ -306,7 +407,7 @@ export default {
         if (
           this.clickedCells.some(
             cell =>
-              cell.pageName === 'advance' &&
+              cell.pageName === this.$route.name &&
               Object.entries(cell.row).every(([key, value]) => row[key] === value) &&
               cell.columnProp === column.property
           )
@@ -319,10 +420,10 @@ export default {
     cellClickHandler(row, column, cell, event) {
       if (
         [
-          // 'flightNO',
+          'passengerName',
           'luggageSN'
           // 'inFlightNO',
-          // 'transferFlightNO'
+          //  'transferFlightNO'
         ].includes(column.property) &&
         row[column.property]
       ) {
@@ -332,77 +433,54 @@ export default {
           pageName: this.$route.name
         })
         switch (column.property) {
-          // case 'flightNO':
-          //   this.$router.push({
-          //     path: '/advance/flightView',
-          //     query: {
-          //       flightNO: this.selectedHistoryData.flightNO,
-          //       flightDate: this.selectedHistoryData.flightDate
-          //     }
-          //   })
-          //   break
+          case 'passengerName':
+            this.$message.info('开发中')
+            break
           case 'luggageSN':
             this.$router.push({
-              path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/baggageView`,
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/baggageView`,
               query: {
-                flightNO: this.selectedHistoryData.flightNO,
-                flightDate: this.selectedHistoryData.flightDate,
-                bagSN: row.luggageSN
+                bagSN: row.luggageSN,
+                flightNO: this.queryData.flightNO,
+                flightDate: this.queryData.flightDate
               }
             })
             break
-          // case 'inFlightNO':
-          //   this.$router.push({
-          //     path: '/advance/flightView',
-          //     query: {
-          //       flightNO: row.inFlightNO,
-          //       flightDate: row.preFlightDate
-          //     }
-          //   })
-          //   break
-          // case 'transferFlightNO':
-          //   this.$router.push({
-          //     path: '/advance/flightView',
-          //     query: {
-          //       flightNO: row.transferFlightNO,
-          //       flightDate: row.transferFlightDate
-          //     }
-          //   })
-          //   break
           default:
             break
         }
       }
     },
-    tableFormat(row, column, cellValue) {
-      switch (column.property) {
-        case 'isDEL':
-          return cellValue === 'DEL' ? cellValue : ''
-        case 'activeState':
-          return cellValue === 1 ? '激活' : '未激活'
-        default:
-          return cellValue ?? ''
+    toContainerHistory() {
+      this.$router.push({
+        path: `${this.$route.path.split('/').slice(0, -1).join('/')}/containerHistory`,
+        query: {
+          containerID: this.queryData.containerID
+        }
+      })
+    },
+    // 统计行数
+    summaryRow(num) {
+      return function () {
+        return ['合计', `共${num}件`]
       }
     },
-    async queryContainerHistory(dataContent) {
-      this.treeLoading = true
-      this.tableData = []
-      try {
-        const result = await myQuery(DATACONTENT_ID.containerHistory, ...dataContent)
-        this.containerHistory = result
-        this.msg = '容器历史默认显示最近' + this.containerHistory[0].k + '条历史，如果需要可联系管理员进行配置'
-      } catch (error) {this.$message.error("失败");}
-      this.treeLoading = false
+    exportHandler(refName, tableName) {
+      const table = this.$refs[refName].$el.cloneNode(true)
+      const fileName = `${tableName}-${Object.values(this.queryData).join('-')}.xlsx`
+      throttledExportToExcel(table, tableName, fileName)
     },
-    async queryBaggageList(dataContent) {
-      this.tableLoading = true
+    async queryContainerBaggage(dataContent) {
+      this.fullscreenLoading = true
       this.tableData = []
       try {
-        const result = await myQuery(DATACONTENT_ID.containerBaggage, ...dataContent)
-        this.tableData = result
+        const tableData = await myQuery(DATACONTENT_ID.containerBaggage, ...dataContent)
+        this.tableData = tableData
         setTableFilters(this.tableData, this.tableDataFilters)
-      } catch (error) {this.$message.error("失败");}
-      this.tableLoading = false
+      } catch {
+        this.$message.error('失败')
+      }
+      this.fullscreenLoading = false
     }
   }
 }
@@ -410,77 +488,68 @@ export default {
 
 <style lang="scss" scoped>
 .container-view {
-  padding: 17px 24px 20px;
-  display: flex;
-  .container-left {
-    flex: 0 1 352px;
-    margin-right: 16px;
-    background-color: #ffffff;
-    ::v-deep .el-tree {
-      height: calc(100vh - 80px - 17px - 20px);
-      overflow-x: hidden;
-      overflow-y: auto;
-      > .el-tree-node {
-        > .el-tree-node__children {
-          display: block;
-        }
-        .el-tree-node__content {
-          height: 38px;
-          .el-tree-node__label {
-            margin-left: 0;
-            letter-spacing: 1px;
-            line-height: 38px;
-            font-size: 14px;
-            font-family: Helvetica, 'Microsoft YaHei';
-            font-weight: bold;
-            color: #101116;
-          }
-        }
-        > .el-tree-node__content {
-          > .el-tree-node__expand-icon.el-icon-caret-right:not(.is-leaf):before {
-            font-size: 16px;
-            color: #101116;
-          }
-          > .el-tree-node__label {
-            font-size: 16px;
-          }
-        }
-      }
-    }
+  width: 100%;
+  height: calc(100vh - 80px - 16px);
+  overflow: hidden;
+  background: #dfe3ea;
+  padding: 0px 8px;
+  .title {
+    display: flex;
+    justify-content: space-between;
+    padding: 16px 0;
+    margin-right: 0;
   }
-
-  .container-right {
-    flex: 1;
-    ::v-deep .el-table {
+  .container-basic {
+    .basic-info-box {
       width: 100%;
-      .cell {
-        padding: 0;
-        text-align: center;
-        font-size: 14px;
-        font-family: Helvetica, 'Microsoft YaHei';
-        letter-spacing: 0;
+      background: #041741;
+      padding: 16px 30px;
+      color: #fff;
+    }
+  }
+  .container-table {
+    .title {
+      height: 64px;
+      .manageTitle {
+        flex: 1;
       }
-      .cell-click {
-        cursor: pointer;
-        color: #2d7cff;
-        &.cell-clicked {
-          color: purple;
+      .el-dropdown {
+        height: 30px;
+      }
+      .btn-square {
+        height: 30px;
+        margin-left: 20px;
+        &:last-child {
+          margin-right: 30px;
         }
       }
-      .el-table__header-wrapper,
-      .el-table__fixed-header-wrapper {
+    }
+    .table-wrapper {
+      background-color: #fff;
+      ::v-deep .el-table {
+        width: 100%;
         .cell {
-          font-weight: bold;
-          color: #101116;
+          padding: 0;
+          text-align: center;
+          font-size: 14px;
+          font-family: Helvetica, 'Microsoft YaHei';
+          letter-spacing: 0;
         }
-      }
-      .el-table__body-wrapper,
-      .el-table__fixed-body-wrapper {
-        tr.bgl-deleted {
-          background: #d2d6df;
-          td {
+        .cell-click {
+          cursor: pointer;
+          color: #2d7cff;
+          &.cell-clicked {
+            color: purple;
+          }
+        }
+        .el-table__body-wrapper,
+        .el-table__fixed-body-wrapper {
+          tr.bgl-deleted {
             background: #d2d6df;
-            font-style: italic;
+            td {
+              background: #d2d6df;
+              font-style: italic;
+            }
           }
         }
       }

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

@@ -0,0 +1,507 @@
+<template>
+  <div class="container-history">
+    <div class="container-left">
+      <div class="title">
+        <span class="manageTitle">容器历史</span>
+        <!-- <BackButton /> -->
+      </div>
+      <div
+        v-loading="treeLoading"
+        element-loading-text="拼命加载中"
+        element-loading-spinner="el-icon-loading"
+        element-loading-background="rgba(0, 0, 0, 0.8)"
+        class="container-tree"
+      >
+        <el-tree
+          :data="containerHistoryTree"
+          :props="defaultTreeProps"
+          node-key="index"
+          default-expand-all
+          :expand-on-click-node="false"
+          @current-change="currentChangeHandler"
+        >
+          <span
+            slot-scope="{ node, data }"
+            class="el-tree-node__label"
+          >
+            <el-tooltip
+              v-if="data.index === -1"
+              class="item"
+              effect="dark"
+              :content="msg"
+              placement="top"
+            >
+              <span>{{ node.label }}</span>
+            </el-tooltip>
+            <span v-else>{{ node.label }}</span>
+          </span>
+        </el-tree>
+      </div>
+    </div>
+    <div
+      v-loading="tableLoading"
+      element-loading-text="拼命加载中"
+      element-loading-spinner="el-icon-loading"
+      element-loading-background="rgba(0, 0, 0, 0.8)"
+      class="container-right"
+    >
+      <el-table
+        ref="table"
+        :data="dealedTableData"
+        border
+        stripe
+        fit
+        height="calc(100vh - 80px - 17px - 20px)"
+        :header-cell-class-name="headerCellClass"
+        :row-class-name="tableRowClassName"
+        :cell-class-name="cellClass"
+        @cell-click="cellClickHandler"
+      >
+        <el-table-column
+          v-for="col in tableCols"
+          :key="col.prop"
+          :prop="col.prop"
+          :label="col.label"
+          :width="col.width"
+          :fixed="col.fixed"
+          :formatter="tableFormat"
+        >
+          <template #header>
+            <el-tooltip
+              :content="col.desc || col.label"
+              placement="top"
+            >
+              <TableHeaderCell
+                :label="col.label"
+                :filter-options="tableDataFilters[col.prop]"
+                :filter-values.sync="filterValues[col.prop]"
+                :sortable="col.sortable"
+                :sort-rule.sync="tableDataSortRules[col.prop]"
+              />
+            </el-tooltip>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+// import BackButton from '@/components/BackButton'
+import TableHeaderCell from '@/components/TableHeaderCell'
+import { mapGetters } from 'vuex'
+import { myQuery } from '@/api/dataIntegration'
+import { setTableFilters } from '@/utils/table'
+
+export default {
+  name: 'ContainerHistory',
+  components: {
+    // BackButton,
+    TableHeaderCell
+  },
+  data() {
+    return {
+      queryData: {},
+      containerHistory: [],
+      selectedHistoryData: {},
+      defaultTreeProps: {
+        children: 'children',
+        label: 'label'
+      },
+      treeLoading: false,
+      tableLoading: false,
+      tableCols: [
+        {
+          prop: 'passengerName',
+          label: '旅客姓名',
+          desc: '指旅客姓名的拼音大写',
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'luggageSN',
+          label: '行李牌号',
+          desc: '指行李的10位数字行李牌号码',
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'specialType',
+          label: '特殊行李类型',
+          desc: '指有别于普通托运行李的特殊行李分类，包括（装笼动物、机组行李、易碎行李、VIP行李等），参考BSM报文.E项说明',
+          width: 115,
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'isDEL',
+          label: '删除',
+          desc: '指旅客是否取消值机托运，根据BSM报文状态是否有DEL判断，已删除的行李记录为斜体灰色字体',
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'activeState',
+          label: '激活',
+          desc: '指托运行李是否被激活，参照BSM报文.S项说明',
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'luggageWeight',
+          label: '重量',
+          desc: '指托运行李的重量，参照BSM报文.W项说明'
+        },
+        {
+          prop: 'lastStatus',
+          label: '最新状态',
+          desc: '指托运行李的当前查询时间所在的节点状态',
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'lastLocation',
+          label: '最新位置',
+          desc: '指托运行李的当前查询时间所在的节点状态的识读位置代号',
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'inFlightNO',
+          label: '中转进航班',
+          desc: '指有中转行李转出的进港航班号',
+          width: 110,
+          filterable: true,
+          sortable: true
+        },
+        {
+          prop: 'transferFlightNO',
+          label: '中转出航班',
+          desc: '指有中转行李转入的离港航班号',
+          width: 110,
+          filterable: true,
+          sortable: true
+        }
+      ],
+      tableData: [],
+      tableDataFilters: {},
+      filterValues: {},
+      tableDataSortRules: {},
+      msg: '容器历史默认显示最近10条历史，如果需要可联系管理员进行配置'
+    }
+  },
+  computed: {
+    ...mapGetters(['clickedCells']),
+    containerHistoryTree() {
+      return [
+        {
+          index: -1,
+          label: `容器历史-${this.queryData.containerID}`,
+          children: this.containerHistory.map(({ flightNO, flightDate, departureAirport, arriveAirport }, index) => ({
+            index,
+            label: [flightNO, flightDate.replaceAll('-', '/'), departureAirport, arriveAirport].join('-')
+          }))
+        }
+      ]
+    },
+    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: {
+    $route: {
+      handler({ path, query }) {
+        if (path.includes('containerHistory')) {
+          const { containerID } = query
+          if (containerID) {
+            const { containerID: oldContainerID } = this.queryData
+            if (containerID !== oldContainerID) {
+              this.queryData = { containerID }
+              this.queryContainerHistory([containerID])
+            }
+          } else {
+            this.$router.push('/')
+          }
+        }
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+  created() {
+    Object.values(this.tableCols).forEach(({ prop, filterable, sortable }) => {
+      if (filterable) {
+        this.$set(this.tableDataFilters, prop, [])
+        this.$set(this.filterValues, prop, [])
+      }
+      if (sortable) {
+        this.$set(this.tableDataSortRules, prop, '')
+      }
+    })
+  },
+  updated() {
+    // table数据更新
+    this.$nextTick(() => {
+      this.$refs.table.doLayout()
+    })
+  },
+  deactivated() {
+    this.treeLoading = false
+    this.tableLoading = false
+  },
+  beforeDestroy() {
+    this.treeLoading = false
+    this.tableLoading = false
+  },
+  methods: {
+    currentChangeHandler({ index }) {
+      if (index > -1) {
+        this.selectedHistoryData = this.containerHistory[index]
+        const { flightNO, flightDate, departureAirport, arriveAirport, containerID } = this.selectedHistoryData
+        const dataContent = [flightNO, flightDate, departureAirport, arriveAirport, containerID]
+        this.queryBaggageList(dataContent)
+      }
+    },
+    // 给表头单元格加上 ascending 或 descending 使用 element 自带的排序箭头变色
+    headerCellClass({ row, column, rowIndex, columnIndex }) {
+      const classes = []
+      const rule = this.tableDataSortRules[column.property]
+      if (rule) {
+        classes.push(rule)
+      }
+      return classes.join(' ')
+    },
+    tableRowClassName({ row, rowIndex }) {
+      const classes = []
+      if (row.isDEL === 'DEL') {
+        classes.push('bgl-deleted')
+      }
+      return classes.join(' ')
+    },
+    cellClass({ row, column, rowIndex, columnIndex }) {
+      const classes = []
+      if (
+        [
+          'flightNO',
+          'luggageSN'
+          // 'inFlightNO',
+          // 'transferFlightNO'
+        ].includes(column.property) &&
+        row[column.property]
+      ) {
+        classes.push('cell-click')
+        if (
+          this.clickedCells.some(
+            cell =>
+              cell.pageName === 'advance' &&
+              Object.entries(cell.row).every(([key, value]) => row[key] === value) &&
+              cell.columnProp === column.property
+          )
+        ) {
+          classes.push('cell-clicked')
+        }
+      }
+      return classes.join(' ')
+    },
+    cellClickHandler(row, column, cell, event) {
+      if (
+        [
+          // 'flightNO',
+          'luggageSN'
+          // 'inFlightNO',
+          // 'transferFlightNO'
+        ].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: '/advance/flightView',
+          //     query: {
+          //       flightNO: this.selectedHistoryData.flightNO,
+          //       flightDate: this.selectedHistoryData.flightDate
+          //     }
+          //   })
+          //   break
+          case 'luggageSN':
+            this.$router.push({
+              path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/baggageView`,
+              query: {
+                flightNO: this.selectedHistoryData.flightNO,
+                flightDate: this.selectedHistoryData.flightDate,
+                bagSN: row.luggageSN
+              }
+            })
+            break
+          // case 'inFlightNO':
+          //   this.$router.push({
+          //     path: '/advance/flightView',
+          //     query: {
+          //       flightNO: row.inFlightNO,
+          //       flightDate: row.preFlightDate
+          //     }
+          //   })
+          //   break
+          // case 'transferFlightNO':
+          //   this.$router.push({
+          //     path: '/advance/flightView',
+          //     query: {
+          //       flightNO: row.transferFlightNO,
+          //       flightDate: row.transferFlightDate
+          //     }
+          //   })
+          //   break
+          default:
+            break
+        }
+      }
+    },
+    tableFormat(row, column, cellValue) {
+      switch (column.property) {
+        case 'isDEL':
+          return cellValue === 'DEL' ? cellValue : ''
+        case 'activeState':
+          return cellValue === 1 ? '激活' : '未激活'
+        default:
+          return cellValue ?? ''
+      }
+    },
+    async queryContainerHistory(dataContent) {
+      this.treeLoading = true
+      this.tableData = []
+      try {
+        const result = await myQuery(DATACONTENT_ID.containerHistory, ...dataContent)
+        this.containerHistory = result
+        this.msg = '容器历史默认显示最近' + this.containerHistory[0].k + '条历史，如果需要可联系管理员进行配置'
+      } catch (error) {
+        this.$message.error('失败')
+      }
+      this.treeLoading = false
+    },
+    async queryBaggageList(dataContent) {
+      this.tableLoading = true
+      this.tableData = []
+      try {
+        const result = await myQuery(DATACONTENT_ID.containerBaggage, ...dataContent)
+        this.tableData = result
+        setTableFilters(this.tableData, this.tableDataFilters)
+      } catch (error) {
+        this.$message.error('失败')
+      }
+      this.tableLoading = false
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.container-history {
+  padding: 17px 24px 20px;
+  display: flex;
+  .container-left {
+    flex: 0 1 352px;
+    margin-right: 16px;
+    background-color: #ffffff;
+    .title {
+      height: 32px;
+      .manageTitle {
+        margin-right: 0;
+      }
+    }
+    ::v-deep .el-tree {
+      height: calc(100vh - 80px - 32px - 17px - 20px);
+      overflow-x: hidden;
+      overflow-y: auto;
+      > .el-tree-node {
+        > .el-tree-node__children {
+          display: block;
+        }
+        .el-tree-node__content {
+          height: 38px;
+          .el-tree-node__label {
+            margin-left: 0;
+            letter-spacing: 1px;
+            line-height: 38px;
+            font-size: 14px;
+            font-family: Helvetica, 'Microsoft YaHei';
+            font-weight: bold;
+            color: #101116;
+          }
+        }
+        > .el-tree-node__content {
+          > .el-tree-node__expand-icon.el-icon-caret-right:not(.is-leaf):before {
+            font-size: 16px;
+            color: #101116;
+          }
+          > .el-tree-node__label {
+            font-size: 16px;
+          }
+        }
+      }
+    }
+  }
+
+  .container-right {
+    flex: 1;
+    ::v-deep .el-table {
+      width: 100%;
+      .cell {
+        padding: 0;
+        text-align: center;
+        font-size: 14px;
+        font-family: Helvetica, 'Microsoft YaHei';
+        letter-spacing: 0;
+      }
+      .cell-click {
+        cursor: pointer;
+        color: #2d7cff;
+        &.cell-clicked {
+          color: purple;
+        }
+      }
+      .el-table__header-wrapper,
+      .el-table__fixed-header-wrapper {
+        .cell {
+          font-weight: bold;
+          color: #101116;
+        }
+      }
+      .el-table__body-wrapper,
+      .el-table__fixed-body-wrapper {
+        tr.bgl-deleted {
+          background: #d2d6df;
+          td {
+            background: #d2d6df;
+            font-style: italic;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

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

@@ -0,0 +1,14 @@
+<template>
+  <ContainerHistory />
+</template>
+
+<script>
+import ContainerHistory from '../containerHistory'
+
+export default {
+  name: 'DepartureContainerHistory',
+  components: {
+    ContainerHistory
+  }
+}
+</script>

src/views/baggageManagement/components/departureC/containerHistory.vue

@@ -0,0 +1,14 @@
+<template>
+  <ContainerHistory />
+</template>
+
+<script>
+import ContainerHistory from '../containerHistory'
+
+export default {
+  name: 'DepartureContainerHistory',
+  components: {
+    ContainerHistory
+  }
+}
+</script>

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

@@ -10,24 +10,39 @@
     <div class="flight-wrapper">
       <div class="part1">
         <div class="title">
-          <span class="manageTitle">
-            <span>航班基本信息</span>
-            <span class="btn-back"><i class="el-icon-arrow-left" />返回上一步</span>
-          </span>
+          <span class="manageTitle">航班基本信息</span>
+          <!-- <BackButton /> -->
         </div>
         <div class="part1-wrapper">
           <div class="airline">{{ queryData.flightNO }}
-            <el-select v-model="selectedAirline" size="mini" class="airline-select">
-              <el-option v-for="(airline, index) in airlineList" :key="index" :value="airline.value" :label="airline.label" />
+            <el-select
+              v-model="selectedAirline"
+              size="mini"
+              class="airline-select"
+            >
+              <el-option
+                v-for="(airline, index) in airlineList"
+                :key="index"
+                :value="airline.value"
+                :label="airline.label"
+              />
             </el-select>
           </div>
           <div class="part1_info">
             <div class="part1_info_box">
               <el-row>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>起飞机场简称：</span>
                 </el-col>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>{{ flightInfo.departureName }}</span>
                 </el-col>
               </el-row>
@@ -48,22 +63,38 @@
                 </el-col>
               </el-row>
               <el-row>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>
                     日期：{{ flightInfo.planDepartureTime && flightInfo.planDepartureTime.split("T")[0] }}
                   </span>
                 </el-col>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>
                     时间：{{ flightInfo.planDepartureTime && flightInfo.planDepartureTime.split("T")[1] }}
                   </span>
                 </el-col>
               </el-row>
               <el-row>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>登机口：{{ flightInfo.bordingGate }}</span>
                 </el-col>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>停机位：{{ flightInfo.standForDepartrue }}</span>
                 </el-col>
               </el-row>
@@ -79,26 +110,67 @@
                 </el-col>
               </el-row> -->
               <el-row>
-                <el-col :xs="16" :sm="16" :xl="12">
+                <el-col
+                  :xs="16"
+                  :sm="16"
+                  :xl="12"
+                >
                   <span>航班状态：</span>
                 </el-col>
-                <el-col :xs="8" :sm="8" :xl="12">
-                  <span>{{ flightInfo.flightStatus === null ? "正常" : flightInfo.flightStatus }}</span>
+                <el-col
+                  :xs="8"
+                  :sm="8"
+                  :xl="12"
+                >
+                  <!-- <span>{{ flightInfo.flightStatus === null ? "正常" : flightInfo.flightStatus }}</span> -->
+                  <span>{{ flightInfo.flightStateCN }}</span>
+                </el-col>
+              </el-row>
+              <el-row>
+                <el-col
+                  :xs="16"
+                  :sm="16"
+                  :xl="12"
+                >
+                  <span>机号：</span>
+                </el-col>
+                <el-col
+                  :xs="8"
+                  :sm="8"
+                  :xl="12"
+                >
+                  <span>{{ flightInfo.craftNo }}</span>
                 </el-col>
               </el-row>
               <el-row>
-                <el-col :xs="16" :sm="16" :xl="12">
+                <el-col
+                  :xs="16"
+                  :sm="16"
+                  :xl="12"
+                >
                   <span>托运旅客数：</span>
                 </el-col>
-                <el-col :xs="8" :sm="8" :xl="12">
+                <el-col
+                  :xs="8"
+                  :sm="8"
+                  :xl="12"
+                >
                   <span>{{ flightInfo.count1 }}</span>
                 </el-col>
               </el-row>
               <el-row>
-                <el-col :xs="16" :sm="16" :xl="12">
+                <el-col
+                  :xs="16"
+                  :sm="16"
+                  :xl="12"
+                >
                   <span>终点行李数：</span>
                 </el-col>
-                <el-col :xs="8" :sm="8" :xl="12">
+                <el-col
+                  :xs="8"
+                  :sm="8"
+                  :xl="12"
+                >
                   <span>{{ flightInfo.count2 }}</span>
                 </el-col>
               </el-row>
@@ -122,10 +194,18 @@
             <i class="part1_info_arrow_right el-icon-caret-right" />
             <div class="part1_info_box">
               <el-row>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>降落机场简称：</span>
                 </el-col>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>{{ flightInfo.landingName }}</span>
                 </el-col>
               </el-row>
@@ -146,23 +226,55 @@
                 </el-col>
               </el-row> -->
               <el-row>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>
                     日期：{{ flightInfo.expectLandingTime && flightInfo.expectLandingTime.split("T")[0] }}
                   </span>
                 </el-col>
-                <el-col :xs="24" :sm="24" :xl="12">
+                <el-col
+                  :xs="24"
+                  :sm="24"
+                  :xl="12"
+                >
                   <span>
                     时间：{{ flightInfo.expectLandingTime && flightInfo.expectLandingTime.split("T")[1] }}
                   </span>
                 </el-col>
               </el-row>
               <el-row>
-                <el-col :xs="24" :sm="24" :xl="12">
-                  <span>提取转盘：{{ flightInfo.carousel }}</span>
+                <el-col
+                  :xs="16"
+                  :sm="16"
+                  :xl="12"
+                >
+                  <span>提取转盘：</span>
                 </el-col>
-                <el-col :xs="24" :sm="24" :xl="12">
-                  <span>停机位：{{ flightInfo.standForLanding }}</span>
+                <el-col
+                  :xs="8"
+                  :sm="8"
+                  :xl="12"
+                >
+                  <span>{{ flightInfo.carousel }}</span>
+                </el-col>
+              </el-row>
+              <el-row>
+                <el-col
+                  :xs="16"
+                  :sm="16"
+                  :xl="12"
+                >
+                  <span>停机位：</span>
+                </el-col>
+                <el-col
+                  :xs="8"
+                  :sm="8"
+                  :xl="12"
+                >
+                  <span>{{ flightInfo.standForLanding }}</span>
                 </el-col>
               </el-row>
             </div>
@@ -172,10 +284,37 @@
       <div class="part2">
         <div class="title">
           <span class="manageTitle">航班容器列表</span>
-          <img class="btn-square btn-shadow" src="@/assets/baggage/ic_export.png" title="导出" @click="exportHandler('containerTable', '航班容器列表')">
+          <img
+            class="btn-square btn-shadow"
+            src="@/assets/baggage/ic_export.png"
+            title="导出"
+            @click="exportHandler('containerTable', '航班容器列表')"
+          >
         </div>
-        <el-table ref="containerTable" :data="containerTableData" border style="width: 100%" height="290px" stripe size="mini" show-summary :summary-method="summaryMethod" :header-cell-style="{ color: '#101116' }" :row-class-name="rowClass" @row-click="containerClick">
-          <el-table-column v-for="col in containerTableColumn" :key="col.id" :prop="col.prop" :label="col.label" :width="col.width" :align="col.align || 'center'" :show-overflow-tooltip="true" />
+        <el-table
+          ref="containerTable"
+          :data="containerTableData"
+          border
+          style="width: 100%"
+          height="290px"
+          stripe
+          size="mini"
+          show-summary
+          :summary-method="summaryMethod"
+          :header-cell-style="{ color: '#101116' }"
+          :row-class-name="rowClass"
+          :cell-class-name="cellClass"
+          @cell-click="cellClickHandler"
+        >
+          <el-table-column
+            v-for="col in containerTableColumn"
+            :key="col.id"
+            :prop="col.prop"
+            :label="col.label"
+            :width="col.width"
+            :align="col.align || 'center'"
+            :show-overflow-tooltip="true"
+          />
         </el-table>
       </div>
       <!-- <div
@@ -236,46 +375,120 @@
           />
         </el-table>
       </div> -->
-      <div class="drag-mask" :class="{ active: dragActive }" />
-      <div class="part4" :style="draggableStyle">
-        <div v-drag-height class="drag-box" :class="{ active: dragActive }">
+      <div
+        class="drag-mask"
+        :class="{ active: dragActive }"
+      />
+      <div
+        class="part4"
+        :style="draggableStyle"
+      >
+        <div
+          v-drag-height
+          class="drag-box"
+          :class="{ active: dragActive }"
+        >
           <i class="drag-icon el-icon-d-caret" />
-          <div class="drag-line" :style="dragLineStyle" />
+          <div
+            class="drag-line"
+            :style="dragLineStyle"
+          />
         </div>
         <div class="title">
           <span class="manageTitle">航班行李列表</span>
           <TimeZoneSelector />
-          <img class="btn-square btn-shadow" src="@/assets/baggage/ic_export.png" title="导出" @click="exportHandler('flightBaggageTable', '航班行李列表')">
-          <img class="btn-square btn-shadow" src="@/assets/baggage/ic_setting.png" title="列设置" @click="show">
+          <img
+            class="btn-square btn-shadow"
+            src="@/assets/baggage/ic_export.png"
+            title="导出"
+            @click="exportHandler('flightBaggageTable', '航班行李列表')"
+          >
+          <img
+            class="btn-square btn-shadow"
+            src="@/assets/baggage/ic_setting.png"
+            title="列设置"
+            @click="show"
+          >
         </div>
-        <el-table ref="flightBaggageTable" :data="dealedTableData" border style="width: 100%" height="calc(100% - 64px)" stripe size="mini" show-summary :summary-method="summaryRow(dealedTableData.length)" :header-cell-class-name="headerCellClass" :header-cell-style="{ color: '#101116' }" :row-class-name="rowClass" :cell-class-name="cellClass" @cell-click="cellClickHandler">
-          <el-table-column v-for="col in tableColsCopy" :key="col.index" :prop="col.prop" :label="col.label" :align="col.align || 'center'" :width="col.width" :fixed="col.fixed" :formatter="tableFormat">
+        <el-table
+          ref="flightBaggageTable"
+          :data="dealedTableData"
+          border
+          style="width: 100%"
+          height="calc(100% - 64px)"
+          stripe
+          size="mini"
+          show-summary
+          :summary-method="summaryRow(dealedTableData.length)"
+          :header-cell-class-name="headerCellClass"
+          :header-cell-style="{ color: '#101116' }"
+          :row-class-name="rowClass"
+          :cell-class-name="cellClass"
+          @cell-click="cellClickHandler"
+        >
+          <el-table-column
+            v-for="col in tableColsCopy"
+            :key="col.index"
+            :prop="col.prop"
+            :label="col.label"
+            :align="col.align || 'center'"
+            :width="col.width"
+            :fixed="col.fixed"
+            :formatter="tableFormat"
+          >
             <template #header>
-              <TableHeaderCell :label="col.label" :filter-options="flightBaggageTableFilters[col.prop]" :filter-values.sync="filterValues[col.prop]" :sortable="col.sortable" :sort-rule.sync="tableDataSortRules[col.prop]" />
+              <TableHeaderCell
+                :label="col.label"
+                :filter-options="flightBaggageTableFilters[col.prop]"
+                :filter-values.sync="filterValues[col.prop]"
+                :sortable="col.sortable"
+                :sort-rule.sync="tableDataSortRules[col.prop]"
+              />
             </template>
           </el-table-column>
         </el-table>
       </div>
     </div>
     <!--列设置-->
-    <Dialog :flag="dialogFlag" class="dialog-check-group">
+    <Dialog
+      :flag="dialogFlag"
+      class="dialog-check-group"
+    >
       <div class="dialog-wrapper">
         <div class="title">列设置</div>
         <div class="content">
-          <el-tree :data="tableCols" :class="colsCheckClass" show-checkbox node-key="index" :default-expand-all="true" :props="{
+          <el-tree
+            :data="tableCols"
+            :class="colsCheckClass"
+            show-checkbox
+            node-key="index"
+            :default-expand-all="true"
+            :props="{
               label: 'label',
               children: 'children',
-            }" :default-checked-keys="checkedKeysTemp" @check="handleCheck" />
+            }"
+            :default-checked-keys="checkedKeysTemp"
+            @check="handleCheck"
+          />
         </div>
         <div class="foot right t30">
-          <el-button size="medium" class="r24" type="primary" @click="onCheck('flightBaggageTableData')">确定</el-button>
-          <el-button size="medium" @click="hide">取消</el-button>
+          <el-button
+            size="medium"
+            class="r24"
+            type="primary"
+            @click="onCheck('flightBaggageTableData')"
+          >确定</el-button>
+          <el-button
+            size="medium"
+            @click="hide"
+          >取消</el-button>
         </div>
       </div>
     </Dialog>
   </div>
 </template>
 <script>
+// import BackButton from '@/components/BackButton'
 import Dialog from '@/layout/components/Dialog/index.vue'
 import TimeZoneSelector from '@/components/TimeZoneSelector'
 import { myQuery } from '@/api/dataIntegration'
@@ -290,20 +503,20 @@ export default {
   name: 'FlightView',
   directives: {
     dragHeight: {
-      inserted (el, binding, vnode) {
+      inserted(el, binding, vnode) {
         const that = vnode.context
         let mousedownY
         let dragY
         let dragHeight
         const offsetTop = el.offsetParent.offsetTop
-        function mousemoveHandler (e) {
+        function mousemoveHandler(e) {
           e.stopPropagation()
           e.preventDefault()
           dragY = dragHeight + mousedownY - e.screenY
           dragY = dragY < 0 ? 0 : dragY > offsetTop ? offsetTop : dragY
           that.dragY = dragY
         }
-        function mouseupHandler (e) {
+        function mouseupHandler(e) {
           e.stopPropagation()
           e.preventDefault()
           that.dragHeight = that.dragY
@@ -324,12 +537,13 @@ export default {
     }
   },
   components: {
+    // BackButton,
     Dialog,
     TimeZoneSelector,
     TableHeaderCell
   },
   mixins: [tableColsMixin, timeZoneMixin],
-  data () {
+  data() {
     return {
       fullscreenLoading: false,
       airlineList: [],
@@ -417,7 +631,7 @@ export default {
   },
   computed: {
     ...mapGetters(['clickedCells']),
-    dealedTableData () {
+    dealedTableData() {
       const filtered = this.flightBaggageTableData.filter(item => {
         let flag = true
         Object.entries(this.filterValues).forEach(([key, arr]) => {
@@ -440,12 +654,12 @@ export default {
       )
       return this._.orderBy(filtered, sortRules[0], sortRules[1])
     },
-    draggableStyle () {
+    draggableStyle() {
       return {
         height: `calc(100vh - 80px - 64px - 16px - 290px + ${this.dragHeight}px)`
       }
     },
-    dragLineStyle () {
+    dragLineStyle() {
       return {
         transform: `translateY(${this.dragHeight - this.dragY}px)`
       }
@@ -453,7 +667,7 @@ export default {
   },
   watch: {
     $route: {
-      handler ({ path, query }) {
+      handler({ path, query }) {
         if (path.includes('flightView')) {
           const { flightNO, flightDate } = query
           if (flightNO && flightDate) {
@@ -470,7 +684,7 @@ export default {
       deep: true,
       immediate: true
     },
-    fullscreenLoading (val) {
+    fullscreenLoading(val) {
       if (val) {
         this.loading = this.$loading({
           lock: true,
@@ -482,13 +696,13 @@ export default {
         this.loading?.close()
       }
     },
-    selectedAirline (val) {
+    selectedAirline(val) {
       const { flightNO, flightDate } = this.queryData
       const [departureAirport, landingAirport] = val.split('-')
       this.queryAll([flightNO, flightDate, departureAirport, landingAirport])
     }
   },
-  created () {
+  created() {
     Object.values(this.tableCols).forEach(({ prop, filterable, sortable }) => {
       if (filterable) {
         this.$set(this.flightBaggageTableFilters, prop, [])
@@ -499,7 +713,7 @@ export default {
       }
     })
   },
-  activated () {
+  activated() {
     this.$nextTick(() => {
       this.$refs['containerTable']?.doLayout()
       // this.$refs['transferInBaggageTable']?.doLayout()
@@ -507,7 +721,7 @@ export default {
       this.$refs['flightBaggageTable']?.doLayout()
     })
   },
-  updated () {
+  updated() {
     this.$nextTick(() => {
       this.$refs['containerTable']?.doLayout()
       // this.$refs['transferInBaggageTable']?.doLayout()
@@ -515,14 +729,14 @@ export default {
       this.$refs['flightBaggageTable']?.doLayout()
     })
   },
-  deactivated () {
+  deactivated() {
     this.loading?.close()
   },
-  beforeDestroy () {
+  beforeDestroy() {
     this.loading?.close()
   },
   methods: {
-    rowClass ({ row, rowIndex }) {
+    rowClass({ row, rowIndex }) {
       const classes = []
       if (this.warningContainers.includes(row['containerNumber']) || row['latestStatus'] === '待翻减') {
         classes.push('row-warning')
@@ -533,7 +747,7 @@ export default {
       return classes.join(' ')
     },
     // 给表头单元格加上 ascending 或 descending 使用 element 自带的排序箭头变色
-    headerCellClass ({ row, column, rowIndex, columnIndex }) {
+    headerCellClass({ row, column, rowIndex, columnIndex }) {
       const classes = []
       const rule = this.tableDataSortRules[column.property]
       if (rule) {
@@ -541,7 +755,7 @@ export default {
       }
       return classes.join(' ')
     },
-    cellClass ({ row, column, rowIndex, columnIndex }) {
+    cellClass({ row, column, rowIndex, columnIndex }) {
       const classes = []
       if (
         ['checkInTime', 'DealInfo', 'sortLocationMark', 'loadLocationMark', 'inflLocationMark'].includes(
@@ -552,6 +766,7 @@ export default {
       }
       if (
         [
+          'containerNumber',
           'preFlightNO',
           'totalNumber',
           'inFlightNO',
@@ -578,11 +793,13 @@ export default {
       }
       return classes.join(' ')
     },
-    cellClickHandler (row, column, cell, event) {
+    cellClickHandler(row, column, cell, event) {
       if (
         [
+          'containerNumber',
           'preFlightNO',
           'totalNumber',
+          'inFlightNO',
           'transferFlightNO',
           'transferNumber',
           'PassengerNameUpcase',
@@ -598,9 +815,25 @@ export default {
           pageName: this.$route.name
         })
         switch (column.property) {
+          case 'containerNumber': {
+            const [departureAirport, landingAirport] = this.selectedAirline.split('-')
+            this.$router.push({
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/containerView`,
+              query: {
+                flightNO: this.queryData.flightNO,
+                flightDate: this.queryData.flightDate,
+                departureAirport,
+                landingAirport,
+                containerID: row.containerNumber,
+                containerType: row.style,
+                containerSpace: row.containerSpace
+              }
+            })
+            break
+          }
           case 'preFlightNO':
             this.$router.push({
-              path: '/advance/flightView',
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/flightView`,
               query: {
                 flightNO: row.preFlightNO,
                 flightDate: row.preFlightDate
@@ -620,7 +853,7 @@ export default {
             break
           case 'inFlightNO':
             this.$router.push({
-              path: '/advance/flightView',
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/flightView`,
               query: {
                 flightNO: row.inFlightNO,
                 flightDate: row.inFlightDate
@@ -629,7 +862,7 @@ export default {
             break
           case 'transferFlightNO':
             this.$router.push({
-              path: '/advance/flightView',
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/flightView`,
               query: {
                 flightNO: row.transferFlightNO,
                 flightDate: row.transferFlightDate
@@ -652,7 +885,7 @@ export default {
             break
           case 'BagSN':
             this.$router.push({
-              path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/baggageView`,
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/baggageView`,
               query: {
                 bagSN: row.BagSN,
                 flightNO: this.queryData.flightNO,
@@ -660,13 +893,19 @@ export default {
               }
             })
             break
-          case 'U_Device_ID':
+          case 'U_Device_ID': {
+            const [departureAirport, landingAirport] = this.selectedAirline.split('-')
+            const container = this.containerTableData.find(({ containerNumber }) => containerNumber === row.U_Device_ID)
             this.$router.push({
-              path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/newContainerView`,
+              path: `${this.$route.path.split('/').slice(0, -1).join('/')}/containerView`,
               query: {
                 flightNO: this.queryData.flightNO,
                 flightDate: this.queryData.flightDate,
-                containerID: row.U_Device_ID
+                departureAirport,
+                landingAirport,
+                containerID: row.U_Device_ID,
+                containerType: container.style,
+                containerSpace: container.containerSpace
               }
             })
             // this.$router.push({
@@ -676,13 +915,14 @@ export default {
             //   }
             // })
             break
+          }
           default:
             break
         }
       }
     },
     // 合计行
-    summaryMethod ({ columns, data }) {
+    summaryMethod({ columns, data }) {
       const sums = []
       if (columns.length > 0) {
         columns.forEach((column, index) => {
@@ -714,53 +954,32 @@ export default {
       return sums
     },
     // 统计行数
-    summaryRow (num) {
+    summaryRow(num) {
       return function () {
         return ['合计', `共${num}件`]
       }
     },
-    containerClick (row) {
-      if (row.containerNumber === 'FBULK') {
-        this.$router.push({
-          path: '/advance',
-          query: {
-            flightNO: this.queryData.flightNO,
-            startDate: this.queryData.flightDate,
-            endDate: this.queryData.flightDate,
-            loadType: 1
-          }
-        })
-      } else {
-        this.$router.push({
-          path: '/advance',
-          query: {
-            flightNO: this.queryData.flightNO,
-            startDate: this.queryData.flightDate,
-            endDate: this.queryData.flightDate,
-            U_Device_ID: row.containerNumber
-          }
-        })
-      }
-    },
-    exportHandler (refName, tableName) {
+    exportHandler(refName, tableName) {
       const table = this.$refs[refName].$el.cloneNode(true)
       const fileName = `${tableName}-${this.queryData.flightNO}-${this.queryData.flightDate}.xlsx`
       throttledExportToExcel(table, tableName, fileName)
     },
-    queryflightInfo (dataContent) {
+    queryflightInfo(dataContent) {
       return myQuery(DATACONTENT_ID.flightInfo, ...dataContent)
     },
-    queryContainer (dataContent) {
+    queryContainer(dataContent) {
       return myQuery(DATACONTENT_ID.flightContainer, ...dataContent)
     },
-    queryBaggageByFlightNO (dataContent) {
+    queryBaggageByFlightNO(dataContent) {
       return myQuery(DATACONTENT_ID.flightBaggage, ...dataContent)
     },
-    async queryAirline (dataContent) {
+    async queryAirline(dataContent) {
       try {
         const listValues = await myQuery(DATACONTENT_ID.flightAirline, ...dataContent)
         this.airlineList = listValues.map(({ departureAirport, landingAirport, departureBuild, landingBuild }) => ({
-          label: `${departureAirport}${departureBuild ? `(${departureBuild})` : ''}-${landingAirport}${landingBuild ? `(${landingBuild})` : ''}`,
+          label: `${departureAirport}${departureBuild ? `(${departureBuild})` : ''}-${landingAirport}${
+            landingBuild ? `(${landingBuild})` : ''
+          }`,
           value: `${departureAirport}-${landingAirport}`
         }))
         if (this.airlineList.length) {
@@ -770,7 +989,7 @@ export default {
         this.$message.error('失败')
       }
     },
-    async queryAll (dataContent) {
+    async queryAll(dataContent) {
       this.fullscreenLoading = true
       this.flightInfo = {}
       try {
@@ -846,6 +1065,12 @@ export default {
     }
     .part1 {
       width: 71.15%;
+      .title {
+        justify-content: flex-start;
+        .manageTitle {
+          flex: 0 1 auto;
+        }
+      }
       .part1-wrapper {
         height: 290px;
         background: #041741;

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

@@ -1,615 +0,0 @@
-<template>
-  <div class="new-container-view">
-    <div class="list">
-      <div class="title flex">
-        <div class="manageTitle">航班基本信息</div>
-        <el-button @click="toContainer" type="primary" size="small">历史记录</el-button>
-      </div>
-      <div class="part1">
-        <el-row :gutter="10">
-          <el-col :span="4">
-            <div class="grid-content bg-purple">容器编号:111</div>
-          </el-col>
-          <el-col :span="4">
-            <div class="grid-content bg-purple">容器类型:2222</div>
-          </el-col>
-          <el-col :span="4">
-            <div class="grid-content bg-purple">航班号:CA1111</div>
-          </el-col>
-          <el-col :span="5">
-            <div class="grid-content bg-purple">航班日期:2022-9-30 10:55:26</div>
-          </el-col>
-          <el-col :span="4">
-            <div class="grid-content bg-purple">舱位:11</div>
-          </el-col>
-        </el-row>
-      </div>
-    </div>
-    <div class="list">
-      <div class="title">
-        <div class="manageTitle">航班行李列表</div>
-      </div>
-      <div class="part2">
-        <el-table ref="flightBaggageTable" :data="dealedTableData" border style="width: 100%" height="calc(77vh - 64px)" stripe size="mini" show-summary :summary-method="summaryRow(dealedTableData.length)" :header-cell-class-name="headerCellClass" :header-cell-style="{ color: '#101116' }" :row-class-name="rowClass" :cell-class-name="cellClass" @cell-click="cellClickHandler">
-          <el-table-column v-for="col in tableColsCopy" :key="col.index" :prop="col.prop" :label="col.label" :align="col.align || 'center'" :width="col.width" :fixed="col.fixed" :formatter="tableFormat">
-            <template #header>
-              <TableHeaderCell :label="col.label" :filter-options="flightBaggageTableFilters[col.prop]" :filter-values.sync="filterValues[col.prop]" :sortable="col.sortable" :sort-rule.sync="tableDataSortRules[col.prop]" />
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import TimeZoneSelector from '@/components/TimeZoneSelector'
-import { myQuery } from '@/api/dataIntegration'
-import tableColsMixin from '../../mixins/tableCols'
-import timeZoneMixin from '../../mixins/timeZone'
-import TableHeaderCell from '@/components/TableHeaderCell'
-import { setTableFilters } from '@/utils/table'
-import { mapGetters } from 'vuex'
-import { throttledExportToExcel } from '@/utils/table'
-export default {
-  name: 'NewContainerView',
-  directives: {
-    dragHeight: {
-      inserted (el, binding, vnode) {
-        const that = vnode.context
-        let mousedownY
-        let dragY
-        let dragHeight
-        const offsetTop = el.offsetParent.offsetTop
-        function mousemoveHandler (e) {
-          e.stopPropagation()
-          e.preventDefault()
-          dragY = dragHeight + mousedownY - e.screenY
-          dragY = dragY < 0 ? 0 : dragY > offsetTop ? offsetTop : dragY
-          that.dragY = dragY
-        }
-        function mouseupHandler (e) {
-          e.stopPropagation()
-          e.preventDefault()
-          that.dragHeight = that.dragY
-          that.dragY = 0
-          that.dragActive = false
-          document.removeEventListener('mousemove', mousemoveHandler)
-          document.removeEventListener('mouseup', mouseupHandler)
-        }
-        el.addEventListener('mousedown', e => {
-          that.dragActive = true
-          mousedownY = e.screenY
-          dragHeight = that.dragHeight
-          that.dragY = dragHeight
-          document.addEventListener('mousemove', mousemoveHandler)
-          document.addEventListener('mouseup', mouseupHandler)
-        })
-      }
-    }
-  },
-  components: {
-    TimeZoneSelector,
-    TableHeaderCell
-  },
-  mixins: [tableColsMixin, timeZoneMixin],
-  data () {
-    return {
-      fullscreenLoading: false,
-      airlineList: [],
-      selectedAirline: '',
-      queryData: {},
-      flightInfo: {},
-      keyWords: '',
-      containerTableColumn: [
-        { label: '容器编号', prop: 'containerNumber', width: 100 },
-        { label: '类型', prop: 'style' },
-        { label: '行李数', prop: 'numberOfBags' },
-        { label: '舱位', prop: 'containerSpace' }
-      ],
-      // transferInTableColumn: [
-      //   { label: '航班号', prop: 'preFlightNO' },
-      //   { label: '日期', prop: 'preFlightDate' },
-      //   { label: '时间', prop: 'flightTime' },
-      //   { label: '始发站', prop: 'planDepartureApt' },
-      //   { label: '航班状态', prop: 'flightStatus' },
-      //   { label: '中转数', prop: 'totalNumber' }
-      // ],
-      // transferOutTableColumn: [
-      //   { label: '航班号', prop: 'transferFlightNO' },
-      //   { label: '日期', prop: 'transferFlightDate' },
-      //   { label: '时间', prop: 'flightTime' },
-      //   { label: '始发站', prop: 'planDepartureApt' },
-      //   { label: '目的站', prop: 'planLandingApt' },
-      //   { label: '中转数', prop: 'transferNumber' }
-      // ],
-      tableCols: [
-        // { label: '序号', prop: 'index' },
-        {
-          label: '旅客姓名',
-          prop: 'PassengerNameUpcase',
-          width: 140,
-          fixed: 'left',
-          filterable: true,
-          sortable: true
-        },
-        {
-          label: '行李牌号',
-          prop: 'BagSN',
-          width: 120,
-          fixed: 'left',
-          filterable: true,
-          sortable: true
-        },
-        {
-          label: '特殊行李类型',
-          prop: 'SpecialType',
-          width: 120,
-          filterable: true,
-          sortable: true
-        },
-        { label: '装载序号', prop: 'LoadSN' },
-        { label: '值机', prop: 'checkInTime', width: 140 },
-        { label: '状态', prop: 'latestStatus', filterable: true, sortable: true },
-        { label: '安检', prop: 'securityTime', width: 140 },
-        { label: '分拣', prop: 'sortTime', width: 140 },
-        { label: '装车', prop: 'loadTime', width: 140 },
-        { label: '装机', prop: 'inflTime', width: 140 },
-        { label: '中转进航班', prop: 'inFlightNO', filterable: true, sortable: true, width: 105 },
-        { label: '中转出航班', prop: 'transferFlightNO', filterable: true, sortable: true, width: 105 },
-      ],
-      containerTableData: [], // 容器统计
-      transferInBaggageTableData: [], // 中转进
-      transferOutBaggageTableData: [], // 中转出
-      flightBaggageTableData: [], // 行李列表
-      flightBaggageTableFilters: {},
-      filterValues: {},
-      tableDataSortRules: {},
-      warningContainers: [],
-      dragHeight: 0,
-      dragY: 0,
-      dragActive: false,
-      containerID: null
-    }
-  },
-  computed: {
-    ...mapGetters(['clickedCells']),
-    dealedTableData () {
-      const filtered = this.flightBaggageTableData.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])
-    },
-    draggableStyle () {
-      return {
-        height: `calc(100vh - 80px - 64px - 16px - 344px + ${this.dragHeight}px)`
-      }
-    },
-    dragLineStyle () {
-      return {
-        transform: `translateY(${this.dragHeight - this.dragY}px)`
-      }
-    }
-  },
-  watch: {
-    $route: {
-      handler ({ path, query }) {
-        if (path.includes('newContainerView')) {
-          const { flightNO, flightDate, containerID } = query
-          this.containerID = containerID
-          if (flightNO && flightDate) {
-            const { flightNO: oldFlightNO, flightDate: oldFlightDate } = this.queryData
-            if (flightNO !== oldFlightNO || flightDate !== oldFlightDate) {
-              this.queryData = { flightNO, flightDate }
-              this.queryAirline([flightNO, flightDate])
-            }
-          }
-        }
-      },
-      deep: true,
-      immediate: true
-    },
-    fullscreenLoading (val) {
-      if (val) {
-        this.loading = this.$loading({
-          lock: true,
-          text: '加载中',
-          spinner: 'el-icon-loading',
-          background: 'rgba(0, 0, 0, 0.7)'
-        })
-      } else {
-        this.loading?.close()
-      }
-    },
-    selectedAirline (val) {
-      const { flightNO, flightDate } = this.queryData
-      const [departureAirport, landingAirport] = val.split('-')
-      this.queryAll([flightNO, flightDate, departureAirport, landingAirport])
-    }
-  },
-  created () {
-    Object.values(this.tableCols).forEach(({ prop, filterable, sortable }) => {
-      if (filterable) {
-        this.$set(this.flightBaggageTableFilters, prop, [])
-        this.$set(this.filterValues, prop, [])
-      }
-      if (sortable) {
-        this.$set(this.tableDataSortRules, prop, '')
-      }
-    })
-  },
-  activated () {
-    this.$nextTick(() => {
-      this.$refs['containerTable']?.doLayout()
-      // this.$refs['transferInBaggageTable']?.doLayout()
-      // this.$refs['transferOutBaggageTable']?.doLayout()
-      this.$refs['flightBaggageTable']?.doLayout()
-    })
-  },
-  updated () {
-    this.$nextTick(() => {
-      this.$refs['containerTable']?.doLayout()
-      // this.$refs['transferInBaggageTable']?.doLayout()
-      // this.$refs['transferOutBaggageTable']?.doLayout()
-      this.$refs['flightBaggageTable']?.doLayout()
-    })
-  },
-  deactivated () {
-    this.loading?.close()
-  },
-  beforeDestroy () {
-    this.loading?.close()
-  },
-  methods: {
-    rowClass ({ row, rowIndex }) {
-      const classes = []
-      if (this.warningContainers.includes(row['containerNumber']) || row['latestStatus'] === '待翻减') {
-        classes.push('row-warning')
-      }
-      if (row['Status'] === 'DEL') {
-        classes.push('bgl-deleted')
-      }
-      return classes.join(' ')
-    },
-    // 给表头单元格加上 ascending 或 descending 使用 element 自带的排序箭头变色
-    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 (
-        ['checkInTime', 'DealInfo', 'sortLocationMark', 'loadLocationMark', 'inflLocationMark'].includes(
-          column.property
-        )
-      ) {
-        classes.push('pre-line')
-      }
-      if (
-        [
-          'preFlightNO',
-          'totalNumber',
-          'inFlightNO',
-          'transferFlightNO',
-          'transferNumber',
-          'PassengerNameUpcase',
-          'BagSN',
-          'U_Device_ID'
-        ].includes(column.property) &&
-        row[column.property] &&
-        row[column.property] !== 'FBULK'
-      ) {
-        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')
-        }
-      }
-      return classes.join(' ')
-    },
-    cellClickHandler (row, column, cell, event) {
-      if (
-        [
-          'preFlightNO',
-          'totalNumber',
-          'transferFlightNO',
-          'transferNumber',
-          'PassengerNameUpcase',
-          'BagSN',
-          'U_Device_ID'
-        ].includes(column.property) &&
-        row[column.property] &&
-        row[column.property] !== 'FBULK'
-      ) {
-        this.$store.dispatch('keepAlive/addClickedCell', {
-          row,
-          columnProp: column.property,
-          pageName: this.$route.name
-        })
-        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 'inFlightNO':
-            this.$router.push({
-              path: '/advance/flightView',
-              query: {
-                flightNO: row.inFlightNO,
-                flightDate: row.inFlightDate
-              }
-            })
-            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
-          case 'U_Device_ID':
-            this.$router.push('/departure/newContainerView')
-            // this.$router.push({
-            //   path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/containerView`,
-            //   query: {
-            //     containerID: row.U_Device_ID
-            //   }
-            // })
-            break
-          default:
-            break
-        }
-      }
-    },
-    toContainer () {
-      this.$router.push({
-        path: `/${this.$route.path.split('/').slice(1, -1).join('/')}/containerView`,
-        query: {
-          containerID: this.containerID
-        }
-      })
-    },
-    // 合计行
-    summaryMethod ({ columns, data }) {
-      const sums = []
-      if (columns.length > 0) {
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '合计'
-          } else if (
-            // 需要计算的列
-            ['numberOfBags', 'totalNumber', 'transferNumber'].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
-    },
-    // 统计行数
-    summaryRow (num) {
-      return function () {
-        return ['合计', `共${num}件`]
-      }
-    },
-    containerClick (row) {
-      if (row.containerNumber === 'FBULK') {
-        this.$router.push({
-          path: '/advance',
-          query: {
-            flightNO: this.queryData.flightNO,
-            startDate: this.queryData.flightDate,
-            endDate: this.queryData.flightDate,
-            loadType: 1
-          }
-        })
-      } else {
-        this.$router.push({
-          path: '/advance',
-          query: {
-            flightNO: this.queryData.flightNO,
-            startDate: this.queryData.flightDate,
-            endDate: this.queryData.flightDate,
-            U_Device_ID: row.containerNumber
-          }
-        })
-      }
-    },
-    exportHandler (refName, tableName) {
-      const table = this.$refs[refName].$el.cloneNode(true)
-      const fileName = `${tableName}-${this.queryData.flightNO}-${this.queryData.flightDate}.xlsx`
-      throttledExportToExcel(table, tableName, fileName)
-    },
-    queryflightInfo (dataContent) {
-      return myQuery(DATACONTENT_ID.flightInfo, ...dataContent)
-    },
-    queryContainer (dataContent) {
-      return myQuery(DATACONTENT_ID.flightContainer, ...dataContent)
-    },
-    queryBaggageByFlightNO (dataContent) {
-      return myQuery(DATACONTENT_ID.flightBaggage, ...dataContent)
-    },
-    async queryAirline (dataContent) {
-      try {
-        const listValues = await myQuery(DATACONTENT_ID.flightAirline, ...dataContent)
-        this.airlineList = listValues.map(({ departureAirport, landingAirport, departureBuild, landingBuild }) => ({
-          label: `${departureAirport}${departureBuild ? `(${departureBuild})` : ''}-${landingAirport}${landingBuild ? `(${landingBuild})` : ''}`,
-          value: `${departureAirport}-${landingAirport}`
-        }))
-        if (this.airlineList.length) {
-          this.selectedAirline = this.airlineList[0].value
-        }
-      } catch (error) {
-        this.$message.error('失败')
-      }
-    },
-    async queryAll (dataContent) {
-      this.fullscreenLoading = true
-      this.flightInfo = {}
-      try {
-        const [flightInfo, containerTableDataData, flightBaggageTableData] = await Promise.all([
-          this.queryflightInfo(dataContent),
-          this.queryContainer(dataContent),
-          this.queryBaggageByFlightNO(dataContent)
-        ])
-        if (flightInfo.length) {
-          this.flightInfo = flightInfo[0]
-        } else {
-          this.$message.info('未查询到航班基础数据')
-        }
-        this.containerTableData = containerTableDataData
-        // this.transferOutBaggageTableData = transferOutBaggageTableData.map(item => {
-        //   item['flightTime'] = item['flightDate'] ? item['flightDate'].split('T')[1] : ''
-        //   return item
-        // })
-        // this.transferInBaggageTableData = transferInBaggageTableData.map(item => {
-        //   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['transitFlag'] = item['preFlightNO'] || item['inFlightNO'] ? '是' : '否'
-          return item
-        })
-        setTableFilters(this.flightBaggageTableData, this.flightBaggageTableFilters)
-      } catch (error) {
-        this.$message.error('失败')
-      }
-      this.fullscreenLoading = false
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.new-container-view {
-  width: 100%;
-  height: calc(100vh - 81px);
-  overflow: hidden;
-  background: #dfe3ea;
-  padding: 0px 8px 16px 8px;
-  .list {
-    .title {
-      padding: 16px 0;
-    }
-    .part1 {
-      width: 100%;
-      background: #041741;
-      padding: 16px 30px;
-      color: #fff;
-    }
-    .part2 {
-      background-color: #fff;
-      ::v-deep .el-table {
-        .cell-click {
-          cursor: pointer;
-          color: #2d7cff;
-          &.cell-clicked {
-            color: purple;
-          }
-        }
-        .el-table__body-wrapper,
-        .el-table__fixed-body-wrapper {
-          tr.bgl-deleted {
-            background: #d2d6df;
-            td {
-              background: #d2d6df;
-              font-style: italic;
-            }
-          }
-          .row-warning .el-table__cell {
-            background: red;
-          }
-        }
-      }
-    }
-  }
-}
-</style>
-

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

@@ -0,0 +1,14 @@
+<template>
+  <ContainerHistory />
+</template>
+
+<script>
+import ContainerHistory from '../containerHistory'
+
+export default {
+  name: 'TransferArrivalContainerHistory',
+  components: {
+    ContainerHistory
+  }
+}
+</script>

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

@@ -0,0 +1,14 @@
+<template>
+  <ContainerHistory />
+</template>
+
+<script>
+import ContainerHistory from '../containerHistory'
+
+export default {
+  name: 'TransferDepartureContainerHistory',
+  components: {
+    ContainerHistory
+  }
+}
+</script>

src/views/statisticsCharts/views/nodeStatisticsCharts.vue

@@ -712,7 +712,7 @@ export default {
     background-color: #fff;
     position: relative;
     .node-tooltip {
-      width: 100px;
+      // width: 100px;
       position: absolute;
       bottom: 48px;
       left: 64px;