add:行李详情列表和报文新增速运信息

src/views/newBagDetails/components/baggageList.vue

@@ -1,6 +1,6 @@
 <template>
   <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="baggageList">
-    <Table style="height:100%" tableName="行李跟踪信息表" :istableCol="true" :tableTag="tableTag" ref="table" />
+    <Table style="height:100%" tableName="行李跟踪信息表" :istableCol="true" :tableTag="tableTag" :pageSize="999" ref="table" />
     <div class="btns">
       <img class="btn-square btn-shadow r16" src="@/assets/baggage/ic_export.png" title="导出" @click="exportHandler('table', '行李节点列表')">
     </div>
@@ -45,14 +45,52 @@ export default {
     tagObj: {
       handler (obj) {
         this.tableTag = obj
+        this.getRushData()
       },
       deep: true,
     }
   },
   mounted () {
     this.tableTag = this.tagObj
+    this.getRushData()
   },
   methods: {
+    //获取行李信息
+    getRushData () {
+      const rushDataCatch = sessionStorage.getItem('rushDataCatch') || {}
+      if (rushDataCatch && rushDataCatch.length) {
+        const rushData = JSON.parse(rushDataCatch)
+        const { OriginalBagTag_TagSequence, OriginalBagTag_TagDate,OriginalBagTag_TagNumber } = rushData
+        const params = {
+          luggageNum: OriginalBagTag_TagSequence,
+          carrierFlights: OriginalBagTag_TagNumber,
+          carrierFlightsDate: OriginalBagTag_TagDate
+        }
+        this.getPnrData(params)
+      }
+    },
+    //获取速运pnr数据
+    async getPnrData (params) {
+      try {
+        const { code, returnData } = await this.getQueryList(21803455, params);
+        if (code == 0) {
+          if (returnData && returnData.length) {
+            const nparams = {
+              PNRNO: returnData[0].PNRNO || '',
+              luggageNum: returnData[0].luggageNum || ('3' + params.luggageNum),
+              carrierFlightsDate: params.carrierFlightsDate
+            }
+            this.$nextTick(() => {
+              this.tableTag = nparams
+            })
+          }
+        } else {
+          this.$message.error("获取表头数据失败");
+        }
+      } catch (error) {
+        console.log(error)
+      }
+    },
     async queryDetails (auth_id) {
       try {
         this.loading = true

src/views/newBagDetails/components/baggageMessage copy.vue

@@ -0,0 +1,367 @@
+<template>
+  <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="baggageMessage">
+    <div class="baggageMessage-content">
+      <template v-if="messageList.length">
+        <el-scrollbar style="height: 100%">
+          <el-row style="margin:0" :gutter="15">
+            <el-col v-for="(message, index) in messageList" :key="index" :span="6">
+              <div class="card">
+                <div class="message-date">{{ message.readTime }}</div>
+                <div class="message-content">
+                  <el-scrollbar style="height: 100%">
+                    <div>{{ message.sourceData.replaceAll('n', '\n').replaceAll('r', '').replaceAll('\\', '').replaceAll('"', '') }}</div>
+                  </el-scrollbar>
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+        </el-scrollbar>
+      </template>
+      <template v-else>
+        <el-empty :image-size="1" description="暂无数据" />
+      </template>
+    </div>
+    <div class="checkBtns">
+      <el-switch v-model="switchs" @change="switchsChange" active-color="#409EFF" :active-text="switchsTxt">
+      </el-switch>
+    </div>
+    <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],
+  props: {
+    query: {
+      type: Object,
+      default: () => { }
+    },
+    tagObj: {
+      type: Object,
+      default: () => { }
+    }
+  },
+  data () {
+    return {
+      messageList: [],
+      loading: false,
+      switchs: false,
+      switchsTxt: '未过滤',
+      dataContent: [],
+      messageListCopy: []
+    }
+  },
+  watch: {
+    tagObj: {
+      handler (obj) {
+        this.dataContent = obj
+        this.queryDetails()
+      },
+      deep: true
+    }
+  },
+  created () {
+    this.dataContent = this.tagObj
+  },
+  mounted () {
+    this.queryDetails()
+  },
+  methods: {
+    async queryDetails () {
+      try {
+        this.loading = true
+        const { code, returnData } = await this.getQueryList(SERVICE_ID.bagDetailId, this.dataContent)
+        if (code == 0 && returnData && returnData.length) {
+          // this.messageList = [...returnData]
+          const messageDatas = [...returnData]
+          messageDatas.map(item => {
+            const { dataObjectId, dataType } = item
+            if (dataObjectId && dataObjectId.length) {
+              const len = dataObjectId.length
+              let place = null
+              function popNums (num) {
+                return dataObjectId.substring(len - num, len)
+              }
+              // const popNums = [100, 101, 102].map(item => item.toString())
+              // const target = dataObjectId.substring(len - 3, len)
+              // const place = popNums.includes(target) ? '（国航）' : dataObjectId.substring(len - 5, len) == '10000' ? '（国航）' : dataObjectId.substring(len - 5, len) == '20021' ? other : other
+              const [target3, target5, target6] = [popNums(3), popNums(5), popNums(6)]
+              if (target3 == '100' || target5 == '10000') {
+                place = '（星盟）'
+              }
+              if (target3 == '101') {
+                place = '（航易行）'
+              }
+              if (target3 == '102') {
+                place = '（首都机场）'
+              }
+              if (target5 == '20021') {
+                place = dataType == ('BSM' || 'bsm') ? '（航信）' : '（BRS）'
+              }
+              if (target6 == '218602') {
+                place = '（山航）'
+              }
+              if (target6 == '218604') {
+                place = '（深航）'
+              }
+              item.readTime = item.readTime ? item.readTime.replace('T', ' ') + place : item.createAt.replace('T', ' ') + place
+            } else {
+              item.readTime = item.readTime.replace('T', ' ') || item.createAt.replace('T', ' ')
+            }
+          })
+          this.messageList = _.cloneDeep(messageDatas)
+          this.messageListCopy = _.cloneDeep(messageDatas)
+          // this.messageList = returnData.map(message => ({
+          //   ...message,
+          //   readTime: message.readTime ? `${message.readTime.replace('T', ' ')}（广州）` : '（北京）'
+          // }))
+          this.loading = false
+        } else {
+          this.loading = false
+        }
+      } catch (error) {
+        this.loading = false
+        console.log(error)
+        this.$message.error('失败')
+      }
+    },
+    //初始化数据地址
+    formatTableData (returnData) {
+      const messageDatas = [...returnData]
+      messageDatas.forEach(item => {
+        const { dataObjectId, dataType } = item
+        if (dataObjectId) {
+          const len = dataObjectId.length
+          const place = dataObjectId.substring(len - 5, len) == '20021'
+          if (place) {
+            const bsm = dataType ? `${dataType} `.toLocaleUpperCase() == 'BSM' : false
+            const bpm = dataType ? `${dataType} `.toLocaleUpperCase() == 'BPM' : false
+            if (place && bsm) {
+              item.readTime = item.readTime ? item.readTime.replace('T', ' ') + '航信' : item.readTime
+            }
+            if (place && bpm) {
+              item.readTime = item.readTime ? item.readTime.replace('T', ' ') + 'BRS' : item.readTime
+            }
+          } else {
+            item.readTime = item.readTime ? item.readTime.replace('T', ' ') : item.createAt.replace('T', ' ')
+          }
+        } else {
+          item.readTime = item.readTime ? item.readTime.replace('T', ' ') : item.createAt.replace('T', ' ')
+        }
+      })
+      return messageDatas
+    },
+    exportMessageToExcel () {
+      const xlsxDatas = [['Date & Time', 'Message']]
+      xlsxDatas.push(
+        ...this.messageList.map(message => [
+          message.readTime || message.createAt.replace('T', ' '),
+          message.sourceData.replaceAll('n', '\n').replaceAll('r', '').replaceAll('\\', '').replaceAll('"', '')
+          // 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, carrierFlights, carrierFlightsDate } = this.query
+      let fileName
+      if (flightNo || flightDate) {
+        fileName = `行李原始报文-${luggageNum}-${flightNo}-${flightDate}.xlsx`
+      } else {
+        fileName = `行李原始报文-${luggageNum}-${carrierFlights}-${carrierFlightsDate}.xlsx`
+      }
+      FileSaver.saveAs(new Blob([tableWrite], { type: 'application/octet-stream' }), fileName)
+    },
+    switchsChange (val) {
+      if (!val) {
+        this.switchsTxt = '未过滤'
+        this.messageList = [...this.messageListCopy]
+      } else {
+        const ndata = _.cloneDeep(this.messageListCopy)
+        const nmap = []
+        const pattern = /[`~!@#$^\-&*()=|{}':;',\\\[\]\.<>\/?~！@#￥……&*（）——|{}【】'；：""'。，、？\s]/g
+        ndata.map((item, index) => {
+          const nitem = item['sourceData'].replace(pattern, "")
+          const ntime = item['readTime'].replace(pattern, "")
+          item['sourceDataNew'] = nitem
+          item['readTimeNew'] = ntime + nitem
+          item['sourceDataIndex'] = index + 1
+          nmap.push(item)
+        })
+        const narr1 = this.uniqByMessage(nmap)
+        if (!narr1.length) {
+          this.switchs = false
+          this.$message.warning('当前报文无数据可过滤')
+          return
+        } else {
+          this.switchsTxt = '已过滤'
+          this.messageList = [...narr1]
+        }
+      }
+    },
+    uniqByMessage (arr) {
+      const narr = [...arr]
+      if (!narr.length) return narr
+      const nmap = {}
+      const [nmap1, nmap2] = [[], []]
+      const key = 'readTimeNew'
+      narr.map(item => {
+        if (!nmap[item['sourceDataNew']]) {
+          nmap[item['sourceDataNew']] = item.sourceDataNew
+          nmap1.push(item)
+        } else {
+          nmap2.push(item)
+        }
+      })
+      const res = [...nmap1, ...nmap2].filter(
+        (item) =>
+        (
+          nmap1.some((p) => item[key] == p[key]) &&
+          nmap2.some((c) => item[key] == c[key])
+        )
+      )
+      return _.orderBy([...nmap1, ...res], ['sourceDataIndex'], ['asc']) || []
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.baggageMessage {
+  height: 100%;
+  position: relative;
+  &-content {
+    padding: 24px;
+    height: 100%;
+  }
+  .card {
+    width: 100%;
+    height: 440px;
+    padding: 20px;
+    background: #ffffff;
+    border: 1px solid #dfe3ea;
+    box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.29);
+    margin-bottom: 12px;
+    > .message-date {
+      // width: 180px;
+      width: 220px;
+      height: 26px;
+      line-height: 14px;
+      font-size: 14px;
+      font-family: Helvetica;
+      color: #afb4bf;
+      border-bottom: 1px solid #afb4bf;
+      margin-bottom: 18px;
+    }
+    > .message-content {
+      white-space: pre-line;
+      line-height: 24px;
+      font-size: 14px;
+      color: #303133;
+      word-break: break-all;
+      height: calc(100% - 44px);
+    }
+  }
+  .btns {
+    position: absolute;
+    top: -50px;
+    right: 24px;
+    z-index: 10;
+    .r16 {
+      margin-right: 16px;
+    }
+  }
+  .checkBtns {
+    position: absolute;
+    top: -45px;
+    right: 84px;
+    z-index: 10;
+  }
+}
+</style>

src/views/newBagDetails/components/baggageMessage.vue

@@ -5,7 +5,7 @@
         <el-scrollbar style="height: 100%">
           <el-row style="margin:0" :gutter="15">
             <el-col v-for="(message, index) in messageList" :key="index" :span="6">
-              <div class="card">
+              <div class="card" :class="message.rushFlag ? 'borderTored' : ''">
                 <div class="message-date">{{ message.readTime }}</div>
                 <div class="message-content">
                   <el-scrollbar style="height: 100%">
@@ -56,7 +56,8 @@ export default {
       switchs: false,
       switchsTxt: '未过滤',
       dataContent: [],
-      messageListCopy: []
+      messageListCopy: [],
+      messageDatas: []
     }
   },
   watch: {
@@ -73,52 +74,95 @@ export default {
   },
   mounted () {
     this.queryDetails()
+    this.getRushData()
   },
   methods: {
-    async queryDetails () {
+    //获取行李信息
+    getRushData () {
+      const rushDataCatch = sessionStorage.getItem('rushDataCatch') || {}
+      if (rushDataCatch && rushDataCatch.length) {
+        const rushData = JSON.parse(rushDataCatch)
+        const { OriginalBagTag_TagSequence, OriginalBagTag_TagDate,OriginalBagTag_TagNumber } = rushData
+        const params = {
+          luggageNum: OriginalBagTag_TagSequence,
+          carrierFlights: OriginalBagTag_TagNumber,
+          carrierFlightsDate: OriginalBagTag_TagDate
+        }
+        this.getPnrData(params)
+      }
+    },
+    //获取速运pnr数据
+    async getPnrData (params) {
+      try {
+        const { code, returnData } = await this.getQueryList(21803455, params);
+        if (code == 0) {
+          if (returnData && returnData.length) {
+            const nparams = {
+              PNRNO: returnData[0].PNRNO || '',
+              luggageNum: returnData[0].luggageNum || ('3' + params.luggageNum),
+              carrierFlightsDate: params.carrierFlightsDate
+            }
+            this.queryDetails(true,nparams)
+          }
+        } else {
+          this.$message.error("获取表头数据失败");
+        }
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    async queryDetails (shouldReset = false,dataContent = this.dataContent) {
       try {
         this.loading = true
-        const { code, returnData } = await this.getQueryList(SERVICE_ID.bagDetailId, this.dataContent)
+        this.messageList = []
+        this.messageListCopy = []
+        const { code, returnData } = await this.getQueryList(SERVICE_ID.bagDetailId, dataContent)
         if (code == 0 && returnData && returnData.length) {
           // this.messageList = [...returnData]
-          const messageDatas = [...returnData]
-          messageDatas.map(item => {
+          if (shouldReset) {
+            returnData.map(item => item.rushFlag = true)
+          }
+          this.messageDatas.push(...returnData)
+          this.messageDatas.map(item => {
             const { dataObjectId, dataType } = item
-            if (dataObjectId && dataObjectId.length) {
-              const len = dataObjectId.length
-              let place = null
-              function popNums (num) {
-                return dataObjectId.substring(len - num, len)
-              }
-              // const popNums = [100, 101, 102].map(item => item.toString())
-              // const target = dataObjectId.substring(len - 3, len)
-              // const place = popNums.includes(target) ? '（国航）' : dataObjectId.substring(len - 5, len) == '10000' ? '（国航）' : dataObjectId.substring(len - 5, len) == '20021' ? other : other
-              const [target3, target5, target6] = [popNums(3), popNums(5), popNums(6)]
-              if (target3 == '100' || target5 == '10000') {
-                place = '（星盟）'
-              }
-              if (target3 == '101') {
-                place = '（航易行）'
-              }
-              if (target3 == '102') {
-                place = '（首都机场）'
-              }
-              if (target5 == '20021') {
-                place = dataType == ('BSM' || 'bsm') ? '（航信）' : '（BRS）'
-              }
-              if (target6 == '218602') {
-                place = '（山航）'
-              }
-              if (target6 == '218604') {
-                place = '（深航）'
+            if (!item.isFormatData) {
+                if (dataObjectId && dataObjectId.length) {
+                const len = dataObjectId.length
+                let place = null
+                function popNums (num) {
+                  return dataObjectId.substring(len - num, len)
+                }
+                // const popNums = [100, 101, 102].map(item => item.toString())
+                // const target = dataObjectId.substring(len - 3, len)
+                // const place = popNums.includes(target) ? '（国航）' : dataObjectId.substring(len - 5, len) == '10000' ? '（国航）' : dataObjectId.substring(len - 5, len) == '20021' ? other : other
+                const [target3, target5, target6] = [popNums(3), popNums(5), popNums(6)]
+                if (target3 == '100' || target5 == '10000') {
+                  place = '（星盟）'
+                }
+                if (target3 == '101') {
+                  place = '（航易行）'
+                }
+                if (target3 == '102') {
+                  place = '（首都机场）'
+                }
+                if (target5 == '20021') {
+                  place = dataType == ('BSM' || 'bsm') ? '（航信）' : '（BRS）'
+                }
+                if (target6 == '218602') {
+                  place = '（山航）'
+                }
+                if (target6 == '218604') {
+                  place = '（深航）'
+                }
+                item.readTime = item.readTime ? item.readTime.replace('T', ' ') + place : item.createAt.replace('T', ' ') + place
+              } else {
+                item.readTime = item.readTime.replace('T', ' ') || item.createAt.replace('T', ' ')
               }
-              item.readTime = item.readTime ? item.readTime.replace('T', ' ') + place : item.createAt.replace('T', ' ') + place
-            } else {
-              item.readTime = item.readTime.replace('T', ' ') || item.createAt.replace('T', ' ')
             }
+            item.isFormatData = true
           })
-          this.messageList = _.cloneDeep(messageDatas)
-          this.messageListCopy = _.cloneDeep(messageDatas)
+          this.messageList = _.cloneDeep(this.messageDatas)
+          this.messageListCopy = _.cloneDeep(this.messageDatas)
           // this.messageList = returnData.map(message => ({
           //   ...message,
           //   readTime: message.readTime ? `${message.readTime.replace('T', ' ')}（广州）` : '（北京）'
@@ -348,6 +392,9 @@ export default {
       height: calc(100% - 44px);
     }
   }
+  .borderTored {
+    border: 1px solid #ff0000;
+  }
   .btns {
     position: absolute;
     top: -50px;

src/views/newBagDetails/components/baggageView.vue

@@ -149,6 +149,7 @@ export default {
       loading: false,
       noMore: false,
       rushInfo: {}, // 速运信息
+      rushDataCatch: [], // 速运数据缓存
     }
   },
   computed: {
@@ -316,6 +317,7 @@ export default {
       }
     },
     loadData () {
+      sessionStorage.removeItem('rushDataCatch')
       this.restTable()
       this.load()
     },
@@ -344,8 +346,10 @@ export default {
             carrierFlightsDate: this.rushInfo.OriginalBagTag_TagDate,
             luggageNum: '3' + this.rushInfo.OriginalBagTag_TagSequence
           };
+          sessionStorage.setItem('rushDataCatch', JSON.stringify(this.rushInfo))
           await this.getLuggageList(2203301, params, page, pageSize,'2');
           setTimeout(() => {
+            if (this.page <= 0) this.page = 0;
             this.getLuggageList(2203301, this.dataContent, ++this.page, this.pageSize);
           }, 300);
         }

src/views/newQuery/components/table.vue

@@ -374,6 +374,7 @@ export default {
       form: {
         desc: ''
       },
+      rushCount: 0,
       initSetTableScroll: true // 是否 只滚动一次（红线）
     }
   },
@@ -639,6 +640,19 @@ export default {
               this.loading = false
             }
           }
+          if (id == SERVICE_ID.bagDetailId) {
+            const rushDataCatch = sessionStorage.getItem('rushDataCatch') || {}
+            if (rushDataCatch && rushDataCatch.length) {
+              const rushData = JSON.parse(rushDataCatch)
+              const { OriginalBagTag_TagSequence } = rushData
+              returnData.forEach(item => {
+                const luggageNum_Nine = item.luggageNum + ''
+                if (luggageNum_Nine.substring(1) == OriginalBagTag_TagSequence) {
+                  item.rushFlag = true
+                }
+              })
+            }
+          }
           if (this.shouldReset) {
             tableData = [...this.tableData, ...returnData]
             this.tableData.push(...returnData)
@@ -1118,6 +1132,11 @@ export default {
           classes.push('cell-toBule')
         }
       }
+      if (this.$route.path.startsWith('/newBagDetails')) {
+        if (column.property === 'luggageNum' && row['rushFlag']) {
+          classes.push('txtToRed')
+        }
+      }
       return classes.join(' ')
     },
     // 表格-设置行样式
@@ -1340,6 +1359,12 @@ export default {
       }
     }
 
+    .txtToRed {
+      .cell {
+        color: #ff0000;
+      }
+    }
+
     .cell {
       color: #000;
       text-align: center;