|
|
|
|
@ -5,144 +5,150 @@
|
|
|
|
|
<div class="base-tit"><i class="iconfont icon-a-fahuodaifahuo"></i>收发通信息</div>
|
|
|
|
|
</template>
|
|
|
|
|
<div class="mail-info">
|
|
|
|
|
<a-row :gutter="10">
|
|
|
|
|
<a-col :xs="24" :sm="24" :md="24" :lg="10" :xl="12">
|
|
|
|
|
<div class="sender">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div class="name"><span class="iconfont icon-bianji"></span>发货人</div>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
v-model="shippername"
|
|
|
|
|
class="customer-input"
|
|
|
|
|
:data-source="shipperDataArr"
|
|
|
|
|
:dropdown-match-select-width="false"
|
|
|
|
|
:dropdown-style="{ width: '200px' }"
|
|
|
|
|
@select="shipperSelect"
|
|
|
|
|
@change="shipperChange"
|
|
|
|
|
@focus="shipperChange"
|
|
|
|
|
/>
|
|
|
|
|
<a-button class="save-btn" type="link" size="small" icon="save" @click="saveModel('shipper')">
|
|
|
|
|
保存
|
|
|
|
|
</a-button>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<span class="btn-circle" @click="spliceMore('shipper')" :style="{ fontSize: '14px' }">*</span>
|
|
|
|
|
<span class="btn" @click="changeCode(35, 'shipper')">35</span>
|
|
|
|
|
<span class="btn" @click="changeCode(40, 'shipper')">40</span>
|
|
|
|
|
<span class="btn" @click="changeCode(50, 'shipper')">50</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<a-textarea
|
|
|
|
|
id="shipper-scroll"
|
|
|
|
|
:defaultValue="details.shipper"
|
|
|
|
|
v-model="showShipper"
|
|
|
|
|
:auto-size="{ minRows: 2, maxRows: 5 }"
|
|
|
|
|
style="height: 120px"
|
|
|
|
|
@blur="textareaChange($event, 'shipper')"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
class="line-count"
|
|
|
|
|
id="shipper-scroll-right"
|
|
|
|
|
v-if="Object.keys(details).length > 1 && details.shipper.length > 1"
|
|
|
|
|
>
|
|
|
|
|
<div v-for="(num, index) in details.shipper.split('\n')" :key="index">{{ num.length }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="consignee">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div class="name"><span class="iconfont icon-bianji"></span>收货人</div>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
v-model="consigneename"
|
|
|
|
|
class="customer-input"
|
|
|
|
|
:data-source="consigneeDataArr"
|
|
|
|
|
:dropdown-match-select-width="false"
|
|
|
|
|
:dropdown-style="{ width: '200px' }"
|
|
|
|
|
@select="consigneeSelect"
|
|
|
|
|
@change="consigneeChange"
|
|
|
|
|
@focus="consigneeChange"
|
|
|
|
|
/>
|
|
|
|
|
<a-button class="save-btn" type="link" size="small" icon="save" @click="saveModel('consignee')"
|
|
|
|
|
>保存</a-button
|
|
|
|
|
>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<span class="btn-circle" @click="spliceMore('consignee')" :style="{ fontSize: '14px' }">*</span>
|
|
|
|
|
<span class="btn" @click="changeCode(35, 'consignee')">35</span>
|
|
|
|
|
<span class="btn" @click="changeCode(40, 'consignee')">40</span>
|
|
|
|
|
<span class="btn" @click="changeCode(50, 'consignee')">50</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<a-textarea
|
|
|
|
|
id="consignee-scroll"
|
|
|
|
|
:defaultValue="details.consignee"
|
|
|
|
|
v-model="showConsignee"
|
|
|
|
|
:auto-size="{ minRows: 2, maxRows: 5 }"
|
|
|
|
|
style="height: 120px"
|
|
|
|
|
@blur="textareaChange($event, 'consignee')"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
class="line-count"
|
|
|
|
|
id="consignee-scroll-right"
|
|
|
|
|
v-if="Object.keys(details).length > 1 && details.consignee.length > 1"
|
|
|
|
|
>
|
|
|
|
|
<div v-for="(num, index) in details.consignee.split('\n')" :key="index">{{ num.length }}</div>
|
|
|
|
|
<!-- <a-button type="primary" @click="checkbasic"> 验证 </a-button> -->
|
|
|
|
|
<a-form-model :selfUpdate="true" ref="mailingFrom" :model="details" :rules="rules">
|
|
|
|
|
<a-row :gutter="10">
|
|
|
|
|
<a-col :xs="24" :sm="24" :md="24" :lg="10" :xl="12">
|
|
|
|
|
<a-form-model-item has-feedback prop="shipper" class="sender-label">
|
|
|
|
|
<div class="sender">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div class="name"><span class="iconfont icon-bianji"></span>发货人</div>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
v-model="shippername"
|
|
|
|
|
class="customer-input"
|
|
|
|
|
:data-source="shipperDataArr"
|
|
|
|
|
:dropdown-match-select-width="false"
|
|
|
|
|
:dropdown-style="{ width: '200px' }"
|
|
|
|
|
@select="shipperSelect"
|
|
|
|
|
@change="shipperChange"
|
|
|
|
|
@focus="shipperChange"
|
|
|
|
|
/>
|
|
|
|
|
<a-button class="save-btn" type="link" size="small" icon="save" @click="saveModel('shipper')">
|
|
|
|
|
保存
|
|
|
|
|
</a-button>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<span class="btn-circle" @click="spliceMore('shipper')" :style="{ fontSize: '14px' }">*</span>
|
|
|
|
|
<span class="btn" @click="changeCode(35, 'shipper')">35</span>
|
|
|
|
|
<span class="btn" @click="changeCode(40, 'shipper')">40</span>
|
|
|
|
|
<span class="btn" @click="changeCode(50, 'shipper')">50</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<a-textarea
|
|
|
|
|
id="shipper-scroll"
|
|
|
|
|
:defaultValue="details.shipper"
|
|
|
|
|
v-model="showShipper"
|
|
|
|
|
:auto-size="{ minRows: 2, maxRows: 5 }"
|
|
|
|
|
style="height: 120px"
|
|
|
|
|
@blur="textareaChange($event, 'shipper')"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
class="line-count"
|
|
|
|
|
id="shipper-scroll-right"
|
|
|
|
|
v-if="Object.keys(details).length > 1 && details.shipper.length > 1"
|
|
|
|
|
>
|
|
|
|
|
<div v-for="(num, index) in details.shipper.split('\n')" :key="index">{{ num.length }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="notifier">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div class="name"><span class="iconfont icon-bianji"></span>通知人</div>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
v-model="notifypartyname"
|
|
|
|
|
class="customer-input"
|
|
|
|
|
:data-source="notifyDataArr"
|
|
|
|
|
@select="notifySelect"
|
|
|
|
|
@change="notifyChange"
|
|
|
|
|
@focus="notifyChange"
|
|
|
|
|
/>
|
|
|
|
|
<a-button class="save-btn" type="link" size="small" icon="save" @click="saveModel('notifyparty')"
|
|
|
|
|
>保存</a-button
|
|
|
|
|
>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<span class="btn-circle" @click="spliceMore('notifyparty')" :style="{ fontSize: '14px' }">*</span>
|
|
|
|
|
<span class="btn" @click="changeCode(35, 'notifyparty')">35</span>
|
|
|
|
|
<span class="btn" @click="changeCode(40, 'notifyparty')">40</span>
|
|
|
|
|
<span class="btn" @click="changeCode(50, 'notifyparty')">50</span>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item has-feedback prop="consignee" class="sender-label">
|
|
|
|
|
<div class="consignee">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div class="name"><span class="iconfont icon-bianji"></span>收货人</div>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
v-model="consigneename"
|
|
|
|
|
class="customer-input"
|
|
|
|
|
:data-source="consigneeDataArr"
|
|
|
|
|
:dropdown-match-select-width="false"
|
|
|
|
|
:dropdown-style="{ width: '200px' }"
|
|
|
|
|
@select="consigneeSelect"
|
|
|
|
|
@change="consigneeChange"
|
|
|
|
|
@focus="consigneeChange"
|
|
|
|
|
/>
|
|
|
|
|
<a-button class="save-btn" type="link" size="small" icon="save" @click="saveModel('consignee')">保存</a-button
|
|
|
|
|
>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<span class="btn-circle" @click="spliceMore('consignee')" :style="{ fontSize: '14px' }">*</span>
|
|
|
|
|
<span class="btn" @click="changeCode(35, 'consignee')">35</span>
|
|
|
|
|
<span class="btn" @click="changeCode(40, 'consignee')">40</span>
|
|
|
|
|
<span class="btn" @click="changeCode(50, 'consignee')">50</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<a-textarea
|
|
|
|
|
id="consignee-scroll"
|
|
|
|
|
:defaultValue="details.consignee"
|
|
|
|
|
v-model="showConsignee"
|
|
|
|
|
:auto-size="{ minRows: 2, maxRows: 5 }"
|
|
|
|
|
style="height: 120px"
|
|
|
|
|
@blur="textareaChange($event, 'consignee')"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
class="line-count"
|
|
|
|
|
id="consignee-scroll-right"
|
|
|
|
|
v-if="Object.keys(details).length > 1 && details.consignee.length > 1"
|
|
|
|
|
>
|
|
|
|
|
<div v-for="(num, index) in details.consignee.split('\n')" :key="index">{{ num.length }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<a-textarea
|
|
|
|
|
id="notifyparty-scroll"
|
|
|
|
|
:defaultValue="details.notifyparty"
|
|
|
|
|
:auto-size="{ minRows: 2, maxRows: 5 }"
|
|
|
|
|
style="height: 120px"
|
|
|
|
|
v-model="showNotifier"
|
|
|
|
|
@blur="textareaChange($event, 'notifyparty')"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
class="line-count"
|
|
|
|
|
id="notifyparty-scroll-right"
|
|
|
|
|
v-if="Object.keys(details).length > 1 && details.notifyparty.length > 1"
|
|
|
|
|
>
|
|
|
|
|
<div v-for="(num, index) in details.notifyparty.split('\n')" :key="index">{{ num.length }}</div>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item has-feedback prop="notifyparty" class="sender-label">
|
|
|
|
|
<div class="notifier">
|
|
|
|
|
<div class="top">
|
|
|
|
|
<div class="name"><span class="iconfont icon-bianji"></span>通知人</div>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
v-model="notifypartyname"
|
|
|
|
|
class="customer-input"
|
|
|
|
|
:data-source="notifyDataArr"
|
|
|
|
|
@select="notifySelect"
|
|
|
|
|
@change="notifyChange"
|
|
|
|
|
@focus="notifyChange"
|
|
|
|
|
/>
|
|
|
|
|
<a-button class="save-btn" type="link" size="small" icon="save" @click="saveModel('notifyparty')">保存</a-button
|
|
|
|
|
>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<span class="btn-circle" @click="spliceMore('notifyparty')" :style="{ fontSize: '14px' }">*</span>
|
|
|
|
|
<span class="btn" @click="changeCode(35, 'notifyparty')">35</span>
|
|
|
|
|
<span class="btn" @click="changeCode(40, 'notifyparty')">40</span>
|
|
|
|
|
<span class="btn" @click="changeCode(50, 'notifyparty')">50</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom">
|
|
|
|
|
<a-textarea
|
|
|
|
|
id="notifyparty-scroll"
|
|
|
|
|
:defaultValue="details.notifyparty"
|
|
|
|
|
:auto-size="{ minRows: 2, maxRows: 5 }"
|
|
|
|
|
style="height: 120px"
|
|
|
|
|
v-model="showNotifier"
|
|
|
|
|
@blur="textareaChange($event, 'notifyparty')"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
class="line-count"
|
|
|
|
|
id="notifyparty-scroll-right"
|
|
|
|
|
v-if="Object.keys(details).length > 1 && details.notifyparty.length > 1"
|
|
|
|
|
>
|
|
|
|
|
<div v-for="(num, index) in details.notifyparty.split('\n')" :key="index">{{ num.length }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :xs="24" :sm="24" :md="24" :lg="14" :xl="12">
|
|
|
|
|
<a-form :selfUpdate="true">
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :xs="24" :sm="24" :md="24" :lg="14" :xl="12">
|
|
|
|
|
<a-row :gutter="16">
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label yarn-label"
|
|
|
|
|
label="场站"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
style="overflow: visible"
|
|
|
|
|
prop="yard"
|
|
|
|
|
>
|
|
|
|
|
<div class="yard-box" style="display: flex">
|
|
|
|
|
<!-- <auto-complete
|
|
|
|
|
@ -173,15 +179,16 @@
|
|
|
|
|
<a-checkbox v-model="details.feeself"> 自结 </a-checkbox>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="报关行"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="customser"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -194,15 +201,16 @@
|
|
|
|
|
@change="customserChange"
|
|
|
|
|
@focus="customserChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="车队"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="trucker"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -215,15 +223,16 @@
|
|
|
|
|
@change="truckerChange"
|
|
|
|
|
@focus="truckerChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="国外代理"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="agentid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -236,28 +245,30 @@
|
|
|
|
|
@change="agentidChange"
|
|
|
|
|
@focus="agentidChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="预抵日期"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="eta"
|
|
|
|
|
>
|
|
|
|
|
<a-date-picker format="YYYY-MM-DD" v-model="details.eta">
|
|
|
|
|
<a-icon slot="suffixIcon" type="time" style="display: none" />
|
|
|
|
|
</a-date-picker>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="截港时间"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="closingdate"
|
|
|
|
|
>
|
|
|
|
|
<a-date-picker
|
|
|
|
|
style="min-width:100px"
|
|
|
|
|
@ -268,15 +279,16 @@
|
|
|
|
|
>
|
|
|
|
|
<a-icon slot="suffixIcon" type="time" style="display: none" />
|
|
|
|
|
</a-date-picker>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="截单时间"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="closedocdate"
|
|
|
|
|
>
|
|
|
|
|
<a-date-picker
|
|
|
|
|
style="min-width:100px"
|
|
|
|
|
@ -287,15 +299,16 @@
|
|
|
|
|
>
|
|
|
|
|
<a-icon slot="suffixIcon" type="time" style="display: none" />
|
|
|
|
|
</a-date-picker>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="VGM时间"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="closevgmdate"
|
|
|
|
|
>
|
|
|
|
|
<a-date-picker
|
|
|
|
|
style="min-width:100px"
|
|
|
|
|
@ -306,15 +319,16 @@
|
|
|
|
|
>
|
|
|
|
|
<a-icon slot="suffixIcon" type="time" style="display: none" />
|
|
|
|
|
</a-date-picker>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="收货代码"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="placereceiptid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -327,26 +341,28 @@
|
|
|
|
|
@change="placereceiptChange"
|
|
|
|
|
@focus="placereceiptChange"
|
|
|
|
|
></auto-complete>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="收货地"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="placereceipt"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.placereceipt" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="装货港代码"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="portloadid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -359,26 +375,28 @@
|
|
|
|
|
@change="portloadChange"
|
|
|
|
|
@focus="portloadChange"
|
|
|
|
|
></auto-complete>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="装货港"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="portload"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.portload" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="中转港代码"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="transportid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -391,26 +409,28 @@
|
|
|
|
|
@change="transportChange"
|
|
|
|
|
@focus="transportChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="中转港"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="transport"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.transport" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="卸货港代码"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="portdischargeid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -423,26 +443,28 @@
|
|
|
|
|
@change="portdischargeChange"
|
|
|
|
|
@focus="portdischargeChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="卸货港"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="portdischarge"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.portdischarge" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="目的代码"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="destinationid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -455,26 +477,28 @@
|
|
|
|
|
@change="destinationChange"
|
|
|
|
|
@focus="destinationChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="目的地"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="destination"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.destination" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="交货代码"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="placedeliveryid"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -487,37 +511,40 @@
|
|
|
|
|
@change="placedeliveryChange"
|
|
|
|
|
@focus="placedeliveryChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="交货地"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="placedelivery"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.placedelivery" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="件数"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="pkgs"
|
|
|
|
|
>
|
|
|
|
|
<a-input :allowClear="true" v-model="details.pkgs" type="number" @change="changePkgs"/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="包装"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="kindpkgs"
|
|
|
|
|
>
|
|
|
|
|
<auto-complete
|
|
|
|
|
:allowClear="true"
|
|
|
|
|
@ -530,38 +557,40 @@
|
|
|
|
|
@change="kindpkgsChange"
|
|
|
|
|
@focus="kindpkgsChange"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="毛重"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="kgs"
|
|
|
|
|
>
|
|
|
|
|
<div class="line-box">
|
|
|
|
|
<a-input :allowClear="true" v-model="details.kgs" /><span class="unit">KGS</span>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="尺寸"
|
|
|
|
|
:labelCol="labelCol"
|
|
|
|
|
:wrapperCol="wrapperCol"
|
|
|
|
|
has-feedback
|
|
|
|
|
prop="cbm"
|
|
|
|
|
>
|
|
|
|
|
<div class="line-box">
|
|
|
|
|
<a-input :allowClear="true" v-model="details.cbm" /><span class="unit">CBM</span>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-form>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<a-modal
|
|
|
|
|
@ -595,7 +624,7 @@
|
|
|
|
|
<a-form>
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="联系人"
|
|
|
|
|
:labelCol="YardlabelCol"
|
|
|
|
|
@ -604,10 +633,10 @@
|
|
|
|
|
style="overflow: visible;"
|
|
|
|
|
>
|
|
|
|
|
<a-input v-model="details.yardcontract" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="电话"
|
|
|
|
|
:labelCol="YardlabelCol"
|
|
|
|
|
@ -616,10 +645,10 @@
|
|
|
|
|
style="overflow: visible;"
|
|
|
|
|
>
|
|
|
|
|
<a-input v-model="details.yardcontracttel" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="12">
|
|
|
|
|
<a-form-item
|
|
|
|
|
<a-form-model-item
|
|
|
|
|
class="from-label"
|
|
|
|
|
label="邮箱"
|
|
|
|
|
:labelCol="YardlabelCol"
|
|
|
|
|
@ -628,7 +657,7 @@
|
|
|
|
|
style="overflow: visible;"
|
|
|
|
|
>
|
|
|
|
|
<a-input v-model="details.yardcontractemail" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</a-form>
|
|
|
|
|
@ -716,7 +745,36 @@ export default {
|
|
|
|
|
customerModelconfirm: false,
|
|
|
|
|
showShipper: '',
|
|
|
|
|
showConsignee: '',
|
|
|
|
|
showNotifier: ''
|
|
|
|
|
showNotifier: '',
|
|
|
|
|
rules: {
|
|
|
|
|
// shipper: [ { required: true, message: '请输入发货人', trigger: 'blur' } ],
|
|
|
|
|
// consignee: [ { required: true, message: '请输入收货人', trigger: 'blur' } ],
|
|
|
|
|
// notifyparty: [ { required: true, message: '请输入通知人', trigger: 'blur' } ],
|
|
|
|
|
// yard: [ { required: true, message: '请输入场站', trigger: 'blur' } ],
|
|
|
|
|
// customser: [ { required: true, message: '请输入报关行', trigger: 'blur' } ],
|
|
|
|
|
// trucker: [ { required: true, message: '请输入车队', trigger: 'blur' } ],
|
|
|
|
|
// agentid: [ { required: true, message: '请输入国外代理', trigger: 'blur' } ],
|
|
|
|
|
// eta: [ { required: true, message: '请选择预抵日期', trigger: 'blur' } ],
|
|
|
|
|
// closingdate: [ { required: true, message: '请选择截港时间', trigger: 'blur' } ],
|
|
|
|
|
// closedocdate: [ { required: true, message: '请选择截单时间', trigger: 'blur' } ],
|
|
|
|
|
// closevgmdate: [ { required: true, message: '请选择VGM时间', trigger: 'blur' } ],
|
|
|
|
|
// placereceiptid: [ { required: true, message: '请选择收货代码', trigger: 'blur' } ],
|
|
|
|
|
// placereceipt: [ { required: true, message: '请选择收货地', trigger: 'blur' } ],
|
|
|
|
|
// portloadid: [ { required: true, message: '请选择装货港代码', trigger: 'blur' } ],
|
|
|
|
|
// portload: [ { required: true, message: '请选择装货港', trigger: 'blur' } ],
|
|
|
|
|
// transportid: [ { required: true, message: '请选择中转港代码', trigger: 'blur' } ],
|
|
|
|
|
// transport: [ { required: true, message: '请选择中转港', trigger: 'blur' } ],
|
|
|
|
|
// portdischargeid: [ { required: true, message: '请选择卸货港代码', trigger: 'blur' } ],
|
|
|
|
|
// portdischarge: [ { required: true, message: '请选择卸货港', trigger: 'blur' } ],
|
|
|
|
|
// destinationid: [ { required: true, message: '请选择目的代码', trigger: 'blur' } ],
|
|
|
|
|
// destination: [ { required: true, message: '请选择目的地', trigger: 'blur' } ],
|
|
|
|
|
// placedeliveryid: [ { required: true, message: '请选择交货代码', trigger: 'blur' } ],
|
|
|
|
|
// placedelivery: [ { required: true, message: '请选择交货地', trigger: 'blur' } ],
|
|
|
|
|
// pkgs: [ { required: true, message: '请输入件数', trigger: 'blur' } ],
|
|
|
|
|
// kindpkgs: [ { required: true, message: '请输入包装', trigger: 'blur' } ],
|
|
|
|
|
// kgs: [ { required: true, message: '请输入毛重', trigger: 'blur' } ],
|
|
|
|
|
// cbm: [ { required: true, message: '请输入尺寸', trigger: 'blur' } ],
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
@ -963,6 +1021,17 @@ export default {
|
|
|
|
|
}, 2000)
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
checkbasic () {
|
|
|
|
|
this.$refs.mailingFrom.validate(valid => {
|
|
|
|
|
console.log(valid)
|
|
|
|
|
if (valid) {
|
|
|
|
|
console.log('验证成功!');
|
|
|
|
|
} else {
|
|
|
|
|
console.log('验证失败!');
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
// ========== 关系人弹窗 ==========
|
|
|
|
|
changeYard(type) {
|
|
|
|
|
if (type == 'remark') {
|
|
|
|
|
@ -1646,7 +1715,9 @@ export default {
|
|
|
|
|
.top {
|
|
|
|
|
margin-bottom: 15px;
|
|
|
|
|
min-height: 32px;
|
|
|
|
|
line-height: 32px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
display: flex;
|
|
|
|
|
.name {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
@ -1666,6 +1737,9 @@ export default {
|
|
|
|
|
margin-top: 5px;
|
|
|
|
|
margin-right: 25px;
|
|
|
|
|
}
|
|
|
|
|
.customer-input{
|
|
|
|
|
flex: 1;
|
|
|
|
|
}
|
|
|
|
|
.btn {
|
|
|
|
|
width: 20px;
|
|
|
|
|
height: 20px;
|
|
|
|
|
@ -1733,6 +1807,9 @@ export default {
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
line-height: 20px;
|
|
|
|
|
}
|
|
|
|
|
textarea{
|
|
|
|
|
line-height: 22px;
|
|
|
|
|
}
|
|
|
|
|
.line-count {
|
|
|
|
|
width: 24px;
|
|
|
|
|
padding-top: 3px;
|
|
|
|
|
@ -1753,14 +1830,37 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.sender-label{
|
|
|
|
|
position: relative;
|
|
|
|
|
margin-bottom: 0px !important;
|
|
|
|
|
/deep/ .ant-form-item-children-icon{
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: calc(100% + 15px);
|
|
|
|
|
left: 0;
|
|
|
|
|
}
|
|
|
|
|
/deep/ .ant-form-explain{
|
|
|
|
|
padding-left: 33px;
|
|
|
|
|
margin-top: -15px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.yard-box {
|
|
|
|
|
position: relative;
|
|
|
|
|
margin-top: 5px;
|
|
|
|
|
i {
|
|
|
|
|
color: @primary-color;
|
|
|
|
|
margin-top: -3px !important;
|
|
|
|
|
margin-top: -5px !important;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.yarn-label{
|
|
|
|
|
position: relative;
|
|
|
|
|
/deep/ .ant-form-item-children-icon{
|
|
|
|
|
// position: absolute;
|
|
|
|
|
// top: 13px;
|
|
|
|
|
// right: 44px;
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.content {
|
|
|
|
|
.label {
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
@ -1783,6 +1883,7 @@ export default {
|
|
|
|
|
|
|
|
|
|
.line-box {
|
|
|
|
|
display: flex;
|
|
|
|
|
margin-top: 6px;
|
|
|
|
|
span.unit {
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
color: #999;
|
|
|
|
|
@ -1797,5 +1898,14 @@ export default {
|
|
|
|
|
top: 15px !important;
|
|
|
|
|
right: -22px !important;
|
|
|
|
|
}
|
|
|
|
|
.yarn-label {
|
|
|
|
|
position: relative;
|
|
|
|
|
/deep/ .ant-form-item-children-icon{
|
|
|
|
|
// position: absolute;
|
|
|
|
|
// top: 13px;
|
|
|
|
|
// right: 15px;
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
张同海
2 years ago