|
|
@@ -1,12 +1,12 @@
|
|
|
<!--
|
|
|
* @Author: your name
|
|
|
* @Date: 2022-01-17 10:39:22
|
|
|
- * @LastEditTime: 2022-03-14 12:04:16
|
|
|
+ * @LastEditTime: 2022-05-05 16:29:57
|
|
|
* @LastEditors: your name
|
|
|
* @Description: 行李视图
|
|
|
-->
|
|
|
<template>
|
|
|
- <div class="departureTwo">
|
|
|
+ <div class="baggage-view">
|
|
|
<div class="part1">
|
|
|
<div class="title">
|
|
|
<span>行李基本信息</span>
|
|
|
@@ -17,63 +17,96 @@
|
|
|
fill="#FFFFFF"
|
|
|
text-color="#28344D"
|
|
|
>
|
|
|
- <el-radio-button label="跟踪信息" />
|
|
|
- <el-radio-button label="跟踪报文" />
|
|
|
+ <el-radio-button
|
|
|
+ v-for="item in infoRadios"
|
|
|
+ :key="item"
|
|
|
+ :label="item"
|
|
|
+ />
|
|
|
</el-radio-group>
|
|
|
</div>
|
|
|
<div class="part1_info">
|
|
|
- <el-row :gutter="50">
|
|
|
- <el-col :span="3">行李牌号：{{ infoData.bagNo }}</el-col>
|
|
|
- <el-col :span="3">特殊行李类型：{{ infoData.specialType }}</el-col>
|
|
|
- <el-col :span="3">旅客姓名：{{ infoData.name }}</el-col>
|
|
|
- <el-col :span="3">行李异常分类： QOD20481</el-col>
|
|
|
- <el-col :span="4">企业或团队名称：{{ infoData.teamOrGroup }}</el-col>
|
|
|
- <el-col :span="4">PNR: {{ infoData.pnr }}</el-col>
|
|
|
+ <el-row :gutter="12">
|
|
|
+ <!-- 第一行 -->
|
|
|
+ <el-col :span="3"><span class="label">行李牌号：</span><span class="content">{{ baggageBasicInfo.BagSN }}</span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">企业或团队名称：</span><span class="content">{{ baggageBasicInfo.TeamOrGroup }}</span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">值机位置：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">特殊行李类型：</span><span class="content">{{ baggageBasicInfo.SpecialType }}</span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">PNR编号：</span><span class="content">{{ baggageBasicInfo.PNR }}</span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">旅客姓名大写拼音：</span><span class="content">{{ baggageBasicInfo.PassengerNameUpcase }}</span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">装载序列号：</span><span class="content"></span></el-col>
|
|
|
+ <!-- 第二行 -->
|
|
|
+ <el-col :span="3"><span class="label">总件数：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">总重量：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">尺寸：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">外部特征描述：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">常旅客号：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">常旅客级别：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">是否取消值机：</span><span class="content"></span></el-col>
|
|
|
+ <!-- 第三行 -->
|
|
|
+ <el-col :span="3"><span class="label">是否可装载：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">是否可运输：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">行李激活状态：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">无BSM状态：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">中转标记：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">速运标记：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="3"><span class="label">破损标记：</span><span class="content"></span></el-col>
|
|
|
+ <!-- 第四行 -->
|
|
|
+ <el-col :span="3"><span class="label">投诉标记：</span><span class="content"></span></el-col>
|
|
|
+ <el-col :span="4"><span class="label">赔偿标记：</span><span class="content"></span></el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="part2">
|
|
|
+ <div
|
|
|
+ v-if="infoBtn === infoRadios[0]"
|
|
|
+ class="part2"
|
|
|
+ >
|
|
|
<div class="part2_info">
|
|
|
- <div class="title">行李跟踪信息</div>
|
|
|
<div
|
|
|
- v-if="infoBtn == '跟踪信息'"
|
|
|
+ style="width: 120px"
|
|
|
+ class="title"
|
|
|
+ >行李跟踪信息</div>
|
|
|
+ <div
|
|
|
+ v-if="infoBtn === infoRadios[0]"
|
|
|
class="type normal"
|
|
|
>
|
|
|
- {{ infoData.status }}
|
|
|
+ {{ baggageBasicInfo.BagStatus }}
|
|
|
</div>
|
|
|
<div
|
|
|
- v-if="infoBtn == '跟踪信息'"
|
|
|
+ v-if="infoBtn === infoRadios[0]"
|
|
|
class="step"
|
|
|
>
|
|
|
- <div class="stepLine">
|
|
|
+ <div class="baggage-track-chart">
|
|
|
+ <div class="stepLine">
|
|
|
+ <div
|
|
|
+ :style="{ width: lineWidth }"
|
|
|
+ class="stepLineBlue"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
<div
|
|
|
- :style="{ width: lineWidth }"
|
|
|
- class="stepLineBlue"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div
|
|
|
- v-for="(item, index) in stepData"
|
|
|
- :key="index"
|
|
|
- class="stepItem"
|
|
|
- :class="{ activeItem: item.date.length > 0 }"
|
|
|
- >
|
|
|
- <span class="head">{{ item.airPort }}
|
|
|
- <span v-if="item.airPort && item.nodeName !== ''">-</span>
|
|
|
- <span>{{ item.nodeName.split('/')[1] || item.nodeName }}</span>
|
|
|
- </span>
|
|
|
- <span>{{ item.date }}</span>
|
|
|
- <span>{{ item.time }}</span>
|
|
|
+ v-for="(item, index) in stepData"
|
|
|
+ :key="index"
|
|
|
+ class="stepItem"
|
|
|
+ :class="{ activeItem: item.NodeNameEN }"
|
|
|
+ >
|
|
|
+ <span class="head">
|
|
|
+ <!-- {{ item.airPort }} -->
|
|
|
+ <!-- <span v-if="item.airPort && item.nodeName !== ''">-</span> -->
|
|
|
+ <span>{{ item.NodeNameEN }}</span>
|
|
|
+ </span>
|
|
|
+ <span>{{ item.DealTime }}</span>
|
|
|
+ <!-- <span>{{ item.time }}</span> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="Btn">
|
|
|
+ <div class="btns">
|
|
|
<el-button
|
|
|
type="primary"
|
|
|
icon="el-icon-download"
|
|
|
size="mini"
|
|
|
/>
|
|
|
<el-button
|
|
|
- class="setBtn"
|
|
|
+ class="btn-set"
|
|
|
type="primary"
|
|
|
icon="el-icon-s-tools"
|
|
|
size="mini"
|
|
|
@@ -82,18 +115,16 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div
|
|
|
- v-if="infoBtn == '跟踪信息'"
|
|
|
+ v-if="infoBtn == infoRadios[0]"
|
|
|
class="part3"
|
|
|
>
|
|
|
<el-table
|
|
|
ref="table"
|
|
|
:data="baggageTableData"
|
|
|
+ size="mini"
|
|
|
border
|
|
|
- style="width: 100%"
|
|
|
- height="calc(100vh - 81px - 144px - 156px)"
|
|
|
stripe
|
|
|
- size="mini"
|
|
|
- :span-method="objectSpanMethod"
|
|
|
+ fit
|
|
|
:header-cell-style="{ color: '#101116' }"
|
|
|
>
|
|
|
<el-table-column
|
|
|
@@ -102,30 +133,48 @@
|
|
|
:prop="item.prop"
|
|
|
:label="item.name"
|
|
|
:align="item.align"
|
|
|
+ :width="item.width + 'px'"
|
|
|
:show-overflow-tooltip="true"
|
|
|
- :render-header="renderHeader"
|
|
|
/>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
- v-if="infoBtn == '跟踪报文'"
|
|
|
+ v-if="infoBtn === infoRadios[1]"
|
|
|
class="part4"
|
|
|
>
|
|
|
- <template v-if="messageList.length">
|
|
|
- <el-row
|
|
|
- :gutter="24"
|
|
|
- type="flex"
|
|
|
- >
|
|
|
- <el-col
|
|
|
- v-for="(message, index) in messageList"
|
|
|
- :key="index"
|
|
|
- :span="6"
|
|
|
+ <header class="head">
|
|
|
+ <div class="title">行李跟踪信息</div>
|
|
|
+ <div class="btns">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-download"
|
|
|
+ size="mini"
|
|
|
+ />
|
|
|
+ <el-button
|
|
|
+ class="btn-set"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-s-tools"
|
|
|
+ size="mini"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
+ <main class="main">
|
|
|
+ <template v-if="messageList.length">
|
|
|
+ <el-row
|
|
|
+ :gutter="24"
|
|
|
+ type="flex"
|
|
|
>
|
|
|
- <div class="card">
|
|
|
- <div class="message">
|
|
|
- {{ message.replace(/\s+/g, '').split('.').join('\n.') }}
|
|
|
- <!-- BSM <br>
|
|
|
+ <el-col
|
|
|
+ v-for="(message, index) in messageList"
|
|
|
+ :key="index"
|
|
|
+ :span="6"
|
|
|
+ >
|
|
|
+ <div class="card">
|
|
|
+ <div class="message-date">{{ message.date }}</div>
|
|
|
+ <div class="message-content">
|
|
|
+ {{ message.content.replace(/\s+/g, "").split(".").join("\n.") }}
|
|
|
+ <!-- BSM <br>
|
|
|
.V/1LHRB <br>
|
|
|
.F/XX1640/08APR/PEK/Y <br>
|
|
|
.O/ZZ941/08APR/DXB/E <br>
|
|
|
@@ -134,17 +183,18 @@
|
|
|
.S/N/32L/C/030//Y/I <br>
|
|
|
.W/K/l/0 <br>
|
|
|
.P/1CUI/DI ENDBSM<br> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <el-empty
|
|
|
- :image-size="1"
|
|
|
- description="暂无数据"
|
|
|
- />
|
|
|
- </template>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-empty
|
|
|
+ :image-size="1"
|
|
|
+ description="暂无数据"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </main>
|
|
|
</div>
|
|
|
<!--列设置-->
|
|
|
<Dialog
|
|
|
@@ -162,7 +212,7 @@
|
|
|
:default-expand-all="true"
|
|
|
:props="{
|
|
|
label: 'name',
|
|
|
- children: 'children'
|
|
|
+ children: 'children',
|
|
|
}"
|
|
|
:default-checked-keys="checkedKeysTemp"
|
|
|
@check="handleCheck"
|
|
|
@@ -186,7 +236,8 @@
|
|
|
</template>
|
|
|
<script>
|
|
|
import Dialog from '@/layout/components/Dialog/index.vue'
|
|
|
-import { nodeinfoes, fulltrackinfoAndNodeInfoList, BaggageMessageQuery } from '@/api/flight'
|
|
|
+import { queryMap, myQuery } from '@/api/dataIntegration'
|
|
|
+import { BaggageMessageQuery } from '@/api/flight'
|
|
|
import tableColsMixin from '../../mixins/tableCols'
|
|
|
|
|
|
export default {
|
|
|
@@ -199,236 +250,152 @@ export default {
|
|
|
return {
|
|
|
departureAirport: '',
|
|
|
landingAirport: '',
|
|
|
- infoData: null,
|
|
|
+ queryData: {},
|
|
|
+ baggageBasicInfo: {
|
|
|
+ BagSN: '3666149457',
|
|
|
+ SpecialType: null,
|
|
|
+ PassengerInfoStatus: null,
|
|
|
+ PassengerNameUpcase: 'AIJIAMEI',
|
|
|
+ bagExcType: null,
|
|
|
+ TeamOrGroup: null,
|
|
|
+ PNR: null,
|
|
|
+ BagStatus: null
|
|
|
+ },
|
|
|
dialogVisibledele: false,
|
|
|
active: 2,
|
|
|
infoBtn: '跟踪信息',
|
|
|
- hasMessageGotten: false,
|
|
|
+ infoRadios: ['跟踪信息', '跟踪报文'],
|
|
|
messageList: [
|
|
|
- // `BSM
|
|
|
- // .V/1LHRB
|
|
|
- // .F/XX1640/08APR/PEK/Y
|
|
|
- // .O/ZZ941/08APR/DXB/E
|
|
|
- // .N/0666826758001
|
|
|
- // .D/SELF//08APR/110023L//PEK30113
|
|
|
- // .S/N/32L/C/030//Y/I
|
|
|
- // .W/K/l/0
|
|
|
- // .P/1CUI/DI ENDBSM`
|
|
|
- ],
|
|
|
- lineWidth: '',
|
|
|
- checkList: [],
|
|
|
- stepData: [
|
|
|
- {
|
|
|
- airPort: this.departureAirport,
|
|
|
- nodeCode: 'CHECKIN',
|
|
|
- nodeName: '值机',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- },
|
|
|
- {
|
|
|
- airPort: this.departureAirport,
|
|
|
- nodeCode: 'SECURITY',
|
|
|
- nodeName: '安检',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- },
|
|
|
- {
|
|
|
- airPort: this.departureAirport,
|
|
|
- nodeCode: 'SORT',
|
|
|
- nodeName: '分拣',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- },
|
|
|
- {
|
|
|
- airPort: this.departureAirport,
|
|
|
- nodeCode: 'LOAD',
|
|
|
- nodeName: '装载/装车',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- },
|
|
|
- {
|
|
|
- airPort: this.departureAirport,
|
|
|
- nodeCode: 'INF',
|
|
|
- nodeName: '装机',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- },
|
|
|
// {
|
|
|
- // airPort: this.landingAirport,
|
|
|
- // nodeCode: '',
|
|
|
- // nodeName: '卸机',
|
|
|
- // date: '',
|
|
|
- // time: ''
|
|
|
- // },
|
|
|
- {
|
|
|
- airPort: this.landingAirport,
|
|
|
- nodeCode: 'UNLOAD',
|
|
|
- nodeName: '卸车',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- },
|
|
|
- {
|
|
|
- airPort: this.landingAirport,
|
|
|
- nodeCode: 'TiQu',
|
|
|
- nodeName: '提取',
|
|
|
- date: '',
|
|
|
- time: ''
|
|
|
- }
|
|
|
+ // content: `BSM
|
|
|
+ // .V/1LHRB
|
|
|
+ // .F/XX1640/08APR/PEK/Y
|
|
|
+ // .O/ZZ941/08APR/DXB/E
|
|
|
+ // .N/0666826758001
|
|
|
+ // .D/SELF//08APR/110023L//PEK30113
|
|
|
+ // .S/N/32L/C/030//Y/I
|
|
|
+ // .W/K/l/0
|
|
|
+ // .P/1CUI/DI ENDBSM`,
|
|
|
+ // date: '2022-04-25 12:42:38:00'
|
|
|
+ // }
|
|
|
],
|
|
|
+ checkList: [],
|
|
|
+ stepData: new Array(11).fill({}),
|
|
|
tableCols: [
|
|
|
{
|
|
|
name: '航班号',
|
|
|
- prop: 'flightNo',
|
|
|
+ prop: 'FlightNO',
|
|
|
align: 'center'
|
|
|
},
|
|
|
- { name: '航班日期', prop: 'flightDate', align: 'center' },
|
|
|
+ { name: '航班日期', prop: 'FlightDate', align: 'center', width: 103 },
|
|
|
{
|
|
|
- name: '起飞航站/预计起飞时间',
|
|
|
- prop: 'start',
|
|
|
- align: 'center'
|
|
|
+ name: '起飞航站\n预计起飞时间',
|
|
|
+ prop: 'PlanDepartureTime',
|
|
|
+ align: 'center',
|
|
|
+ width: 111
|
|
|
},
|
|
|
{
|
|
|
- name: '目的航站/预计降落时间',
|
|
|
- prop: 'end',
|
|
|
+ name: '目的航站\n预计降落时间',
|
|
|
+ prop: 'PlanLandingTime',
|
|
|
align: 'center',
|
|
|
- sortable: 'custom'
|
|
|
+ sortable: 'custom',
|
|
|
+ width: 111
|
|
|
},
|
|
|
- { name: '旅客仓位', prop: 'passengerCompartment', align: 'center' },
|
|
|
- { name: '旅客座位号', prop: 'passengerSeatNumber', align: 'center' },
|
|
|
- { name: '值机序号', prop: 'passengerCheckInNumber', align: 'center' },
|
|
|
- { name: '节点标识', prop: 'nodeCode', align: 'center' },
|
|
|
- { name: '节点名称', prop: 'nodeName', align: 'center' },
|
|
|
- { name: '位置码', prop: 'locationCode', align: 'center' },
|
|
|
- { name: '位置描述', prop: 'locationRemark', align: 'center' },
|
|
|
- { name: '读取时间', prop: 'dealTime', align: 'center' },
|
|
|
- { name: '结果', prop: 'status', align: 'center' },
|
|
|
- { name: '次级代码', prop: 'secondaryCode', align: 'center' },
|
|
|
+ { name: '旅客仓位', prop: 'Canbin', align: 'center' },
|
|
|
+ { name: '旅客座位号', prop: 'SeatNO', align: 'center', width: 101 },
|
|
|
+ { name: '值机序号', prop: 'CheckInNO', align: 'center' },
|
|
|
+ { name: '节点标识', prop: 'NodeCode', align: 'center' },
|
|
|
+ { name: '节点名称', prop: 'NodeName', align: 'center' },
|
|
|
+ { name: '位置标识', prop: 'LocationID', align: 'center' },
|
|
|
+ { name: '位置码', prop: 'LocationMark', align: 'center' },
|
|
|
+ { name: '位置描述', prop: 'RemarkCN', align: 'center' },
|
|
|
+ { name: '读取时间', prop: 'DealTime', align: 'center' },
|
|
|
+ { name: '结果', prop: 'DealResult', align: 'center' },
|
|
|
+ { name: '次级代码', prop: 'SecondCode', align: 'center' },
|
|
|
{ name: '操作人', prop: 'creator', align: 'center' },
|
|
|
- { name: '设备ID', prop: 'deviceId', align: 'center' },
|
|
|
- { name: '发往位置', prop: 'toLocation', align: 'center' },
|
|
|
- { name: '位置描述', prop: 'toLocationRemark', align: 'center' },
|
|
|
- { name: '装载序号', prop: 'loadSequenceNumber', align: 'center' },
|
|
|
- { name: '容器编号', prop: 'containerNumber', align: 'center' },
|
|
|
- { name: '报文', prop: 'messageType', align: 'center' }
|
|
|
+ { name: '设备ID', prop: 'DeviceCode', align: 'center' },
|
|
|
+ { name: '发往位置', prop: 'ToPlaceCode', align: 'center' },
|
|
|
+ { name: '发往位置描述', prop: 'ToPlaceMark', align: 'center', width: 113 },
|
|
|
+ { name: '装载序号', prop: 'LoadSN', align: 'center' },
|
|
|
+ { name: '容器编号', prop: 'containerNumber', align: 'center' }
|
|
|
],
|
|
|
baggageTableData: [],
|
|
|
spanArr: [],
|
|
|
pos: 0
|
|
|
}
|
|
|
},
|
|
|
- watch: {
|
|
|
- infoBtn(val) {
|
|
|
- if (val === '跟踪报文' && !this.hasMessageGotten) {
|
|
|
- const { flightNo, flightDate, bagNo } = this.infoData
|
|
|
- const params = { flightNo, flightDate, bagNo }
|
|
|
- this.baggageMessageQuery(params)
|
|
|
- }
|
|
|
+ computed: {
|
|
|
+ lineWidth() {
|
|
|
+ return ((this.stepData.filter(item => item.NodeNameEN).length - 1) * 100) / 10.0 + '%'
|
|
|
}
|
|
|
},
|
|
|
- created() {
|
|
|
- this.infoData = this._.cloneDeep(this.$route.query)
|
|
|
- // console.log(this.infoData)
|
|
|
- // this.baggageTableColumnCheckList = this._.cloneDeep(this.baggageTableColumn)
|
|
|
- const nodeData = {
|
|
|
- flightNo: this.infoData.flightNo,
|
|
|
- flightDate: this.infoData.flightDate,
|
|
|
- bagNo: this.infoData.bagNo
|
|
|
- }
|
|
|
- this.getNodeinfoes(nodeData)
|
|
|
- this.getFulltrackinfoAndNodeInfoList(nodeData)
|
|
|
+ // watch: {
|
|
|
+ // infoBtn(val) {
|
|
|
+ // if (val === '跟踪报文') {
|
|
|
+ // const { BagSN: bagNo, FlightNO: flightNo, FlightDate: flightDate } = this.queryData
|
|
|
+ // const params = { flightNo, flightDate, bagNo }
|
|
|
+ // this.baggageMessageQuery(params)
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ mounted() {
|
|
|
+ this.queryData = this._.cloneDeep(this.$route.query)
|
|
|
+ // console.log(this.queryData)
|
|
|
+ this.queryBaggageAll()
|
|
|
},
|
|
|
methods: {
|
|
|
- async getFulltrackinfoAndNodeInfoList(data) {
|
|
|
- try {
|
|
|
- const result = await fulltrackinfoAndNodeInfoList(data)
|
|
|
- if (result.returnData.length > 0) {
|
|
|
- this.departureAirport = result.returnData[0].departureAirport
|
|
|
- this.landingAirport = result.returnData[0].landingAirport
|
|
|
- }
|
|
|
- result.returnData.forEach(item => {
|
|
|
- item['start'] = item.departureAirport + '\n' + item.departureTime
|
|
|
- item['end'] = item.landingAirport + '\n' + item.landingTime
|
|
|
- item['dealTime'] = item.dealTime.split('T')[1]
|
|
|
- })
|
|
|
- this.baggageTableData = this._.cloneDeep(result.returnData)
|
|
|
- for (var i = 0; i < this.baggageTableData.length; i++) {
|
|
|
- if (i === 0) {
|
|
|
- this.spanArr.push(1)
|
|
|
- this.pos = 0
|
|
|
- } else {
|
|
|
- // 判断当前元素与上一个元素是否相同
|
|
|
- if (this.baggageTableData[i].flightNo === this.baggageTableData[i - 1].flightNo) {
|
|
|
- this.spanArr[this.pos] += 1
|
|
|
- this.spanArr.push(0)
|
|
|
- } else {
|
|
|
- this.spanArr.push(1)
|
|
|
- this.pos = i
|
|
|
- }
|
|
|
- }
|
|
|
- // console.log(this.spanArr)
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- console.log(error)
|
|
|
- }
|
|
|
+ // objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ // if (columnIndex < 4) {
|
|
|
+ // const _row = this.spanArr[rowIndex]
|
|
|
+ // const _col = _row > 0 ? 1 : 0
|
|
|
+ // // console.log(`rowspan:${_row} colspan:${_col}`)
|
|
|
+ // return {
|
|
|
+ // rowspan: _row,
|
|
|
+ // colspan: _col
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // 行李详情基础信息
|
|
|
+ queryBaggageBasicInfo(dataContent) {
|
|
|
+ return myQuery(queryMap.baggageBasicInfoByID, ...dataContent)
|
|
|
+ },
|
|
|
+ // 行李详情追踪链
|
|
|
+ queryBaggageTrack(dataContent) {
|
|
|
+ return myQuery(queryMap.baggageTrackByID, ...dataContent)
|
|
|
},
|
|
|
- async getNodeinfoes(data) {
|
|
|
+ // 行李详情表格
|
|
|
+ queryBaggageDetails(dataContent) {
|
|
|
+ return myQuery(queryMap.baggageDetailsByID, ...dataContent)
|
|
|
+ },
|
|
|
+ async queryBaggageAll(queryData = this.queryData) {
|
|
|
+ const { BagSN, FlightDate, FlightNO } = queryData
|
|
|
+ const dataContent = [BagSN, FlightDate, FlightNO]
|
|
|
try {
|
|
|
- const result = await nodeinfoes(data)
|
|
|
- const nodes = this._.cloneDeep(result.returnData)
|
|
|
- let finalStep = 0
|
|
|
- this.stepData.forEach((item, index) => {
|
|
|
- nodes.forEach(node => {
|
|
|
- if (item.nodeCode === node.nodeCode) {
|
|
|
- item.date = node.realTime.split(' ')[0]
|
|
|
- item.time = node.realTime.split(' ')[1]
|
|
|
- finalStep < index + 1 && (finalStep = index + 1)
|
|
|
- }
|
|
|
- })
|
|
|
+ const [baggageBasicInfo, baggageTrack, baggageDetails] = await Promise.all([
|
|
|
+ this.queryBaggageBasicInfo(dataContent),
|
|
|
+ this.queryBaggageTrack(dataContent),
|
|
|
+ this.queryBaggageDetails(dataContent)
|
|
|
+ ])
|
|
|
+ baggageBasicInfo.length && (this.baggageBasicInfo = baggageBasicInfo[0])
|
|
|
+ baggageTrack.forEach((item, index) => {
|
|
|
+ item.NodeNameEN && this.stepData.splice(index, 1, item)
|
|
|
+ })
|
|
|
+ this.baggageTableData = baggageDetails.map(item => {
|
|
|
+ item['DealTime'] = item['DealTime'].split('T')[1]
|
|
|
+ return item
|
|
|
})
|
|
|
- this.lineWidth = (finalStep / 8) * 100 + '%'
|
|
|
- // console.log(this.stepData)
|
|
|
} catch (error) {
|
|
|
- console.log(error)
|
|
|
+ console.log('错误', error)
|
|
|
}
|
|
|
},
|
|
|
async baggageMessageQuery(params) {
|
|
|
try {
|
|
|
const result = await BaggageMessageQuery(params)
|
|
|
- this.hasMessageGotten = true
|
|
|
// console.log(result.returnData)
|
|
|
this.messageList = result.returnData
|
|
|
} catch (error) {
|
|
|
console.log(error)
|
|
|
}
|
|
|
- },
|
|
|
- objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
- if (columnIndex < 4) {
|
|
|
- const _row = this.spanArr[rowIndex]
|
|
|
- const _col = _row > 0 ? 1 : 0
|
|
|
- // console.log(`rowspan:${_row} colspan:${_col}`)
|
|
|
- return {
|
|
|
- rowspan: _row,
|
|
|
- colspan: _col
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- renderHeader(h, { column, $index }) {
|
|
|
- const arr = column.label.split('/')
|
|
|
- if (arr.length > 1) {
|
|
|
- return h('span', {
|
|
|
- attrs: {},
|
|
|
- domProps: {
|
|
|
- innerHTML: '<span>' + arr[0] + '</span><br>' + arr[1]
|
|
|
- }
|
|
|
- })
|
|
|
- } else {
|
|
|
- return h('span', {
|
|
|
- attrs: {},
|
|
|
- domProps: {
|
|
|
- innerHTML: '<span>' + arr[0] + '</span>'
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -449,17 +416,17 @@ export default {
|
|
|
}
|
|
|
</style>
|
|
|
<style lang="scss" scoped>
|
|
|
-.departureTwo {
|
|
|
+.baggage-view {
|
|
|
width: 100%;
|
|
|
height: calc(100vh - 81px);
|
|
|
overflow: hidden;
|
|
|
background: #dfe3ea;
|
|
|
- padding: 10px 5px 0 5px;
|
|
|
+ padding: 8px 8px 0;
|
|
|
.part1 {
|
|
|
width: 100%;
|
|
|
- height: 144px;
|
|
|
+ height: 232px;
|
|
|
background: #041741;
|
|
|
- padding: 31px 18px;
|
|
|
+ padding: 16px 30px;
|
|
|
.title {
|
|
|
font-size: 18px;
|
|
|
font-weight: bold;
|
|
|
@@ -472,17 +439,33 @@ export default {
|
|
|
}
|
|
|
.part1_info {
|
|
|
width: 100%;
|
|
|
- padding-top: 25px;
|
|
|
color: #fff;
|
|
|
font-size: 14px;
|
|
|
font-weight: 400;
|
|
|
color: #ffffff;
|
|
|
+ > .el-row > .el-col {
|
|
|
+ height: 38px;
|
|
|
+ line-height: 38px;
|
|
|
+ display: flex;
|
|
|
+ .label {
|
|
|
+ flex-basis: 126px;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .content {
|
|
|
+ flex: 1;
|
|
|
+ margin: 0;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.part2 {
|
|
|
+ margin: 8px 0;
|
|
|
width: 100%;
|
|
|
- padding: 24px 0;
|
|
|
- padding-left: 32px;
|
|
|
+ padding: 24px 30px;
|
|
|
+ background: #ffffff;
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
@@ -511,12 +494,17 @@ export default {
|
|
|
}
|
|
|
.step {
|
|
|
height: 80px;
|
|
|
- width: 980px;
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
+ width: 1430px;
|
|
|
position: relative;
|
|
|
+ .baggage-track-chart {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ overflow-x: scroll;
|
|
|
+ overflow-y: hidden;
|
|
|
+ }
|
|
|
.stepLine {
|
|
|
width: 100%;
|
|
|
height: 20px;
|
|
|
@@ -558,52 +546,91 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .Btn {
|
|
|
- height: 30px;
|
|
|
- display: flex;
|
|
|
- .el-button {
|
|
|
- margin-left: 10px;
|
|
|
- width: 30px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
- .setBtn {
|
|
|
- margin-right: 30px;
|
|
|
- }
|
|
|
- }
|
|
|
}
|
|
|
.part3 {
|
|
|
width: 100%;
|
|
|
- height: calc(100vh - 81px - 144px - 145px);
|
|
|
- padding: 10px 5px 15px 5px;
|
|
|
- ::v-deep .el-table .cell {
|
|
|
- white-space: pre-line;
|
|
|
+ height: calc(100% - 232px - 146px);
|
|
|
+ ::v-deep .el-table {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ .el-table__cell {
|
|
|
+ background: #f0f3f7;
|
|
|
+ }
|
|
|
+ &.el-table--striped {
|
|
|
+ .el-table__body tr.el-table__row--striped td.el-table__cell,
|
|
|
+ .el-table__header .el-table__cell {
|
|
|
+ background: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cell {
|
|
|
+ word-spacing: 0;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Helvetica, 'Microsoft YaHei';
|
|
|
+ font-weight: 400;
|
|
|
+ color: #303133;
|
|
|
+ white-space: pre-line;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.part4 {
|
|
|
width: 100%;
|
|
|
- height: calc(100vh - 81px - 144px - 100px);
|
|
|
- overflow-y: auto;
|
|
|
- overflow-x: hidden;
|
|
|
- ::v-deep .el-row {
|
|
|
- flex-wrap: wrap;
|
|
|
- .card {
|
|
|
- width: 100%;
|
|
|
- min-height: 280px;
|
|
|
- padding: 36px 0 15px 31px;
|
|
|
- background: #ffffff;
|
|
|
- box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.29);
|
|
|
- margin-bottom: 24px;
|
|
|
- > .message {
|
|
|
- white-space: pre-line;
|
|
|
- line-height: 24px;
|
|
|
- font-size: 14px;
|
|
|
- color: #303133;
|
|
|
+ height: calc(100vh - 81px - 232px);
|
|
|
+ .head {
|
|
|
+ padding: 16px 24px 11px 30px;
|
|
|
+ background: transparent;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ .title {
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #303133;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .main {
|
|
|
+ height: calc(100% - 57px);
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+ ::v-deep .el-row {
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .card {
|
|
|
+ width: 100%;
|
|
|
+ min-height: 330px;
|
|
|
+ padding: 24px 0 0 32px;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.29);
|
|
|
+ margin-bottom: 24px;
|
|
|
+ > .message-date {
|
|
|
+ width: 160px;
|
|
|
+ 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;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .btns {
|
|
|
+ height: 30px;
|
|
|
+ display: flex;
|
|
|
+ .el-button {
|
|
|
+ margin-left: 10px;
|
|
|
+ width: 30px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
::v-deep .dialog-check-cols .el-tree {
|
|
|
&.has-children .el-tree-node > .el-tree-node__children {
|
