|
|
|
@ -15,16 +15,16 @@
|
|
|
|
|
预配舱单列表
|
|
|
|
|
</h4>
|
|
|
|
|
<div>
|
|
|
|
|
<a-button type="link" @click="addOrder" class="pl0 pb0">
|
|
|
|
|
<a-button v-repeat type="link" @click="addOrder" class="pl0 pb0">
|
|
|
|
|
<span class="iconfont icon-new_document"></span>
|
|
|
|
|
添加分单
|
|
|
|
|
</a-button>
|
|
|
|
|
<a-button type="link" @click="sendOrderFun" class="pb0">
|
|
|
|
|
<a-button v-repeat type="link" @click="sendOrderFun" class="pb0">
|
|
|
|
|
<span class="iconfont icon-tijiao1"></span>
|
|
|
|
|
发送
|
|
|
|
|
</a-button>
|
|
|
|
|
<div style="white-space: nowrap;">
|
|
|
|
|
<a-button type="link" @click="saveOrder" class="pl0 pt0">
|
|
|
|
|
<a-button v-repeat type="link" @click="saveOrder" class="pl0 pt0">
|
|
|
|
|
<span class="iconfont icon-baocun"></span>
|
|
|
|
|
保存
|
|
|
|
|
</a-button>
|
|
|
|
@ -52,41 +52,62 @@
|
|
|
|
|
</a-popconfirm>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<a-spin :spinning="floading">
|
|
|
|
|
<div class="sec-order">
|
|
|
|
|
<template v-for="(sedDetail, sindex) in orderList" :key="sindex">
|
|
|
|
|
<h4>主提单号</h4>
|
|
|
|
|
<template v-for="(sedDetail, sindex) in orderList" :key="sindex + 'f'">
|
|
|
|
|
<div class="order-box">
|
|
|
|
|
<a-checkbox class="check-btn" v-model:checked="sedDetail.checked" />
|
|
|
|
|
<a-checkbox v-if="!sedDetail.isHBL" class="check-btn mb10" v-model:checked="sedDetail.checked" />
|
|
|
|
|
<span
|
|
|
|
|
class="order-label"
|
|
|
|
|
:class="{ active: sindex == editIndex }"
|
|
|
|
|
@click.stop="changeOrder(sindex)"
|
|
|
|
|
@click.stop="changeOrder(sindex, sedDetail)"
|
|
|
|
|
>
|
|
|
|
|
<a-tag
|
|
|
|
|
class="tag"
|
|
|
|
|
v-if="sedDetail.state"
|
|
|
|
|
v-if="sedDetail.state && !sedDetail.isHBL"
|
|
|
|
|
:color="sedDetail.state === '已直发' ? '#00CC00' : ''"
|
|
|
|
|
>{{ sedDetail.state }}</a-tag
|
|
|
|
|
>>
|
|
|
|
|
>
|
|
|
|
|
<template v-if="!sedDetail.isHBL">
|
|
|
|
|
主提单号:{{ sedDetail.mblno || '请填写主提单号' }}
|
|
|
|
|
{{ sedDetail.mblno || '请填写主提单号' }}
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
分提单号{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mt15">
|
|
|
|
|
<h4>分提单号</h4>
|
|
|
|
|
<template v-for="(sedDetail, sindex) in orderList" :key="sindex">
|
|
|
|
|
<div class="order-box">
|
|
|
|
|
<a-checkbox v-if="sedDetail.isHBL" class="check-btn mb10" v-model:checked="sedDetail.checked" />
|
|
|
|
|
<span
|
|
|
|
|
class="order-label"
|
|
|
|
|
:class="{ active: sindex == editIndex }"
|
|
|
|
|
@click.stop="changeOrder(sindex, sedDetail)"
|
|
|
|
|
>
|
|
|
|
|
<a-tag
|
|
|
|
|
class="tag"
|
|
|
|
|
v-if="sedDetail.state && sedDetail.isHBL"
|
|
|
|
|
:color="sedDetail.state === '已直发' ? '#00CC00' : ''"
|
|
|
|
|
>{{ sedDetail.state }}</a-tag
|
|
|
|
|
>
|
|
|
|
|
<template v-if="sedDetail.isHBL">
|
|
|
|
|
{{ sedDetail.hblno || '请填写分单号' }}
|
|
|
|
|
</template>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="pre-details">
|
|
|
|
|
<a-spin :spinning="floading" style="flex: 1">
|
|
|
|
|
<a-form
|
|
|
|
|
class="ds-detail-form"
|
|
|
|
|
layout="vertical"
|
|
|
|
|
ref="basicFrom"
|
|
|
|
|
:selfUpdate="true"
|
|
|
|
|
size="small"
|
|
|
|
|
:model="formState"
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
>
|
|
|
|
|
<div class="ds-card">
|
|
|
|
|
<h4>基本信息</h4>
|
|
|
|
@ -96,7 +117,7 @@
|
|
|
|
|
label="主提单号"
|
|
|
|
|
name="mblno"
|
|
|
|
|
>
|
|
|
|
|
<a-input v-model:value="formState.mblno" />
|
|
|
|
|
<a-input v-model:value="formState.mblno" disabled/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col v-else :span="4">
|
|
|
|
@ -174,7 +195,6 @@
|
|
|
|
|
>
|
|
|
|
|
<a-select
|
|
|
|
|
class="sft-select"
|
|
|
|
|
placeholder="模版"
|
|
|
|
|
v-model:value="formState.shipperId"
|
|
|
|
|
@change="
|
|
|
|
|
(e) => {
|
|
|
|
@ -204,7 +224,6 @@
|
|
|
|
|
>
|
|
|
|
|
<a-select
|
|
|
|
|
class="sft-select"
|
|
|
|
|
placeholder="模版"
|
|
|
|
|
v-model:value="formState.consigneeId"
|
|
|
|
|
@change="
|
|
|
|
|
(e) => {
|
|
|
|
@ -234,7 +253,6 @@
|
|
|
|
|
>
|
|
|
|
|
<a-select
|
|
|
|
|
class="sft-select"
|
|
|
|
|
placeholder="模版"
|
|
|
|
|
v-model:value="formState.notifyPartyId"
|
|
|
|
|
@change="
|
|
|
|
|
(e) => {
|
|
|
|
@ -464,7 +482,7 @@
|
|
|
|
|
<a-textarea
|
|
|
|
|
class="input-box"
|
|
|
|
|
v-model:value="formState.marks"
|
|
|
|
|
:auto-size="{ minRows: 7, maxRows: 7 }"
|
|
|
|
|
:auto-size="{ minRows: 12, maxRows: 12 }"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
@ -475,7 +493,7 @@
|
|
|
|
|
>
|
|
|
|
|
<a-textarea
|
|
|
|
|
v-model:value="formState.description"
|
|
|
|
|
:auto-size="{ minRows: 7, maxRows: 7 }"
|
|
|
|
|
:auto-size="{ minRows: 12, maxRows: 12 }"
|
|
|
|
|
/>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
@ -622,13 +640,12 @@
|
|
|
|
|
</a-row>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="ds-card mt15">
|
|
|
|
|
<h4>集装箱信息</h4>
|
|
|
|
|
<div class="flex" style="justify-content: space-between;">
|
|
|
|
|
<a-form-item
|
|
|
|
|
label="场站"
|
|
|
|
|
name="yardId"
|
|
|
|
|
>
|
|
|
|
|
<a-select v-model:value="formState.yardId" style="width: 200px">
|
|
|
|
|
<div class="flex">
|
|
|
|
|
<h4>集装箱信息</h4>
|
|
|
|
|
<div >
|
|
|
|
|
<span style="font-size: 12px;" class="ml10">场站:</span>
|
|
|
|
|
<a-select v-model:value="formState.yardId" style="width: 100px">
|
|
|
|
|
<a-select-option
|
|
|
|
|
v-for="item in yardList"
|
|
|
|
|
:key="item.id"
|
|
|
|
@ -637,8 +654,10 @@
|
|
|
|
|
{{ item.codeName }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div style="float: right">
|
|
|
|
|
<a-button type="link" @click="addCtn" class="pl0">
|
|
|
|
|
<span class="iconfont icon-new_document"></span>
|
|
|
|
|
新建
|
|
|
|
@ -654,15 +673,6 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<a-col :span="24">
|
|
|
|
|
<div class="mail-box">
|
|
|
|
|
<div class="ctn-btn">
|
|
|
|
|
<div class="import">
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="table-box">
|
|
|
|
|
<hot-table ref="hotTb" :data="list" :settings="settings">
|
|
|
|
|
<img
|
|
|
|
|
v-show="!list.length"
|
|
|
|
@ -672,11 +682,8 @@
|
|
|
|
|
/>
|
|
|
|
|
</hot-table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-col>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form>
|
|
|
|
|
</div>
|
|
|
|
|
</a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<a-modal
|
|
|
|
|
width="50vw"
|
|
|
|
@ -743,7 +750,7 @@
|
|
|
|
|
} from '/@/views/operation/seaexport/api/BookingLedger'
|
|
|
|
|
import { preOrderD } from '/@/views/operation/seaexport/detail/modules/preOrderColumns'
|
|
|
|
|
import { useMessage } from '/@/hooks/web/useMessage'
|
|
|
|
|
const { notification } = useMessage()
|
|
|
|
|
const { notification, createMessage } = useMessage()
|
|
|
|
|
import { useRoute } from 'vue-router'
|
|
|
|
|
const route = useRoute()
|
|
|
|
|
import { HotTable } from '@handsontable/vue3'
|
|
|
|
@ -755,37 +762,6 @@
|
|
|
|
|
})
|
|
|
|
|
const openPreOrderShow = ref(false)
|
|
|
|
|
const id = ref()
|
|
|
|
|
const labelCol = {
|
|
|
|
|
xs: { span: 12 },
|
|
|
|
|
sm: { span: 4 },
|
|
|
|
|
md: { span: 4 }
|
|
|
|
|
}
|
|
|
|
|
const wrapperCol = {
|
|
|
|
|
xs: { span: 24 },
|
|
|
|
|
sm: { span: 15 },
|
|
|
|
|
md: { span: 20 },
|
|
|
|
|
}
|
|
|
|
|
const labelCol2 = {
|
|
|
|
|
xs: { span: 24 },
|
|
|
|
|
sm: { span: 8 },
|
|
|
|
|
md: { span: 8 },
|
|
|
|
|
}
|
|
|
|
|
const wrapperCol2 = {
|
|
|
|
|
xs: { span: 24 },
|
|
|
|
|
sm: { span: 15 },
|
|
|
|
|
md: { span: 16 },
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const labelCol3 = {
|
|
|
|
|
xs: { span: 24 },
|
|
|
|
|
sm: { span: 8 },
|
|
|
|
|
md: { span: 6 },
|
|
|
|
|
}
|
|
|
|
|
const wrapperCol3 = {
|
|
|
|
|
xs: { span: 24 },
|
|
|
|
|
sm: { span: 15 },
|
|
|
|
|
md: { span: 16 },
|
|
|
|
|
}
|
|
|
|
|
// -----------------------弹窗相关------------------------
|
|
|
|
|
function init() {
|
|
|
|
|
openPreOrderShow.value = true
|
|
|
|
@ -805,6 +781,11 @@
|
|
|
|
|
const orderList = ref<any>([])
|
|
|
|
|
const formState = ref<any>({})
|
|
|
|
|
const editIndex = ref(0)
|
|
|
|
|
const floading = ref(false)
|
|
|
|
|
// 主题单号数据列表
|
|
|
|
|
const mainBillData = ref([])
|
|
|
|
|
// 分单号列表
|
|
|
|
|
const childBillData = ref([])
|
|
|
|
|
// 获取列表数据
|
|
|
|
|
function FngetPageESeaeEdi() {
|
|
|
|
|
orderList.value.splice(0)
|
|
|
|
@ -818,8 +799,10 @@
|
|
|
|
|
},
|
|
|
|
|
queryCondition: `[{"FieldName":"businessId","FieldValue":"${id.value}","ConditionalType":1}]`,
|
|
|
|
|
}
|
|
|
|
|
floading.value = true
|
|
|
|
|
GetShippingBillList(ApiData)
|
|
|
|
|
.then((res) => {
|
|
|
|
|
floading.value = false
|
|
|
|
|
if (res.succeeded) {
|
|
|
|
|
if (res.data.length > 0) {
|
|
|
|
|
res.data.forEach((e) => {
|
|
|
|
@ -832,7 +815,7 @@
|
|
|
|
|
if (e.mblno == route.query.mblno) {
|
|
|
|
|
isHBL = false
|
|
|
|
|
}
|
|
|
|
|
orderList.value.push({ checked: true, isHBL, ...e })
|
|
|
|
|
orderList.value.push({ checked: false, isHBL, ...e })
|
|
|
|
|
})
|
|
|
|
|
formState.value = orderList.value[editIndex.value]
|
|
|
|
|
} else {
|
|
|
|
@ -858,7 +841,7 @@
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
console.log(err)
|
|
|
|
|
floading.value = false
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 添加分单
|
|
|
|
@ -888,10 +871,12 @@
|
|
|
|
|
ApiData.yard = e.shortName
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
floading.value = true
|
|
|
|
|
EditShippingBill(ApiData).then((res) => {
|
|
|
|
|
floading.value = false
|
|
|
|
|
if (res.succeeded) {
|
|
|
|
|
orderList.value[editIndex.value].id = res.data
|
|
|
|
|
notification.success({ message: res.message, duration: 3 })
|
|
|
|
|
createMessage.success(res.message)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
@ -1000,10 +985,14 @@
|
|
|
|
|
init()
|
|
|
|
|
}
|
|
|
|
|
// 点击列表
|
|
|
|
|
function changeOrder(index) {
|
|
|
|
|
function changeOrder(index, sedDetail) {
|
|
|
|
|
orderList.value[editIndex.value] = formState.value
|
|
|
|
|
editIndex.value = index
|
|
|
|
|
formState.value = orderList.value[index]
|
|
|
|
|
orderList.value.forEach(item => {
|
|
|
|
|
item.checked = false
|
|
|
|
|
})
|
|
|
|
|
sedDetail.checked = true
|
|
|
|
|
// GetShippingBillInfo({ id: formState.value.id }).then((res) => {
|
|
|
|
|
// if (res.succeeded) {
|
|
|
|
|
// notification.success({ message: res.message, duration: 3 })
|
|
|
|
@ -1130,34 +1119,34 @@
|
|
|
|
|
// },
|
|
|
|
|
{
|
|
|
|
|
title: '箱号',
|
|
|
|
|
width: 80,
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'cntrNo',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '封号',
|
|
|
|
|
width: 80,
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'sealNo',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '件数',
|
|
|
|
|
width: 80,
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'pkgs',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '毛重',
|
|
|
|
|
width: 80,
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'kgs',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '尺码',
|
|
|
|
|
width: 80,
|
|
|
|
|
width: 120,
|
|
|
|
|
data: 'cbm',
|
|
|
|
|
},
|
|
|
|
|
// kindPkgsName
|
|
|
|
|
// kindPkgs
|
|
|
|
|
{
|
|
|
|
|
title: '包装',
|
|
|
|
|
width: 120,
|
|
|
|
|
width: 150,
|
|
|
|
|
data: 'kindPkgs',
|
|
|
|
|
type: 'dropdown',
|
|
|
|
|
// 下拉框数据,可以同步或者异步返回(异步需要process返回)
|
|
|
|
|