|
|
|
|
@ -13,99 +13,16 @@
|
|
|
|
|
</div>
|
|
|
|
|
<x-card>
|
|
|
|
|
<div slot="content" class="table-page-search-wrapper">
|
|
|
|
|
<a-form layout="inline" :form="form">
|
|
|
|
|
<a-form layout="inline">
|
|
|
|
|
<a-row :gutter="48">
|
|
|
|
|
<template v-for="(fromLabel, findex) in fromLabelData">
|
|
|
|
|
<template v-for="(formLabel, findex) in formData">
|
|
|
|
|
<a-col :md="6" :sm="24" :key="findex" v-if="(findex<2 && !advanced) || advanced">
|
|
|
|
|
<a-form-item :label="fromLabel.title">
|
|
|
|
|
<fromLabel :labelData="fromLabel"></fromLabel>
|
|
|
|
|
<a-form-item :label="formLabel.title">
|
|
|
|
|
<formLabel :labelData="formLabel" @change="formChange"></formLabel>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</template>
|
|
|
|
|
<!-- <a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item label="提单号">
|
|
|
|
|
<a-input
|
|
|
|
|
placeholder="请输入提单号"
|
|
|
|
|
v-decorator="['MBLNO', { rules: [{ required: false, message: '请输入提单号' }] }]"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item label="ETD">
|
|
|
|
|
<a-range-picker
|
|
|
|
|
format="YYYY-MM-DD"
|
|
|
|
|
:placeholder="['开始时间', '结束时间']"
|
|
|
|
|
v-decorator="['ETD', { rules: [{ required: false }] }]"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :md="6" :sm="24" v-if="advanced">
|
|
|
|
|
<a-form-item label="航名">
|
|
|
|
|
<a-input
|
|
|
|
|
placeholder="请输入航名"
|
|
|
|
|
v-decorator="['VESSEL', { rules: [{ required: false, message: '请输入航名' }] }]"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
|
|
|
|
|
<template v-if="advanced">
|
|
|
|
|
<a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item label="航次">
|
|
|
|
|
<a-input
|
|
|
|
|
placeholder="请输入航次"
|
|
|
|
|
v-decorator="['VOYNO', { rules: [{ required: false, message: '请输入航次' }] }]"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item label="截单状态">
|
|
|
|
|
<a-select
|
|
|
|
|
style="width: 160px"
|
|
|
|
|
placeholder="请选择截单状态"
|
|
|
|
|
v-decorator="['CLOSEDOC', { rules: [{ required: false, message: '请选择截单状态!' }] }]"
|
|
|
|
|
>
|
|
|
|
|
<a-select-option value="1"> 全部 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 已截单 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 未截单 </a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item label="订舱状态">
|
|
|
|
|
<a-select
|
|
|
|
|
style="width: 160px"
|
|
|
|
|
placeholder="请选择订舱状态"
|
|
|
|
|
v-decorator="['FORWARDER', { rules: [{ required: false, message: '请选择订舱状态!' }] }]"
|
|
|
|
|
>
|
|
|
|
|
<a-select-option value="1"> 未订舱 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 已订舱无BC </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 有BC未放舱 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 已放舱 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 无下货纸 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 有下货纸 </a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item label="VGM状态">
|
|
|
|
|
<a-select
|
|
|
|
|
style="width: 160px"
|
|
|
|
|
placeholder="请选择VGM状态"
|
|
|
|
|
v-decorator="['isDebugOutput', { rules: [{ required: false, message: '请选择VGM状态!' }] }]"
|
|
|
|
|
>
|
|
|
|
|
<a-select-option value="1"> 未提交 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 提交成功 </a-select-option>
|
|
|
|
|
<a-select-option value="0"> 成功 </a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :md="6" :sm="24">
|
|
|
|
|
<a-form-item>
|
|
|
|
|
<a-checkbox v-decorator="['isDebugOutput']"> 包含退舱 </a-checkbox>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</template> -->
|
|
|
|
|
<a-col :md="(!advanced && 12) || fromBtnCol" :sm="24">
|
|
|
|
|
<a-col :md="(!advanced && 12) || formBtnCol" :sm="24">
|
|
|
|
|
<span
|
|
|
|
|
class="table-page-search-submitButtons"
|
|
|
|
|
:style="(advanced && { float: 'right', overflow: 'hidden' }) || {}"
|
|
|
|
|
@ -113,8 +30,7 @@
|
|
|
|
|
<a-button type="primary" @click="tableRefresh">查询</a-button>
|
|
|
|
|
<a-button style="margin-left: 8px" @click="tableReset">重置</a-button>
|
|
|
|
|
<a-button style="margin-left: 8px" @click="tableMoreRefresh">多提单号查询</a-button>
|
|
|
|
|
<span class="tab-btn" @click="fromSetting"
|
|
|
|
|
><a-icon type="setting" :style="{ fontSize: '16px' }" />
|
|
|
|
|
<span class="tab-btn" @click="formSetting"><a-icon type="setting" :style="{ fontSize: '16px' }" />
|
|
|
|
|
</span>
|
|
|
|
|
<a @click="toggleAdvanced">
|
|
|
|
|
{{ advanced ? '收起' : '展开' }}
|
|
|
|
|
@ -169,119 +85,48 @@
|
|
|
|
|
</div>
|
|
|
|
|
</a-modal>
|
|
|
|
|
|
|
|
|
|
<setFromModel ref="setFrom" :fromData="fromData" :fromAllData="fromAllData" @ok="submitFrom"></setFromModel>
|
|
|
|
|
<setFormModel ref="setForm" :formData="formData" :formAllData="formMoreData" @ok="submitForm" v-if="formMoreData"></setFormModel>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import { XCard, setFromModel } from '@/components'
|
|
|
|
|
import { XCard, setFormModel } from '@/components'
|
|
|
|
|
import { BookingOrderPage } from '@/api/modular/main/BookingLedger'
|
|
|
|
|
import columnSetting from '@/components/tableColumnSetting'
|
|
|
|
|
import fromLabel from './modules/fromLabel'
|
|
|
|
|
import formLabel from './modules/formLabel'
|
|
|
|
|
import initData from './modules/initData'
|
|
|
|
|
import condAllData from './modules/initCondData'
|
|
|
|
|
import {
|
|
|
|
|
DjyCustomerGet,
|
|
|
|
|
// DjyCustomerPage,
|
|
|
|
|
// DjyCustomerDelete,
|
|
|
|
|
// DjyUserConfigAdd
|
|
|
|
|
} from '@/api/modular/main/CustomerInformationManagement'
|
|
|
|
|
DjyUserConfigGet,
|
|
|
|
|
DjyUserConfigPage,
|
|
|
|
|
DjyUserConfigAdd
|
|
|
|
|
} from '@/api/modular/main/DjyUserConfig'
|
|
|
|
|
|
|
|
|
|
const fromLabelData = [
|
|
|
|
|
{ title: '主题单号', align: 'center', width: '90', label: 'mblno', type: 'input' },
|
|
|
|
|
{ title: '分提单号', align: 'center', width: '90', label: 'hblno', type: 'input' },
|
|
|
|
|
{ title: '订舱编号', align: 'center', width: '90', label: 'bookingno', type: 'input' },
|
|
|
|
|
{ title: '开船日期', align: 'center', width: '90', label: 'etd', type: 'date' },
|
|
|
|
|
{ title: '实际开船日期', align: 'center', width: '90', label: 'atd', type: 'date' },
|
|
|
|
|
{ title: '船名', align: 'center', width: '90', label: 'vessel', type: 'input' },
|
|
|
|
|
const formInitData = [
|
|
|
|
|
{ title: '主题单号', align: 'center', width: '90', label: 'MBLNO', type: 'input' },
|
|
|
|
|
{ title: '分提单号', align: 'center', width: '90', label: 'HBLNO', type: 'input' },
|
|
|
|
|
{ title: '订舱编号', align: 'center', width: '90', label: 'BOOKINGNO', type: 'input' },
|
|
|
|
|
{ title: '开船日期', align: 'center', width: '90', label: 'ETD', type: 'date' },
|
|
|
|
|
{ title: '实际开船日期', align: 'center', width: '90', label: 'ATD', type: 'date' },
|
|
|
|
|
{ title: '船名', align: 'center', width: '90', label: 'VESSEL', type: 'input' }
|
|
|
|
|
]
|
|
|
|
|
export default {
|
|
|
|
|
name: 'BookingLedger',
|
|
|
|
|
components: {
|
|
|
|
|
XCard,
|
|
|
|
|
columnSetting,
|
|
|
|
|
setFromModel,
|
|
|
|
|
fromLabel,
|
|
|
|
|
setFormModel,
|
|
|
|
|
formLabel
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
// ===== 临时数据分割线 strat ======
|
|
|
|
|
fromData: [
|
|
|
|
|
{
|
|
|
|
|
title: '分提单号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '订舱编号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '合约号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '客户合同号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '发货人代码',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '收货人代码',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
fromAllData: [
|
|
|
|
|
{
|
|
|
|
|
title: '业务编号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务状态',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务状态名称',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务日期',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '主提单号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务编号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务状态',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务状态名称',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '业务日期',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '主提单号',
|
|
|
|
|
type: 'label',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
// ===== 临时数据分割线 end ======
|
|
|
|
|
tstyle: { 'padding-bottom': '0px', 'margin-bottom': '10px' },
|
|
|
|
|
// 高级搜索 展开/关闭
|
|
|
|
|
advanced: false,
|
|
|
|
|
// 查询参数
|
|
|
|
|
fromLabelData: fromLabelData,
|
|
|
|
|
form: this.$form.createForm(this),
|
|
|
|
|
fromBtnCol: 12,
|
|
|
|
|
// fromData: [],
|
|
|
|
|
formData: formInitData,
|
|
|
|
|
formRes: {},
|
|
|
|
|
formAllData: null,
|
|
|
|
|
formMoreData: null,
|
|
|
|
|
formBtnCol: 12,
|
|
|
|
|
// 表格
|
|
|
|
|
setVisible: false,
|
|
|
|
|
showColumns: null,
|
|
|
|
|
@ -317,20 +162,18 @@ export default {
|
|
|
|
|
radioStyle: {
|
|
|
|
|
display: 'block',
|
|
|
|
|
height: '30px',
|
|
|
|
|
lineHeight: '30px',
|
|
|
|
|
lineHeight: '30px'
|
|
|
|
|
},
|
|
|
|
|
// 多单号弹窗
|
|
|
|
|
moreNumVisible: false,
|
|
|
|
|
moreNumVal: '',
|
|
|
|
|
moreNumVal: ''
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.showColumns = JSON.parse(JSON.stringify(initData.columns))
|
|
|
|
|
this.formAllData = JSON.parse(JSON.stringify(initData.condAllData))
|
|
|
|
|
this.getList()
|
|
|
|
|
this.getFromData()
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
console.log(condAllData, initData)
|
|
|
|
|
this.getFormData()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
init(queryParam = {}) {
|
|
|
|
|
@ -342,68 +185,56 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
this.gridOptions.data = []
|
|
|
|
|
this.getList(queryParam)
|
|
|
|
|
this.getFormData()
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
getFromData() {
|
|
|
|
|
DjyCustomerGet({ type: 'booking_list_cond' }).then((res) => {
|
|
|
|
|
getFormData() {
|
|
|
|
|
DjyUserConfigGet({ type: 'booking_list_cond' }).then((res) => {
|
|
|
|
|
if (res.data && JSON.parse(res.data.configJson).length) {
|
|
|
|
|
const arr = JSON.parse(res.data.configJson)
|
|
|
|
|
const nowData = []
|
|
|
|
|
const moreData = []
|
|
|
|
|
this.formAllData.map((item, index) => {
|
|
|
|
|
if (arr.includes(item.label)) {
|
|
|
|
|
nowData.push(item)
|
|
|
|
|
} else {
|
|
|
|
|
moreData.push(item)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
this.formData = nowData
|
|
|
|
|
this.formMoreData = moreData
|
|
|
|
|
} else {
|
|
|
|
|
const nowData = this.formData.map((item, index) => {
|
|
|
|
|
return item.label
|
|
|
|
|
})
|
|
|
|
|
const moreData = []
|
|
|
|
|
this.formAllData.map((item, index) => {
|
|
|
|
|
if (!nowData.includes(item.label)) {
|
|
|
|
|
moreData.push(item)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
this.formMoreData = moreData
|
|
|
|
|
}
|
|
|
|
|
this.formData.map((item, index) => {
|
|
|
|
|
this.$set(this.formRes, item.label, '')
|
|
|
|
|
})
|
|
|
|
|
console.log('=== 当前数据 ===', this.formRes, this.formData, this.formMoreData)
|
|
|
|
|
this.formBtnCol = 24 - (this.formData.length % 4 * 6)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
handlePageChange({ currentPage, pageSize }) {
|
|
|
|
|
console.log(currentPage, pageSize)
|
|
|
|
|
this.gridOptions.pagerConfig.currentPage = currentPage
|
|
|
|
|
this.gridOptions.pagerConfig.pageSize = pageSize
|
|
|
|
|
this.getList()
|
|
|
|
|
this.getList(this.formRes)
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// from
|
|
|
|
|
// form
|
|
|
|
|
toggleAdvanced() {
|
|
|
|
|
this.advanced = !this.advanced
|
|
|
|
|
},
|
|
|
|
|
tableRefresh() {
|
|
|
|
|
const {
|
|
|
|
|
form: { validateFields },
|
|
|
|
|
} = this
|
|
|
|
|
validateFields((err, values) => {
|
|
|
|
|
if (!err) {
|
|
|
|
|
if (values.genDate) {
|
|
|
|
|
const time = values.genDate.map((item, index) => {
|
|
|
|
|
const str = this.dateFtt('YYYY-MM-DD', item._d)
|
|
|
|
|
return str
|
|
|
|
|
})
|
|
|
|
|
console.log(time)
|
|
|
|
|
values.genDate = time
|
|
|
|
|
}
|
|
|
|
|
if (values.upDate) {
|
|
|
|
|
const _time = values.upDate.map((item, index) => {
|
|
|
|
|
const str = this.dateFtt('YYYY-MM-DD', item._d)
|
|
|
|
|
return str
|
|
|
|
|
})
|
|
|
|
|
console.log(_time)
|
|
|
|
|
values.upDate = _time
|
|
|
|
|
}
|
|
|
|
|
if (values.entryDate) {
|
|
|
|
|
const _time = values.entryDate.map((item, index) => {
|
|
|
|
|
const str = this.dateFtt('YYYY-MM-DD', item._d)
|
|
|
|
|
return str
|
|
|
|
|
})
|
|
|
|
|
console.log(_time)
|
|
|
|
|
values.entryDate = _time
|
|
|
|
|
}
|
|
|
|
|
if (values.publishDate) {
|
|
|
|
|
const _time = values.publishDate.map((item, index) => {
|
|
|
|
|
const str = this.dateFtt('YYYY-MM-DD', item._d)
|
|
|
|
|
return str
|
|
|
|
|
})
|
|
|
|
|
console.log(_time)
|
|
|
|
|
values.publishDate = _time
|
|
|
|
|
}
|
|
|
|
|
console.log('== 获取到的values == ', values)
|
|
|
|
|
this.init(values)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
this.init(this.formRes)
|
|
|
|
|
},
|
|
|
|
|
tableMoreRefresh() {
|
|
|
|
|
const {
|
|
|
|
|
@ -446,11 +277,34 @@ export default {
|
|
|
|
|
this.init()
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
submitFrom(data) {
|
|
|
|
|
this.fromData = data
|
|
|
|
|
console.log('获取到已编辑号的fromData', data)
|
|
|
|
|
this.$message.success('保存成功')
|
|
|
|
|
this.$refs.setFrom.handleCancel()
|
|
|
|
|
submitForm(data) {
|
|
|
|
|
this.formData = data
|
|
|
|
|
const arr = data.map((item, index) => {
|
|
|
|
|
return item.label
|
|
|
|
|
})
|
|
|
|
|
DjyUserConfigAdd({
|
|
|
|
|
type: 'booking_list_cond',
|
|
|
|
|
configJson: JSON.stringify(arr)
|
|
|
|
|
}).then(res => {
|
|
|
|
|
console.log(res)
|
|
|
|
|
this.$message.success('保存成功')
|
|
|
|
|
this.$refs.setForm.handleCancel()
|
|
|
|
|
this.init()
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
formChange (data) {
|
|
|
|
|
const { form, value } = data
|
|
|
|
|
if (form.type === 'input') {
|
|
|
|
|
this.formRes[form.label] = value
|
|
|
|
|
} else if (form.type === 'date') {
|
|
|
|
|
this.formRes[form.label] = value
|
|
|
|
|
} else if (form.type === 'dateRange') {
|
|
|
|
|
// 根据逻辑填写内容
|
|
|
|
|
} else if (form.type === 'select') {
|
|
|
|
|
// 根据逻辑填写内容
|
|
|
|
|
}
|
|
|
|
|
console.log(this.formRes)
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// table
|
|
|
|
|
@ -473,22 +327,13 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
getList(queryParam = {}) {
|
|
|
|
|
const { currentPage, pageSize } = this.gridOptions.pagerConfig
|
|
|
|
|
BookingOrderPage({
|
|
|
|
|
const query = {
|
|
|
|
|
...queryParam,
|
|
|
|
|
...{
|
|
|
|
|
PageNo: currentPage,
|
|
|
|
|
PageSize: pageSize,
|
|
|
|
|
sort: '',
|
|
|
|
|
order: '', // asc - desc
|
|
|
|
|
MBLNO: '',
|
|
|
|
|
ETD_START: '',
|
|
|
|
|
ETD_END: '',
|
|
|
|
|
PORTDISCHARGE: '',
|
|
|
|
|
VESSEL: '',
|
|
|
|
|
VOYNO: '',
|
|
|
|
|
SISTATUS: '',
|
|
|
|
|
BusinessStatus: '',
|
|
|
|
|
VgmStatus: '',
|
|
|
|
|
UnBook: false,
|
|
|
|
|
})
|
|
|
|
|
PageSize: pageSize
|
|
|
|
|
} }
|
|
|
|
|
BookingOrderPage(query)
|
|
|
|
|
.then((res) => {
|
|
|
|
|
const _data = res.data.rows.map((item, index) => {
|
|
|
|
|
item.id = (currentPage - 1) * pageSize + index
|
|
|
|
|
@ -520,8 +365,8 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 表单编辑
|
|
|
|
|
fromSetting() {
|
|
|
|
|
this.$refs.setFrom.open()
|
|
|
|
|
formSetting() {
|
|
|
|
|
this.$refs.setForm.open()
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 多表单
|
|
|
|
|
|
