Merge branch 'szh_change'

master
sunzehua 1 year ago
commit 0f86b41846

@ -26,6 +26,7 @@ const constantRouterComponents = {
// 默认首页
Console: () => import('@/views/system/index/welcome'),
BookingDetail: () => import('@/views/main/BookingLedger/detail'),
BookingDetailTest: () => import('@/views/main/BookingLedger/detail/indexTest'),
CustomerInformationManagementAdd: () => import('@/views/main/Customer/addForm'),
CustomerInformationManagementEdit: () => import('@/views/main/Customer/editForm'),
SendCarAdd: () => import('@/views/main/SendCar/addForm'),
@ -253,6 +254,17 @@ const booking = [
},
component: 'BookingDetail'
},
{
name: 'BookingDetailTest',
path: '/BookingDetailTest',
pid: 0,
id: 10031,
meta: {
title: '订舱详情',
show: false
},
component: 'BookingDetailTest'
},
{
name: 'CustomerInformationManagementAdd',
path: '/CustomerInformationManagementAdd',

File diff suppressed because it is too large Load Diff

@ -0,0 +1,196 @@
<template>
<a-collapse class="collapse-box bill-info-box" :bordered="false" v-model="showKey">
<a-collapse-panel key="1" :showArrow="false">
<div class="container bill-info">
<a-form-model ref="billFrom" :model="details" :rules="rules">
<a-row :gutter="10">
<template v-if="details.cargoid == 'D'">
<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="dclass"
>
<inputView type="dclass" size="small" :parentVal="details.dclass" @getInputChange="inputChange"/>
</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="dunno"
>
<inputView type="dunno" size="small" :parentVal="details.dunno" @getInputChange="inputChange"/>
</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="dpage"
>
<inputView type="dpage" size="small" :parentVal="details.dpage" @getInputChange="inputChange"/>
</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="dlabel"
>
<inputView type="dlabel" size="small" :parentVal="details.dlabel" @getInputChange="inputChange"/>
</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="linkman"
>
<inputView type="linkman" size="small" :parentVal="details.linkman" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
</template>
</a-row>
</a-form-model>
</div>
</a-collapse-panel>
</a-collapse>
</template>
<script>
import inputView from '../components/inputView'
import selectView from '../components/selectView'
import datePickerView from '../components/datePickerView'
export default {
name: '',
components: {
selectView,
inputView,
datePickerView
},
props: {
details: {
type: Object,
default: () => {
return {}
}
},
rules: {
type: Object,
default: () => {
return {}
}
},
inSave: {
type: Boolean,
default: false
},
isParent: {
type: String,
default: ''
}
},
data() {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 8 },
md: { span: 10 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 15 },
md: { span: 13 }
},
showKey: ['1']
}
},
watch: {
details: {
handler(nval, oval) {
if (!this.inSave) {
this.$emit('changeDetail', {
detail: nval,
type: 'billInfo'
})
}
this.$forceUpdate()
},
deep: true
},
'$route.query': {
immediate: true,
handler(nD, oD) {
this.id = this.$route.query.id
}
}
},
created() { },
methods: {
checkbasic () {
this.$refs.billFrom.validate(valid => {
if (valid) {
return true;
} else {
return false;
}
});
},
getSelectViewRes({ type, res }) {
if (['issuetype', 'blfrt'].includes(type)) {
this.details[type] = res.enName || ''
if (type === 'blfrt') {
if (this.details.blfrt === 'FREIGHT COLLECT') {
this.details.payableat = this.details.payableat ? this.details.payableat : this.details.portdischarge || ''
this.details.payableatid = this.details.payableatid ? this.details.payableatid : this.details.portdischargeid || ''
} else {
this.details.prepardat = this.details.prepardat ? this.details.prepardat : this.details.portload || ''
this.details.prepardatid = this.details.prepardatid ? this.details.prepardatid : this.details.portloadid || ''
}
}
} else if (['issueplace', 'prepardat', 'payableat'].includes(type)) {
this.details[type] = res.enName || ''
this.details[`${type}id`] = res.ediCode || ''
} else if (['service'].includes(type)) {
this.details[type] = res.name || ''
} else if (['nobill', 'copynobill'].includes(type)) {
this.details[type] = res.code || ''
}
},
inputChange({ type, value }) {
this.details[type] = value
this.$forceUpdate()
},
dateChangeFun ({ type, value }) {
this.details[type] = value || ''
}
}
}
</script>
<style lang="less" scoped>
/deep/ .ant-form-explain{
display: none !important;
}
/deep/ .ant-form-item-children-icon .anticon-check-circle{
display: none;
}
</style>
<style lang="less" scoped>
@import url('../style/billInfo.less');
</style>

@ -0,0 +1,868 @@
<template>
<a-collapse class="collapse-box" :bordered="false" v-model="showKey">
<a-collapse-panel key="1" :showArrow="false">
<template slot="header">
<div class="base-tit"><i class="iconfont icon-goods"></i>货物信息 <span
class="click-btn"
@click.stop="tabStopFun"></span></div>
</template>
<template slot="extra">
<div class="tab-change"><i class="iconfont icon-xia" :class="{ 'active': !showKey.includes('1') }"></i></div>
</template>
<div class="container cargo-info">
<a-form-model :selfUpdate="true" ref="cargoFrom" :model="details" :rules="rules">
<a-row :gutter="10">
<a-col :span="5">
<div class="cargo-info-tit" :class="{ 'required': rules['marks'] && rules['marks'][0].required }">
<div>Seal No.(封志号)<span
@click="handleOpen(1)"
style="cursor: pointer;"
class="copy-btn iconfont icon-bianji"></span></div>
<div>Marks & Nos.(标记与号码)</div>
</div>
<a-form-model-item has-feedback prop="marks" class="textarea-label" label="">
<div class="bottom">
<textareaView
class="input-box"
id="marks-scroll"
:parentVal="details.marks"
type="marks"
:height="100"
:openToCDB="true"
@getTextareaChange="getTextareaChange" />
<div
class="line-count"
id="marks-scroll-right"
v-if="Object.keys(details).length > 1 && details.marks.length > 1">
<div v-for="(num, index) in details.marks.split('\n')" :key="index">{{ num.length }}</div>
</div>
</div>
</a-form-model-item>
</a-col>
<a-col :span="10">
<div class="line">
<div
class="left"
:class="{ 'required': rules['description'] && rules['description'][0].required }"
v-if="details.carrierid !== 'PIL'">
<div>Description of Goods</div>
<div>(包装种类与货名)<span
@click="handleOpen(2)"
style="cursor: pointer;"
class="copy-btn iconfont icon-bianji"></span></div>
</div>
<div class="left" v-else>
<div class="title" :class="{ 'required': rules['description'] && rules['description'][0].required }">
Description of Goods (包装种类与货名)<span
@click="handleOpen(2)"
style="cursor: pointer;color: black;"
class="copy-btn iconfont icon-bianji"></span></div>
<a-form-model-item
has-feedback
prop="goodsname"
label=""
:class="{ 'goods-name-box': rules['goodsname'] && rules['goodsname'][0].required }">
<i
class="icon required goods-required"
v-if="rules['goodsname'] && rules['goodsname'][0].required"></i>
<!-- :showLabel="['goodsNameEN', 'goodsCode']" -->
<selectView
type="goodsname"
:defaultVal="details.goodsname"
searchApi="getGoodsname"
:searchQuery="{ queryItem: '', top: 50 }"
:showLabel="['goodsNameEN', 'goodsCode']"
:openSearch="true"
@change="getSelectViewRes"
style="width: 75%;max-width:210px;"></selectView>
</a-form-model-item>
</div>
<div class="cargo-mark">
<div :class="{ 'required': rules['cargoid'] && rules['cargoid'][0].required }" class="tit">货物标志</div>
<a-form-model-item class="cargoid" has-feedback prop="cargoid" label="" style="margin-top:-6px;">
<selectView
type="cargoid"
:defaultVal="details.cargoid"
searchApi="cargoData"
:searchQuery="{ name: '' }"
:showLabel="['name']"
:openSearch="false"
@change="getSelectViewRes"
style="width: 120px;margin-top:7px;"></selectView>
</a-form-model-item>
</div>
<div class="input">
<div :class="{ 'required': rules['hscode'] && rules['hscode'][0].required }" calss="tit">HS编码</div>
<a-form-model-item class="cargoid" has-feedback prop="hscode" label="" style="margin-top:-2px;">
<!-- <a-input size="small" :allowClear="true" v-model="details.hscode" /> -->
<inputView type="hscode" size="small" :parentVal="details.hscode" @getInputChange="inputChange" />
</a-form-model-item>
</div>
</div>
<a-form-model-item has-feedback prop="description" class="textarea-label" label="">
<div class="bottom">
<textareaView
id="description-scroll"
class="input-box"
:parentVal="details.description"
type="description"
:height="100"
:openToCDB="true"
@getTextareaChange="getTextareaChange" />
<div
class="line-count"
id="description-scroll-right"
v-if="Object.keys(details).length > 1 && details.description.length > 1">
<div v-for="(num, index) in details.description.split('\n')" :key="index">{{ num.length }}</div>
</div>
</div>
</a-form-model-item>
</a-col>
<a-col :span="9">
<a-col :span="12">
<a-form-model-item
class="from-label pkgs-line-box"
label="件数"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="pkgs">
<div class="line-box">
<a-input
:allowClear="true"
size="small"
v-model="details.pkgs"
type="number"
@change="changePkgs" />
<i class="iconfont icon-bianji1 edit-icon" @click="editTextEntryModel('pkgs')"></i>
</div>
</a-form-model-item>
</a-col>
<a-col :span="12" style="overflow: hidden">
<a-form-model-item
class="from-label"
label="包装"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="kindpkgs">
<selectView
type="kindpkgs"
:defaultVal="details.kindpkgs"
searchApi="GetPackage"
:searchQuery="{ KeyWord: '' }"
:showLabel="['name']"
:openSearch="false"
@change="getSelectViewRes">
</selectView>
</a-form-model-item>
</a-col>
<a-col :span="12" style="overflow: hidden">
<a-form-model-item
class="from-label kgs-line-box"
label="毛重"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="kgs">
<div class="line-box">
<a-input size="small" :allowClear="true" v-model="details.kgs" />
<i class="iconfont icon-bianji1 edit-icon" @click="editTextEntryModel('kgs')"></i>
<span class="unit">KGS</span>
</div>
</a-form-model-item>
</a-col>
<a-col :span="12" style="overflow: hidden">
<a-form-model-item
class="from-label cbm-line-box"
label="尺寸"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="cbm">
<div class="line-box">
<a-input size="small" :allowClear="true" v-model="details.cbm" />
<i class="iconfont icon-bianji1 edit-icon" @click="editTextEntryModel('cbm')"></i>
<span class="unit">CBM</span>
</div>
</a-form-model-item>
</a-col>
<template v-if="details.cargoid == 'R'">
<a-col :span="12">
<a-form-model-item
class="from-label"
label="冷藏通风量"
:labelCol="labelColCode"
:wrapperCol="wrapperColCode"
has-feedback
prop="reeferf"
>
<inputView type="reeferf" size="small" :parentVal="details.reeferf" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="设置温度"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="tempset"
>
<inputView type="tempset" size="small" :parentVal="details.tempset" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="温度单位"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="tempid"
>
<a-select size="small" :default-value="details.tempid || 'C'" v-model="details.tempid">
<a-select-option value="C"> C摄氏 </a-select-option>
<a-select-option value="F"> F华氏 </a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="最低温度"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="tempmin"
>
<inputView type="tempmin" size="small" :parentVal="details.tempmin" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="最高温度"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="tempmax"
>
<inputView type="tempmax" size="small" :parentVal="details.tempmax" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="湿度"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="humidity">
<inputView type="humidity" size="small" :parentVal="details.humidity" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
</template>
<template v-if="details.cargoid == 'D'">
<a-col :span="12">
<a-form-model-item
class="from-label"
label="危险品等级"
:labelCol="labelColCode"
:wrapperCol="wrapperColCode"
has-feedback
prop="dclass"
>
<inputView type="dclass" size="small" :parentVal="details.dclass" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="危险品编号"
:labelCol="labelColCode"
:wrapperCol="wrapperColCode"
has-feedback
prop="dunno"
>
<inputView type="dunno" size="small" :parentVal="details.dunno" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="危险品页号"
:labelCol="labelColCode"
:wrapperCol="wrapperColCode"
has-feedback
prop="dpage"
>
<inputView type="dpage" size="small" :parentVal="details.dpage" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="危险品标签"
:labelCol="labelColCode"
:wrapperCol="wrapperColCode"
has-feedback
prop="dlabel"
>
<inputView type="dlabel" size="small" :parentVal="details.dlabel" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
class="from-label"
label="危险品联系人"
:labelCol="{
xs: { span: 24 },
sm: { span: 10 },
md: { span: 12 }
}"
:wrapperCol="{
xs: { span: 24 },
sm: { span: 14 },
md: { span: 12 }
}"
has-feedback
prop="linkman"
>
<inputView type="linkman" size="small" :parentVal="details.linkman" @getInputChange="inputChange"/>
</a-form-model-item>
</a-col>
</template>
</a-col>
<a-col class="num-box" :span="24">
<span class="label">件数大写: </span>
<a-input
:allowClear="true"
class="input-val num-box-right"
v-model="details.totalno"
disabled
placeholder="自动生成" />
</a-col>
</a-row>
</a-form-model>
</div>
<a-modal :title="modelTitle" :width="900" :visible="visible" @ok="visible = false" @cancel="visible = false">
<div>
<div v-if="modelType === 1" style="display: flex;">
<textareaView
class="input-box"
id="marks-scroll"
:parentVal="details.marks"
type="marks"
:height="500"
style="font-size:20px;margin-right: 10px;"
:openToCDB="true"
@getTextareaChange="getTextareaChange" />
<div
class="line-count"
id="marks-scroll-right"
v-if="Object.keys(details).length > 1 && details.marks.length > 1">
<div v-for="(num, index) in details.marks.split('\n')" :key="index">{{ num.length }}</div>
</div>
</div>
<div v-if="modelType === 2" style="display: flex;">
<textareaView
id="description-scroll"
class="input-box"
:parentVal="details.description"
type="description"
:height="500"
style="font-size:20px;margin-right: 10px;"
:openToCDB="true"
@getTextareaChange="getTextareaChange" />
<div
class="line-count"
id="description-scroll-right"
v-if="Object.keys(details).length > 1 && details.description.length > 1">
<div v-for="(num, index) in details.description.split('\n')" :key="index">{{ num.length }}</div>
</div>
</div>
</div>
</a-modal>
<a-modal width="500px" :maskClosable="false" v-model="textEntryModalVisible" :title="textEntryModalTitle">
<div class="text-entry-box">
<!-- 件数包装 -->
<a-form v-if="textEntryType === 'pkgs'">
<div class="text-input">
<a-textarea
v-model="details.pkgstotal"
placeholder="请输入内容"
:auto-size="{ minRows: 6, maxRows: 9 }"
@change="pkgsTextChange" />
</div>
<div class="total" v-if="pkgstotalRes">{{ pkgstotalRes }}</div>
</a-form>
<!-- 毛重 -->
<a-form v-if="textEntryType === 'kgs'">
<div class="text-input">
<a-textarea
v-model="details.kgstotal"
placeholder="请输入内容"
:auto-size="{ minRows: 6, maxRows: 9 }"
@change="kgsTextChange" />
</div>
<div class="total" v-if="kgstotalRes">{{ kgstotalRes }} / KGS</div>
</a-form>
<!-- 尺码 -->
<a-form v-if="textEntryType === 'cbm'">
<div class="text-input">
<a-textarea
v-model="details.cbmtotal"
placeholder="请输入内容"
:auto-size="{ minRows: 6, maxRows: 9 }"
@change="cbmTextChange" />
</div>
<div class="total" v-if="cbmtotalRes">{{ cbmtotalRes }} / CBM</div>
</a-form>
</div>
<template slot="footer">
<a-button type="primary" @click="textEntryClose"></a-button>
</template>
</a-modal>
</a-collapse-panel>
</a-collapse>
</template>
<script>
import textareaView from '../components/textareaView'
import selectView from '../components/selectView'
import inputView from '../components/inputView'
let timer;
export default {
name: '',
components: {
textareaView,
selectView,
inputView
},
props: {
details: {
type: Object,
default: () => {
return {}
}
},
moreStr: {
type: String,
default: ''
},
rules: {
type: Object,
default: () => {
return {}
}
},
inSave: {
type: Boolean,
default: false
},
isParent: {
type: String,
default: ''
}
},
data() {
return {
showKey: ['1'],
modelTitle: '',
modelType: 0,
visible: false,
labelCol: {
xs: { span: 24 },
sm: { span: 8 },
md: { span: 8 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
md: { span: 16 }
},
labelColCode: {
xs: { span: 24 },
sm: { span: 8 },
md: { span: 10 }
},
wrapperColCode: {
xs: { span: 24 },
sm: { span: 16 },
md: { span: 14 }
},
shippername: '',
consigneename: '',
notifypartyname: '',
foreignAgentname: '',
notifypartY2name: '',
modelVisible: false,
modelconfirm: false,
modelName: '',
yardType: '',
yardVisible: false,
customerModelconfirm: false,
textEntryModalVisible: false,
textEntryType: '',
textEntryModalTitle: '',
pkgstotalRes: 0,
kgstotalRes: 0,
cbmtotalRes: 0,
portdischargeHasline: false,
destinationidHasline: false,
userHasLine: false
// goodsnameData: []
}
},
watch: {
details: {
handler(nval, oval) {
if (!this.inSave) {
this.$emit('changeDetail', {
detail: nval,
type: 'cargoInfo'
})
}
},
deep: true
},
moreStr(nval, oval) {
if (nval !== oval) {
let str = this.details.description
if (str.length > 0) {
str += '\n'
}
this.details.description = str + nval
}
},
'$route.query': {
immediate: true,
handler(nD, oD) {
this.id = this.$route.query.id
}
}
},
created() { },
mounted() {
const marksScroll = document.getElementById('marks-scroll')
if (marksScroll) {
marksScroll.addEventListener('scroll', () => {
document.getElementById('marks-scroll-right').scrollTop = marksScroll.scrollTop
})
}
const descriptionScroll = document.getElementById('description-scroll')
if (descriptionScroll) {
descriptionScroll.addEventListener('scroll', () => {
document.getElementById('description-scroll-right').scrollTop = descriptionScroll.scrollTop
})
}
setTimeout(() => {
this.changePkgs()
}, 2000)
},
methods: {
SetTOTALNO(SS) {
SS = SS.toString()
const i = SS.indexOf('\n')
let num = 0
let strKind = ''
let enCapital = ''
if (i > 0) {
const slist = SS.split('\n')
for (let i = 0; i < slist.length; i += 1) {
const member = slist[i]
const strNum = this.GetStringNum(member)
if (i == 0) {
strKind = member.substring(strNum.length)
}
num = parseFloat(num).add(parseFloat(strNum))
}
if (strKind !== '') {
enCapital = strKind
} else {
strKind = this.details.kindpkgs
enCapital = this.ToEn(num).toUpperCase() + ' ' + strKind + ' ONLY.'
}
} else {
const strNum = this.GetStringNum(SS)
strKind = SS.substring(strNum.length)
if (strKind !== '') {
console.log(strKind)
enCapital = strKind
} else {
strKind = this.details.kindpkgs
enCapital = 'SAY:' + this.ToEn(strNum).toUpperCase() + ' ' + strKind + ' ONLY.'
}
}
return enCapital
},
ToEn(a) {
// eslint-disable-next-line no-array-constructor
const arr1 = new Array('', ' thousand', ' million', ' billion')
const b = a.length
let f = null
let h = 0
let g = ''
const e = Math.ceil(b / 3)
const k = b - e * 3
g = ''
for (f = k; f < b; f += 3) {
++h
// eslint-disable-next-line no-undef
const num3 = f >= 0 ? a.substring(f, f + 3) : a.substring(0, k + 3)
// eslint-disable-next-line no-undef
const strEng = this.English(num3)
// eslint-disable-next-line eqeqeq
if (strEng != '') {
// eslint-disable-next-line eqeqeq
if (g != '') g += ' '
g += this.English(num3) + arr1[e - h]
}
}
return g
},
English(a) {
// eslint-disable-next-line no-array-constructor
var arr1 = new Array('', ' thousand', ' million', ' billion')
// eslint-disable-next-line no-array-constructor
var arr2 = new Array('zero', 'ten', 'twenty', 'thirty', 'forty', 'fifty', 'sixty', 'seventy', 'eighty', 'ninety')
// eslint-disable-next-line no-array-constructor
var arr3 = new Array('zero', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine')
// eslint-disable-next-line no-array-constructor
var arr4 = new Array(
'ten',
'eleven',
'twelve',
'thirteen',
'fourteen',
'fifteen',
'sixteen',
'seventeen',
'eighteen',
'nineteen'
)
let strRet = ''
// eslint-disable-next-line eqeqeq
if (a.length == 3 && a.substr(0, 3) != '000') {
if (a.substr(0, 1) != '0') {
strRet += arr3[a.substr(0, 1)] + ' hundred'
if (a.substr(1, 2) != '00') strRet += ' and '
} else {
strRet += ' and '
}
a = a.substring(1)
}
if (a.length == 2) {
if (a.substr(0, 1) == '0') a = a.substring(1)
else if (a.substr(0, 1) == '1') strRet += arr4[a.substr(1, 2)]
else {
strRet += arr2[a.substr(0, 1)]
if (a.substr(1, 1) != '0') strRet += '-'
a = a.substring(1)
}
}
if (a.length == 1 && a.substr(0, 1) != '0') strRet += arr3[a.substr(0, 1)]
return strRet
},
editTextEntryModel(type) {
this.textEntryModalVisible = true
this.textEntryType = type
if (type === 'pkgs') {
this.textEntryModalTitle = '件数/包装'
if (this.details.pkgstotal) {
this.pkgsTextChange()
} else {
this.pkgstotalRes = 0
}
} else if (type === 'kgs') {
this.textEntryModalTitle = '毛重'
if (this.details.kgstotal) {
this.kgsTextChange()
} else {
this.kgstotalRes = 0
}
} else if (type === 'cbm') {
this.textEntryModalTitle = '尺码'
if (this.details.cbmtotal) {
this.cbmTextChange()
} else {
this.cbmtotalRes = 0
}
}
},
textEntryClose() {
this.textEntryModalVisible = false
this.textEntryModalTitle = ''
this.textEntryType = false
},
GetStringNum(str) {
var num = 0
if (str == null || str == '') return num
if (str.length == 0) return num
var if_find = false
var str_num = ''
for (var i = 0; i < str.length; i += 1) {
var member = str.substr(i, 1)
if (
member == '0' ||
member == '1' ||
member == '2' ||
member == '3' ||
member == '4' ||
member == '5' ||
member == '6' ||
member == '7' ||
member == '8' ||
member == '9' ||
member == '.' ||
member == '-'
) {
if (!if_find) {
str_num = str_num + member
}
} else {
if_find = true
}
}
return str_num
},
pkgsTextChange() {
const pkgsTexyVal = this.details.pkgstotal
const arr = pkgsTexyVal.split(/\n|\r/g)
let pkgs = 0
let kindpkgs = ''
arr.map((item, index) => {
const regexStr = item.match(/[a-zA-Z]+|[0-9]+(?:\.[0-9]+|)/g)
if (regexStr && Number(regexStr[0])) {
const num1 = Number(regexStr[0])
pkgs = (pkgs * 100 + num1 * 100) / 100
}
if (!kindpkgs && regexStr && /^[a-zA-Z]+$/.test(regexStr[1])) {
kindpkgs = regexStr[1]
}
})
this.details.pkgs = parseInt(pkgs)
this.details.kindpkgs = kindpkgs
this.pkgstotalRes = parseInt(pkgs)
},
kgsTextChange() {
const kgsTexyVal = this.details.kgstotal
const arr = kgsTexyVal.split(/\n|\r/g)
let kgs = 0
arr.map((item, index) => {
const regexStr = item.match(/[a-zA-Z]+|[0-9]+(?:\.[0-9]+|)/g)
if (regexStr && Number(regexStr[0])) {
const num1 = Number(regexStr[0])
kgs = (kgs * 100 + num1 * 100) / 100
}
})
this.details.kgs = kgs
this.kgstotalRes = kgs
},
cbmTextChange() {
const cbmTexyVal = this.details.cbmtotal
const arr = cbmTexyVal.split(/\n|\r/g)
let cbm = 0
arr.map((item, index) => {
const regexStr = item.match(/[a-zA-Z]+|[0-9]+(?:\.[0-9]+|)/g)
if (regexStr && Number(regexStr[0])) {
const num1 = Number(regexStr[0])
cbm = (cbm * 100 + num1 * 100) / 100
}
})
this.details.cbm = cbm
this.cbmtotalRes = cbm
},
handleOpen(type) {
this.modelType = type
if (type === 1) {
this.modelTitle = '唛头'
} else {
this.modelTitle = '货物描述'
}
this.visible = true
},
debounce(func, wait, ...args) {
if (timer) clearTimeout(timer);
timer = setTimeout(() => {
func.apply(this, args);
}, wait);
},
checkbasic() {
this.$refs.cargoFrom.validate(valid => {
if (valid) {
console.log('验证成功!');
return true;
} else {
console.log('验证失败!');
return false;
}
});
},
handleChange(value) {
this.details.cargoid = value
},
getTextareaChange({ type, value }) {
this.details[type] = value
this.$forceUpdate()
},
getSelectViewRes({ type, res }) {
if (type === 'goodsname') {
this.details.goodscode = res.goodsCode || ''
this.details.goodsname = res.goodsNameEN || ''
} else if (type === 'cargoid') {
this.details.cargoid = res.code || ''
} else if (['kindpkgs'].includes(type)) {
this.details.kindpkgs = res['name'] || ''
const enCapitalRes = this.SetTOTALNO(this.details.pkgs)
this.$emit('pkgsEnCapital', enCapitalRes)
}
},
changePkgs() {
const enCapitalRes = this.SetTOTALNO(this.details.pkgs)
this.$emit('pkgsEnCapital', enCapitalRes)
},
inputChange({ type, value }) {
this.details[type] = value
if (type === 'pkgs') {
this.changePkgs()
}
this.$forceUpdate()
},
tabStopFun() {
return false
},
tabChangeFun() {
}
}
}
</script>
<style lang="less" scoped>
.copy-btn {
margin-left: 10px;
&:hover {
color: @primary-color !important;
}
}
/deep/ .ant-form-explain {
display: none !important;
}
/deep/ .ant-form-item-children-icon .anticon-check-circle {
display: none;
}
</style>
<style lang="less" scoped>
@import url('../style/cargoInfo.less');
@import url('../style/mailingInfo.less');
.cargo-info {
padding-bottom: 20px;
}
</style>

@ -0,0 +1,713 @@
<template>
<div class="more-edi" :style="{ paddingTop: '20px', paddingBottom: '10px' }">
<a-form-model ref="ediFrom" :model="details" :rules="rules" v-if="details">
<div class="normal">
<a-row :gutter="16">
<a-col :span="8">
<a-form-model-item
label="发送方EDI代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.sendCode"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.sendCode" /> -->
<inputView type="sendCode" :parentVal="details.bookingEDIExt.sendCode" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="接收方EDI代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.receiveCode"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.receiveCode" /> -->
<inputView
type="receiveCode"
:parentVal="details.bookingEDIExt.receiveCode"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="EDI联系人名称"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.ediAttn"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.ediAttn" /> -->
<inputView type="ediAttn" :parentVal="details.bookingEDIExt.ediAttn" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="EDI联系人电话"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.ediAttnTel"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.ediAttnTel" /> -->
<inputView
type="ediAttnTel"
:parentVal="details.bookingEDIExt.ediAttnTel"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="EDI联系人邮箱"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.ediAttnMail"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.ediAttnMail" /> -->
<inputView
type="ediAttnMail"
:parentVal="details.bookingEDIExt.ediAttnMail"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="AMS收货人"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.amsConsignee"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.amsConsignee" /> -->
<inputView
type="amsConsignee"
:parentVal="details.bookingEDIExt.amsConsignee"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="AMS通知人"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.amsNotifyParty"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.amsNotifyParty" /> -->
<inputView
type="amsNotifyParty"
:parentVal="details.bookingEDIExt.amsNotifyParty"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="操作英文名称"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.opEName"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.opEName" /> -->
<inputView type="opEName" :parentVal="details.bookingEDIExt.opEName" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="操作电话"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.opTel"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.opTel" /> -->
<inputView type="opTel" :parentVal="details.bookingEDIExt.opTel" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="操作邮箱"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.opEmail"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.opEmail" /> -->
<inputView type="opEmail" :parentVal="details.bookingEDIExt.opEmail" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="商品名称"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.goodsName"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.goodsName" /> -->
<inputView type="goodsName" :parentVal="details.bookingEDIExt.goodsName" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="SOC箱"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="iscontainersoc"
>
<a-select size="small" :default-value="iscontainersoc" style="width: 120px" v-model="iscontainersoc">
<a-select-option value="1"> </a-select-option>
<a-select-option value="0"> </a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="SCAC代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="scaccode"
>
<!-- <a-input :allowClear="true" v-model="details.scaccode" /> -->
<inputView type="scaccode" :parentVal="details.scaccode" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="ITN编号"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="itncode"
>
<!-- <a-input :allowClear="true" v-model="details.itncode" /> -->
<inputView type="itncode" :parentVal="details.itncode" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="订舱人说明"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.orderRemark"
>
<!-- <a-input v-model="details.bookingEDIExt.orderRemark" /> -->
<inputView
type="orderRemark"
:placeholder="'订舱人说明或ESL BP CODE'"
:parentVal="details.bookingEDIExt.orderRemark"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="付款方"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="freightpayer"
>
<!-- <a-input :allowClear="true" v-model="details.freightpayer" /> -->
<inputView type="freightpayer" :parentVal="details.freightpayer" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="第一层包装皮重"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.kingTareweight"
>
<inputView
type="kingTareweight"
:parentVal="details.bookingEDIExt.kingTareweight"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item
label="指定业务员"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.xmcywy"
>
<inputView
type="xmcywy"
:parentVal="details.bookingEDIExt.xmcywy"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col v-if="details.carrierid == 'EMC'" :span="8">
<a-form-model-item
label="Name accout"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.emcNameAccount"
>
<inputView
type="emcNameAccount"
:parentVal="details.bookingEDIExt.emcNameAccount"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="23">
<a-form-model-item
label="委托方"
:labelCol="{ xs: { span: 24 }, sm: { span: 3 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 21 } }"
has-feedback
prop="bookingEDIExt.weiTuoFang"
style="margin-top:4px;"
>
<a-textarea
size="small"
v-model="details.bookingEDIExt.weiTuoFang"
:auto-size="{ minRows: 2, maxRows: 5 }"
/>
</a-form-model-item>
</a-col>
</a-row>
</div>
<div class="ex-remark">
<div class="title">
<span class="line left"></span>
<span class="text">业务备注</span>
<span class="line right"></span>
</div>
<div class="ex-remark-content">
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item
label="辅助字段1"
:labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 17 } }"
has-feedback
prop="bookingEDIExt.exRemark1"
>
<a-textarea
size="small"
:allowClear="true"
v-model="details.bookingEDIExt.exRemark1"
:auto-size="{ minRows: 2, maxRows: 5 }"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="辅助字段2"
:labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 17 } }"
has-feedback
prop="bookingEDIExt.exRemark2"
>
<a-textarea
size="small"
:allowClear="true"
v-model="details.bookingEDIExt.exRemark2"
:auto-size="{ minRows: 2, maxRows: 5 }"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="辅助字段3"
:labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 17 } }"
has-feedback
prop="bookingEDIExt.exRemark3"
>
<a-textarea
size="small"
:allowClear="true"
v-model="details.bookingEDIExt.exRemark3"
:auto-size="{ minRows: 2, maxRows: 5 }"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="辅助字段4"
:labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 17 } }"
has-feedback
prop="bookingEDIExt.exRemark4"
>
<a-textarea
size="small"
:allowClear="true"
v-model="details.bookingEDIExt.exRemark4"
:auto-size="{ minRows: 2, maxRows: 5 }"
/>
</a-form-model-item>
</a-col>
</a-row>
</div>
</div>
<!-- === 太平添加 start === -->
<template v-if="details.carrierid == 'PIL'">
<div class="taiping">
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item
label="收货人EDI代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.consigneeEdiCode"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.consigneeEdiCode" /> -->
<inputView
type="consigneeEdiCode"
:parentVal="details.bookingEDIExt.consigneeEdiCode"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="发货人EDI代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.shipperEdiCode"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.shipperEdiCode" /> -->
<inputView
type="shipperEdiCode"
:parentVal="details.bookingEDIExt.shipperEdiCode"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="通知方EDI代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.notifyCdoe"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.notifyCdoe" /> -->
<inputView
type="notifyCdoe"
:parentVal="details.bookingEDIExt.notifyCdoe"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="太平销售EDI代码"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.salerCode"
>
<selectView
type="salerCode"
:defaultVal="details.bookingEDIExt.salerCode"
searchApi="salerCode"
:searchQuery="{ NAME: '' }"
:showLabel="['NAME']"
:openSearch="false"
@change="getSelectViewRes"
></selectView>
<!-- <a-select size="small" default-value="CN087 | GRACE SUN" v-model="details.bookingEDIExt.salerCode" @change="handleSaleChange">
<a-select-option v-for="(sales, sindex) in StoreSalesRepCode" :value="sales.NAME" :key="sindex">
{{ sales.NAME }}
</a-select-option>
</a-select> -->
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="EMANIFEST HBL"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.emanifestHbl"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.emanifestHbl" /> -->
<inputView
type="emanifestHbl"
:parentVal="details.bookingEDIExt.emanifestHbl"
@getInputChange="inputChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="Master Bol Indicator"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.masterBolIndicator"
>
<selectView
type="masterBolIndicator"
:defaultVal="details.bookingEDIExt.masterBolIndicatorName"
searchApi="StoreMasterBOLIndicator"
:searchQuery="{ NAME: '' }"
:showLabel="['NAME']"
:openSearch="false"
@change="getSelectViewRes"
></selectView>
<!-- <a-select size="small" v-model="details.bookingEDIExt.masterBolIndicator" @change="handleMasterBolChange" optionLabelProp="label">
<a-select-option v-for="(master, mindex) in StoreMasterBOLIndicator" :value="mindex" :key="mindex">
{{ master.NAME }}
</a-select-option>
</a-select> -->
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="S0C C0C:"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.s0CC0C"
style="margin-top:4px;"
>
<a-textarea
size="small"
:allowClear="true"
v-model="details.bookingEDIExt.s0CC0C"
:auto-size="{ minRows: 2, maxRows: 5 }"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="欧盟港口、伊朗港口、KHI"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.ckhi"
style="margin-top:4px;"
>
<a-textarea size="small" v-model="details.bookingEDIExt.ckhi" :auto-size="{ minRows: 2, maxRows: 5 }" />
</a-form-model-item>
</a-col>
</a-row>
</div>
<div class="taiping-2">
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item
label="南美东"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.cncm"
>
<a-textarea size="small" v-model="details.bookingEDIExt.cncm" :auto-size="{ minRows: 2, maxRows: 5 }" />
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="巴西线木质包装情况"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.wncm"
>
<a-textarea size="small" v-model="details.bookingEDIExt.wncm" :auto-size="{ minRows: 2, maxRows: 5 }" />
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="ACI HBL:"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.acihbl"
>
<!-- <a-input :allowClear="true" v-model="details.bookingEDIExt.acihbl" /> -->
<inputView type="acihbl" :parentVal="details.bookingEDIExt.acihbl" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="CNPT No:"
:labelCol="{ xs: { span: 24 }, sm: { span: 9 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
has-feedback
prop="bookingEDIExt.cnptNo"
>
<inputView type="CNPTNo" :parentVal="details.bookingEDIExt.cnptNo" @getInputChange="inputChange" />
</a-form-model-item>
</a-col>
</a-row>
</div>
</template>
<!-- === 太平添加 END === -->
</a-form-model>
</div>
</template>
<script>
import inputView from '../components/inputView'
import selectView from '../components/selectView'
let timer
export default {
components: {
inputView,
selectView
},
props: {
details: {
type: Object,
default: () => {
return {}
}
},
rules: {
type: Object,
default: () => {
return {}
}
},
inSave: {
type: Boolean,
default: false
},
isParent: {
type: String,
default: ''
}
},
data() {
return {
iscontainersoc: '',
StoreSalesRepCode: [
{ ID: 'CN087', NAME: 'CN087 | GRACE SUN' },
{ ID: 'CN096', NAME: 'CN096 | LEON LIANG' },
{ ID: 'CN097', NAME: 'CN097 | CHARLES GAO' },
{ ID: 'CN098', NAME: 'CN098 | TERESA LIU SHAN' },
{ ID: 'CN106', NAME: 'CN106 | HOKI YU' },
{ ID: 'CN107', NAME: 'CN107 | WILLIAM YANG JING YU' },
{ ID: 'CN099', NAME: 'CN099 | HELEN ZHANG' },
{ ID: 'CN100', NAME: 'CN100 | LEOREN' }
],
StoreMasterBOLIndicator: [
{ ID: '1', NAME: 'Carrier filing HBL | 船公司发HBL' },
{ ID: '2', NAME: 'Self filing HBL | 自己发' },
{ ID: '3', NAME: 'Not Applicable/Straight bl | 无HBL' }
]
}
},
watch: {
details: {
handler(nval, oval) {
if (!this.inSave) {
this.$emit('changeDetail', {
detail: nval,
type: 'ediMore'
})
}
},
deep: true
},
iscontainersoc(nval, oval) {
this.details.iscontainersoc = nval !== '0'
},
'$route.query': {
immediate: true,
handler(nD, oD) {
if (this.$route.name === 'BookingDetail') {
this.id = this.$route.query.id
}
}
}
},
created() {},
mounted() {
this.iscontainersoc = this.details.iscontainersoc ? '1' : '0'
},
methods: {
debounce(func, wait, ...args) {
if (timer) clearTimeout(timer)
timer = setTimeout(() => {
func.apply(this, args)
}, wait)
},
checkbasic() {
this.$refs.ediFrom.validate(valid => {
if (valid) {
return true
} else {
return false
}
})
},
inputChange({ type, value }) {
const bookingEDIExtArr = [
'sendCode',
'receiveCode',
'ediAttn',
'ediAttnTel',
'ediAttnMail',
'amsConsignee',
'amsNotifyParty',
'opEName',
'opTel',
'opEmail',
'goodsName',
'orderRemark',
'consigneeEdiCode',
'shipperEdiCode',
'notifyCdoe',
'emanifestHbl',
'acihbl',
'CNPTNo',
'kingTareweight',
'xmcywy',
'emcNameAccount'
]
if (bookingEDIExtArr.includes(type)) {
this.details.bookingEDIExt[type] = value
} else {
this.details[type] = value
}
this.$forceUpdate()
},
getSelectViewRes({ type, res }) {
if (type === 'masterBolIndicator') {
this.details.bookingEDIExt.masterBolIndicator = res.ID || ''
this.details.bookingEDIExt.masterBolIndicatorName = res.NAME || ''
} else if (type === 'salerCode') {
this.details.bookingEDIExt.salerCode = res.ID
this.details.bookingEDIExt.salerCodeName = res.NAME
}
}
}
}
</script>
<style lang="less" scoped>
/deep/ .ant-form-explain {
display: none !important;
}
/deep/ .ant-form-item-children-icon .anticon-check-circle {
display: none;
}
</style>
<style lang="less" scoped>
@import url('../style/ediMore.less');
</style>

File diff suppressed because it is too large Load Diff

@ -0,0 +1,100 @@
<template>
<a-card class="ramark-box" :bordered="false">
<!-- <a-button type="primary" @click="checkbasic"> </a-button> -->
<a-form-model ref="remarkFrom" :model="details" :rules="rules">
<a-row :gutter="24">
<a-col :span="12">
<a-form-model-item prop="soremark">
<div class="tit" :class="{'required':rules['soremark'] && rules['soremark'][0].required}"><span class="iconfont icon-bianji"></span>订舱备注</div>
<a-textarea :auto-size="{ minRows: 4, maxRows: 7 }" class="input-box" v-model="details.soremark" />
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item prop="siremark">
<div class="tit" :class="{'required':rules['siremark'] && rules['siremark'][0].required}"><span class="iconfont icon-bianji"></span>截单备注</div>
<a-textarea :auto-size="{ minRows: 4, maxRows: 7 }" class="input-box" v-model="details.siremark" data-next="box-ctnall"/>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
</a-card>
</template>
<script>
export default {
name: '',
props: {
details: {
type: Object,
default: () => {
return {}
}
},
rules: {
type: Object,
default: () => {
return {}
}
},
inSave: {
type: Boolean,
default: false
},
isParent: {
type: String,
default: ''
}
},
data() {
return {
remarks: ''
}
},
watch: {
details: {
handler(nval, oval) {
if (!this.inSave) {
this.$emit('changeDetail', {
detail: nval,
type: 'remarksInfo'
})
}
},
deep: true
},
'$route.query': {
immediate: true,
handler(nD, oD) {
this.id = this.$route.query.id
}
}
},
created() {},
methods: {
checkbasic () {
this.$refs.remarkFrom.validate(valid => {
if (valid) {
console.log('验证成功!');
return true;
} else {
console.log('验证失败!');
return false;
}
});
},
}
}
</script>
<style lang="less" scoped>
/deep/ .ant-form-explain{
display: none !important;
}
/deep/ .ant-form-item-children-icon .anticon-check-circle{
display: none;
}
</style>
<style lang="less" scoped>
@import url('../style/remarksInfo.less');
</style>

@ -0,0 +1,969 @@
<template>
<div class="right-box">
<a-card :bodyStyle="tstyle" :bordered="false">
<div class="title"><i class="iconfont icon-ERP_zhuyi"></i><span>注意事项</span></div>
<div class="content">
<div class="tip" v-if="excuteRules.length > 0">
<div class="rules-label" v-for="(rule, rindex) in excuteRules" :key="rindex">
<i class="iconfont icon-chenggong Success" v-if="rule.errorType === 'Success'"></i>
<i class="iconfont icon-xiazaishibai Warning" v-else-if="rule.errorType === 'Warning'"></i>
<i class="iconfont icon-shibai Error" v-else-if="rule.errorType === 'Error'"></i>
<span>{{ rule.resultName }}</span>
<i @click="handleOpenRule(rule)" class="icon-shujushangchuan-shixin iconfont rule-icon"></i>
</div>
</div>
<div class="tip" v-else-if="excuteRulesType === 'success'">
<div class="rules-label">
<i class="iconfont icon-chenggong Success"></i><span>校验完成无异常信息</span>
</div>
</div>
<div class="tip" v-else-if="excuteRulesType === 'fail'">
<div class="rules-label"><i class="iconfont icon-shibai Warning"></i><span>校验失败</span></div>
</div>
<div class="tip no-data" v-else>
<i class="iconfont icon-meiyoudingdan"></i>
<div class="text">
暂无校验, <a-button size="small" type="link" class="btn" @click="checkFun"> </a-button>
</div>
</div>
</div>
</a-card>
<a-card :bodyStyle="tstyle" :bordered="false">
<div class="title"><i class="iconfont icon-fuwu"></i><span>服务项目</span></div>
<div class="content">
<div
class="items"
v-for="(serive, sindex) in bookingServiceItem"
:key="sindex"
:class="{ active: locaService.includes(serive.code) }"
@click="saveService(serive)">
{{ serive.name }}
</div>
</div>
</a-card>
<a-card :bodyStyle="tstyle" :bordered="false">
<div class="title"><i class="iconfont icon-shijian1"></i><span>船舶动态
<button class="btn-refsh" @click="handleRefsh"><span
class="iconfont icon-shuaxin"
:style="{ fontSize: '17px' }"></span>刷新</button>
</span>
</div>
<div class="content">
<a-spin :spinning="btnLoading" >
<div class="DataTime">
<div>
<span>
<!-- <i class="iconfont icon-chuanbo"></i> -->
POL
</span>
<div>
<p>
<span>ETA:</span><span>{{ handleTime(details.startETA) }}</span>
</p>
<p>
<span>ATA:</span><span>{{ handleTime(details.startATA) }}</span>
</p>
</div>
</div>
<div>
<span> </span>
<div>
<p>
<span>ETD:</span><span>{{ handleTime(details.ygtETD) }}</span>
</p>
<p>
<span>ATD:</span><span>{{ handleTime(details.atd) }}</span>
</p>
</div>
</div>
<div>
<span>
<!-- <i class="iconfont icon-chuanfanguanli-chuanfanshenqing"></i> -->
POT
</span>
<div>
<p>
<span>ATA:</span><span>{{ handleTime(details.middleATA) }}</span>
</p>
<p>
<span>ATD:</span><span>{{ handleTime(details.middleATD) }}</span>
</p>
</div>
</div>
<div>
<span>
<!-- <i class="iconfont icon-beizhu1"></i> -->
POD
</span>
<div>
<p>
<span>ETA:</span><span>{{ handleTime(details.eta) }}</span>
</p>
<p>
<span>ATA:</span><span>{{ handleTime(details.ata) }}</span>
</p>
</div>
</div>
</div>
</a-spin>
</div>
</a-card>
<a-card :bodyStyle="tstyle" :bordered="false">
<a-spin :spinning="spinning" :delay="delayTime">
<div class="title"><i class="iconfont icon-fuwu"></i><span>货物状态</span></div>
<div class="content">
<a-tooltip v-for="(serive, sindex) in booGoodsStatusItem" :key="`${serive.configId}_${sindex}`">
<template v-if="serive.finishTime || serive.remark" #title>
<p v-if="serive.finishTime">{{ serive.finishTime }}</p>
<p v-if="serive.remark">{{ serive.remark }}</p>
<p v-if="serive.extData">{{ serive.extData }}</p>
</template>
<div
class="items"
:class="{ active: serive.finishTime, active1: serive.remark }"
@click="saveGoodsStatus(serive)">
{{ serive.statusName }}
<div class="edit" @click.stop="FnOpenEdit(serive)"><a-icon type="edit" /></div>
</div>
</a-tooltip>
</div>
</a-spin>
</a-card>
<a-modal v-model="GoodsStatusVisible" width="600px" title="编辑" @ok="GoodsStatusHandleOk">
<a-form :form="StatusVisibleForm">
<a-row>
<a-col :span="12">
<a-form-item label="完成时间" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
<a-date-picker show-time placeholder="完成时间" v-decorator="['finishTime']" />
</a-form-item>
</a-col>
<a-col :span="12" v-if="GoodsStatusEditData.systemCode == 'SQXS'">
<a-form-item label="显示天数" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
<a-input placeholder="请输入显示天数" v-decorator="['extData']" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="备注" :labelCol="labelCol2" :wrapperCol="wrapperCol2" has-feedback>
<!-- <a-input placeholder="请输入备注" v-decorator="['remark']" /> -->
<a-textarea placeholder="请输入备注" v-decorator="['remark']" :auto-size="{ minRows: 2 }" />
</a-form-item>
</a-col>
</a-row>
</a-form>
</a-modal>
<a-card :bodyStyle="tstyle" :bordered="false">
<div class="title">
<i class="iconfont icon-beizhu1"></i><span>备注</span>
<span class="right" @click="addRemark"><i class="iconfont icon-jiahao2fill"></i>新增备注</span>
</div>
<div class="content">
<div class="remark" v-for="(remark, rindex) in details.remark" :key="rindex">
<div class="remark-main">
<div class="top"><i class="iconfont icon-yuandian"></i>{{ remark.remark }}</div>
<div class="bottom">{{ remark.updatedTime || remark.createdTime }} {{ remark.updatedUserName }}</div>
</div>
<div class="remark-btn" @click="editRemark(remark)"><i class="iconfont icon-bianji1"></i></div>
<a-popconfirm title="你确定要删除这个备注吗?" ok-text="" cancel-text="" @confirm="deleteRemark(remark)">
<div class="remark-btn"><i class="iconfont icon-shanchu1"></i></div>
</a-popconfirm>
</div>
<div class="remark no-data" v-if="!details.remark || details.remark.length === 0">
<i class="iconfont icon-wushuju"></i>
<div class="text">暂无内容</div>
</div>
</div>
</a-card>
<a-card :bodyStyle="tstyle" :bordered="false">
<div class="title"><i class="iconfont icon-fujian-wenjian"></i><span>附件</span></div>
<div class="content">
<a-button type="primary" class="file-btn" @click="addFile"></a-button>
<div class="file" v-for="(file, findex) in details.file" :key="findex">
<div class="top">
<span class="left">
<i class="iconfont icon-Excel" v-if="['xls', 'xlsx'].includes(getFileType(file.fileName))"></i>
<i class="iconfont icon-tupian" v-else-if="['jpg', 'jpeg', 'png'].includes(getFileType(file.fileName))"></i>
<i class="iconfont icon-pdf" v-else-if="['pdf'].includes(getFileType(file.fileName))"></i>
<i class="iconfont icon-file-word" v-else></i>
{{ file.fileName }}
</span>
<span class="right"><i class="iconfont icon-yulan" @click="getFileFun(file)"></i><i
class="iconfont icon-arrow-"></i></span>
</div>
<div class="bottom">
<span><i class="iconfont icon-leixing"></i>{{ file.typeName }}</span>
<span><i class="iconfont icon-yonghu-yuan"></i>{{ file.createdUserName }}</span>
<span><i class="iconfont icon-shijian1"></i>{{ file.createdTime }}</span>
</div>
</div>
<div class="no-data" v-if="!details.file || details.file.length === 0">
<i class="iconfont icon-wushuju"></i>
<div class="text">暂无附件</div>
</div>
</div>
</a-card>
<a-card :bodyStyle="tstyle" :bordered="false">
<div class="title" :style="{ marginBottom: '10px' }">
<i class="iconfont icon-lightning-full"></i><span>订单及货运动态</span>
</div>
<div class="content">
<div class="booking-log" v-for="(bookingLog, bindex) in details.statuslog" :key="bindex">
<div
class="log"
:class="{ hideline: bindex === details.statuslog.length - 1 && bookingLog.detail.length === 0 }"
@click="bookingShow(bookingLog)">
<span class="log-time">{{ bookingLog.opTime }}</span>
<i class="iconfont icon-jian icon" v-if="bookingLog.detail.length > 0 && bookingLog.isChecked"></i>
<i class="iconfont icon-jia icon" v-else-if="bookingLog.detail.length > 0 && !bookingLog.isChecked"></i>
<i class="iconfont icon-tongzhi icon" v-else></i>
<span class="log-name">{{ bookingLog.status }}</span>
</div>
<div class="child-list" v-if="bookingLog.detail.length > 0 && bookingLog.isChecked">
<div class="child-log" v-for="(child, cindex) in bookingLog.detail" :key="cindex">
<span class="log-time">{{ child.opTime }}</span>
<i class="iconfont icon-yuanxuankuang2 icon"></i>
<span class="log-name">{{ child.status }} <span class="min-log" v-if="child.cntrno">:{{ child.cntrno
}}</span>
</span>
</div>
</div>
</div>
<div class="no-data" v-if="!details.statuslog || details.statuslog.length === 0">
<i class="iconfont icon-queshengye_zanwushuju" :style="{ fontSize: '50px' }"></i>
<div class="text">暂无动态</div>
</div>
</div>
</a-card>
<a-collapse class="collapse-box" :bordered="false" expandIconPosition="right" v-model="showKey">
<a-collapse-panel key="1">
<template slot="header">
<div class="title"><i class="iconfont icon-rizhi"></i><span>日志</span></div>
</template>
<div class="cargo-info">
<div class="info-header">
<span>修改人</span>
<span>修改时间</span>
</div>
<div v-for="(log, lindex) in details.log" :key="lindex">
<div class="list">
<span class="btn">{{ log.createdUserName }}</span>
<span class="btn">
{{ log.createdTime }}
<!-- <span class="more"> -->
<i
class="iconfont icon-xia more"
v-if="log.details.length > 0"
:class="!log.showMore ? 'hide' : 'show'"
@click="showLogMore(lindex)"></i>
<!-- </span> -->
</span>
</div>
<div class="more-detail" v-if="log.details.length > 0 && log.showMore">
<div class="detail-single" v-for="(child, cindex) in log.details" :key="cindex">
<template v-if="log.type != 'Trace'">
<div class="old">
<span class="o-title">{{ child.field || '字段' }} :</span>
<span class="content">{{ child.oldValue }}</span>
</div>
<div class="line">改为</div>
</template>
<div class="new">
<span class="o-title" v-if="log.type != 'Trace'">{{ child.field || '' }}:</span>
<span class="content">{{ child.newValue }}</span>
</div>
</div>
</div>
</div>
</div>
</a-collapse-panel>
</a-collapse>
<a-modal
title="新增备注"
:width="700"
:visible="remarkModelvisible"
:confirmLoading="bookingModelconfirm"
:maskClosable="false"
cancelText="取消"
okText="确定"
@ok="handleModelSubmit"
@cancel="handleModelCancel">
<a-textarea v-model="remarkVal" :auto-size="{ minRows: 5, maxRows: 7 }" />
</a-modal>
<a-modal
title="添加附件"
:width="900"
:visible="fileModelvisible"
:confirmLoading="uploading"
:maskClosable="false"
cancelText="关闭"
okText="保存"
@ok="handleUpload"
@cancel="fileModelCancel">
<div class="clearfix uplad-bg uplad-file-bg">
<span class="tip">1. 选择上传文件</span>
<a-upload
:file-list="upFileList"
:remove="handleRemove"
:disabled="upFileList.length > 0"
:before-upload="beforeUpload"
:style="{ width: '680px' }">
<a-button> <a-icon type="upload" /> 选择文件 </a-button>
</a-upload>
<span class="format">支持格式xlsxlsxpdftxtpms</span>
</div>
<div class="uplad-bg uplad-type">
<span class="tip">2. 选择文件类型</span>
<div class="upload-label">文件类型</div>
<a-select style="width: 120px" :value="attachName" @change="handleAttachChange">
<a-select-option v-for="(attach, aindex) in bookingAttachType" :key="attach.name" :value="aindex">
{{ attach.name }}
</a-select-option>
</a-select>
</div>
</a-modal>
<a-modal
title="规则反馈需求"
:width="1000"
:visible="roleFlag"
:maskClosable="false"
cancelText="取消"
okText="提交"
@ok="handleModelSubmit"
@cancel="handleModelCancel">
<a-form :form="ruleForm" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }" @submit="handleModelSubmit">
<a-form-item label="提示信息">
脚尖提醒脚尖提醒脚尖提醒脚尖提醒脚尖提醒
</a-form-item>
<a-form-item label="意见类型">
<a-select
v-decorator="[
'gender',
{ rules: [{ required: true, message: '请选择意见类型!' }] },
]"
placeholder="请选择意见类型"
style="width: 200px;margin-right: 10px;"
>
<a-select-option value="male">
male
</a-select-option>
<a-select-option value="female">
female
</a-select-option>
</a-select>
<span>当前状态:新增</span>
</a-form-item>
<a-form-item label="意见内容">
<a-textarea
v-decorator="['note', { rules: [{ required: true, message: '请输入意见内容' }] }]"
/>
</a-form-item>
<a-form-item label="意见日志">
<div>2023-04-01 10:05:00</div>
<div>2023-04-01 10:05:00</div>
<div>2023-04-01 10:05:00</div>
</a-form-item>
</a-form>
</a-modal>
</div>
</template>
<script>
import {
AddRemark,
AddFile,
ExcuteRulesOceanBooking,
BookingOrderDownload,
BookingOrderDeleteRemark,
SaveServiceItem,
BookingOrderGetGoodsStatusList,
BookingOrderSaveGoodsStatus,
refreshSailingDate
} from '@/api/modular/main/BookingLedger'
export default {
name: '',
props: {
details: {
type: Object,
default: () => {
return {}
}
},
excuteRules: {
type: Array,
default: () => {
return []
}
},
excuteRulesType: {
type: String,
default: () => {
return ''
}
}
},
data() {
return {
delayTime: 500,
roleFlag: false,
spinning: false,
StatusVisibleFlag: true,
id: this.id,
ruleForm: this.$form.createForm(this),
isCopy: this.$route.query.isCopy,
tstyle: { padding: '0 15px 15px', 'margin-bottom': '10px', background: '#fff' },
remarkModelvisible: false,
bookingModelconfirm: false,
remarkVal: '',
showKey: [],
btnLoading: false,
fileModelvisible: false,
fileModelconfirm: false,
authorization: 'authorization-text',
file: {},
upFileList: [],
uploading: false,
realTimePercent: null,
bookingServiceItem: [],
booGoodsStatusItem: [],
bookingAttachType: [],
attachName: '',
attachCode: '',
editRemarkVal: null,
GoodsStatusVisible: false,
GoodsStatusEditData: {},
StatusVisibleForm: this.$form.createForm(this),
labelCol: {
xs: { span: 24 },
sm: { span: 8 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
labelCol2: {
xs: { span: 24 },
sm: { span: 4 }
},
wrapperCol2: {
xs: { span: 24 },
sm: { span: 20 }
}
}
},
computed: {
locaService() {
if (!this.details || Object.keys(this.details).length === 0) {
return []
}
return this.details.item.map((item, index) => {
return item.code
})
},
locaGoodsStatus() {
if (!this.details) {
return []
}
if (this.details.goodsStatus) {
const data = []
this.details.goodsStatus.forEach(item => {
if (item.finishTime || item.remark) {
data.push(item.configId)
}
})
return data
} else {
return []
}
}
},
created() {
this.$bus.$on('WebTest001', val => {
this.WebTest001(val)
})
this.init()
},
watch: {
'$route.query': {
immediate: true,
handler(nD, oD) {
if (this.$route.query.isCopy) {
}
if (this.$route.name === 'BookingDetail') {
this.id = this.$route.query.id
this.init()
}
}
}
},
methods: {
handleOpenRule() {
this.roleFlag = true
},
handleRefsh() {
this.btnLoading = true
refreshSailingDate({ id: this.details.id }).then(res => {
if (res.success) {
this.btnLoading = false
this.$emit('handleRefsh', res.data)
} else {
this.$message.error(res.message)
this.btnLoading = false
}
})
},
handleTime(time) {
let Rdata = '-'
if (time && time.split(':').length == 3) {
Rdata = `${time.split(':')[0]}:${time.split(':')[1]}`
}
return Rdata
},
init() {
this.bookingAttachType = this.$options.filters['dictData']('booking_attach_type')
this.bookingServiceItem = this.$options.filters['dictData']('booking_service_item')
BookingOrderGetGoodsStatusList({ bookingId: this.id }).then(res => {
this.booGoodsStatusItem = res.data
if (this.$route.query.isCopy) {
this.booGoodsStatusItem.forEach(item => {
delete item.isPublic
delete item.finishUserId
delete item.finishTime
delete item.finishUser
delete item.remark
delete item.extData
})
this.details.goodsStatus.forEach(item => {
delete item.isPublic
delete item.finishUserId
delete item.finishTime
delete item.finishUser
delete item.remark
delete item.extData
})
}
})
},
checkFun() {
this.$message.loading({ content: '校验中...' })
ExcuteRulesOceanBooking(this.id)
.then(res => {
if (res.success) {
this.$message.destroy()
if (!res.succ) {
this.$message.error(res.data.msg)
} else {
this.$message.success({ content: '校验完成' })
}
this.$emit('rules', {
rows: res.data.rows,
type: res.data.succ ? 'success' : 'fail'
})
} else {
this.$message.error(res.message)
}
})
.catch(() => {
this.$message.destroy()
this.$message.success({ content: '校验失败' })
})
},
addRemark() {
if (!this.id) {
this.$message.error('请先保存主单')
return false
}
this.remarkModelvisible = true
this.remarkVal = ''
},
handleModelSubmit() {
if (!this.id) {
this.$message.error('请先保存主单')
return false
}
AddRemark({
id: this.editRemarkVal ? this.editRemarkVal.id : 0,
pId: this.id,
remark: this.remarkVal
})
.then(res => {
if (res.success) {
this.$message.info('备注提交成功')
this.editRemarkVal = null
this.handleModelCancel()
this.$emit('upDateRight')
}
})
.catch(err => {
console.log(err)
})
},
editRemark(data) {
this.remarkModelvisible = true
this.remarkVal = data.remark
this.editRemarkVal = data
},
deleteRemark(data) {
BookingOrderDeleteRemark(data.id).then(res => {
this.$message.success('成功删除')
this.$emit('upDateRight')
})
},
handleModelCancel() {
this.remarkModelvisible = false
this.editRemarkVal = null
},
getFileType(val) {
if (val) {
return val.substr(val.lastIndexOf('.') + 1)
} else {
return ''
}
},
addFile() {
if (!this.id) {
this.$message.error('请先保存主单')
return false
}
this.fileModelvisible = true
},
fileModelCancel() {
this.upFileList = []
this.attachCode = ''
this.attachName = ''
this.fileModelvisible = false
},
handleRemove(file) {
const index = this.upFileList.indexOf(file)
const newFileList = this.upFileList.slice()
newFileList.splice(index, 1)
this.upFileList = newFileList
},
beforeUpload(file) {
if (this.upFileList.length > 1) {
return false
}
this.upFileList = [...this.upFileList, file]
return false
},
WebTest001(val) {
this.beforeUpload(val.upFileList)
this.attachCode = val.attachCode
this.attachName = val.attachName
this.handleUpload()
},
handleUpload() {
const { upFileList, attachCode, attachName } = this
if (upFileList.length === 0) {
this.$message.error('请上传文件')
return false
}
if (!attachCode || !attachName) {
this.$message.error('请选择附件类型')
return false
}
const formData = new FormData()
formData.append('file', upFileList[0])
formData.append('BookingId', this.id)
formData.append('TypeCode', attachCode)
formData.append('TypeName', attachName)
this.uploading = true
AddFile(formData)
.then(res => {
if (res.success) {
this.$message.success('上传成功')
this.$emit('upDateRight')
} else {
this.$message.error(res.message)
}
this.uploading = false
this.fileModelCancel()
})
.catch(err => {
this.$message.error(err.message)
})
},
getFileFun(data) {
this.$message.success(`下载打印文件 ${data.fileName} 中...`)
BookingOrderDownload({ id: data.id }).then(res => {
this.pdfUrl = window.URL.createObjectURL(new Blob([res], { type: 'application/pdf;charset=utf-8' }))
const fname = data.fileName //
const link = document.createElement('a')
link.href = this.pdfUrl
link.setAttribute('download', fname)
document.body.appendChild(link)
link.click()
})
},
handleAttachChange(index) {
this.attachCode = this.bookingAttachType[index].code
this.attachName = this.bookingAttachType[index].name
},
bookingShow(data) {
data.isChecked = !data.isChecked
this.$forceUpdate()
},
showLogMore(index) {
this.details.log[index].showMore = !this.details.log[index].showMore
this.$forceUpdate()
},
saveService(data) {
if (!this.id) {
this.$message.error('请先保存主单')
return false
}
if (!this.locaService.includes(data.code)) {
this.locaService.push(data.code)
this.details.item.push({
code: data.code,
value: data.name
})
} else {
const index = this.locaService.indexOf(data.code)
this.locaService.splice(index, 1)
this.details.item.splice(index, 1)
}
this.saveServiceItem()
},
saveServiceItem() {
SaveServiceItem({
bookingId: this.id,
item: this.details.item
})
.then(res => {
if (res.success) {
console.log('== 服务项目设置成功 ==')
}
})
.catch(err => {
console.log(err)
})
},
GoodsStatusHandleOk() {
const {
StatusVisibleForm: { validateFields }
} = this
this.GoodsStatusVisible = true
validateFields((errors, values) => {
if (!errors || this.GoodsStatusEditData.systemCode === 'SQXS') {
for (const key in values) {
if (typeof values[key] === 'object' && !(values[key] === null)) {
values[key] = JSON.stringify(values[key])
}
}
let date = ''
if (values.finishTime) {
if (values.finishTime._d) {
date = new Date(+new Date(values.finishTime._d) + 8 * 3600 * 1000)
} else {
if (values.finishTime.split('"').length == 3) {
date = new Date(+new Date(values.finishTime.split('"')[1]))
} else {
date = new Date(+new Date(values.finishTime) + 8 * 3600 * 1000)
}
}
}
const data = {
finishTime: date ? date.toISOString() : '',
remark: values.remark,
extData: values.extData
}
const AData = { ...this.GoodsStatusEditData, ...data }
if (!this.id) {
this.$message.error('请先保存主单')
return false
}
if (!this.locaGoodsStatus.includes(this.GoodsStatusEditData.configId)) {
this.locaGoodsStatus.push(this.GoodsStatusEditData.configId)
this.details.goodsStatus.push({ ...AData })
}
const ApiData = {
bookingId: this.id,
item: []
}
console.log(this.details.goodsStatus)
this.details.goodsStatus.forEach(item => {
if (item.finishTime || item.remark) {
if (item.configId == this.GoodsStatusEditData.configId) {
ApiData.item.push(AData)
} else {
ApiData.item.push(item)
}
}
})
BookingOrderSaveGoodsStatus(ApiData)
.then(res => {
if (res.success) {
// let data = []
// this.booGoodsStatusItem.forEach(item => {
// let type = true
// ApiData.item.forEach(item2 => {
// if (item.configId == item2.configId) {
// type = false
// data.push(item2)
// }
// })
// if (type) {
// data.push(item)
// }
// })
this.$nextTick(() => {
this.booGoodsStatusItem = res.data
this.$emit('inGoodsSave', true)
this.details.goodsStatus = res.data
setTimeout(() => {
this.$emit('inGoodsSave', false)
}, 400)
})
this.$message.success('货物状态设置成功')
this.GoodsStatusVisible = false
}
})
.catch(err => {
console.log(err)
})
} else {
console.log(errors, values)
}
})
// this.GoodsStatusVisible = false
},
FnOpenEdit(data) {
if (this.$route.query.isCopy) {
this.$message.error('请先保存')
return false
}
setTimeout(() => {
this.GoodsStatusEditData = data
this.GoodsStatusVisible = true
this.$nextTick(() => {
this.StatusVisibleForm.setFieldsValue({
finishTime: data.finishTime ? data.finishTime : '',
remark: data.remark ? data.remark : '',
extData: data.extData ? data.extData : ''
})
})
console.log(this.GoodsStatusEditData)
}, 100)
},
saveGoodsStatus(data) {
if (!this.id || this.$route.query.isCopy) {
this.$message.error('请先保存')
return false
}
if (!this.locaGoodsStatus.includes(data.configId) || !data.finishTime) {
// this.locaGoodsStatus.push(data.configId)
// this.details.goodsStatus.push({ ...data })
this.savegoodsStatusItem(data, 'push')
} else {
const that = this
this.$confirm({
title: '是否取消',
okText: '是',
okType: 'danger',
cancelText: '否',
onOk() {
const index = that.locaGoodsStatus.indexOf(data.configId)
that.locaGoodsStatus.splice(index, 1)
that.details.goodsStatus.forEach((item, index2) => {
if (item.configId == data.configId) {
that.$emit('inGoodsSave', true)
that.details.goodsStatus.splice(index2, 1)
setTimeout(() => {
that.$emit('inGoodsSave', false)
}, 1200)
}
})
that.savegoodsStatusItem(data, 'splice')
},
onCancel() {
return false
}
})
}
},
savegoodsStatusItem(data, type) {
const ApiData = {
bookingId: this.$route.query.id,
item: []
}
console.log(this.details.goodsStatus, 132213)
this.details.goodsStatus.forEach(item => {
if (item.finishTime || item.remark) {
ApiData.item.push(item)
}
})
if (type === 'push' && !data.remark) {
const date = new Date(+new Date() + 8 * 3600 * 1000)
ApiData.item.push({ ...data, finishTime: date.toISOString() })
}
if (type === 'push' && data.remark) {
const date = new Date(+new Date() + 8 * 3600 * 1000)
ApiData.item.forEach(ite => {
if (ite.systemCode === data.systemCode) {
ite.finishTime = date.toISOString()
}
})
}
this.spinning = true
BookingOrderSaveGoodsStatus(ApiData)
.then(res => {
if (res.success) {
this.booGoodsStatusItem = res.data
this.$emit('inGoodsSave', true)
this.details.goodsStatus = res.data
setTimeout(() => {
this.$emit('inGoodsSave', false)
}, 400)
}
this.spinning = false
})
.catch(err => {
console.log(err)
this.spinning = false
})
}
}
}
</script>
<style lang="less" scoped>
@import url('../index.less');
@import url('../style/rightContent.less');
.active1 {
border: 1px solid #13c2c2 !important;
}
.rule-icon{
color: dodgerblue;
margin-left: 10px;
cursor: pointer;
position: relative;
z-index: 99;
}
.btn-refsh {
border: none;
font-size: 14px;
color: #666;
height: 20px;
cursor: pointer;
color: black;
background: #fff;
.iconfont {
font-size: 16px;
margin-right: 6px;
font-weight: 400;
}
}
</style>

@ -0,0 +1,180 @@
<template>
<div class="operation-area">
<a-card :bordered="false" :bodyStyle="{ padding: '10px', 'margin-bottom': '10px' }">
<div class="btn-list more-view">
<div class="area-order-title" v-if="scrollTop > 100">
<i class="iconfont icon-dingdan"></i> 当前分单号 <span>{{ details.hblno }}</span>
</div>
<button @click="copyFun"><span class="iconfont icon-fuzhi1"></span>复制</button>
<button @click="saveFun"><span class="iconfont icon-icon_baocun"></span>保存</button>
<button @click="FSnhowPrintModal"><span class="iconfont icon-printing"></span>打印</button>
<a-popconfirm
title="确定删除分单?"
ok-text="是"
cancel-text="否"
@confirm="removeOrder"
@cancel="cancelRemove"
>
<button><span class="iconfont icon-shanchu1"></span>删除</button>
</a-popconfirm>
</div>
</a-card>
<!-- 打印弹窗 start -->
<a-modal width="50vw" :maskClosable="false" v-model="PrintModalVisible" title="打印">
<template slot="footer"> <span></span> </template>
<a-spin tip="数据加载中..." :spinning="spinning">
<div class="PrintMain">
<div class="PrintTitle">
<p>默认打印格式为<span>pdf</span>,如需其他格式请选择</p>
<p>
打印格式
<a-radio-group v-model="PrintType" name="radioGroup">
<a-radio value="1">pdf</a-radio>
<a-radio value="2">xlsx</a-radio>
<a-radio value="3">docx</a-radio>
<a-radio value="4">精确打印</a-radio>
</a-radio-group>
</p>
</div>
<a-row class="PrintMainBox">
<a-col
v-for="(item, index) in templateType"
:key="item.id"
@click="FnCilckTemplateType(item.id)"
class="items"
:span="11"
:offset="index % 2 == 0 ? 0 : 1"
>
<span>·</span>{{ item.displayName }}
</a-col>
</a-row>
</div>
</a-spin>
</a-modal>
<!-- 打印弹窗 end -->
</div>
</template>
<script>
import { BookingOrderPrintTemplateWithHistoryList, BookingOrderPrintOrder } from '@/api/modular/main/BookingLedger'
export default {
props: {
details: {
type: Object,
default: () => {
return {}
}
},
scrollTop: {
type: Number,
default: 0
}
},
data() {
return {
PrintModalVisible: false,
templateType: [],
PrintType: '1',
spinning: false
}
},
mounted() {},
watch: {
PrintType(newdata, oldData) {
let printType = newdata == 4 ? 20 : 10
let print = oldData == 4 ? 20 : 10
if (printType != print) {
this.GetPrintData(this.cateCode, printType)
}
}
},
methods: {
refreshPage() {
this.$emit('refresh')
},
cancelRefresh() {
return false
},
saveFun() {
this.$emit('save')
},
copyFun() {
this.$emit('copy')
},
GetPrintData(cateCode, printType) {
let Data = {
cateCode,
printType
}
this.spinning = true
BookingOrderPrintTemplateWithHistoryList(Data).then(res => {
this.templateType = res.data
this.spinning = false
this.PrintModalVisible = true
})
},
FSnhowPrintModal() {
if (this.details.id) {
this.cateCode = 'fendan_print'
let printType = ''
if (this.printType == 4) {
printType = 20
} else {
printType = 10
}
this.PrintType = '1'
this.GetPrintData(this.cateCode, printType)
// BookingOrderPrintTemplateWithHistoryList().then(res => {
// this.templateType = []
// res.data.forEach(item => {
// if (item.isSub) {
// this.templateType.push(item)
// }
// })
// })
this.PrintModalVisible = true
} else {
this.$message.warning('请先保存分单')
}
},
FnCilckTemplateType(templateId) {
this.$message.success(`搜索文件中...`)
let printType = this.PrintType == 4 ? 20 : 10
BookingOrderPrintOrder({
templateId,
bookingId: this.details.id,
cateCode: this.cateCode,
type: this.PrintType,
printType
})
.then(res => {
if (!res.success) {
this.$message.error(res.message)
} else {
if (this.PrintType == 1) {
window.open(` ${process.env.VUE_APP_API_BASE_URL}/BookingOrder/ViewPrintPdf/${res.data}`, '_blank')
} else {
window.open(
` ${process.env.VUE_APP_API_BASE_URL}/BookingOrder/downloadPrint?filename=${res.data}`,
'_blank'
)
}
}
})
.catch(err => {
console.log(err)
})
},
removeOrder() {
this.$emit('remove')
},
cancelRemove() {
console.log('= 取消删除 =')
}
}
}
</script>
<style lang="less" scoped>
@import url('../index.less');
@import url('../style/sedOperationArea.less');
</style>

@ -0,0 +1,796 @@
<template>
<div class="booking-detail" style="margin-top:0;">
<a-row :gutter="24" :class="showSecNav ? 'show-content' : 'hide-content'" style="margin-left:0;">
<div class="nav-min-icon" v-if="!showSecNav" @click="openNav"><i class="iconfont icon-liebiao"></i></div>
<a-col :span="showSecNav ? 5 : 0" v-if="showSecNav">
<div class="sed-order-list">
<div class="sed-order-title">
<i class="iconfont icon-liebiao"></i><span class="tit">分提单列表</span
><span class="right" @click="openNav"></span>
</div>
<div class="sec-order">
<div
class="sed-order-label"
v-for="(sedDetail, sindex) in sedOrderList"
:key="sindex"
:class="{ active: editIndex === sindex }"
>
<div class="left" @click.stop="changeOrder(sindex)">
<i class="iconfont icon-dingdan"></i>分单{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
</div>
<span class="no-save" v-if="sedDetail.isNoSave && editIndex !== sindex"> </span>
<a-popconfirm
title="确定删除分单?"
ok-text="是"
cancel-text="否"
@confirm.stop="removeSedOrderFun(sedDetail, sindex)"
@cancel="cancelRemove"
>
<span class="remove-btn iconfont icon-shanchu1"></span>
</a-popconfirm>
</div>
<div class="sed-order-btn" @click="addSedOrder"><i class="iconfont icon-jiahao2fill"></i>添加分单</div>
</div>
</div>
</a-col>
<a-col :span="showSecNav ? 19 : 24" style="padding-left:0;">
<template v-if="editDetails">
<div class="order-title">
<i class="iconfont icon-dingdan"></i> 当前分单号 <span>{{ editDetails.hblno }}</span>
</div>
<sedOperationArea
:details="editDetails"
:scrollTop="scrollTop"
:class="scrollTop < 100 ? 'normal-nav' : 'fixed-nav'"
@save="saveFun"
@copy="copyFun"
@remove="removeFun"
></sedOperationArea>
<ul class="sec-parent-tabs-box">
<div class="parents-tabs-top">
<li @click="changeParentTabs('1')" :class="{ active: mainOrderActiveKey === '1' }">
<input type="radio" name="tabs" id="stab1" checked />
<label class="tabs-label" for="tab1">基础信息</label>
</li>
<li @click="changeParentTabs('2')" :class="{ active: mainOrderActiveKey === '2' }">
<input type="radio" name="tabs" id="stab2" />
<label class="tabs-label" for="tab2">EDI补充信息</label>
</li>
</div>
<div class="parents-tabs-content">
<div id="tab-content1" class="tab-content" v-show="mainOrderActiveKey === '1'">
<div class="pane-box">
<!-- 基本信息 -->
<basicInfo
ref="basicInfo"
:type="type"
:details="editDetails"
:rules="basicRules"
:ishd="true"
:inSave="inSave"
isParent="child"
@changeDetail="changeDetailFun"
></basicInfo>
<!-- 收发通信息 -->
<mailingInfo
ref="mailingInfo"
:details="editDetails"
:rules="mailingRules"
:inSave="inSave"
:ishd="true"
isParent="child"
@changeDetail="changeDetailFun"
@pkgsEnCapital="pkgsEnCapitalFun"
></mailingInfo>
<!-- 货物信息 -->
<cargoInfo
ref="cargoInfo"
:details="editDetails"
:rules="cargoRules"
:inSave="inSave"
isParent="child"
@changeDetail="changeDetailFun"
></cargoInfo>
<!-- 签单信息 -->
<billInfo
ref="billInfo"
:details="editDetails"
:rules="billRules"
:inSave="inSave"
isParent="child"
@changeDetail="changeDetailFun"
></billInfo>
<!-- 备注信息 -->
<remarksInfo
ref="remarksInfo"
:details="editDetails"
:rules="remarksRules"
:inSave="inSave"
isParent="child"
@changeDetail="changeDetailFun"
></remarksInfo>
<!-- 箱型 -->
<goodsTable
ref="goodsTable"
:details="editDetails"
:rules="tableRules"
:inSave="inSave"
isParent="child"
pType="secOrder"
@changeDetail="changeDetailFun"
></goodsTable>
</div>
</div>
<div id="tab-content2" class="tab-content" v-show="mainOrderActiveKey === '2'">
<ediMore
class="pane-box"
ref="ediMore"
:rules="ediRules"
:details="editDetails"
:inSave="inSave"
isParent="child"
@changeDetail="changeDetailFun"
v-if="!inPageLoading"
></ediMore>
</div>
</div>
</ul>
</template>
<template v-else>
<div class="sed-no-data">
<i class="iconfont icon-meiyoudingdan"></i>
<div class="no-data-text">暂无数据 <span class="btn" @click="addSedOrder"></span></div>
</div>
</template>
</a-col>
</a-row>
</div>
</template>
<script>
import sedOperationArea from './sedOperationArea'
import basicInfo from './basicInfo'
import mailingInfo from './mailingInfo'
import cargoInfo from './cargoInfo'
import billInfo from './billInfo'
import remarksInfo from './remarksInfo'
import goodsTable from './goodsTable'
import ediMore from './ediMore'
import rules from '../rules'
import { BookingOrderSave, DeleteBookingOrder } from '@/api/modular/main/BookingLedger'
const sedDetail = {
id: 0,
parentId: 0,
customername: '',
customerid: '',
carrier: 'CMA',
carrierid: 'CMA',
forwarder: '',
forwarderid: '',
pono: '',
mblno: '',
hblno: '',
epCode: '',
custno: '',
contractno: '',
vessel: '',
voyno: '',
voynoinner: '',
lanecode: '',
etd: '',
atd: '',
lanename: '',
shipagency: '',
shipagencyid: '',
lineName: '',
sale: '',
saleid: '',
op: '',
opid: '',
doc: '',
docid: '',
custservice: '',
custserviceid: '',
route: '',
routeid: '',
dzRemark: '',
czRemark: '',
shipper: '',
feeself: false,
consignee: '',
notifyparty: '',
yard: '',
yardid: '',
customser: '',
customserid: '',
trucker: '',
truckerid: '',
agentname: '',
agentid: '',
warehouse: '',
warehouseID: '',
eta: '',
closingdate: '',
closedocdate: '',
closevgmdate: '',
portload: '',
portloadid: '',
transport: '',
transportid: '',
portdischarge: '',
portdischargeid: '',
destination: '',
destinationid: '',
placedelivery: '',
placedeliveryid: '',
placereceipt: '',
placereceiptid: '',
pkgs: 0,
kindpkgs: '',
kgs: 0,
cbm: 0,
yardremark: '',
yardcontract: '',
yardcontracttel: '',
yardcontractemail: '',
pkgstotal: '',
kgstotal: '',
cbmtotal: '',
marks: '',
goodsname: '',
goodscode: '',
cargoid: '',
hscode: '',
description: '',
totalno: '',
issuetype: '',
issuedate: '',
issueplace: '',
issueplaceid: '',
nobill: '',
copynobill: '',
prepardat: '',
prepardatid: '',
payableat: '',
payableatid: '',
blfrt: '',
thirdpayaddr: '',
service: '',
reeferf: '',
tempset: '',
tempid: '',
tempmin: '',
tempmax: '',
humidity: '',
dclass: '',
dunno: '',
dpage: '',
dlabel: '',
linkman: '',
soremark: '',
siremark: '',
ctnInputs: [],
weituo: '',
freightpayer: '',
scaccode: '',
itncode: '',
iscontainersoc: 0,
bookingEDIExt: {
weiTuoFang: '',
ediAttn: '',
ediAttnTel: '',
ediAttnMail: '',
sendCode: '',
receiveCode: '',
amsConsignee: '',
amsNotifyParty: '',
opEName: '',
opTel: '',
opEmail: '',
goodsName: '',
orderRemark: '',
kingTareweight: '',
exRemark1: '',
exRemark2: '',
exRemark3: '',
exRemark4: '',
consigneeEdiCode: '',
shipperEdiCode: '',
notifyCdoe: '',
salerCode: '',
salerCodeName: '',
emanifestHbl: '',
masterBolIndicator: '',
masterBolIndicatorName: '',
s0CC0C: '',
ckhi: '',
cncm: '',
wncm: '',
acihbl: ''
},
hbList: [],
remark: [],
file: [],
log: [],
item: [],
statuslog: []
}
const bookingEDIExt = {
weiTuoFang: '',
ediAttn: '',
ediAttnTel: '',
ediAttnMail: '',
sendCode: '',
receiveCode: '',
amsConsignee: '',
amsNotifyParty: '',
opEName: '',
opTel: '',
opEmail: '',
goodsName: '',
orderRemark: '',
kingTareweight: '',
exRemark1: '',
exRemark2: '',
exRemark3: '',
exRemark4: '',
consigneeEdiCode: '',
shipperEdiCode: '',
notifyCdoe: '',
salerCode: '',
salerCodeName: '',
emanifestHbl: '',
masterBolIndicator: '',
masterBolIndicatorName: '',
s0CC0C: '',
ckhi: '',
cncm: '',
wncm: '',
acihbl: ''
}
export default {
name: 'SedOrder',
props: {
parSedOrderList: {
type: Array,
default: () => {
return []
}
},
isAdd: {
type: Boolean,
default: false
},
details: {
type: Object,
default: () => {
return {}
}
},
checkFrom: {
type: Array,
default: () => {
return []
}
},
scrollTop: {
type: Number,
default: 0
}
},
components: {
sedOperationArea,
basicInfo,
mailingInfo,
cargoInfo,
billInfo,
remarksInfo,
goodsTable,
ediMore
},
data() {
return {
type: this.$route.query.type,
id: this.$route.query.id,
inPageLoading: false,
editDetails: null,
editIndex: 0,
showSecNav: true,
inSecLoad: false,
mainOrderActiveKey: '1',
basicRules: rules.basicRules,
mailingRules: rules.mailingRules,
cargoRules: rules.cargoRules,
billRules: rules.billRules,
remarksRules: rules.remarksRules,
ediRules: rules.ediRules,
hasEdiRules: false,
tableRules: rules.tableRules,
hasTableRules: false,
inSave: false,
sedOrderList: JSON.parse(JSON.stringify(this.parSedOrderList)) || []
}
},
watch: {
parSedOrderList: {
handler(nval, oval) {},
deep: true
},
editDetails: {
handler(nval, oval) {},
deep: true
},
'$route.query': {
immediate: true,
handler(nD, oD) {
this.id = this.$route.query.id
this.inSave = true
setTimeout(() => {
this.inSave = false
}, 1200)
if (this.$refs.basicInfo) {
this.$refs.basicInfo.$refs.basicFrom.clearValidate()
this.$refs.mailingInfo.$refs.mailingFrom.clearValidate()
this.$refs.cargoInfo.$refs.cargoFrom.clearValidate()
this.$refs.billInfo.$refs.billFrom.clearValidate()
this.$refs.remarksInfo.$refs.remarkFrom.clearValidate()
}
}
},
checkFrom(nval, oval) {
this.checkFromInit()
}
},
created() {},
mounted() {
this.checkFromInit()
},
methods: {
init(data = []) {
this.inSecLoad = true
if (Object.keys(data).length > 0) {
this.sedOrderList = JSON.parse(JSON.stringify(data))
} else {
this.sedOrderList = []
}
if (this.sedOrderList.length > 0) {
this.sedOrderList.map((item, index) => {
item.isNoSave = false
})
this.editIndex = 0
const $data = JSON.parse(JSON.stringify(this.sedOrderList[0]))
if (!$data.bookingEDIExt) {
$data.bookingEDIExt = bookingEDIExt
}
this.editDetails = $data
setTimeout(() => {
this.$refs.goodsTable.init()
}, 1000)
setTimeout(() => {
this.inSecLoad = false
}, 2000)
} else {
this.editDetails = JSON.parse(JSON.stringify(sedDetail))
setTimeout(() => {
this.inSecLoad = false
}, 2000)
}
},
checkFromInit() {
Object.keys(this.basicRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.basicRules[item][0].required = true
}
})
Object.keys(this.mailingRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.mailingRules[item][0].required = true
}
})
Object.keys(this.cargoRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.cargoRules[item][0].required = true
}
})
Object.keys(this.billRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.billRules[item][0].required = true
}
})
Object.keys(this.remarksRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.remarksRules[item][0].required = true
}
})
Object.keys(this.ediRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.ediRules[item][0].required = true
}
if (this.checkFrom.includes('bookingEDIExt.scaccode')) {
this.ediRules['scaccode'][0].required = true
}
if (this.checkFrom.includes('bookingEDIExt.itncode')) {
this.ediRules['itncode'][0].required = true
}
if (this.checkFrom.includes('bookingEDIExt.freightpayer')) {
this.ediRules['freightpayer'][0].required = true
}
})
Object.keys(this.tableRules).map((item, index) => {
if (this.checkFrom.includes(item)) {
this.tableRules[item].required = true
this.hasTableRules = true
}
})
this.$forceUpdate()
},
addSedOrder() {
if (this.isAdd) {
this.$message.error('请先保存主单')
return false
}
const data = JSON.parse(JSON.stringify(this.details))
data.isNoSave = true
data.hblno = ''
data.shipper = ''
data.consignee = ''
data.notifyparty = ''
data.pid = this.$route.query.id
data.id = 0
if (!data.bookingEDIExt) {
data.bookingEDIExt = bookingEDIExt
}
if (data.ctnInputs.length > 0) {
data.ctnInputs.map((item, index) => {
delete item.id
})
}
if (data.hbList.length > 0) {
delete data.hbList
}
this.editDetails = data
this.editIndex = this.sedOrderList.length
this.sedOrderList.push(data)
this.$emit('changeHB', this.sedOrderList)
},
changeDetailFun(data) {
if (this.inSave || this.inSecLoad || this.sedOrderList.length === 0) {
return false
}
const { detail, type } = data
if (!detail.bookingEDIExt) {
detail.bookingEDIExt = bookingEDIExt
}
if (this.ifCompare(this.sedOrderList[this.editIndex], detail) && !this.inSecLoad && type !== 'save') {
this.sedOrderList[this.editIndex].isNoSave = true
}
this.editDetails = detail
this.sedOrderList[this.editIndex] = detail
this.$emit('changeHB', this.sedOrderList)
this.$forceUpdate()
},
ifCompare(object1, object2) {
var o1keys = Object.keys(object1)
var o2keys = Object.keys(object2)
if (o2keys.length !== o1keys.length) return false
for (let i = 0; i <= o1keys.length - 1; i++) {
let key = o1keys[i]
if (!o2keys.includes(key)) return false
if (object2[key] !== object1[key]) return false
}
return true
},
saveFun() {
this.bookingOrderSave()
},
bookingOrderSave() {
if (!this.editDetails.hblno) {
this.$message.error('请输入分提单号')
return false
}
let basicFrom = true
this.$refs.basicInfo.$refs.basicFrom.validate((valid, err) => {
console.log(err)
basicFrom = valid
})
let mailingFrom = true
this.$refs.mailingInfo.$refs.mailingFrom.validate(valid => {
mailingFrom = valid
})
let cargoFrom = true
this.$refs.cargoInfo.$refs.cargoFrom.validate(valid => {
cargoFrom = valid
})
let billFrom = true
this.$refs.billInfo.$refs.billFrom.validate(valid => {
billFrom = valid
})
let remarksFrom = true
this.$refs.remarksInfo.$refs.remarkFrom.validate(valid => {
remarksFrom = valid
})
console.log(this.editDetails)
if (!basicFrom || !mailingFrom || !cargoFrom || !billFrom || !remarksFrom) {
this.$message.error('保存失败,请检查必填项')
return false
}
if (this.$refs.ediMore) {
let ediFrom = true
this.$refs.ediMore.$refs.ediFrom.validate(valid => {
ediFrom = valid
})
if (!ediFrom) {
this.mainOrderActiveKey = '2'
this.$message.error('保存失败请检查EDI必填项')
return false
}
} else {
Object.keys(this.ediRules).map((item, index) => {
if (this.checkFrom.includes(item) && !this.editDetails[item.split('.')[0]][item.split('.')[1]]) {
this.hasEdiRules = true
}
})
if (this.hasEdiRules) {
this.mainOrderActiveKey = '2'
this.$message.error('保存失败请检查EDI必填项')
return false
}
}
if (this.hasTableRules && this.editDetails.carrierid !== 'GGPX') {
if (this.editDetails.ctnInputs.length === 0) {
this.$message.error('保存失败,箱信息未填写')
return false
}
let tableErrTip = ''
this.editDetails.ctnInputs.map((item, index) => {
Object.keys(item).map((label, lindex) => {
if (this.tableRules[label] && this.tableRules[label].required && !item[label]) {
tableErrTip = `${tableErrTip} 序号${index + 1}${this.tableRules[label].title}未填写,`
}
})
})
if (tableErrTip !== '') {
this.$message.error(`保存失败, 箱信息错误: ${tableErrTip.substr(0, tableErrTip.length - 1)}`, 3)
return false
}
}
this.inSave = true
const data = JSON.parse(JSON.stringify(this.editDetails))
delete data.isNoSave
if (this.$route.query.isCopy) {
delete data.bookingno
data.ctnInputs.map((item, index) => {
delete item.id
})
}
data.parentId = this.$route.query.id
if (this.editDetails.id !== 0 && Number(this.editDetails.id) !== Number(this.$route.query.id)) {
// this.bookingOrderUpdate()
} else {
data.id = 0
data.ctnInputs.map((item, index) => {
item.id = 0
})
}
BookingOrderSave(data)
.then(res => {
if (res.success) {
this.$message.success('保存成功')
this.sedOrderList.splice(this.editIndex, 1, res.data)
this.editDetails = res.data
this.$set(this.sedOrderList[this.editIndex], 'isNoSave', false)
this.$set(this.editDetails, 'isNoSave', false)
setTimeout(() => {
this.inSave = false
this.changeDetailFun({ detail: this.editDetails, type: 'save' })
}, 1000)
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch(err => {
console.log(err)
})
},
changeOrder(index) {
this.editIndex = index
const data = this.sedOrderList[index]
if (!data.bookingEDIExt) {
data.bookingEDIExt = bookingEDIExt
}
this.editDetails = data
this.inSecLoad = true
setTimeout(() => {
this.inSecLoad = false
}, 200)
},
copyFun() {
const _data = JSON.parse(JSON.stringify(this.editDetails))
_data.isNoSave = true
_data.hblno = ''
_data.pid = this.$route.query.id
_data.id = 0
if (!_data.bookingEDIExt) {
_data.bookingEDIExt = bookingEDIExt
}
this.editDetails = _data
this.editIndex = this.sedOrderList.length
this.sedOrderList.push(_data)
},
openNav() {
this.showSecNav = !this.showSecNav
},
pkgsEnCapitalFun(data) {
this.editDetails.totalno = data
},
changeMainTab(e) {
this.mainOrderActiveKey = e
},
changeParentTabs(type) {
this.mainOrderActiveKey = type
},
removeSedOrderFun(data, index) {
this.deleteBookingOrder(data.id, index)
},
removeFun() {
this.deleteBookingOrder(this.editDetails.id, this.editIndex)
},
deleteBookingOrder(id, index) {
// eslint-disable-next-line eqeqeq
if (id == 0) {
this.removeSucc(id, index)
return false
}
this.inSecLoad = true
DeleteBookingOrder([id].toString())
.then(res => {
if (res.success) {
this.$message.success('删除成功')
this.removeSucc(id, index)
} else {
this.$message.error(res.message)
}
})
.catch(err => {
console.log(err)
})
},
removeSucc(id, index) {
const removeIndex = index
this.sedOrderList.splice(removeIndex, 1)
this.$emit('sedOrderRemove', this.sedOrderList)
if (this.sedOrderList.length === 0) {
this.editIndex = 0
this.editDetails = null
return false
}
if (this.editDetails.id === id) {
const num = this.editIndex === 0 ? 0 : this.editIndex - 1
this.editIndex = num > this.sedOrderList.length ? this.sedOrderList.length - 1 : num
this.editDetails = this.sedOrderList[this.editIndex]
} else {
this.editIndex = removeIndex < this.editIndex ? this.editIndex - 1 : this.editIndex
}
setTimeout(() => {
this.inSecLoad = false
}, 200)
this.$forceUpdate()
},
cancelRemove() {
console.log('== 取消删除 ==')
}
}
}
</script>
<style lang="less" scoped>
@import url('../index.less');
@import url('../style/sedOrder.less');
</style>

@ -0,0 +1,158 @@
export default {
basicRules: {
customername: [{ required: false, message: '请选择委托单位', trigger: 'change' }],
mblno: [{ required: false, message: '请输入提单号', trigger: 'change' }],
carrierid: [{ required: false, message: '请选择船公司', trigger: 'change' }],
forwarder: [{ required: false, message: '请输入订舱代理', trigger: 'change' }],
pono: [{ required: false, message: '请输入PO NO', trigger: 'change' }],
hblno: [{ required: false, message: '请输入分提单号', trigger: 'change' }],
custno: [{ required: false, message: '请输入订舱编号', trigger: 'change' }],
contractno: [{ required: false, message: '请输入运费协议号', trigger: 'change' }],
tmblno: [{ required: false, message: '请输入真提单号', trigger: 'change' }], // VOLTA WHL CSL
epCode: [{ required: false, message: '请输入EP号', trigger: 'change' }], // esl
vessel: [{ required: false, message: '请输入船名', trigger: 'change' }],
lanecode: [{ required: false, message: '请输入航线代码', trigger: 'change' }], // esl
voynoinner: [{ required: false, message: '请输入内部航次', trigger: 'change' }],
voyno: [{ required: false, message: '请输入航次/海关航次', trigger: 'change' }],
etd: [{ required: false, message: '请选择开船日期', trigger: 'change' }],
zhanCangFlag: [{ required: false, message: '请选择是否占舱', trigger: 'change' }],
// atd: [{ required: false, message: '请选择实际开船日期', trigger: 'change' }],
lanename: [{ required: false, message: '请输入船司航线', trigger: 'change' }],
shipagency: [{ required: false, message: '请输入船代', trigger: 'change' }],
lineName: [{ 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' }],
route: [{ required: false, message: '请选择航线操作', trigger: 'change' }],
lineManage: [{ required: false, message: '请选择航线管理', trigger: 'change' }],
dzRemark: [{ required: false, message: '请选择单证备注', trigger: 'change' }],
czRemark: [{ required: false, message: '请选择操作备注', trigger: 'change' }]
},
mailingRules: {
shipper: [{ required: false, message: '请输入发货人', trigger: 'submit' }],
consignee: [{ required: false, message: '请输入收货人', trigger: 'submit' }],
notifyparty: [{ required: false, message: '请输入通知人', trigger: 'submit' }],
yard: [{ required: false, message: '请输入场站', trigger: 'change' }],
feeself: [{ required: false, message: '请选择场站费自结', trigger: 'change' }],
customser: [{ required: false, message: '请输入报关行', trigger: 'change' }],
trucker: [{ required: false, message: '请输入车队', trigger: 'change' }],
agentname: [{ required: false, message: '请输入国外代理', trigger: 'change' }],
warehouse: [{ required: false, message: '请选择仓库', trigger: 'change' }],
shippingMethod: [{ required: false, message: '请选择装运方式', trigger: 'change' }],
// eta: [{ required: false, message: '请选择预抵日期', trigger: 'change' }],
closingdate: [{ required: false, message: '请选择截港时间', trigger: 'change' }],
closedocdate: [{ required: false, message: '请选择截单时间', trigger: 'change' }],
closevgmdate: [{ required: false, message: '请选择VGM时间', trigger: 'change' }],
placereceiptid: [{ required: false, message: '请选择收货地代码', trigger: 'change' }],
placereceipt: [{ required: false, message: '请选择收货地', trigger: 'change' }],
portloadid: [{ required: false, message: '请选择装货港代码', trigger: 'change' }],
portload: [{ required: false, message: '请选择装货港', trigger: 'change' }],
transportid: [{ required: false, message: '请选择中转港代码', trigger: 'change' }],
transport: [{ required: false, message: '请选择中转港', trigger: 'change' }],
portdischargeid: [{ required: false, message: '请选择卸货港代码', trigger: 'change' }],
portdischarge: [{ required: false, message: '请选择卸货港', trigger: 'change' }],
destinationid: [{ required: false, message: '请选择目的代码', trigger: 'change' }],
destination: [{ required: false, message: '请选择目的地', trigger: 'change' }],
placedeliveryid: [{ required: false, message: '请选择交货代码', trigger: 'change' }],
placedelivery: [{ required: false, message: '请选择交货地', trigger: 'change' }],
issuetype: [{ required: false, message: '请选择签单方式', trigger: 'change' }],
issuedate: [{ required: false, message: '请选择签单日期', trigger: 'change' }],
issueplace: [{ required: false, message: '请选择签单地点', trigger: 'change' }],
issueplaceid: [{ required: false, message: '请输入签单地代码', trigger: 'change' }],
nobill: [{ required: false, message: '请选择提单份数', trigger: 'change' }],
copynobill: [{ required: false, message: '请选择副本份数', trigger: 'change' }],
prepardat: [{ required: false, message: '请选择预付地点', trigger: 'change' }],
payableat: [{ required: false, message: '请选择到付地点', trigger: 'change' }],
blfrt: [{ required: false, message: '请选择付费方式', trigger: 'change' }],
thirdpayaddr: [{ required: false, message: '请输入第三付款地', trigger: 'change' }],
service: [{ required: false, message: '请选择运输条款', trigger: 'change' }],
reeferf: [{ required: false, message: '请输入冷藏通风量', trigger: 'change' }],
tempset: [{ required: false, message: '请输入温度', trigger: 'change' }],
tempid: [{ required: false, message: '请选择温度单位', trigger: 'change' }],
tempmin: [{ required: false, message: '请输入最低温度', trigger: 'change' }],
tempmax: [{ required: false, message: '请输入最高温度', trigger: 'change' }],
humidity: [{ required: false, message: '请输入湿度', trigger: 'change' }],
dclass: [{ required: false, message: '请输入危险品等级', trigger: 'change' }],
dunno: [{ required: false, message: '请输入危险品编号', trigger: 'change' }],
dpage: [{ required: false, message: '请输入危险品页号', trigger: 'change' }],
dlabel: [{ required: false, message: '请输入危险品标签', trigger: 'change' }],
linkman: [{ required: false, message: '请输入危险品联系人', trigger: 'change' }],
soremark: [{ required: false, message: '请输入订舱备注', trigger: 'change' }],
siremark: [{ required: false, message: '请输入截单备注', trigger: 'change' }]
},
cargoRules: {
marks: [{ required: false, message: '请输入Seal No. Marks & Nos', trigger: 'change' }],
cargoid: [{ required: false, message: '请选择货物标志', trigger: 'change' }],
hscode: [{ required: false, message: '请输入HS编码', trigger: 'change' }],
description: [{ required: false, message: '请输入包装种类与货名', trigger: 'change' }],
goodsname: [{ required: false, message: '请选择品名', trigger: 'change' }],
pkgs: [{ required: false, message: '请输入件数', trigger: 'change' }],
kindpkgs: [{ required: false, message: '请输入包装', trigger: 'change' }],
kgs: [{ required: false, message: '请输入毛重', trigger: 'change' }],
cbm: [{ required: false, message: '请输入尺寸', trigger: 'change' }]
},
billRules: {
},
remarksRules: {
},
ediRules: {
'bookingEDIExt.sendCode': [{ required: false, message: '请输入发送方EDI代码', trigger: 'change' }],
'bookingEDIExt.receiveCode': [{ required: false, message: '请输入接收方EDI代码', trigger: 'change' }],
'bookingEDIExt.ediAttn': [{ required: false, message: '请输入EDI联系人名称', trigger: 'change' }],
'bookingEDIExt.ediAttnTel': [{ required: false, message: '请输入EDI联系人电话', trigger: 'change' }],
'bookingEDIExt.ediAttnMail': [{ required: false, message: '请输入EDI联系人邮箱', trigger: 'change' }],
'bookingEDIExt.amsConsignee': [{ required: false, message: '请输入AMS收货人', trigger: 'change' }],
'bookingEDIExt.amsNotifyParty': [{ required: false, message: '请输入AMS通知人', trigger: 'change' }],
'bookingEDIExt.opEName': [{ required: false, message: '请输入操作英文名称', trigger: 'change' }],
'bookingEDIExt.opTel': [{ required: false, message: '请输入操作电话', trigger: 'change' }],
'bookingEDIExt.opEmail': [{ required: false, message: '请输入操作邮箱', trigger: 'change' }],
'bookingEDIExt.goodsName': [{ required: false, message: '请输入商品名称', trigger: 'change' }],
iscontainersoc: [{ required: false, message: '请输入SOC箱', trigger: 'change' }],
scaccode: [{ required: false, message: '请输入SCAC代码', trigger: 'change' }],
itncode: [{ required: false, message: '请输入ITN编号', trigger: 'change' }],
'bookingEDIExt.orderRemark': [{ required: false, message: '请输入订舱人说明', trigger: 'change' }],
freightpayer: [{ required: false, message: '请输入付款方', trigger: 'change' }],
'bookingEDIExt.kingTareweight': [{ required: false, message: '请输入第一层包装皮重', trigger: 'change' }],
'bookingEDIExt.weiTuoFang': [{ required: false, message: '请输入委托方', trigger: 'change' }],
'bookingEDIExt.exRemark1': [{ required: false, message: '请输入辅助字段1', trigger: 'change' }],
'bookingEDIExt.exRemark2': [{ required: false, message: '请输入辅助字段2', trigger: 'change' }],
'bookingEDIExt.exRemark3': [{ required: false, message: '请输入辅助字段3', trigger: 'change' }],
'bookingEDIExt.exRemark4': [{ required: false, message: '请输入辅助字段4', trigger: 'change' }],
'bookingEDIExt.consigneeEdiCode': [{ required: false, message: '请输入收货人EDI代码', trigger: 'change' }],
'bookingEDIExt.shipperEdiCode': [{ required: false, message: '请输入发货人EDI代码', trigger: 'change' }],
'bookingEDIExt.notifyCdoe': [{ required: false, message: '请输入通知方EDI代码', trigger: 'change' }],
'bookingEDIExt.salerCode': [{ required: false, message: '请输入太平销售EDI代码', trigger: 'change' }],
'bookingEDIExt.emanifestHbl': [{ required: false, message: '请输入EMANIFEST HBL', trigger: 'change' }],
'bookingEDIExt.masterBolIndicator': [{ required: false, message: '请输入Master Bol Indicator', trigger: 'change' }],
'bookingEDIExt.s0CC0C': [{ required: false, message: '请输入S0C C0C', trigger: 'change' }],
'bookingEDIExt.ckhi': [{ required: false, message: '请输入欧盟港口、伊朗港口、KHI', trigger: 'change' }],
'bookingEDIExt.cncm': [{ required: false, message: '请输入南美东', trigger: 'change' }],
'bookingEDIExt.wncm': [{ required: false, message: '请输入巴西线木质包装情况', trigger: 'change' }],
'bookingEDIExt.acihbl': [{ required: false, message: '请输入ACI HBL', trigger: 'change' }]
},
tableRules: {
ctnall: { required: false, title: '箱型', message: '请选择箱型', trigger: 'change' },
ctnnum: { required: false, title: '箱量', message: '请选择箱量', trigger: 'change' },
cntrno: { required: false, title: '箱号', message: '请选择箱号', trigger: 'change' },
sealno: { required: false, title: '封号', message: '请选择封号', trigger: 'change' },
pkgs: { required: false, title: '件数', message: '请选择件数', trigger: 'change' },
kindpkgs: { required: false, title: '包装', message: '请选择包装', trigger: 'change' },
kgs: { required: false, title: '重量', message: '请选择重量', trigger: 'change' },
cbm: { required: false, title: '尺码', message: '请选择尺码', trigger: 'change' },
tareweight: { required: false, title: '箱皮重', message: '请选择箱皮重', trigger: 'change' },
weightype: { required: false, title: '称重方式', message: '请选择称重方式', trigger: 'change' },
weighkgs: { required: false, title: '称重重量', message: '请选择称重重量', trigger: 'change' }
},
preRules: {
ctn: { required: false, title: '箱型', message: '请选择箱型', trigger: 'change' },
cntrno: { required: false, title: '箱号', message: '请选择箱号', trigger: 'change' },
sealno: { required: false, title: '封号', message: '请选择封号', trigger: 'change' },
pkgs: { required: false, title: '件数', message: '请选择件数', trigger: 'change' },
kindpkgs: { required: false, title: '包装', message: '请选择包装', trigger: 'change' },
kgs: { required: false, title: '重量', message: '请选择重量', trigger: 'change' },
cbm: { required: false, title: '尺码', message: '请选择尺码', trigger: 'change' }
}
}

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save