修改

src/views/newBagDetails/components/baggageList.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="baggageList">
+  <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="baggageList">
     <el-table ref="table" :data="baggageTableData" height="100%" size="mini" border fit :header-cell-class-name="headerCellClass" :header-cell-style="{ color: '#101116' }" :cell-class-name="cellClass" :span-method="tableSpanMethod" @cell-click="cellClickHandler">
       <el-table-column v-for="item in tableColsCopy" :key="item.index" :prop="item.prop" :label="item.name" :align="item.align || 'center'" :width="item.width" show-overflow-tooltip :fixed="item.fixed">
         <template slot="header">
@@ -10,15 +10,38 @@
         </template>
       </el-table-column>
     </el-table>
+    <div class="btns">
+      <img class="btn-square btn-shadow r16" 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>
+    <!--列设置-->
+    <Dialog :flag="dialogFlag" class="dialog-check-group">
+      <div class="dialog-wrapper">
+        <div class="title">列设置</div>
+        <div class="content">
+          <el-tree ref="columnSetTree" :data="tableCols" :class="colsCheckClass" show-checkbox node-key="index" :default-expand-all="true" :props="{
+              label: 'name',
+              children: 'children',
+            }" :default-checked-keys="checkedKeysTemp" @check="handleCheck" />
+        </div>
+        <div class="foot right t30">
+          <el-button size="medium" class="r24" type="primary" @click="onCheck('baggageTableData')">确定</el-button>
+          <el-button size="medium" @click="hide">取消</el-button>
+        </div>
+      </div>
+    </Dialog>
   </div>
 </template>
 
 <script>
+import Dialog from '@/layout/components/Dialog/index.vue'
 import pf from '@/layout/mixin/publicFunc'
 import tableColsMixin from '@/views/flightViewManagement/mixins/tableCols'
+import { throttledExportToExcel } from '@/utils/table'
 export default {
   name: 'BaggageList',
   mixins: [pf, tableColsMixin],
+  components: { Dialog },
   props: {
     query: {
       type: Object,
@@ -41,27 +64,23 @@ export default {
         { name: '值机序号', prop: 'checkin_number', width: 70 },
         { name: '节点标识', prop: 'nodeCode', width: 100 },
         { name: '节点名称', prop: 'nodeName', width: 70 },
-        { name: '位置标识', prop: 'J8' },
-        { name: '位置描述', prop: 'J6' },
-        { name: '读取时间', prop: 'J5', width: 158 },
-        { name: '结果', prop: 'status', width: 60 },
-        { name: '次级代码', prop: 'J1', width: 70 },
-        { name: '操作人', prop: 'J2', width: 90 },
-        { name: '设备ID', prop: 'J3' },
-        { name: '发往位置', prop: 'J9', width: 70 },
-        { name: '发往位置描述', prop: 'J7', width: 100 },
-        { name: '装载序号', prop: 'Q1', width: 70 },
-        { name: '容器编号', prop: 'U1', width: 110 },
-        { name: '数据来源', prop: 'dataSource' }
+        { name: '位置标识', prop: 'location_code' },
+        { name: '位置描述', prop: 'location_describe' },
+        { name: '读取时间', prop: 'readTime', width: 158 },
+        { name: '结果', prop: 'currentResult', width: 60 },
+        { name: '次级代码', prop: 'secondary_code', width: 70 },
+        { name: '操作人', prop: 'agentNumber', width: 90 },
+        { name: '设备ID', prop: 'device_ID' },
+        { name: '发往位置', prop: 'to_location_code', width: 70 },
+        { name: '发往位置描述', prop: 'to_location_describe', width: 100 },
+        { name: '装载序号', prop: 'loadNumber', width: 70 },
+        { name: '容器编号', prop: 'container_ID', width: 110 },
+        { name: '数据来源', prop: 'dataObjectId', width: 200 }
       ],
       baggageTableData: [],
       spanArr: [],
       pos: 0,
-      queryData: {
-        "B2": "3479519535",
-        "F1": "ZH9863",
-        "F2": "2023-02-02"
-      }
+      loading: false
     }
   },
   mounted () {
@@ -70,6 +89,7 @@ export default {
   methods: {
     async queryDetails () {
       try {
+        this.loading = true
         const { code, returnData } = await this.getQueryList(SERVICE_ID.bagDetailId, this.query)
         if (code == 0 && returnData && returnData.length) {
           this.baggageTableData = returnData.map((item, index) => {
@@ -83,8 +103,12 @@ export default {
             return item
           })
           this.initTableData(this.baggageTableData)
+          this.loading = false
+        } else {
+          this.loading = false
         }
       } catch (error) {
+        this.loading = false
         console.log(error)
         this.$message.error('失败')
       }
@@ -171,6 +195,12 @@ export default {
         }
       }
     },
+    exportHandler (refName, tableName) {
+      const table = this.$refs[refName].$el.cloneNode(true)
+      const { luggageNum, flightNo, flightDate } = this.query
+      const fileName = `${tableName}-${luggageNum}-${flightNo}-${flightDate}.xlsx`
+      throttledExportToExcel(table, tableName, fileName)
+    },
   }
 }
 </script>
@@ -178,5 +208,15 @@ export default {
 <style lang="scss" scoped>
 .baggageList {
   height: 100%;
+  position: relative;
+  .btns {
+    position: absolute;
+    top: -50px;
+    right: 24px;
+    z-index: 10;
+    .r16 {
+      margin-right: 16px;
+    }
+  }
 }
 </style>

src/views/newBagDetails/components/baggageMessage.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="baggageMessage">
+  <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="baggageMessage">
     <template v-if="messageList.length">
       <el-row :gutter="24" type="flex">
         <el-col v-for="(message, index) in messageList" :key="index" :span="6">
@@ -15,11 +15,17 @@
     <template v-else>
       <el-empty :image-size="1" description="暂无数据" />
     </template>
+    <div class="btns">
+      <img class="btn-square btn-shadow" src="@/assets/baggage/ic_export.png" title="导出" @click="exportMessageToExcel">
+    </div>
   </div>
 </template>
 
 <script>
 import pf from '@/layout/mixin/publicFunc'
+import * as XLSX from 'xlsx'
+import XLSX_STYLE from 'xlsx-style'
+import FileSaver from 'file-saver'
 export default {
   name: 'BaggageMessage',
   mixins: [pf],
@@ -36,6 +42,7 @@ export default {
   data () {
     return {
       messageList: [],
+      loading: false
     }
   },
   mounted () {
@@ -44,22 +51,122 @@ export default {
   methods: {
     async queryDetails () {
       try {
+        this.loading = true
         const { code, returnData } = await this.getQueryList(SERVICE_ID.bagDetailId, this.query)
         if (code == 0 && returnData && returnData.length) {
           this.messageList = [...returnData]
+          this.loading = false
+        } else {
+          this.loading = false
         }
       } catch (error) {
+        this.loading = false
         console.log(error)
         this.$message.error('失败')
       }
     },
+    exportMessageToExcel () {
+      const xlsxDatas = [['Date & Time', 'Message']]
+      xlsxDatas.push(
+        ...this.messageList.map(message => [
+          message.flightDate,
+          message.sourceData.replaceAll(/[\r\n]{2,}/g, '\n').replaceAll('\\', '')
+        ])
+      )
+      const columnWidths = []
+      xlsxDatas.forEach(row => {
+        // 计算每一列宽度，考虑换行
+        row.forEach((cell, columnIndex) => {
+          const cellWidth = Math.max(
+            ...cell
+              .toString()
+              .split('\n')
+              .map(cellRow =>
+                cellRow.split('').reduce((pre, curr) => {
+                  const letterSize = curr.charCodeAt(0) > 255 ? 2 : 1
+                  return pre + letterSize
+                }, 0)
+              )
+          )
+          if ((!columnWidths[columnIndex] && cellWidth > 0) || cellWidth > columnWidths[columnIndex]) {
+            columnWidths[columnIndex] = cellWidth
+          }
+        })
+      })
+      // 生成表格数据
+      const sheet = XLSX.utils.aoa_to_sheet(xlsxDatas)
+      // 添加列宽度
+      sheet['!cols'] = columnWidths.map(width => ({
+        wch: width + 2
+      }))
+      // 表格对齐、添加边框
+      const borderStyle = {
+        style: 'medium',
+        color: {
+          rgb: 'FFFFFF'
+        }
+      }
+      const reg = /^[A-Z]+([\d]+$)/
+      for (const key in sheet) {
+        const match = reg.test(key)
+        if (match) {
+          const rowIndex = reg.exec(key)[1]
+          let cellStyle = {
+            alignment: {
+              horizontal: 'center',
+              vertical: 'center',
+              wrapText: true
+            }
+          }
+          if (Number(rowIndex) === 1) {
+            cellStyle = {
+              ...cellStyle,
+              border: {
+                top: borderStyle,
+                right: borderStyle,
+                bottom: borderStyle,
+                left: borderStyle
+              },
+              font: {
+                color: {
+                  rgb: 'FFFFFF'
+                }
+              },
+              fill: {
+                fgColor: {
+                  rgb: '3366FF'
+                }
+              }
+            }
+          } else {
+            cellStyle.alignment.horizontal = 'left'
+          }
+          sheet[key].s = cellStyle
+        }
+      }
+      // 表格数据转换
+      const workBook = XLSX.utils.book_new()
+      XLSX.utils.book_append_sheet(workBook, sheet, '行李原始报文')
+      const tableWrite = XLSX_STYLE.write(workBook, {
+        bookType: 'xlsx',
+        bookSST: true,
+        type: 'buffer',
+        cellStyles: true
+      })
+      // 下载表格
+      const { luggageNum, flightNo, flightDate } = this.query
+      const fileName = `行李原始报文-${luggageNum}-${flightNo}-${flightDate}.xlsx`
+      FileSaver.saveAs(new Blob([tableWrite], { type: 'application/octet-stream' }), fileName)
+    },
   }
 }
 </script>
 
 <style lang="scss" scoped>
 .baggageMessage {
+  padding: 24px;
   height: 100%;
+  position: relative;
   .card {
     width: 100%;
     min-height: 440px;
@@ -85,5 +192,14 @@ export default {
       word-break: break-all;
     }
   }
+  .btns {
+    position: absolute;
+    top: -50px;
+    right: 24px;
+    z-index: 10;
+    .r16 {
+      margin-right: 16px;
+    }
+  }
 }
 </style>

src/views/newBagDetails/components/baggageView.vue

@@ -2,7 +2,7 @@
   <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="baggageView">
     <el-scrollbar style="height: 100%">
       <div v-infinite-scroll="load" class="baggageView-content">
-        <div v-for="item in tableData" :key="item.ID" class="baggageView-list">
+        <div v-for="(item,index) in tableData" :key="index" class="baggageView-list">
           <div class="part2">
             <div class="part2_info">
               <div class="title">
@@ -15,12 +15,12 @@
                 <div class="step-line">
                   <div v-for="(line, index) in 6" :key="index" :class="['step-line-segment', { 'step-line-active': activeStepLine(index) }]" />
                 </div>
-                <div v-for="(item, index) in stepNodes" :key="index" :class="{ 'step-item': true, 'active-item': item.status }">
+                <div v-for="(item, index) in stepNodes" :key="index" :class="{ 'step-item': true, 'active-item': item.currentResult }">
                   <div class="step-circle">
                     <span class="step-name">{{ item.nodeName }}</span>
                   </div>
-                  <div v-if="item.status" class="step-info">
-                    <div :class="statusClasses(item.status)">{{ item.status }}</div>
+                  <div v-if="item.currentResult" class="step-info">
+                    <div :class="statusClasses(item.currentResult)">{{ item.currentResult }}</div>
                     <span class="step-time">{{ item.processingTime }}</span>
                     <div class="step-location">{{ item.locationId }}</div>
                   </div>
@@ -64,8 +64,7 @@ export default {
   computed: {
     activeStepLine () {
       return function (index) {
-        // return this.stepNodes[index].status && this.stepNodes[index + 1].status
-        return true
+        return this.stepNodes[index].currentResult && this.stepNodes[index + 1].currentResult
       }
     },
     statusClasses () {
@@ -92,28 +91,43 @@ export default {
       deep: true
     }
   },
+  created () {
+    this.dataContent = this.query
+  },
   mounted () {
     this.resetStepNodes()
   },
   methods: {
     //获取行李信息
-    async getLuggageList () {
+    async getLuggageList (id, dataContent = this.dataContent, page, pageSize) {
+      function isSameStep (code1, code2) {
+        const sameStepCodes = ['ARRIVED', 'TRANSFER']
+        return sameStepCodes.includes(code1) && sameStepCodes.includes(code2)
+      }
       try {
         this.loading = true
-        const { luggageNum, flightNo, flightDate } = this.query
-        const dataContent = {
-          flightNo,
-          luggageNum,
-          flightDate
-        }
-        this.dataContent = dataContent
-        const { code, returnData } = await this.getQueryList(SERVICE_ID.bagDetailId, dataContent, this.page, this.pageSize)
+        this.resetStepNodes()
+        const { code, returnData } = await this.getQueryList(id, dataContent, page, pageSize)
         if (code == 0) {
           if (returnData.length === 0) {
             this.page--;
             this.noMore = true;
             this.loading = false;
           }
+          returnData.forEach(({ nodeCode, nodeName, processingTime, locationId, currentResult }) => {
+            const replaceIndex = this.stepNodes.findIndex(
+              stepNode => stepNode.nodeCode === nodeCode || isSameStep(stepNode.nodeCode, nodeCode)
+            )
+            if (replaceIndex > -1) {
+              this.stepNodes.splice(replaceIndex, 1, {
+                nodeCode,
+                nodeName,
+                processingTime: processingTime?.replace('T', '\n'),
+                locationId,
+                currentResult
+              })
+            }
+          })
           this.tableData.push(...returnData);
           this.loading = false;
         } else {
@@ -136,6 +150,7 @@ export default {
         return;
       }
       this.getLuggageList(SERVICE_ID.bagDetailId, this.dataContent, ++this.page, this.pageSize);
+      console.log(this.stepNodes)
     },
     resetStepNodes () {
       this.stepNodes = [

src/views/newBagDetails/index.vue

@@ -4,8 +4,10 @@
       <div class="newBagDetails-info-look">
         <el-row :gutter="20">
           <el-col :span="4">
-            <span class="newBagDetails-info-look-name">{{ passengerName }}</span>
-            <el-button type="text">查看</el-button>
+            <div class="flex-wrap">
+              <span class="newBagDetails-info-look-name">{{ passengerName }}</span>
+              <el-button type="text">查看</el-button>
+            </div>
           </el-col>
           <el-col :span="item.rows" v-for="(item,index) in infoArrs" :key="index">{{ item.label }}：{{ item.value }}</el-col>
         </el-row>
@@ -105,14 +107,14 @@ export default {
       activeIndex: null,
       msgs1: [
         {
-          prop: 'latest_node',
+          prop: 'nodeCode',
           label: '最新节点',
           rows: 4,
           value: ''
         },
         {
-          prop: 'latest_status',
-          label: '最新状态',
+          prop: 'currentResult',
+          label: '最新结果',
           rows: 3,
           value: ''
         },
@@ -297,6 +299,11 @@ export default {
         font-weight: bold;
         color: #ffffff;
         margin-right: 7px;
+        max-width: 101px;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        display: inline-block;
       }
     }
     &-details {

src/views/newQuery/components/table.vue

@@ -100,7 +100,9 @@ export default {
   watch: {
     tableTag: {
       handler (val) {
-        this.getQuery(this.AqueryId, val)
+        this.dataContent = val
+        this.restTable()
+        this.load()
       },
       deep: true
     }
@@ -131,12 +133,10 @@ export default {
       }
     },
     //获取表格数据
-    async getQuery (id, dataContent) {
+    async getQuery (id, dataContent = this.dataContent, page, pageSize) {
       try {
         this.loading = true;
-        this.queryId = id;
-        this.dataContent = dataContent;
-        const { code, returnData } = await this.getQueryList(id, dataContent, ++this.page, this.pageSize);
+        const { code, returnData } = await this.getQueryList(id, dataContent, page, pageSize);
         if (code == 0) {
           if (returnData.length === 0) {
             this.page--;
@@ -158,12 +158,18 @@ export default {
         this.loading = false;
       }
     },
+    restTable () {
+      this.loading = false
+      this.noMore = false
+      this.page = 0
+      this.tableData = []
+    },
     load () {
-      if (this.isTable) {
+      if (Object.keys(this.tableTag).length) {
         if (this.noMore || this.loading) {
           return;
         }
-        this.getQuery(this.queryId, this.dataContent, ++this.page, this.pageSize);
+        this.getQuery(this.AqueryId, this.dataContent, ++this.page, this.pageSize);
       }
     },
     setCellClick () {

src/views/systemSettings/views/newAuth/components/button.vue

@@ -118,6 +118,7 @@ export default {
     },
     authObj: {
       handler (obj) {
+        console.log(obj)
         this.relationData = []
         this.passData = []
         if (!Array.isArray(obj.pass_parameters) && obj.pass_parameters) {

src/views/systemSettings/views/newAuth/index.vue

@@ -403,8 +403,9 @@ export default {
       this.$refs['form'].validate(async (valid) => {
         if (valid) {
           const child = this.$refs['dataChild'].form
+          console.log(child)
           const data = _.merge(child, this.form)
-          if (data.pass_parameters && data.pass_parameters.length) {
+          if (Array.isArray(data.pass_parameters)) {
             data.pass_parameters = data.pass_parameters.join(',')
           } else {
             data.pass_parameters = null
@@ -433,6 +434,8 @@ export default {
               this.$message.error('操作失败')
             }
           }
+          this.authObj = {}
+          this.clearForm()
         } else {
           return false
         }