|
|
@@ -8,17 +8,8 @@
|
|
|
<template>
|
|
|
<div class="transfer-in">
|
|
|
<!--功能区-表单-->
|
|
|
- <div
|
|
|
- ref="formWrap"
|
|
|
- class="terminal-form-wrap"
|
|
|
- >
|
|
|
- <el-form
|
|
|
- ref="form"
|
|
|
- :inline="true"
|
|
|
- :model="formData"
|
|
|
- :rules="rules"
|
|
|
- class="form"
|
|
|
- >
|
|
|
+ <div ref="formWrap" class="terminal-form-wrap">
|
|
|
+ <el-form ref="form" :inline="true" :model="formData" :rules="rules" class="form">
|
|
|
<div class="form-left">
|
|
|
<el-form-item prop="currentAirport">
|
|
|
<!-- <el-cascader
|
|
|
@@ -33,52 +24,15 @@
|
|
|
filterable
|
|
|
@change="setCurrentAirport"
|
|
|
/> -->
|
|
|
- <el-select
|
|
|
- v-model="formData.currentAirport"
|
|
|
- class="input-shadow"
|
|
|
- size="small"
|
|
|
- style="width: 100px;"
|
|
|
- filterable
|
|
|
- placeholder="请选择机场"
|
|
|
- @change="airPortChange"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in AirportList"
|
|
|
- :key="index"
|
|
|
- :label="item.planDepartureApt"
|
|
|
- :value="item.planDepartureApt"
|
|
|
- />
|
|
|
+ <el-select v-model="formData.currentAirport" class="input-shadow" size="small" style="width: 100px;" filterable placeholder="请选择机场" @change="airPortChange">
|
|
|
+ <el-option v-for="(item, index) in AirportList" :key="index" :label="item.planDepartureApt" :value="item.planDepartureApt" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="inboundCarrier">
|
|
|
- <el-cascader
|
|
|
- v-model="formData.inboundCarrier"
|
|
|
- class="input-shadow"
|
|
|
- style="width: 150px"
|
|
|
- size="small"
|
|
|
- :options="carrierProps"
|
|
|
- :props="optionProps"
|
|
|
- placeholder="进港承运航司"
|
|
|
- collapse-tags
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- @change="resetLoopEvent"
|
|
|
- />
|
|
|
+ <el-cascader v-model="formData.inboundCarrier" class="input-shadow" style="width: 150px" size="small" :options="carrierProps" :props="optionProps" placeholder="进港承运航司" collapse-tags clearable filterable @change="resetLoopEvent" />
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="outgoingAirline">
|
|
|
- <el-cascader
|
|
|
- v-model="formData.outgoingAirline"
|
|
|
- class="input-shadow"
|
|
|
- style="width: 150px"
|
|
|
- size="small"
|
|
|
- :options="carrierPropsop"
|
|
|
- :props="optionPropser"
|
|
|
- placeholder="离港承运航司"
|
|
|
- collapse-tags
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- @change="resetLoopEvent"
|
|
|
- />
|
|
|
+ <el-cascader v-model="formData.outgoingAirline" class="input-shadow" style="width: 150px" size="small" :options="carrierPropsop" :props="optionPropser" placeholder="离港承运航司" collapse-tags clearable filterable @change="resetLoopEvent" />
|
|
|
</el-form-item>
|
|
|
<!-- <el-form-item prop="startDate">
|
|
|
<el-date-picker
|
|
|
@@ -104,156 +58,54 @@
|
|
|
@change="endDateChangeHandler"
|
|
|
/>
|
|
|
</el-form-item> -->
|
|
|
- <el-form-item
|
|
|
- prop="flightDate"
|
|
|
- label="航班日期"
|
|
|
- >
|
|
|
- <el-date-picker
|
|
|
- v-model="formData.flightDate"
|
|
|
- size="small"
|
|
|
- style="width: 300px;"
|
|
|
- type="daterange"
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- :picker-options="dateRangePickerOptions"
|
|
|
- @change="dateChangeHandler"
|
|
|
- />
|
|
|
+ <el-form-item prop="flightDate" label="航班日期">
|
|
|
+ <el-date-picker v-model="formData.flightDate" :clearable="false" size="small" style="width: 300px;" type="daterange" value-format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="dateRangePickerOptions" @change="dateChangeHandler" />
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<div class="box-item">
|
|
|
<p>预计中转数：</p>
|
|
|
- <li
|
|
|
- v-for="(item, index) in orderNum"
|
|
|
- :key="index"
|
|
|
- :class="{ 'number-item': !isNaN(item), 'mark-item': isNaN(item) }"
|
|
|
- >
|
|
|
+ <li v-for="(item, index) in orderNum" :key="index" :class="{ 'number-item': !isNaN(item), 'mark-item': isNaN(item) }">
|
|
|
<span v-if="!isNaN(item)">
|
|
|
<i ref="numberItem">0123456789</i>
|
|
|
</span>
|
|
|
- <span
|
|
|
- v-else
|
|
|
- class="comma"
|
|
|
- >{{ item }}</span>
|
|
|
+ <span v-else class="comma">{{ item }}</span>
|
|
|
</li>
|
|
|
</div>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
- <div
|
|
|
- class="form-right"
|
|
|
- @keyup.enter="onSubmit(1)"
|
|
|
- >
|
|
|
+ <div class="form-right" @keyup.enter="onSubmit(1)">
|
|
|
<el-form-item prop="search">
|
|
|
- <el-popover
|
|
|
- :value="popoverVisible"
|
|
|
- placement="bottom"
|
|
|
- trigger="manual"
|
|
|
- >
|
|
|
+ <el-popover :value="popoverVisible" placement="bottom" trigger="manual">
|
|
|
<span>请输入航班号（示例：CA1234）或行李牌号（示例：1234567890）</span>
|
|
|
- <el-input
|
|
|
- slot="reference"
|
|
|
- v-model="formData.search"
|
|
|
- class="input-shadow"
|
|
|
- style="width: 240px;"
|
|
|
- size="small"
|
|
|
- placeholder="请输入内容"
|
|
|
- prefix-icon="el-icon-search"
|
|
|
- clearable
|
|
|
- @focus="popoverVisible = true"
|
|
|
- @blur="popoverVisible = false"
|
|
|
- />
|
|
|
+ <el-input slot="reference" v-model="formData.search" class="input-shadow" style="width: 240px;" size="small" placeholder="请输入内容" prefix-icon="el-icon-search" clearable @focus="popoverVisible = true" @blur="popoverVisible = false" />
|
|
|
</el-popover>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button
|
|
|
- class="btn-shadow"
|
|
|
- size="mini"
|
|
|
- type="primary"
|
|
|
- @click="onSubmit(1)"
|
|
|
- >搜索</el-button>
|
|
|
+ <el-button class="btn-shadow" size="mini" type="primary" @click="onSubmit(1)">搜索</el-button>
|
|
|
</el-form-item>
|
|
|
<el-form-item v-is="['ti_showTransit']">
|
|
|
- <el-button
|
|
|
- class="btn-shadow"
|
|
|
- size="mini"
|
|
|
- type="primary"
|
|
|
- @click="changeView"
|
|
|
- >切换视角</el-button>
|
|
|
+ <el-button class="btn-shadow" size="mini" type="primary" @click="changeView">切换视角</el-button>
|
|
|
</el-form-item>
|
|
|
<el-form-item v-is="['ti_timeIcon']">
|
|
|
<TimeZoneSelector />
|
|
|
</el-form-item>
|
|
|
<el-form-item v-is="['ti_columnSettings']">
|
|
|
- <img
|
|
|
- class="btn-img btn-shadow"
|
|
|
- src="../../../../assets/baggage/ic_setting.png"
|
|
|
- title="列设置"
|
|
|
- @click="show"
|
|
|
- >
|
|
|
+ <img class="btn-img btn-shadow" src="../../../../assets/baggage/ic_setting.png" title="列设置" @click="show">
|
|
|
</el-form-item>
|
|
|
<el-form-item v-is="['dm_dt_columnSettings']">
|
|
|
- <img
|
|
|
- class="btn-img btn-shadow"
|
|
|
- src="../../../../assets/baggage/ic_export.png"
|
|
|
- title="导出"
|
|
|
- @click="exportHandler('table', '航站中转进港列表')"
|
|
|
- >
|
|
|
+ <img class="btn-img btn-shadow" src="../../../../assets/baggage/ic_export.png" title="导出" @click="exportHandler('table', '航站中转进港列表')">
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<!--表格-->
|
|
|
- <div
|
|
|
- v-loading="loading"
|
|
|
- class="terminal-table"
|
|
|
- element-loading-text="拼命加载中"
|
|
|
- element-loading-spinner="el-icon-loading"
|
|
|
- element-loading-background="rgba(0, 0, 0, 0.8)"
|
|
|
- >
|
|
|
- <el-table
|
|
|
- ref="table"
|
|
|
- class="table"
|
|
|
- :data="dealedTableData"
|
|
|
- :height="computedTableHeight"
|
|
|
- show-summary
|
|
|
- :summary-method="summaryMethod"
|
|
|
- :span-method="arraySpanMethod"
|
|
|
- :header-cell-class-name="headerCellClass"
|
|
|
- :row-class-name="tableRowClassName"
|
|
|
- :cell-class-name="cellClass"
|
|
|
- border
|
|
|
- stripe
|
|
|
- fit
|
|
|
- @cell-click="cellClickHandler"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- v-for="col in tableColsCopy"
|
|
|
- :key="col.prop"
|
|
|
- :prop="col.prop"
|
|
|
- :label="col.label"
|
|
|
- :width="col.width"
|
|
|
- :fixed="col.fixed"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- v-for="childCol in col.children"
|
|
|
- :key="childCol.prop"
|
|
|
- :prop="childCol.prop"
|
|
|
- :label="childCol.label"
|
|
|
- :width="childCol.width"
|
|
|
- :formatter="tableFormat"
|
|
|
- >
|
|
|
+ <div v-loading="loading" class="terminal-table" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)">
|
|
|
+ <el-table ref="table" class="table" :data="dealedTableData" :height="computedTableHeight" show-summary :summary-method="summaryMethod" :span-method="arraySpanMethod" :header-cell-class-name="headerCellClass" :row-class-name="tableRowClassName" :cell-class-name="cellClass" border stripe fit @cell-click="cellClickHandler">
|
|
|
+ <el-table-column v-for="col in tableColsCopy" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" :fixed="col.fixed">
|
|
|
+ <el-table-column v-for="childCol in col.children" :key="childCol.prop" :prop="childCol.prop" :label="childCol.label" :width="childCol.width" :formatter="tableFormat">
|
|
|
<template #header>
|
|
|
- <el-tooltip
|
|
|
- :content="childCol.desc || childCol.label"
|
|
|
- placement="top"
|
|
|
- >
|
|
|
- <TableHeaderCell
|
|
|
- :label="childCol.label"
|
|
|
- :filter-options="tableDataFilters[childCol.prop]"
|
|
|
- :filter-values.sync="filterValues[childCol.prop]"
|
|
|
- :sortable="childCol.sortable"
|
|
|
- :sort-rule.sync="tableDataSortRules[childCol.prop]"
|
|
|
- />
|
|
|
+ <el-tooltip :content="childCol.desc || childCol.label" placement="top">
|
|
|
+ <TableHeaderCell :label="childCol.label" :filter-options="tableDataFilters[childCol.prop]" :filter-values.sync="filterValues[childCol.prop]" :sortable="childCol.sortable" :sort-rule.sync="tableDataSortRules[childCol.prop]" />
|
|
|
</el-tooltip>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -261,38 +113,18 @@
|
|
|
</el-table>
|
|
|
</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"
|
|
|
- >确定</el-button>
|
|
|
- <el-button
|
|
|
- size="medium"
|
|
|
- @click="hide"
|
|
|
- >取消</el-button>
|
|
|
+ <el-button size="medium" class="r24" type="primary" @click="onCheck">确定</el-button>
|
|
|
+ <el-button size="medium" @click="hide">取消</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</Dialog>
|
|
|
@@ -314,7 +146,7 @@ export default {
|
|
|
name: 'DepartureTerminalView',
|
|
|
components: { Dialog, TimeZoneSelector, TableHeaderCell },
|
|
|
mixins: [terminalMixin, formMixin, tableColsMixin, timeZoneMixin],
|
|
|
- data() {
|
|
|
+ data () {
|
|
|
return {
|
|
|
optionProps: {
|
|
|
value: 'inAicompanyCode2',
|
|
|
@@ -489,13 +321,13 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
- singleDay() {
|
|
|
+ singleDay () {
|
|
|
return this.startDate === this.endDate
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
dealedTableData: {
|
|
|
- handler(val) {
|
|
|
+ handler (val) {
|
|
|
this.spanArr = []
|
|
|
let contactDot = this.contactDot
|
|
|
val.forEach((item, index, arr) => {
|
|
|
@@ -518,10 +350,10 @@ export default {
|
|
|
deep: true
|
|
|
}
|
|
|
},
|
|
|
- created() {
|
|
|
+ created () {
|
|
|
// this.getAirPortData()
|
|
|
},
|
|
|
- mounted() {
|
|
|
+ mounted () {
|
|
|
this.$refs['form'].validateField('flightDate')
|
|
|
this.getAirPortData()
|
|
|
this.table = this.$refs.table.bodyWrapper
|
|
|
@@ -530,7 +362,7 @@ export default {
|
|
|
that.scrollTop = this.table.scrollTop
|
|
|
})
|
|
|
},
|
|
|
- activated() {
|
|
|
+ activated () {
|
|
|
this.table.scrollTop = this.scrollTop
|
|
|
this.getTableData()
|
|
|
const that = this
|
|
|
@@ -550,20 +382,20 @@ export default {
|
|
|
// this.formData.flightDate[1] = endDate
|
|
|
// }
|
|
|
},
|
|
|
- deactivated() {
|
|
|
+ deactivated () {
|
|
|
if (this.loopEvent) {
|
|
|
clearInterval(this.loopEvent)
|
|
|
this.loopEvent = null
|
|
|
}
|
|
|
},
|
|
|
- beforeDestroy() {
|
|
|
+ beforeDestroy () {
|
|
|
if (this.loopEvent) {
|
|
|
clearInterval(this.loopEvent)
|
|
|
this.loopEvent = null
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- resetLoopEvent() {
|
|
|
+ resetLoopEvent () {
|
|
|
this.loading = true
|
|
|
this.hasSetTableScroll = false
|
|
|
if (this.loopEvent) {
|
|
|
@@ -575,7 +407,7 @@ export default {
|
|
|
that.getTableData()
|
|
|
}, 3000)
|
|
|
},
|
|
|
- headerCellClass({ row, column }) {
|
|
|
+ headerCellClass ({ row, column }) {
|
|
|
const classes = []
|
|
|
const rule = this.tableDataSortRules[column.property]
|
|
|
if (rule) {
|
|
|
@@ -583,7 +415,7 @@ export default {
|
|
|
}
|
|
|
return classes.join(' ')
|
|
|
},
|
|
|
- tableRowClassName({ row, rowIndex }) {
|
|
|
+ tableRowClassName ({ row, rowIndex }) {
|
|
|
const classes = []
|
|
|
if (row.hasArrived) {
|
|
|
classes.push('bgl-hui')
|
|
|
@@ -593,7 +425,7 @@ export default {
|
|
|
}
|
|
|
return classes.join(' ')
|
|
|
},
|
|
|
- changeView() {
|
|
|
+ changeView () {
|
|
|
// const query = {
|
|
|
// ...this.formData,
|
|
|
// startDate: this.startDate,
|
|
|
@@ -606,18 +438,18 @@ export default {
|
|
|
// })
|
|
|
this.$router.push('/transfer/departure')
|
|
|
},
|
|
|
- airPortChange() {
|
|
|
+ airPortChange () {
|
|
|
this.getAviationData()
|
|
|
this.upAviationData()
|
|
|
this.resetLoopEvent()
|
|
|
},
|
|
|
- dateChangeHandler() {
|
|
|
+ dateChangeHandler () {
|
|
|
this.getAviationData()
|
|
|
this.upAviationData()
|
|
|
this.resetLoopEvent()
|
|
|
},
|
|
|
// 选择机场
|
|
|
- async getAirPortData() {
|
|
|
+ async getAirPortData () {
|
|
|
try {
|
|
|
const res = await getQuery({
|
|
|
id: DATACONTENT_ID.departureAirId,
|
|
|
@@ -637,7 +469,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
// 选择航司
|
|
|
- async getAviationData() {
|
|
|
+ async getAviationData () {
|
|
|
try {
|
|
|
const res = await getQuery({
|
|
|
id: DATACONTENT_ID.departureAviJoinId,
|
|
|
@@ -653,7 +485,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
// 选择航司
|
|
|
- async upAviationData() {
|
|
|
+ async upAviationData () {
|
|
|
try {
|
|
|
const res = await getQuery({
|
|
|
id: DATACONTENT_ID.departureAviLeaveId,
|
|
|
@@ -679,7 +511,7 @@ export default {
|
|
|
// this.flightAttrQuery(params)
|
|
|
// },
|
|
|
// 获取表格数据
|
|
|
- async getTableData() {
|
|
|
+ async getTableData () {
|
|
|
if (!this.formData.currentAirport || !this.startDate || !this.endDate) {
|
|
|
return
|
|
|
}
|
|
|
@@ -720,7 +552,7 @@ export default {
|
|
|
console.log('出错了', error.message || error)
|
|
|
}
|
|
|
},
|
|
|
- initTableData(tableData) {
|
|
|
+ initTableData (tableData) {
|
|
|
this.arrivalCount = 0
|
|
|
this.baggageCount = 0
|
|
|
tableData.forEach(item => {
|
|
|
@@ -736,7 +568,7 @@ export default {
|
|
|
this.setTableScroll()
|
|
|
})
|
|
|
},
|
|
|
- hasArrived(flight) {
|
|
|
+ hasArrived (flight) {
|
|
|
if (flight.actualLandingTime) {
|
|
|
const now = new Date()
|
|
|
const actualLandingTime = new Date(flight.actualLandingTime.replace('T', ' '))
|
|
|
@@ -746,7 +578,7 @@ export default {
|
|
|
}
|
|
|
return flight['hasArrived']
|
|
|
},
|
|
|
- setTableScroll() {
|
|
|
+ setTableScroll () {
|
|
|
if (!this.singleDay || this.hasSetTableScroll || this.arrivalCount === 0) {
|
|
|
return
|
|
|
}
|
|
|
@@ -766,7 +598,7 @@ export default {
|
|
|
}, 0)
|
|
|
this.hasSetTableScroll = true
|
|
|
},
|
|
|
- setNumberTransform() {
|
|
|
+ setNumberTransform () {
|
|
|
const numberItems = this.$refs.numberItem // 拿到数字的ref，计算元素数量
|
|
|
const numberArr = this.orderNum.filter(item => !isNaN(item))
|
|
|
// 结合CSS 对数字字符进行滚动,显示订单数量
|
|
|
@@ -776,7 +608,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
|
|
|
- toOrderNum(num) {
|
|
|
+ toOrderNum (num) {
|
|
|
num = num.toString()
|
|
|
if (num.length < 6) {
|
|
|
num = '0' + num // 如未满八位数，添加"0"补位
|
|
|
@@ -789,7 +621,7 @@ export default {
|
|
|
}
|
|
|
this.setNumberTransform()
|
|
|
},
|
|
|
- arraySpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ arraySpanMethod ({ row, column, rowIndex, columnIndex }) {
|
|
|
for (let i = 0; i < 7; i++) {
|
|
|
if (columnIndex === i) {
|
|
|
const _row = this.spanArr[rowIndex]
|
|
|
@@ -801,7 +633,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- exportHandler(refName, tableName) {
|
|
|
+ exportHandler (refName, tableName) {
|
|
|
if (this.loading) {
|
|
|
return
|
|
|
}
|
|
|
@@ -834,7 +666,7 @@ export default {
|
|
|
optgroup,
|
|
|
select,
|
|
|
textarea {
|
|
|
- font-family: Helvetica, 'Microsoft YaHei';
|
|
|
+ font-family: Helvetica, "Microsoft YaHei";
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
.el-switch__label {
|
|
|
@@ -940,7 +772,7 @@ export default {
|
|
|
padding: 0;
|
|
|
text-align: center;
|
|
|
font-size: 14px;
|
|
|
- font-family: Helvetica, 'Microsoft YaHei';
|
|
|
+ font-family: Helvetica, "Microsoft YaHei";
|
|
|
letter-spacing: 0;
|
|
|
}
|
|
|
.cell-click {
|
|
|
@@ -974,7 +806,7 @@ export default {
|
|
|
&.redBorder {
|
|
|
position: relative;
|
|
|
&::after {
|
|
|
- content: '';
|
|
|
+ content: "";
|
|
|
position: absolute;
|
|
|
left: 0;
|
|
|
bottom: 0;
|
