台账表单,表头自定义 / 仓库 / 航线操作 / 改样式等

dev
lilu 2 years ago
parent 89bf6d5f12
commit e0e9604406

@ -156,7 +156,7 @@ export default {
inSecLoad: false,
mainOrderActiveKey: '1',
basicRules: {
customername: [ { required: false, message: '请选择客户名', trigger: 'change' } ],
customername: [ { required: false, message: '请选择委托单位', trigger: 'change' } ],
mblno: [{ required: false, message: '请输入提单号', trigger: 'change' }],
carrierid: [{ required: false, message: '请选择船公司', trigger: 'change' }],
forwarder: [{ required: false, message: '请输入订舱代理', trigger: 'change' }],
@ -172,7 +172,7 @@ export default {
atd: [{ required: false, message: '请选择实际开船日期', trigger: 'change' }],
lanename: [{ required: false, message: '请输入航线', trigger: 'change' }],
shipagency: [{ required: false, message: '请输入船代', trigger: 'change' }],
sale: [{ required: false, message: '请选择销售人员', trigger: 'change' }],
sale: [{ required: false, message: '请选择揽货人员', trigger: 'change' }],
op: [{ required: false, message: '请选择操作人员', trigger: 'change' }],
doc: [{ required: false, message: '请选择单证人员', trigger: 'change' }],
custservice: [{ required: false, message: '请选择客服人员', trigger: 'change' }]

@ -366,7 +366,7 @@ export default {
checkFrom: [],
mainOrderActiveKey: '1-1',
basicRules: {
customername: [{ required: false, message: '请选择客户名', trigger: 'change' }],
customername: [{ required: false, message: '请选择委托单位', trigger: 'change' }],
mblno: [{ required: false, message: '请输入提单号', trigger: 'change' }],
carrierid: [{ required: false, message: '请选择船公司', trigger: 'change' }],
forwarder: [{ required: false, message: '请输入订舱代理', trigger: 'change' }],
@ -382,7 +382,7 @@ export default {
atd: [{ required: false, message: '请选择实际开船日期', trigger: 'change' }],
lanename: [{ required: false, message: '请输入航线', trigger: 'change' }],
shipagency: [{ required: false, message: '请输入船代', trigger: 'change' }],
sale: [{ required: false, message: '请选择销售人员', trigger: 'change' }],
sale: [{ required: false, message: '请选择揽货人员', trigger: 'change' }],
op: [{ required: false, message: '请选择操作人员', trigger: 'change' }],
doc: [{ required: false, message: '请选择单证人员', trigger: 'change' }],
custservice: [{ required: false, message: '请选择客服人员', trigger: 'change' }]

@ -8,13 +8,12 @@
<a-form-model-item
class="from-label"
prop="customername"
label="客户"
help="提示信息: 此处显示客户内容列表,客户设置,请点击基础信息设置-客户设置"
label="委托单位"
:labelCol="labelCol2"
:wrapperCol="wrapperCol2"
has-feedback>
<div class="customer-box" style="padding-right:24px;">
<auto-complete
<!-- <auto-complete
size="small"
:allowClear="true"
class="customer-input"
@ -26,7 +25,19 @@
@focus="customerChange"
@change="debounce(customerChange, 300, $event)"
>
</auto-complete>
</auto-complete> -->
<a-select
size="small"
v-model="details.customername"
@change="debounce(customerSelect, 300, $event)"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
>
<a-select-option v-for="(customer, cindex) in customerData" :key="cindex" :value="cindex + ''">
{{ customer.shortName }}
</a-select-option>
</a-select>
<span
class="customer-btn iconfont icon-touxiang"
@click="changeCustomer('select')"
@ -402,13 +413,13 @@
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
<a-form-model-item
class="from-label"
label="销售"
label="揽货人"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="sale"
>
<auto-complete
<!-- <auto-complete
size="small"
:allowClear="true"
class="customer-input"
@ -419,10 +430,22 @@
@select="saleSelect"
@change="debounce(saleChange, 300, $event)"
@focus="saleChange"
/>
/> -->
<a-select
size="small"
v-model="details.sale"
@change="debounce(saleSelect, 300, $event)"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
>
<a-select-option v-for="(saleUser, cindex) in saleUserList" :key="cindex" :value="cindex + ''">
{{ saleUser.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="5">
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="4">
<a-form-model-item
class="from-label"
label="操作"
@ -431,7 +454,7 @@
has-feedback
prop="op"
>
<auto-complete
<!-- <auto-complete
size="small"
:allowClear="true"
class="customer-input"
@ -442,10 +465,22 @@
@select="opSelect"
@change="debounce(opChange, 300, $event)"
@focus="opChange"
/>
/> -->
<a-select
size="small"
v-model="details.sale"
@change="debounce(opSelect, 300, $event)"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
>
<a-select-option v-for="(opUser, opindex) in opUserList" :key="opindex" :value="opindex + ''">
{{ opUser.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="4">
<a-form-model-item
class="from-label"
label="单证"
@ -454,7 +489,7 @@
has-feedback
prop="doc"
>
<auto-complete
<!-- <auto-complete
size="small"
:allowClear="true"
class="customer-input"
@ -465,10 +500,23 @@
@select="docSelect"
@change="debounce(docChange, 300, $event)"
@focus="docChange"
/>
/> -->
<a-select
size="small"
v-model="details.doc"
@change="debounce(docSelect, 300, $event)"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
>
<a-select-option v-for="(docUser, docindex) in docUserList" :key="docindex" :value="docindex + ''">
{{ docUser.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="7">
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="4">
<a-form-model-item
class="from-label"
label="客服"
@ -477,7 +525,7 @@
has-feedback
prop="custservice"
>
<auto-complete
<!-- <auto-complete
size="small"
:allowClear="true"
class="customer-input"
@ -488,7 +536,42 @@
@select="custserviceSelect"
@focus="custserviceChange"
@change="debounce(custserviceChange, 300, $event)"
/>
/> -->
<a-select
size="small"
v-model="details.custservice"
@change="debounce(custserviceSelect, 300, $event)"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
>
<a-select-option v-for="(custserviceUser, custserviceindex) in custserviceUserList" :key="custserviceindex" :value="custserviceindex + ''">
{{ custserviceUser.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
<a-form-model-item
class="from-label"
label="航线操作"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="route"
>
<a-select
size="small"
v-model="details.route"
@change="debounce(routeSelect, 300, $event)"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
>
<a-select-option v-for="(routeUser, routeindex) in routeUserList" :key="routeindex" :value="routeindex + ''">
{{ routeUser.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
</a-row>
@ -497,7 +580,7 @@
</x-card>
<a-modal
:title="customerType === 'add' ? '添加客户' : '关系人'"
:title="customerType === 'add' ? '添加委托单位' : '关系人'"
:width="1200"
:visible="customerVisible"
:confirmLoading="customerModelconfirm"
@ -621,7 +704,7 @@ export default {
},
form: this.$form.createForm(this),
dataSource: ['Burns Bay Road', 'Downing Street', 'Wall Street'],
customerData: [], //
customerData: [], //
carrierData: [], //
carrierSelectData: [], //
vesselData: [], //
@ -630,10 +713,11 @@ export default {
saleUserList: [], //
opUserList: [], //
docUserList: [], //
routeUserList: [], // 线
custserviceUserList: [], //
forwarderData: [],
shipagencyData: [],
// / - start
// / - start
customerType: '',
customerVisible: false,
customerModelconfirm: false,
@ -773,7 +857,7 @@ export default {
etdWeek: '',
selectArr: [],
customerContacts: [],
// / - end
// / - end
customerContactsData: [],
ContactType: [],
customerContactsDataList: [],
@ -1051,10 +1135,12 @@ export default {
// this.getVoynoinner()
// // this.getVoynoinner()
// // this.getLanename()
this.getUserList('sale')
this.getUserList('op')
this.getUserList('doc')
this.getUserList('custservice')
this.getUserList('', 'sale')
this.getUserList('', 'op')
this.getUserList('', 'doc')
this.getUserList('', 'custservice')
this.getUserList('', 'route')
this.getDjyCustomerpage('', 'customer', 'consignor')
if (this.details.etd) {
this.etdWeek = this.getWeek(this.details.etd)
} else {
@ -1062,7 +1148,7 @@ export default {
}
this.ContactType = this.$options.filters['dictData']('booking_contact_type')
},
// - start
// - start
getDjyCustomerpage(name = '', type, key) {
const _type = type === 'customer' ? 'consignor' : 'booking_agent'
DjyCustomerSuggest({
@ -1082,9 +1168,32 @@ export default {
console.log(err)
})
},
customerSelect(value) {
customerSelect(val) {
const index = Number(val)
const data = this.customerData[index]
this.details.customername = data.shortName
this.details.customerid = data.id
if (data.op) {
this.details.op = data.op
this.details.opid = data.opid
}
if (data.sale) {
this.details.sale = data.sale
this.details.saleid = data.saleid
}
if (data.doc) {
this.details.doc = data.doc
this.details.docid = data.docid
}
if (data.custservice) {
this.details.custservice = data.custservice
this.details.custserviceid = data.custserviceid
}
},
//
customerSelect1(value) {
this.customerData.forEach(item => {
if (item.shortName == value) {
if (item.shortName === value) {
this.details.op = item.op
this.details.opid = item.opid
this.details.sale = item.sale
@ -1106,7 +1215,7 @@ export default {
}
this.getDjyCustomerpage(value, 'customer', 'consignor')
},
// - end
// - end
// - start
forwarderSelect(value) {
@ -1277,6 +1386,8 @@ export default {
this.docUserList = res.data
} else if (type === 'custservice') {
this.custserviceUserList = res.data
} else if (type === 'route') {
this.routeUserList = res.data
}
}
})
@ -1285,15 +1396,22 @@ export default {
})
},
//
saleSelect(value) {
console.log('销售选中', value)
//
saleSelect(val) {
const index = Number(val)
this.details.sale = this.saleUserList[index].name
this.details.saleid = this.saleUserList[index].id
console.log('揽货人选中', this.details.sale)
},
//
saleSelect1(value) {
console.log('揽货人选中', value)
this.details.sale = value
const index = this.saleUserListArr.indexOf(value)
this.details.saleid = this.saleUserList[index].id
},
saleChange(value) {
console.log('销售搜索内容: ', value)
console.log('揽货人搜索内容: ', value)
if (!value) {
this.details.sale = this.details.sale ? this.details.sale : ''
}
@ -1301,7 +1419,14 @@ export default {
},
//
opSelect(value) {
opSelect(val) {
const index = Number(val)
this.details.op = this.opUserList[index].name
this.details.opid = this.opUserList[index].id
console.log('修改操作人员', this.details.op)
},
//
opSelect1(value) {
this.details.op = value
const index = this.opUserListArr.indexOf(value)
this.details.opid = this.opUserList[index].id
@ -1315,7 +1440,14 @@ export default {
},
//
docSelect(value) {
docSelect(val) {
const index = Number(val)
this.details.doc = this.docUserList[index].name
this.details.docid = this.docUserList[index].id
console.log('修改单证人员', this.details.doc)
},
//
docSelect1(value) {
this.details.doc = value
const index = this.docUserListArr.indexOf(value)
this.details.docid = this.docUserList[index].id
@ -1329,7 +1461,14 @@ export default {
},
//
custserviceSelect(value) {
custserviceSelect(val) {
const index = Number(val)
this.details.custservice = this.custserviceUserList[index].name
this.details.custserviceid = this.custserviceUserList[index].id
console.log('修改客服人员', this.details.custservice)
},
//
custserviceSelect1(value) {
this.details.custservice = value
const index = this.custserviceUserListArr.indexOf(value)
this.details.custserviceid = this.custserviceUserList[index].id
@ -1342,6 +1481,14 @@ export default {
this.getUserList(value, 'custservice')
},
// 线
routeSelect(val) {
const index = Number(val)
this.details.route = this.routeUserList[index].name
this.details.routeid = this.routeUserList[index].id
console.log('修改客服人员', this.details.route)
},
// - end
// - start
@ -1385,7 +1532,7 @@ export default {
}
)
} else {
this.$message.warning('请先选择客户')
this.$message.warning('请先选择委托单位')
}
}
},

@ -196,7 +196,7 @@
<a-col :span="12">
<a-form-model-item
class="from-label"
label="自结"
label="场站费自结"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
@ -283,13 +283,28 @@
</a-form-model-item>
</a-col>
<a-col :span="12">
<!-- 这里显示仓库后台字段未添加暂时隐藏 -->
<a-form-model-item
class="from-label"
label=" "
style="opacity:0;"
label="仓库"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
></a-form-model-item>
has-feedback
prop="warehouse"
>
<auto-complete
size="small"
:allowClear="true"
v-model="details.warehouse"
class="customer-input"
:data-source="warehouseDataArr"
:dropdown-match-select-width="false"
:dropdown-style="{ width: '200px' }"
@select="warehouseSelect"
@focus="warehouseChange"
@change="debounce(warehouseChange, 300, $event)"
/>
</a-form-model-item>
</a-col>
</div>
@ -862,6 +877,7 @@ export default {
customserData: [], //
truckerData: [], //
agentidData: [], //
warehouseData: [], //
shippername: '',
consigneename: '',
notifypartyname: '',
@ -1104,6 +1120,19 @@ export default {
} else {
return []
}
},
warehouseDataArr() {
if (this.warehouseData) {
const arr = []
this.warehouseData.map((item, index) => {
if (!arr.includes(item.shortName)) {
arr.push(item.shortName)
}
})
return arr
} else {
return []
}
}
},
created() {
@ -1464,6 +1493,19 @@ export default {
},
// - end
// - start
warehouseSelect(value) {
this.details.warehouse = value
this.details.warehouseID = this.warehouseData[this.warehouseDataArr.indexOf(value)].id
},
warehouseChange(value) {
if (!value) {
this.details.warehouse = this.details.warehouse ? this.details.warehouse : ''
}
this.getDjyCustomerpage(value, 'warehouse', 'warehouse')
},
// - end
//
saveModel(type) {
this.modelVisible = true

@ -34,6 +34,7 @@
:resetType="ResetType"
@change="formChange"
@pressEnter="pressEnterFun"
@getCompleteList="getCompleteListFun"
></formLabel>
</a-form-item>
</a-col>
@ -125,12 +126,27 @@
<template #vessel="{ row }">
<div class="vessel">{{ row.vessel }}</div>
</template>
<template #remarks="{ row }">
<a-popover title="备注消息">
<template slot="content">
<p>订舱备注 {{ row.soremark }}</p>
<p>截单备注 {{ row.siremark }}</p>
</template>
<div class="remarks">{{ row.soremark }} / {{ row.siremark }}</div>
</a-popover>
</template>
<template #etd="{ row }">
<div class="etd" v-if="row.etd">{{ row.etd.substring(0, 10) }}</div>
</template>
<template #atd="{ row }">
<div class="atd" v-if="row.atd">{{ row.atd.substring(0, 10) }}</div>
</template>
<template #issuedate="{ row }">
<div class="atd" v-if="row.issuedate">{{ row.issuedate.substring(0, 10) }}</div>
</template>
<template #closingdate="{ row }">
<div class="closingdate" v-if="row.closingdate">{{ row.closingdate.substring(0, 13) }}</div>
</template>
<template #operate="{ row }">
<vxe-button class="operate-btn" type="text" icon="vxe-icon-edit" @click="editColumns(row)"></vxe-button>
</template>
@ -159,6 +175,13 @@
</span>
</div>
</template>
<template #empty>
<span class="no-data">
<i class="iconfont icon-queshengye_zanwushuju"></i>
<p>没有更多数据了</p>
</span>
</template>
</vxe-grid>
</div>
</x-card>
@ -458,7 +481,12 @@ import {
GetVessellist,
GetPortlist,
BookingOrderBachUpdate,
GetCarrierlist
GetCarrierlist,
DjyCustomerSuggest,
getVesselInfoService,
GetYardlist,
GetSysUserPage,
DjyCustomerpage
} from '@/api/modular/main/BookingLedger'
import columnSetting from '@/components/tableColumnSetting'
import formLabel from './modules/formLabel'
@ -727,9 +755,11 @@ export default {
}
this.formData.map((item, index) => {
this.$set(this.formRes, item.label, this.formRes[item.label] || '')
// select
if (item.label === 'CARRIER') {
this.getFromSelectData(GetCarrierlist).then((data) => {
// select
const fun = this.emnuSelectApi(item.label)
// debugger
if (fun) {
this.getFromSelectData(fun).then((data) => {
item.dataList = data
this.$refs[`fromlabel-${item.label}`][0].$data.dataList = data
})
@ -747,11 +777,21 @@ export default {
this.$forceUpdate()
})
},
emnuSelectApi (type) {
switch (type) {
case 'CARRIER':
return GetCarrierlist
case 'YARDID':
return GetYardlist
}
},
//
getFromSelectData(func, ...args) {
// debugger
return new Promise((resolve, reject) => {
func(args).then((res) => {
console.log('== 船公司 ==', res)
// debugger
func(...args).then((res) => {
// debugger
if (res.code === 200) {
resolve(res.data);
} else {
@ -759,26 +799,6 @@ export default {
}
})
});
// GetCarrierlist({
// KeyWord: name
// })
// .then(res => {
// if (res.code === 200) {
// this.carrierData = res.data
// const arr = []
// res.data.map((item, index) => {
// arr.push({
// ...{ selectShowTab: item.cnName + ' / ' + item.code },
// ...item
// })
// })
// this.carrierSelectData = arr
// this.$forceUpdate()
// }
// })
// .catch(err => {
// console.log(err)
// })
},
//
getTableList() {
@ -941,14 +961,11 @@ export default {
} else if (form.type === 'date') {
this.formRes[form.label] = value
} else if (form.type === 'dateRange') {
// , etd
// this.formRes[form.label] = value
if (form.label === 'ETD') {
this.formRes.BETD = value[0]
this.formRes.EETD = value[1]
}
this.formRes[form.resLabel[0]] = value[0]
this.formRes[form.resLabel[1]] = value[1]
} else if (form.type === 'select') {
//
this.formRes[form.label] = value
} else if (form.type === 'complete') {
this.formRes[form.label] = value
}
this.$forceUpdate()
@ -1263,8 +1280,78 @@ export default {
.catch(err => {
console.log(err)
})
},
//
getCompleteListFun ({ form, value }) {
let query = {}
if (['VESSEL', 'PORTDISCHARGE', 'PORTLOAD'].includes(form.label)) {
//
query = {
KeyWord: value
}
} else if (form.label === 'CUSTOMERNAME') {
// /
query = {
KeyWord: value,
type: 'consignor'
}
} else if (form.label === 'FORWARDER') {
//
query = {
KeyWord: value,
type: 'booking_agent'
}
} else if (['SALE', 'CUSTSERVICE', 'DOC'].includes(form.label)) {
//
query = {
name: value
}
} else if (form.label === 'CUSTOMSER') {
//
query = {
SearchValue: value,
PropString: 'customs_broker'
}
}
const fun = this.emnuCompleteApi(form.label)
if (fun) {
this.getFromSelectData(this.emnuCompleteApi(form.label), query).then((data) => {
console.log(data)
if (['CUSTOMERNAME', 'FORWARDER', 'CUSTOMSER'].includes(form.label)) {
this.$refs[`fromlabel-${form.label}`][0].$data.dataSourceList = data.rows
} else {
this.$refs[`fromlabel-${form.label}`][0].$data.dataSourceList = data
}
})
}
},
emnuCompleteApi (type) {
switch (type) {
case 'VESSEL':
return GetVessellist
case 'CUSTOMERNAME':
return DjyCustomerSuggest
case 'FORWARDER':
return DjyCustomerSuggest
case 'PORTDISCHARGE':
return GetPortlist
case 'PORTLOAD':
return GetPortlist
case 'SALE':
return GetSysUserPage
case 'CUSTSERVICE':
return GetSysUserPage
case 'OP':
return GetSysUserPage
case 'DOC':
return GetSysUserPage
case 'CUSTOMSER':
return DjyCustomerpage
}
}
}
}
</script>
<style lang="less" scoped>
@ -1841,4 +1928,17 @@ export default {
}
}
/deep/ .ant-form-item-control-wrapper{
overflow: hidden !important;
}
.no-data{
display: block;
color: #aaa;
font-size: 14px;
i{
line-height: 120px;
font-size: 100px;
}
}
</style>

@ -1,48 +1,72 @@
<template>
<div class="from-label">
<template v-if="labelData.type == 'input'">
<a-input v-model="value" @change="changeInput" @pressEnter="$emit('pressEnter')"/>
<a-input style="height:23px;margin-top:8px;" v-model="value" @change="changeInput" @pressEnter="$emit('pressEnter')"/>
</template>
<template v-else-if="labelData.type == 'date'">
<a-date-picker format="YYYY-MM-DD" @change="changeDate" v-model="value"/>
</template>
<template v-else-if="labelData.type == 'dateRange'">
<a-range-picker format="YYYY-MM-DD" @change="changeRangeDate" v-model="dateVal"/>
<a-range-picker style="overflow: hidden;margin-top:3px;" format="YYYY-MM-DD" @change="changeRangeDate" v-model="dateVal"/>
</template>
<template v-else-if="labelData.type == 'select'">
<a-select
style="width: 160px"
size="small"
style="margin-top:7px;"
v-model="value"
show-search
:dropdownMatchSelectWidth="false"
:filter-option="filterOption"
@change="debounce(handleSelectChange, 300, $event)"
>
<template v-if="['CARRIER', 'YARDID'].includes(labelData.label)">
<a-select-option v-for="(sitem,sindex) in dataList" :key="sindex">
{{ sitem[labelData.showLabel2] }}/ {{ sitem[labelData.showLabel] }}
</a-select-option>
</template>
<template v-else>
<a-select-option v-for="(sitem,sindex) in dataList" :key="sindex">{{ sitem[labelData.showLabel] }}</a-select-option>
</template>
</a-select>
</template>
<!-- <template v-else-if="abelData.type == 'complete'">
<template v-else-if="labelData.type == 'complete'">
<auto-complete
size="small"
:allowClear="true"
class="customer-input"
:dropdown-match-select-width="false"
:dropdown-style="{ width: '200px' }"
v-model="value"
:data-source="dataSourceList"
option-label-prop="value"
@select="completeSelect"
@focus="completeChange"
@focus="completeChangeFirst"
@change="debounce(completeChange, 300, $event)"
>
<!-- <template slot="dataSource" v-if="labelData.label === 'VESSEL'">
<a-select-option v-for="(item, index) in dataSourceList" :key="index" :value="item[labelData.showLabel]">
<div class="vessel-label">
<div class="title"> 船名{{ item[labelData.showLabel] }} </div>
<div class="msg"> 航次{{ item[labelData.showLabel2] || '--' }} </div>
</div>
</a-select-option>
</template>-->
<template slot="dataSource">
<a-select-option v-for="(item, index) in dataSourceList" :key="index" :value="item[labelData.showLabel]">
<div>
<div class="title"> {{ item[labelData.showLabel] }} </div>
</div>
</a-select-option>
</template>
</auto-complete>
</template> -->
</template>
</div>
</template>
<script>
// import { AutoComplete } from 'ant-design-vue'
import { AutoComplete } from 'ant-design-vue'
let timer;
export default {
components: {
// AutoComplete
AutoComplete
},
props: {
labelData: {
@ -83,7 +107,8 @@ export default {
//
dateVal: [],
// select
dataList: this.labelData.dataList || []
dataList: this.labelData.dataList || [],
dataSourceList: []
}
},
mounted() { },
@ -127,11 +152,26 @@ export default {
},
// == ==
completeSelect () {
completeSelect (value) {
this.$emit('change', {
form: this.labelData,
value: value || ''
})
},
completeChange (value) {
console.log(value, this.value)
this.$emit('getCompleteList', {
form: this.labelData,
value: value || ''
})
},
completeChange () {
completeChangeFirst (value) {
if (this.value) { return false }
this.$emit('getCompleteList', {
form: this.labelData,
value: value || ''
})
}
}
}
</script>
@ -139,4 +179,36 @@ export default {
.aa{
transform: scaleY(.8);
}
/deep/ .ant-select-selection__clear{
margin-top: 0;
}
.vessel-label{
// border-bottom:1px solid #eee;
.title{
height: 28px;
line-height: 28px;
font-size: 14px;
font-weight:600;
color: #666;
border-bottom:1px dashed #ddd;
margin-bottom: 4px;
}
.voyno, .etd {
height: 22px;
line-height: 22px;
font-size: 12px;
color: #999;
}
}
/deep/.ant-calendar-picker-input{
overflow: hidden;
}
/deep/.ant-calendar-range-picker-input{
height: 24px !important;
line-height: 24px !important;
}
/deep/ .ant-input{
height: 24px !important;
}
</style>

@ -1,27 +1,11 @@
export default {
// ==== 表格部分 ====
columns: [
{ type: 'checkbox', width: 60, noDraggable: true },
{ field: 'carrier', label: 'CARRIER', width: 120, title: '船公司', showHeaderOverflow: true, sortable: true },
{ field: 'carrier', width: 120, title: '船公司', showHeaderOverflow: true, sortable: true },
{ field: 'yard', label: 'YARD', width: 120, title: '场站', showHeaderOverflow: true, sortable: true },
{
field: 'mblno',
label: 'MBLNO',
width: 160,
title: '主提单号',
showHeaderOverflow: true,
showOverflow: false,
sortable: true,
slots: { default: 'mblno' }
},
{
field: 'vessel',
label: 'VESSEL',
width: 120,
title: '船名航次',
showHeaderOverflow: true,
sortable: true,
slots: { default: 'vessel' }
},
{ field: 'mblno', label: 'MBLNO', width: 160, title: '主提单号', showHeaderOverflow: true, showOverflow: false, sortable: true, slots: { default: 'mblno' } },
{ field: 'vessel', label: 'VESSEL', width: 120, title: '船名', showHeaderOverflow: true, sortable: true },
{ field: 'etd', label: 'ETD', width: 110, title: '开船日期', showHeaderOverflow: true, sortable: true, slots: { default: 'etd' } },
{ field: 'voyno', label: 'VOYNO', width: 120, title: '海关航次', showHeaderOverflow: true },
{ field: 'bookingStatus', label: 'BOOKINGSTATUS', width: 120, title: '订舱状态', showHeaderOverflow: true },
@ -29,74 +13,107 @@ export default {
{ field: 'billStatus', label: 'BILLSTATUS', width: 120, title: '提单状态', showHeaderOverflow: true },
{ field: 'portdischarge', label: 'PORTDISCHARGE', width: 120, title: '卸货港', showHeaderOverflow: true, sortable: true },
{ field: 'createdUserName', label: 'CREATEDUSERNAME', width: 120, title: '创建人', showHeaderOverflow: true, sortable: true },
{ field: 'createdTime', label: 'CREATEDTIME', width: 160, title: '创建时间', showHeaderOverflow: true, sortable: true },
{ field: 'cntrtotal', label: 'CNTRTOTAL', width: 120, title: '箱型箱量', showHeaderOverflow: true, sortable: true },
{ field: 'createdTime', label: 'CREATEDTIME', width: 160, title: '创建日期', showHeaderOverflow: true, sortable: true },
{ field: 'cntrtotal', label: 'CNTRTOTAL', width: 120, title: '箱型*箱量', showHeaderOverflow: true, sortable: true },
{ field: 'operate', title: '操作', width: 80, noDraggable: true, slots: { default: 'operate' }, fixed: 'right', resizable: false }
],
columnsAllData: [
{ field: 'carrier', width: 120, title: '船公司', showHeaderOverflow: true, sortable: true },
{ field: 'mblno', label: 'MBLNO', width: 160, title: '主提单号', showHeaderOverflow: true, showOverflow: false, sortable: true, slots: { default: 'mblno' } },
{ field: 'hblno', label: 'HBLNO', width: 120, title: '分提单号', showHeaderOverflow: true, sortable: true },
{ field: 'customername', label: 'CUSTOMERNAME', width: 120, title: '委托单位', showHeaderOverflow: true, sortable: true }, // 客户
{ field: 'consignee', label: 'CONSIGNEE', width: 120, title: '收货人', showHeaderOverflow: true, sortable: true },
{ field: 'notifyparty', label: 'NOTIFYPARTY', width: 120, title: '通知人', showHeaderOverflow: true, sortable: true },
{ field: 'yard', label: 'YARD', width: 120, title: '场站', showHeaderOverflow: true, sortable: true },
{
field: 'mblno',
label: 'MBLNO',
width: 160,
title: '主提单号',
showHeaderOverflow: true,
showOverflow: false,
sortable: true,
slots: { default: 'mblno' }
},
{
field: 'vessel',
label: 'VESSEL',
width: 120,
title: '船名航次',
showHeaderOverflow: true,
sortable: true,
slots: { default: 'vessel' }
},
{ field: 'vessel', label: 'VESSEL', width: 120, title: '船名', showHeaderOverflow: true, sortable: true },
{ field: 'voynoinner', label: 'VOYNOINNER', width: 120, title: '内部航次', showHeaderOverflow: true, sortable: true }, // 内部航次 / 海关航次 暂时放内部航次
{ field: 'etd', label: 'ETD', width: 110, title: '开船日期', showHeaderOverflow: true, sortable: true, slots: { default: 'etd' } },
{ field: 'voyno', label: 'VOYNO', width: 120, title: '海关航次', showHeaderOverflow: true },
{ field: 'bookremark', label: 'BOOKREMARK', width: 120, title: '备注', className: 'book-remark-box', showOverflow: false, slots: { default: 'bookremark' } },
{ field: 'bookingStatus', label: 'BOOKINGSTATUS', width: 120, title: '订舱状态', showHeaderOverflow: true },
{ field: 'vgm', label: 'VGM', width: 120, title: 'VGM', showHeaderOverflow: true },
{ field: 'billStatus', label: 'BILLSTATUS', width: 120, title: '提单状态', showHeaderOverflow: true },
{ field: 'portdischarge', label: 'PORTDISCHARGE', width: 120, title: '卸货港', showHeaderOverflow: true, sortable: true },
{ field: 'createdUserName', label: 'CREATEDUSERNAME', width: 120, title: '创建人', showHeaderOverflow: true, sortable: true },
{ field: 'createdTime', label: 'CREATEDTIME', width: 160, title: '创建时间', showHeaderOverflow: true, sortable: true },
{ field: 'cntrtotal', label: 'CNTRTOTAL', width: 120, title: '箱型箱量', showHeaderOverflow: true, sortable: true },
{ field: 'atd', label: 'ATD', width: 160, title: '实际开船日期', showHeaderOverflow: true, sortable: true, slots: { default: 'atd' } },
{ field: 'blfrt', label: 'BLFRT', width: 120, title: '付费方式', showHeaderOverflow: true, sortable: true },
{ field: 'cargoid', label: 'CARGOID', width: 120, title: '货物标识', showHeaderOverflow: true, sortable: true },
{ field: 'payableat', label: 'PAYABLEAT', width: 120, title: '到付地点', showHeaderOverflow: true, sortable: true },
{ field: 'pkgs', label: 'PKGS', width: 120, title: '件数', showHeaderOverflow: true, sortable: true },
{ field: 'kindpkgs', label: 'KINDPKGS', width: 120, title: '包装', showHeaderOverflow: true, sortable: true },
{ field: 'kgs', label: 'KGS', width: 120, title: '重量', showHeaderOverflow: true, sortable: true },
{ field: 'cbm', label: 'CBM', width: 90, title: '尺码', showHeaderOverflow: true, sortable: true },
{ field: 'consignee', label: 'CONSIGNEE', width: 120, title: '收货人', showHeaderOverflow: true, sortable: true },
{ field: 'contractno', label: 'CONTRACTNO', width: 120, title: '合约号', showHeaderOverflow: true, sortable: true },
{ field: 'customername', label: 'CUSTOMERNAME', width: 120, title: '客户', showHeaderOverflow: true, sortable: true },
{ field: 'cntrtotal', label: 'CNTRTOTAL', width: 120, title: '箱型*箱量', showHeaderOverflow: true, sortable: true },
{ field: 'custservice', label: 'CUSTSERVICE', width: 120, title: '客服员', showHeaderOverflow: true, sortable: true },
{ field: 'createdUserName', label: 'CREATEDUSERNAME', width: 120, title: '创建人', showHeaderOverflow: true, sortable: true },
{ field: 'createdTime', label: 'CREATEDTIME', width: 160, title: '创建日期', showHeaderOverflow: true, sortable: true },
{ field: 'op', label: 'OP', width: 120, title: '操作员', showHeaderOverflow: true, sortable: true },
{ field: 'doc', label: 'DOC', width: 120, title: '单证员', showHeaderOverflow: true, sortable: true },
{ field: 'carrier', width: 120, title: '船公司', showHeaderOverflow: true, sortable: true },
{ field: 'customser', label: 'CUSTOMSER', width: 120, title: '报关行', showHeaderOverflow: true, sortable: true },
{ field: 'custservice', label: 'CUSTSERVICE', width: 120, title: '客服', showHeaderOverflow: true, sortable: true },
{ field: 'doc', label: 'DOC', width: 120, title: '单证', showHeaderOverflow: true, sortable: true },
{ field: 'dunno', label: 'DUNNO', width: 120, title: '危险品编号', showHeaderOverflow: true, sortable: true },
{ field: 'forwarder', label: 'FORWARDER', width: 120, title: '订舱代理', showHeaderOverflow: true, sortable: true },
{ field: 'freightpayer', label: 'FREIGHTPAYER', width: 120, title: '付款方', showHeaderOverflow: true, sortable: true },
{ field: 'hblno', label: 'HBLNO', width: 120, title: '分提单号', showHeaderOverflow: true, sortable: true },
{ field: 'hscode', label: 'HSCODE', width: 120, title: 'HS编码', showHeaderOverflow: true, sortable: true },
{ field: 'issueplace', label: 'ISSUEPLACE', width: 120, title: '签单地点', showHeaderOverflow: true, sortable: true },
{ field: 'issuetype', label: 'ISSUETYPE', width: 120, title: '签单方式', showHeaderOverflow: true, sortable: true },
{ field: 'kgs', label: 'KGS', width: 120, title: '毛重', showHeaderOverflow: true, sortable: true },
{ field: 'kindpkgs', label: 'KINDPKGS', width: 120, title: '包装', showHeaderOverflow: true, sortable: true },
{ field: 'pkgs', label: 'PKGS', width: 120, title: '件数', showHeaderOverflow: true, sortable: true },
{ field: 'issueplace', label: 'ISSUEPLACE', width: 120, title: '签单地点', showHeaderOverflow: true, sortable: true },
{ field: 'placedelivery', label: 'PLACEDELIVERY', width: 120, title: '交货地点', showHeaderOverflow: true, sortable: true },
{ field: 'nobill', label: 'NOBILL', width: 120, title: '提单份数', showHeaderOverflow: true, sortable: true },
{ field: 'portdischarge', label: 'PORTDISCHARGE', width: 120, title: '卸货港', showHeaderOverflow: true, sortable: true },
{ field: 'bookremark', label: 'BOOKREMARK', width: 120, title: '合同号备注', className: 'book-remark-box', showOverflow: false, slots: { default: 'bookremark' } },
// { field: 'remarks', label: 'REMARKS', width: 120, title: '其他备注', showHeaderOverflow: true, showOverflow: false, sortable: true, slots: { default: 'remarks' } }, // 暂时写为so备注 + si备注 数据量太大,不要了
{ field: 'bookstatus', label: 'BOOKSTATUS', minWidth: 140, title: '运踪', showHeaderOverflow: true, slots: { default: 'bookstatus' } },
{ field: 'closingdate', label: 'CLOSINGDATE', width: 160, title: '截港日期', showHeaderOverflow: true, sortable: true, slots: { default: 'closingdate' } },
{ field: 'eta', label: 'ETA', width: 160, title: '预计到港日期', showHeaderOverflow: true, sortable: true },
{ field: 'portload', label: 'PORTLOAD', width: 160, title: '装货港', showHeaderOverflow: true, sortable: true },
{ field: 'shipper', label: 'SHIPPER', width: 160, title: '发货人', showHeaderOverflow: true, sortable: true },
{ field: 'destination', label: 'DESTINATION', width: 160, title: '目的地', showHeaderOverflow: true, sortable: true },
{ field: 'issuedate', label: 'ISSUEDATE', width: 160, title: '签单日期', showHeaderOverflow: true, sortable: true, slots: { default: 'issuedate' } },
{ field: 'prepardat', label: 'PREPARDAT', width: 160, title: '预付地点', showHeaderOverflow: true, sortable: true },
{ field: 'service', label: 'SERVICE', width: 160, title: '运输条款', showHeaderOverflow: true, sortable: true },
{ field: 'sale', label: 'SALE', width: 160, title: '揽货人', showHeaderOverflow: true, sortable: true }, // 销售
{ field: 'lanename', label: 'LANENAME', width: 160, title: '航线', showHeaderOverflow: true, sortable: true },
{ field: 'servicecontractno', label: 'SERVICECONTRACTNO', width: 160, title: '客户合同号', showHeaderOverflow: true, sortable: true }, // 没有设置该字段的地方
{ field: 'bsstatusname', label: 'BSSTATUSNAME', width: 160, title: '业务状态', showHeaderOverflow: true, sortable: true },
{ field: 'bsno', label: 'BSNO', width: 160, title: '业务编号', showHeaderOverflow: true, sortable: true },
{ field: 'agentid', label: 'AGENTID', width: 160, title: '国外代理', showHeaderOverflow: true, sortable: true },
{ field: 'trucker', label: 'TRUCKER', width: 160, title: '车队', showHeaderOverflow: true, sortable: true },
{ field: 'tempset', label: 'TEMPSET', width: 160, title: '设置温度', showHeaderOverflow: true, sortable: true },
{ field: 'reeferf', label: 'REEFERF', width: 160, title: '通风度', showHeaderOverflow: true, sortable: true },
{ field: 'shipagency', label: 'SHIPAGENCY', width: 160, title: '船代', showHeaderOverflow: true, sortable: true },
{ field: 'bookingno', label: 'BOOKINGNO', width: 160, title: '订舱编号', showHeaderOverflow: true, sortable: true },
// 以下为东胜没有,大简云有,目前保留的
{ field: 'vgm', label: 'VGM', width: 120, title: 'VGM', showHeaderOverflow: true },
{ field: 'forwarder', label: 'FORWARDER', width: 120, title: '订舱代理', showHeaderOverflow: true, sortable: true },
{ field: 'bookingStatus', label: 'BOOKINGSTATUS', width: 120, title: '订舱状态', showHeaderOverflow: true },
{ field: 'freightpayer', label: 'FREIGHTPAYER', width: 120, title: '付款方', showHeaderOverflow: true, sortable: true },
{ field: 'voyno', label: 'VOYNO', width: 120, title: '海关航次', showHeaderOverflow: true },
{ field: 'cargoid', label: 'CARGOID', width: 120, title: '货物标识', showHeaderOverflow: true, sortable: true },
{ field: 'marks', label: 'MARKS', width: 120, title: '唛头', showHeaderOverflow: true, sortable: true },
{ field: 'nobill', label: 'NOBILL', width: 120, title: '提单分数', showHeaderOverflow: true, sortable: true },
{ field: 'notifyparty', label: 'NOTIFYPARTY', width: 120, title: '通知人', showHeaderOverflow: true, sortable: true },
{ field: 'op', label: 'OP', width: 120, title: '操作人', showHeaderOverflow: true, sortable: true },
{ field: 'payableat', label: 'PAYABLEAT', width: 120, title: '到付地点', showHeaderOverflow: true, sortable: true },
{ field: 'placedelivery', label: 'PLACEDELIVERY', width: 120, title: '交货地', showHeaderOverflow: true, sortable: true },
{ field: 'bookstatus', label: 'BOOKSTATUS', minWidth: 140, title: '运踪', showHeaderOverflow: true, slots: { default: 'bookstatus' } }
// { field: 'book_sta_cate_billtrace', label: 'book_sta_cate_billtrace', width: 120, title: '运踪状态', showHeaderOverflow: true, sortable: true },
// { field: 'book_sta_cate_vgm', label: 'book_sta_cate_vgm', width: 120, title: 'VGM状态', showHeaderOverflow: true, sortable: true },
// { field: 'book_sta_cate_si', label: 'book_sta_cate_si', width: 120, title: '提单状态', showHeaderOverflow: true, sortable: true },
{ field: 'billStatus', label: 'BILLSTATUS', width: 120, title: '提单状态', showHeaderOverflow: true },
{ field: 'dunno', label: 'DUNNO', width: 120, title: '危险品编号', showHeaderOverflow: true, sortable: true },
{ field: 'contractno', label: 'CONTRACTNO', width: 120, title: '合约号', showHeaderOverflow: true, sortable: true },
{ field: 'route', label: 'ROUTE', width: 120, title: '航线操作', showHeaderOverflow: true, sortable: true }
],
// ==== 表单部分 ====
condAllData: [
{ title: '委托单位', align: 'center', width: 160, label: 'CUSTOMERNAME', type: 'complete', showLabel: 'shortName' }, // 客户
{ title: '主提单号', align: 'center', width: 160, label: 'MBLNO', type: 'input' },
{ title: '分提单号', align: 'center', width: 160, label: 'HBLNO', type: 'input' },
{ title: '船公司', align: 'center', width: 120, label: 'CARRIER', type: 'select', showLabel: 'enName', showLabel2: 'cnName' },
{ title: '订舱代理', align: 'center', width: 120, label: 'FORWARDER', type: 'complete', showLabel: 'shortName' },
{ title: '场站', align: 'center', width: 120, label: 'YARDID', type: 'select', showLabel: 'code', showLabel2: 'name' }, // 场站显示 name , yardid 取字段 code
// { title: '船名/航次', align: 'center', width: 120, label: 'VESSEL', type: 'complete', showLabel: 'vessel', showLabel2: 'voyno' }, // 船名航次换接口 船名 vessel 航次 voyno
{ title: '船名', align: 'center', width: 120, label: 'VESSEL', type: 'complete', showLabel: 'name' }, // 船名航次换接口 船名 vessel 航次 voyno
{ title: '开船日期', align: 'center', width: 160, label: 'ETD', type: 'dateRange', resLabel: ['BETD', 'EETD'] },
{ title: '实际开船日期', align: 'center', width: 160, label: 'ATD', type: 'dateRange', resLabel: ['BATD', 'EATD'] },
{ title: '预计到港日期', align: 'center', width: 160, label: 'ETA', type: 'dateRange', resLabel: ['BETA', 'EETA'] },
{ title: '卸货港', align: 'center', width: 120, label: 'PORTDISCHARGE', type: 'complete', showLabel: 'enName' },
{ title: '装货港', align: 'center', width: 120, label: 'PORTLOAD', type: 'complete', showLabel: 'enName' },
{ title: '揽货人', align: 'center', width: 120, label: 'SALE', type: 'complete', showLabel: 'name' }, // 销售
{ title: '客服员', align: 'center', width: 120, label: 'CUSTSERVICE', type: 'complete', showLabel: 'name' },
{ title: '操作员', align: 'center', width: 120, label: 'OP', type: 'complete', showLabel: 'name' },
{ title: '单证员', align: 'center', width: 120, label: 'DOC', type: 'complete', showLabel: 'name' },
{ title: '报关行', align: 'center', width: 120, label: 'CUSTOMSER', type: 'complete', showLabel: 'shortName' },
{ title: '订舱编号', align: 'center', width: 120, label: 'BOOKINGNO', type: 'input' },
{ title: '业务编号', align: 'center', width: 120, label: 'BSNO', type: 'input' },
{ title: '业务状态', align: 'center', width: 120, label: 'BSSTATUS', type: 'input' },
{ title: '客户合同号', align: 'center', width: 120, label: 'SERVICECONTRACTNO', type: 'input' },
{ title: '航线', align: 'center', width: 120, label: 'ROUTE', type: 'input' },
{ title: '航线代码', align: 'center', width: 120, label: 'LANECODE', type: 'input' },
{ title: '内部航次', align: 'center', width: 120, label: 'VOYNOINNER', type: 'input' },
{ title: '海关航次', align: 'center', width: 120, label: 'VOYNO', type: 'input' },
// 未完成
],
condAllDataOld: [
{ title: '业务编号', align: 'center', width: 120, label: 'BSNO', type: 'input' },
// { title: '船公司', align: 'center', width: 120, label: 'CARRIER', type: 'input' },
{ title: '船公司', align: 'center', width: 120, label: 'CARRIER', type: 'select', showLabel: 'enName' },
@ -118,7 +135,7 @@ export default {
{ title: '场站代码', align: 'center', width: 120, label: 'YARDID', type: 'input' },
{ title: '场站', align: 'center', width: 120, label: 'YARD', type: 'input' },
{ title: '船舶呼号', align: 'center', width: 120, label: 'VESSELID', type: 'input' },
{ title: '船名', align: 'center', width: 120, label: 'VESSEL', type: 'input' },
{ title: '船名', align: 'center', width: 120, label: 'VESSEL', type: 'complete', showLabel: 'name' },
{ title: '海关航次', align: 'center', width: 120, label: 'VOYNO', type: 'input' },
{ title: '内部航次', align: 'center', width: 120, label: 'VOYNOINNER', type: 'input' },
{ title: '开船日期', align: 'center', width: 160, label: 'ETD', type: 'dateRange' },
@ -138,5 +155,39 @@ export default {
{ title: '目的地代码', align: 'center', width: 120, label: 'DESTINATIONID', type: 'input' },
{ title: '目的地', align: 'center', width: 120, label: 'DESTINATION', type: 'input' }
// 此处省略部分数据
]
],
columnsOld: [
{ type: 'checkbox', width: 60, noDraggable: true },
{ field: 'carrier', label: 'CARRIER', width: 120, title: '船公司', showHeaderOverflow: true, sortable: true },
{ field: 'yard', label: 'YARD', width: 120, title: '场站', showHeaderOverflow: true, sortable: true },
{
field: 'mblno',
label: 'MBLNO',
width: 160,
title: '主提单号',
showHeaderOverflow: true,
showOverflow: false,
sortable: true,
slots: { default: 'mblno' }
},
{
field: 'vessel',
label: 'VESSEL',
width: 120,
title: '船名航次',
showHeaderOverflow: true,
sortable: true,
slots: { default: 'vessel' }
},
{ field: 'etd', label: 'ETD', width: 110, title: '开船日期', showHeaderOverflow: true, sortable: true, slots: { default: 'etd' } },
{ field: 'voyno', label: 'VOYNO', width: 120, title: '海关航次', showHeaderOverflow: true },
{ field: 'bookingStatus', label: 'BOOKINGSTATUS', width: 120, title: '订舱状态', showHeaderOverflow: true },
{ field: 'vgm', label: 'VGM', width: 120, title: 'VGM', showHeaderOverflow: true },
{ field: 'billStatus', label: 'BILLSTATUS', width: 120, title: '提单状态', showHeaderOverflow: true },
{ field: 'portdischarge', label: 'PORTDISCHARGE', width: 120, title: '卸货港', showHeaderOverflow: true, sortable: true },
{ field: 'createdUserName', label: 'CREATEDUSERNAME', width: 120, title: '创建人', showHeaderOverflow: true, sortable: true },
{ field: 'createdTime', label: 'CREATEDTIME', width: 160, title: '创建时间', showHeaderOverflow: true, sortable: true },
{ field: 'cntrtotal', label: 'CNTRTOTAL', width: 120, title: '箱型箱量', showHeaderOverflow: true, sortable: true },
{ field: 'operate', title: '操作', width: 80, noDraggable: true, slots: { default: 'operate' }, fixed: 'right', resizable: false }
],
}

Loading…
Cancel
Save