|
|
|
@ -2,7 +2,7 @@
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<a-row :gutter="24">
|
|
|
|
<a-row :gutter="24">
|
|
|
|
<a-col :md="24" :sm="24" style="padding: 0 0 0 0">
|
|
|
|
<a-col :md="24" :sm="24" style="padding: 0 0 0 0">
|
|
|
|
<div class="nav-box">
|
|
|
|
<!-- <div class="nav-box">
|
|
|
|
<div class="nav" @click="addBooking"><i class="iconfont icon-jiahao2fill"></i>新建</div>
|
|
|
|
<div class="nav" @click="addBooking"><i class="iconfont icon-jiahao2fill"></i>新建</div>
|
|
|
|
<div class="nav" @click="copyBooking"><i class="iconfont icon-fuzhi"></i>复制</div>
|
|
|
|
<div class="nav" @click="copyBooking"><i class="iconfont icon-fuzhi"></i>复制</div>
|
|
|
|
<div class="nav" @click="copyBookingMore"><i class="iconfont icon-fuzhi1"></i>复制多票</div>
|
|
|
|
<div class="nav" @click="copyBookingMore"><i class="iconfont icon-fuzhi1"></i>复制多票</div>
|
|
|
|
@ -10,13 +10,19 @@
|
|
|
|
<div class="nav"><i class="iconfont icon-shujushangchuan-shixin"></i>批量VGM</div>
|
|
|
|
<div class="nav"><i class="iconfont icon-shujushangchuan-shixin"></i>批量VGM</div>
|
|
|
|
<div class="nav"><i class="iconfont icon-shishijifei"></i>定时订舱</div>
|
|
|
|
<div class="nav"><i class="iconfont icon-shishijifei"></i>定时订舱</div>
|
|
|
|
<div class="nav"><i class="iconfont icon-xiaopiaodayin"></i>小票状态</div>
|
|
|
|
<div class="nav"><i class="iconfont icon-xiaopiaodayin"></i>小票状态</div>
|
|
|
|
</div>
|
|
|
|
</div> -->
|
|
|
|
<x-card>
|
|
|
|
<x-card>
|
|
|
|
<div slot="content" class="table-page-search-wrapper">
|
|
|
|
<div slot="content" class="table-page-search-wrapper">
|
|
|
|
<a-form layout="inline">
|
|
|
|
<a-form layout="inline">
|
|
|
|
<a-row :gutter="48">
|
|
|
|
<a-row :gutter="48">
|
|
|
|
<template v-for="(formLabel, findex) in formData">
|
|
|
|
<template v-for="(formLabel, findex) in formData">
|
|
|
|
<a-col :md="4" :key="findex" v-if="(findex < 4 && !advanced) || advanced">
|
|
|
|
<a-col
|
|
|
|
|
|
|
|
:md="6"
|
|
|
|
|
|
|
|
:lg="6"
|
|
|
|
|
|
|
|
:xl="4"
|
|
|
|
|
|
|
|
:key="findex"
|
|
|
|
|
|
|
|
v-if="(findex < 4 && !advanced) || advanced"
|
|
|
|
|
|
|
|
class="from-label">
|
|
|
|
<a-form-item :label="formLabel.title" v-if="ResetType">
|
|
|
|
<a-form-item :label="formLabel.title" v-if="ResetType">
|
|
|
|
<formLabel
|
|
|
|
<formLabel
|
|
|
|
:ref="`fromlabel-${formLabel.label}`"
|
|
|
|
:ref="`fromlabel-${formLabel.label}`"
|
|
|
|
@ -28,24 +34,39 @@
|
|
|
|
</a-form-item>
|
|
|
|
</a-form-item>
|
|
|
|
</a-col>
|
|
|
|
</a-col>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
<a-col :md="formBtnCol || (!advanced && 8)" :sm="24">
|
|
|
|
<a-col :xl="formBtnCol || (!advanced && 8)" :lg="24" :md="24" :sm="24">
|
|
|
|
<span
|
|
|
|
<span
|
|
|
|
class="table-page-search-submitButtons"
|
|
|
|
class="table-page-search-submitButtons"
|
|
|
|
:style="(advanced && { float: 'right', overflow: 'hidden' }) || {}"
|
|
|
|
:style="(advanced && { float: 'right', overflow: 'hidden' }) || {}"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<a-button type="primary" @click="tableRefresh">查询</a-button>
|
|
|
|
<a-button size="small" type="primary" @click="tableRefresh">查询</a-button>
|
|
|
|
<a-button class="reset" @click="tableReset">重置</a-button>
|
|
|
|
<a-button size="small" class="reset" @click="tableReset">重置</a-button>
|
|
|
|
<a-button class="more-search" @click="tableMoreRefresh">
|
|
|
|
<template v-if="screenWidth > 1600">
|
|
|
|
多提单号查询<a-icon type="search" />
|
|
|
|
<a-button size="small" class="more-search" @click="tableMoreRefresh">
|
|
|
|
</a-button>
|
|
|
|
多提单号查询<a-icon type="search" />
|
|
|
|
<span class="tab-btn" @click="formSetting">
|
|
|
|
</a-button>
|
|
|
|
<a-icon type="setting" :style="{ marginLeft: '0px' }" />
|
|
|
|
<span class="tab-btn" @click="formSetting">
|
|
|
|
</span>
|
|
|
|
<a-icon type="setting" :style="{ marginLeft: '0px' }" />
|
|
|
|
<a class="senior-search" @click="toggleAdvanced" v-if="formData.length > 4">
|
|
|
|
</span>
|
|
|
|
{{ advanced ? '收起查询' : '更多查询' }}
|
|
|
|
<a class="senior-search" @click="toggleAdvanced" v-if="formData.length > 4">
|
|
|
|
<!-- <a-icon :type="advanced ? 'up' : 'down'" /> -->
|
|
|
|
{{ advanced ? '收起查询' : '更多查询' }}
|
|
|
|
<i class="iconfont" :class="advanced ? 'icon-shouqi' : 'icon-zhankai'"></i>
|
|
|
|
<!-- <a-icon :type="advanced ? 'up' : 'down'" /> -->
|
|
|
|
</a>
|
|
|
|
<i class="iconfont" :class="advanced ? 'icon-shouqi' : 'icon-zhankai'"></i>
|
|
|
|
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<template v-else>
|
|
|
|
|
|
|
|
<a-button size="small" class="more-search" @click="tableMoreRefresh">
|
|
|
|
|
|
|
|
多提单号<a-icon type="search" />
|
|
|
|
|
|
|
|
</a-button>
|
|
|
|
|
|
|
|
<span class="tab-btn" @click="formSetting">
|
|
|
|
|
|
|
|
<a-icon type="setting" :style="{ marginLeft: '0px' }" />
|
|
|
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
<a class="senior-search" @click="toggleAdvanced" v-if="formData.length > 4">
|
|
|
|
|
|
|
|
{{ advanced ? '收起' : '更多' }}
|
|
|
|
|
|
|
|
<!-- <a-icon :type="advanced ? 'up' : 'down'" /> -->
|
|
|
|
|
|
|
|
<i class="iconfont" :class="advanced ? 'icon-shouqi' : 'icon-zhankai'"></i>
|
|
|
|
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
</a-col>
|
|
|
|
</a-col>
|
|
|
|
</a-row>
|
|
|
|
</a-row>
|
|
|
|
@ -54,7 +75,18 @@
|
|
|
|
</x-card>
|
|
|
|
</x-card>
|
|
|
|
<x-card class="content-table">
|
|
|
|
<x-card class="content-table">
|
|
|
|
<div slot="content" class="table-page-search-wrapper" :style="{ marginTop: '-8px' }">
|
|
|
|
<div slot="content" class="table-page-search-wrapper" :style="{ marginTop: '-8px' }">
|
|
|
|
<vxe-toolbar style="padding-top:0px;">
|
|
|
|
<vxe-toolbar>
|
|
|
|
|
|
|
|
<template #buttons>
|
|
|
|
|
|
|
|
<div class="nav-box">
|
|
|
|
|
|
|
|
<div class="nav" @click="addBooking"><i class="iconfont icon-jiahao2fill"></i>新建</div>
|
|
|
|
|
|
|
|
<div class="nav" @click="copyBooking"><i class="iconfont icon-fuzhi"></i>复制</div>
|
|
|
|
|
|
|
|
<div class="nav" @click="copyBookingMore"><i class="iconfont icon-fuzhi1"></i>复制多票</div>
|
|
|
|
|
|
|
|
<div class="nav"><i class="iconfont icon-bianjiwenjian"></i>批量编辑</div>
|
|
|
|
|
|
|
|
<div class="nav"><i class="iconfont icon-shujushangchuan-shixin"></i>批量VGM</div>
|
|
|
|
|
|
|
|
<div class="nav"><i class="iconfont icon-shishijifei"></i>定时订舱</div>
|
|
|
|
|
|
|
|
<div class="nav"><i class="iconfont icon-xiaopiaodayin"></i>小票状态</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
<template #tools>
|
|
|
|
<template #tools>
|
|
|
|
<div class="right BookTopButton">
|
|
|
|
<div class="right BookTopButton">
|
|
|
|
<span class="tab-btn" @click="tableRefresh">
|
|
|
|
<span class="tab-btn" @click="tableRefresh">
|
|
|
|
@ -75,7 +107,7 @@
|
|
|
|
@cell-dblclick="handledbclick"
|
|
|
|
@cell-dblclick="handledbclick"
|
|
|
|
@resizable-change="resizableChange"
|
|
|
|
@resizable-change="resizableChange"
|
|
|
|
@sort-change="tableSortChange"
|
|
|
|
@sort-change="tableSortChange"
|
|
|
|
style="margin-top:15px;"
|
|
|
|
style="margin-top:6px;"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<template #mblno="{ row }">
|
|
|
|
<template #mblno="{ row }">
|
|
|
|
<div class="mblno">
|
|
|
|
<div class="mblno">
|
|
|
|
@ -86,6 +118,9 @@
|
|
|
|
<template #vessel="{ row }">
|
|
|
|
<template #vessel="{ row }">
|
|
|
|
<div class="vessel">{{ row.vessel }}</div>
|
|
|
|
<div class="vessel">{{ row.vessel }}</div>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<template #etd="{ row }">
|
|
|
|
|
|
|
|
<div class="etd" v-if="row.etd">{{ row.etd.substring(0, 10) }}</div>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
<template #operate="{ row }">
|
|
|
|
<template #operate="{ row }">
|
|
|
|
<vxe-button class="operate-btn" type="text" icon="vxe-icon-edit" @click="editColumns(row)"></vxe-button>
|
|
|
|
<vxe-button class="operate-btn" type="text" icon="vxe-icon-edit" @click="editColumns(row)"></vxe-button>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
@ -254,7 +289,8 @@ export default {
|
|
|
|
moreNumVal: '',
|
|
|
|
moreNumVal: '',
|
|
|
|
// 表头排序参数
|
|
|
|
// 表头排序参数
|
|
|
|
tableOrderLabel: '',
|
|
|
|
tableOrderLabel: '',
|
|
|
|
tableOrderType: ''
|
|
|
|
tableOrderType: '',
|
|
|
|
|
|
|
|
screenWidth: document.body.clientWidth
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
created() {
|
|
|
|
@ -265,6 +301,11 @@ export default {
|
|
|
|
this.getFormData()
|
|
|
|
this.getFormData()
|
|
|
|
this.getTableList()
|
|
|
|
this.getTableList()
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
mounted () {
|
|
|
|
|
|
|
|
window.onresize = () => {
|
|
|
|
|
|
|
|
this.screenWidth = document.body.clientWidth
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
...mapActions(['setBookingList']),
|
|
|
|
...mapActions(['setBookingList']),
|
|
|
|
FnCopy(data) {
|
|
|
|
FnCopy(data) {
|
|
|
|
@ -759,7 +800,6 @@ export default {
|
|
|
|
// color: #77c950;
|
|
|
|
// color: #77c950;
|
|
|
|
// }
|
|
|
|
// }
|
|
|
|
.nav-box {
|
|
|
|
.nav-box {
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
|
|
padding: 0 10px;
|
|
|
|
padding: 0 10px;
|
|
|
|
|
|
|
|
|
|
|
|
.nav {
|
|
|
|
.nav {
|
|
|
|
@ -873,6 +913,7 @@ export default {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.table-page-search-submitButtons {
|
|
|
|
.table-page-search-submitButtons {
|
|
|
|
text-align: right;
|
|
|
|
text-align: right;
|
|
|
|
|
|
|
|
padding-top: 6px;
|
|
|
|
.reset {
|
|
|
|
.reset {
|
|
|
|
margin-left: 8px;
|
|
|
|
margin-left: 8px;
|
|
|
|
margin-right: 8px;
|
|
|
|
margin-right: 8px;
|
|
|
|
@ -1094,5 +1135,49 @@ export default {
|
|
|
|
color: @primary-color;
|
|
|
|
color: @primary-color;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/deep/ .ant-form-item{
|
|
|
|
|
|
|
|
margin-bottom: 10px !important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/deep/ .table-page-search-submitButtons{
|
|
|
|
|
|
|
|
margin-bottom: 10px !important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/deep/ .ant-input{
|
|
|
|
|
|
|
|
height: 28px;
|
|
|
|
|
|
|
|
margin-top: 4px;
|
|
|
|
|
|
|
|
// transform: scaleY(.8);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/deep/ .ant-card-body{
|
|
|
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/deep/ .ant-calendar-picker-input{
|
|
|
|
|
|
|
|
padding: 0 4px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/deep/ .ant-calendar-range-picker-input{
|
|
|
|
|
|
|
|
height: 28px;
|
|
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
vertical-align: top;
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
// background: #f99;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (min-width: 1200px) and (max-width:1600px){
|
|
|
|
|
|
|
|
.from-label {
|
|
|
|
|
|
|
|
padding-right: 0 !important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@media (min-width: 1200px) and (max-width:1438px){
|
|
|
|
|
|
|
|
.table-page-search-submitButtons {
|
|
|
|
|
|
|
|
.ant-btn{
|
|
|
|
|
|
|
|
margin-left: 4px;
|
|
|
|
|
|
|
|
margin-right: 4px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.table-page-search-submitButtons .senior-search{
|
|
|
|
|
|
|
|
margin-left: 20px;
|
|
|
|
|
|
|
|
&::before{
|
|
|
|
|
|
|
|
left:-7px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
</style>
|
|
|
|
|
张同海
2 years ago