航班行李列表导出

package.json

@@ -21,6 +21,7 @@
     "echarts": "^5.2.0",
     "el-table-infinite-scroll": "^1.0.11",
     "element-ui": "^2.15.6",
+    "file-saver": "^2.0.5",
     "js-cookie": "2.2.0",
     "lodash": "^4.17.21",
     "normalize.css": "7.0.0",
@@ -33,6 +34,7 @@
     "vue-router": "3.0.6",
     "vue2-org-tree": "^1.3.5",
     "vuex": "3.1.0",
+    "xlsx": "^0.18.5",
     "xss": "^1.0.13"
   },
   "devDependencies": {

src/components/TableHeaderCell/index.vue

@@ -10,6 +10,7 @@
   <div class="table-header-cell">
     <template v-if="filterable">
       <el-popover
+        class="table-header-cell-popover"
         placement="bottom"
         trigger="click"
         @show="expand = true"

src/layout/components/AppMain.vue

@@ -10,7 +10,7 @@
   <section class="app-main">
     <div class="app-main-content">
       <transition name="fade-transform" mode="out-in">
-        <keep-alive v-if="$route.meta && $route.meta.keepAlive" :max="10">
+        <keep-alive v-if="$route.meta && $route.meta.keepAlive" :max="6">
           <router-view  :key="key"  class="router-view">
           </router-view>
         </keep-alive>

src/main.js

@@ -5,6 +5,14 @@ import 'normalize.css/normalize.css' // A modern alternative to CSS resets
 import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
 import '@/styles/index.scss' // global css
+import _ from 'lodash'
+import * as echarts from 'echarts'
+import Vue2OrgTree from 'vue2-org-tree'
+import 'vue2-org-tree/dist/style.css'
+import elTableInfiniteScroll from 'el-table-infinite-scroll'
+import xss from 'xss'
+import FileSaver from 'file-saver'
+import * as XLSX from 'xlsx'
 
 import App from './App'
 import store from './store'
@@ -13,25 +21,18 @@ import router from './router'
 import '@/icons' // icon
 import '@/permission' // permission control
 import '@/config/checkPermission' //按钮权限 全局自定义指令v-is
-// import lodash
-import _ from 'lodash'
-Vue.prototype._ = _
 
-// import echarts
-import * as echarts from 'echarts'
-import Vue2OrgTree from 'vue2-org-tree'
-import 'vue2-org-tree/dist/style.css'
-Vue.use(Vue2OrgTree)
 Vue.use(ElementUI)
-import elTableInfiniteScroll from 'el-table-infinite-scroll';
-
+Vue.prototype._ = _
+Vue.prototype.$echarts = echarts
+Vue.use(Vue2OrgTree)
 Vue.use(elTableInfiniteScroll)
-
-import xss from 'xss'
 Vue.use(xss)
+Vue.prototype.$FileSaver = FileSaver
+Vue.prototype.$XLSX = XLSX
 
-Vue.prototype.$echarts = echarts
 Vue.config.productionTip = false
+
 new Vue({
   router,
   store,

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

@@ -122,7 +122,7 @@ const arrivalRoutes = {
 const transferRoutes = {
   path: '/transfer',
   component: Layout,
-  meta: { roles: ['ti_showTransit'], keepAlive: true },
+  meta: { roles: ['ti_showTransit'] },
   children: [
     {
       path: '/transfer',

src/utils/request.js

@@ -1,7 +1,7 @@
 import axios from 'axios'
 import { MessageBox, Message } from 'element-ui'
 import store from '@/store'
-import { getToken } from '@/utils/auth'
+import { getToken, getUserId } from '@/utils/auth'
 // create an axios instance
 // let baseURL
 // if (process.env.NODE_ENV === "development") {
@@ -29,6 +29,9 @@ service.interceptors.request.use(
       // config.headers['X-Token'] = getToken()
       config.headers['token'] = getToken()
     }
+    if (config.data) {
+      config.data['OperatorId'] = getUserId()
+    }
     return config
   },
   error => {

src/views/advancedQuery/views/advancedHome.vue

@@ -807,10 +807,8 @@ export default {
     this.dom.addEventListener('scroll', () => {
       that.scrollTop = this.dom.scrollTop
     })
-    console.log(1)
   },
   activated() {
-    console.log(2)
     this.dom.scrollTop = this.scrollTop
     // else if (this.queryForm) {
     //   Object.keys(this.form).forEach(key => {

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

@@ -392,6 +392,7 @@
           <img
             class="btn-square btn-shadow"
             src="../../../../assets/baggage/ic_export.png"
+            @click="exportToExcel('航班行李列表', 'flightBaggageTable')"
           >
           <img
             class="btn-square btn-shadow"
@@ -928,6 +929,56 @@ export default {
         }
       })
     },
+    exportToExcel(tableName, refName) {
+      const table = this.$refs[refName].$el.cloneNode(true)
+      table.removeChild(table.querySelector('.el-table__fixed'))
+      const tableHeaderCellPopovers = table.querySelectorAll('.table-header-cell-popover')
+      tableHeaderCellPopovers.forEach(node => {
+        node.removeChild(node.querySelector('.el-popover'))
+      })
+      const tableBook = this.$XLSX.utils.table_to_book(table, { raw: true, sheet: tableName })
+      const columnWidths = []
+      function devideGroup(cellName) {
+        const stringArray = cellName.split('')
+        const length = stringArray.length
+        let index = 0
+        for (let i = 0; i < length; i++) {
+          if (isNaN(parseInt(stringArray[i]))) {
+            index += stringArray[i].charCodeAt(0) - 'A'.charCodeAt(0) + i * 26
+          } else {
+            return index
+          }
+        }
+      }
+      Object.entries(tableBook.Sheets[tableName]).forEach(cell => {
+        if (!['!rows', '!cols', '!fullref', '!ref'].includes(cell[0])) {
+          const columnIndex = devideGroup(cell[0])
+          const cellTextLength = cell[1].v.split('').reduce((pre, curr) => {
+            const currentSize = curr.charCodeAt(0) > 255 ? 2 : 1
+            return pre + currentSize
+          }, 0)
+          if ((!columnWidths[columnIndex] && cellTextLength > 0) || cellTextLength > columnWidths[columnIndex]) {
+            columnWidths[columnIndex] = cellTextLength
+          }
+        }
+      })
+      tableBook.Sheets[tableName]['!cols'] = columnWidths.map(width => ({
+        wch: width
+      }))
+      const tableWrite = this.$XLSX.write(tableBook, {
+        bookType: 'xlsx',
+        bookSST: true,
+        type: 'array'
+      })
+      try {
+        this.$FileSaver.saveAs(
+          new Blob([tableWrite], { type: 'application/octet-stream' }),
+          `${tableName}-${this.queryData.flightNO}-${this.queryData.flightDate}.xlsx`
+        )
+      } catch (error) {
+        console.log(error.message || error)
+      }
+    },
     queryflightInfo(dataContent) {
       return myQuery(queryMap.flightInfo, ...dataContent)
     },