|
|
|
@ -1,270 +1,266 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="main">
|
|
|
|
|
<div style="width: 74%;margin-right: 20px;background: white;padding: 10px;">
|
|
|
|
|
|
|
|
|
|
<div style="margin-bottom: 10px;">
|
|
|
|
|
<a-button type="link" size="mini" @click="handleSave">
|
|
|
|
|
<span class="iconfont icon-jiahao2fill"></span>
|
|
|
|
|
保存
|
|
|
|
|
</a-button>
|
|
|
|
|
<!-- <a-button v-if="type === 'edit'" style="margin: 0 10px;" type="link" size="mini">
|
|
|
|
|
<span class="iconfont icon-tijiao1"></span>
|
|
|
|
|
提交
|
|
|
|
|
</a-button>
|
|
|
|
|
<a-button v-if="type === 'edit'" type="link" size="mini">
|
|
|
|
|
<span class="iconfont icon-fuzhi3"></span>
|
|
|
|
|
审核
|
|
|
|
|
</a-button>
|
|
|
|
|
<a-button v-if="type === 'edit'" style="margin: 0 10px;" type="link" size="mini">
|
|
|
|
|
<span class="iconfont icon-guanli"></span>提交审核</a-button> -->
|
|
|
|
|
</div>
|
|
|
|
|
<a-spin :spinning="loading">
|
|
|
|
|
<a-form :model="form" :wrapper-col="{ span: 21 }">
|
|
|
|
|
<div v-if="type === 'edit' && form.bookingSlotSaleInfoList.length && form.bookingSlotSaleInfoList.length > 0"
|
|
|
|
|
class="bookslot">
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title"
|
|
|
|
|
v-if="type === 'edit' && form.bookingSlotSaleInfoList.length && form.bookingSlotSaleInfoList.length > 0">
|
|
|
|
|
关联订舱
|
|
|
|
|
</div>
|
|
|
|
|
<div :class="{ 'line-bootm': index != form.bookingSlotSaleInfoList.length - 1 }"
|
|
|
|
|
v-for="(item, index) in form.bookingSlotSaleInfoList" v-show="item.customerId != 0"
|
|
|
|
|
:key="index">
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>委托单位</div>
|
|
|
|
|
<a-select show-search v-model:value="item.customerName"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null" @change="e => {
|
|
|
|
|
ChangeUser(e, 'customerId', 5, index)
|
|
|
|
|
}" @search="SearchCustomer">
|
|
|
|
|
<a-select-option v-for="(item1, index1) in CustomerList" :key="index1"
|
|
|
|
|
:value="item1.pinYinCode">
|
|
|
|
|
{{ item1.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>客服</div>
|
|
|
|
|
<a-select show-search v-model:value="item.custService"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null" allowClear
|
|
|
|
|
@search="SearchUser($event, 0)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'custServiceId', 0, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item1 in UserListCus" :key="item1.id"
|
|
|
|
|
:value="item1.pinYinCode">
|
|
|
|
|
{{ item1.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>销售</div>
|
|
|
|
|
<a-select show-search v-model:value="item.sale"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null" allowClear
|
|
|
|
|
@search="SearchUser($event, 1)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'saleId', 1, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item1 in UserListSale" :key="item1.id"
|
|
|
|
|
:value="item1.pinYinCode">
|
|
|
|
|
{{ item1.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>操作</div>
|
|
|
|
|
<a-select show-search v-model:value="item.op"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false" allowClear
|
|
|
|
|
:filter-option="false" :not-found-content="null"
|
|
|
|
|
@search="SearchUser($event, 2)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'opId', 2, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item in UserListOp" :key="item.id"
|
|
|
|
|
:value="item.pinYinCode">
|
|
|
|
|
{{ item.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>单证</div>
|
|
|
|
|
<a-select show-search v-model:value="item.doc" allowClear
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null"
|
|
|
|
|
@search="SearchUser($event, 3)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'docId', 3, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item in UserListDoc" :key="item.id"
|
|
|
|
|
:value="item.pinYinCode">
|
|
|
|
|
{{ item.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>商务</div>
|
|
|
|
|
<a-select show-search v-model:value="item.business" allowClear
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null"
|
|
|
|
|
@search="SearchUser($event, 4)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'businessId', 4, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item in UserListBus" :key="item.id"
|
|
|
|
|
:value="item.pinYinCode">
|
|
|
|
|
{{ item.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>品名</div>
|
|
|
|
|
<a-input v-model:value="item.goodsName" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>卖价</div>
|
|
|
|
|
<a-input-number style="width: 100%" :precision="2"
|
|
|
|
|
v-model:value="item.sellingPrice" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>销售日期</div>
|
|
|
|
|
<a-date-picker valueFormat="YYYY-MM-DD" style="width: 100%"
|
|
|
|
|
v-model:value="item.saleTime" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>SHIPPER</div>
|
|
|
|
|
<a-input v-model:value="item.shipper" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<div class="box-top">
|
|
|
|
|
<a-tabs v-model:activeKey="activeKey">
|
|
|
|
|
<a-tab-pane key="1" tab="舱位台账"></a-tab-pane>
|
|
|
|
|
<a-tab-pane key="2" tab="日志"></a-tab-pane>
|
|
|
|
|
</a-tabs>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="margin-bottom: 10px;margin-left: 20px">
|
|
|
|
|
<span class="icon-box" @click="handleSave">
|
|
|
|
|
<SvgIcon size="16" name="save-btn" />
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="display: flex;padding: 0 20px">
|
|
|
|
|
<div style="width: 74%;margin-right: 20px;">
|
|
|
|
|
<a-spin :spinning="loading">
|
|
|
|
|
<a-form :model="form" :wrapper-col="{ span: 21 }">
|
|
|
|
|
<div v-if="type === 'edit' && form.bookingSlotSaleInfoList.length && form.bookingSlotSaleInfoList.length > 0"
|
|
|
|
|
class="bookslot">
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title"
|
|
|
|
|
v-if="type === 'edit' && form.bookingSlotSaleInfoList.length && form.bookingSlotSaleInfoList.length > 0">
|
|
|
|
|
关联订舱
|
|
|
|
|
</div>
|
|
|
|
|
<div :class="{ 'line-bootm': index != form.bookingSlotSaleInfoList.length - 1 }"
|
|
|
|
|
v-for="(item, index) in form.bookingSlotSaleInfoList" v-show="item.customerId != 0"
|
|
|
|
|
:key="index">
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>委托单位</div>
|
|
|
|
|
<a-select show-search v-model:value="item.customerName"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null" @change="e => {
|
|
|
|
|
ChangeUser(e, 'customerId', 5, index)
|
|
|
|
|
}" @search="SearchCustomer">
|
|
|
|
|
<a-select-option v-for="(item1, index1) in CustomerList"
|
|
|
|
|
:key="index1" :value="item1.pinYinCode">
|
|
|
|
|
{{ item1.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>客服</div>
|
|
|
|
|
<a-select show-search v-model:value="item.custService"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null" allowClear
|
|
|
|
|
@search="SearchUser($event, 0)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'custServiceId', 0, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item1 in UserListCus" :key="item1.id"
|
|
|
|
|
:value="item1.pinYinCode">
|
|
|
|
|
{{ item1.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>销售</div>
|
|
|
|
|
<a-select show-search v-model:value="item.sale"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null" allowClear
|
|
|
|
|
@search="SearchUser($event, 1)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'saleId', 1, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item1 in UserListSale" :key="item1.id"
|
|
|
|
|
:value="item1.pinYinCode">
|
|
|
|
|
{{ item1.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>操作</div>
|
|
|
|
|
<a-select show-search v-model:value="item.op"
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false" allowClear
|
|
|
|
|
:filter-option="false" :not-found-content="null"
|
|
|
|
|
@search="SearchUser($event, 2)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'opId', 2, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item in UserListOp" :key="item.id"
|
|
|
|
|
:value="item.pinYinCode">
|
|
|
|
|
{{ item.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>单证</div>
|
|
|
|
|
<a-select show-search v-model:value="item.doc" allowClear
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null"
|
|
|
|
|
@search="SearchUser($event, 3)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'docId', 3, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item in UserListDoc" :key="item.id"
|
|
|
|
|
:value="item.pinYinCode">
|
|
|
|
|
{{ item.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>商务</div>
|
|
|
|
|
<a-select show-search v-model:value="item.business" allowClear
|
|
|
|
|
:default-active-first-option="false" :show-arrow="false"
|
|
|
|
|
:filter-option="false" :not-found-content="null"
|
|
|
|
|
@search="SearchUser($event, 4)" @change="e => {
|
|
|
|
|
ChangeUser(e, 'businessId', 4, index)
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
<a-select-option v-for="item in UserListBus" :key="item.id"
|
|
|
|
|
:value="item.pinYinCode">
|
|
|
|
|
{{ item.pinYinCode }}
|
|
|
|
|
</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
<a-row>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>品名</div>
|
|
|
|
|
<a-input v-model:value="item.goodsName" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>卖价</div>
|
|
|
|
|
<a-input-number style="width: 100%" :precision="2"
|
|
|
|
|
v-model:value="item.sellingPrice" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>销售日期</div>
|
|
|
|
|
<a-date-picker valueFormat="YYYY-MM-DD" style="width: 100%"
|
|
|
|
|
v-model:value="item.saleTime" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
<a-col :span="4">
|
|
|
|
|
<a-form-item label="">
|
|
|
|
|
<div>SHIPPER</div>
|
|
|
|
|
<a-input v-model:value="item.shipper" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
</a-col>
|
|
|
|
|
</a-row>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form>
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span style="margin-right: 20px;">{{ type === 'edit' ? '舱位修改' : '舱位新增' }}</span>
|
|
|
|
|
<span
|
|
|
|
|
style="background: #d78a6d;color: white;padding: 0 8px;font-size: 13px;font-weight: 400;"
|
|
|
|
|
v-if="form.spliT_OR_MERGE_FLAG == 1">已拆票</span>
|
|
|
|
|
<span
|
|
|
|
|
style="background: #d78a6d;color: white;padding: 0 8px;font-size: 13px;font-weight: 400;"
|
|
|
|
|
v-if="form.spliT_OR_MERGE_FLAG == 2">已合票</span>
|
|
|
|
|
</div>
|
|
|
|
|
<BasicForm @register="registerForm" />
|
|
|
|
|
</div>
|
|
|
|
|
</a-form>
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span style="margin-right: 20px;">{{ type === 'edit' ? '舱位修改' : '舱位新增' }}</span>
|
|
|
|
|
<span style="background: #d78a6d;color: white;padding: 0 8px;font-size: 13px;font-weight: 400;"
|
|
|
|
|
v-if="form.spliT_OR_MERGE_FLAG == 1">已拆票</span>
|
|
|
|
|
<span style="background: #d78a6d;color: white;padding: 0 8px;font-size: 13px;font-weight: 400;"
|
|
|
|
|
v-if="form.spliT_OR_MERGE_FLAG == 2">已合票</span>
|
|
|
|
|
</div>
|
|
|
|
|
<BasicForm @register="registerForm" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">截止时间</div>
|
|
|
|
|
<BasicForm @register="registerFormTime" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">截止时间</div>
|
|
|
|
|
<BasicForm @register="registerFormTime" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span>箱型箱量</span>
|
|
|
|
|
<span style="font-size: 12px;margin-left: 20px;cursor: pointer;font-weight: 400"
|
|
|
|
|
@click="handleOpenBoxList">
|
|
|
|
|
<span class="iconfont icon-jiahao2fill" style="color: rgba(37, 122, 250, 1);"></span>添加
|
|
|
|
|
</span>
|
|
|
|
|
<span style="font-size: 12px;margin-left: 20px;" @click="boxFlag = true">合计:{{ boxTotal
|
|
|
|
|
}}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="list">
|
|
|
|
|
<div class="item" v-for="item in form.ctnList" :key="item.gid">
|
|
|
|
|
<a-input-number style="width: 100%;" v-model:value="item.ctnNum" :min="1" :max="100">
|
|
|
|
|
<template #prefix>
|
|
|
|
|
{{ item.ctnAll }}:
|
|
|
|
|
</template>
|
|
|
|
|
</a-input-number>
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span>箱型箱量</span>
|
|
|
|
|
<span @click="handleOpenBoxList" class="ctn-btn">
|
|
|
|
|
<i class="iconfont icon-xiugai-danse"></i>编辑
|
|
|
|
|
</span>
|
|
|
|
|
<span style="font-size: 12px;margin-left: 20px;" @click="boxFlag = true">合计:{{ boxTotal
|
|
|
|
|
}}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="list">
|
|
|
|
|
<div class="item" v-for="item in form.ctnList" :key="item.gid">
|
|
|
|
|
<a-input-number style="width: 100%;" v-model:value="item.ctnNum" :min="1" :max="100">
|
|
|
|
|
<template #prefix>
|
|
|
|
|
{{ item.ctnAll }}:
|
|
|
|
|
</template>
|
|
|
|
|
</a-input-number>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span>用途</span>
|
|
|
|
|
<span style="font-size: 12px;margin-left: 20px;cursor: pointer;font-weight: 400"
|
|
|
|
|
@click="handleOpenUse">
|
|
|
|
|
<span class="iconfont icon-jiahao2fill" style="color: rgba(37, 122, 250, 1);"></span>添加
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="use-list">
|
|
|
|
|
<div class="item" v-for="(item, index) in form.useToList" :key="item.useTo">
|
|
|
|
|
<i @click="delUse(index)" class="icon-shanchu2 iconfont"></i>
|
|
|
|
|
<span>【{{ item.useToName }}】</span>
|
|
|
|
|
<span> {{ item.useToValShow }} </span>
|
|
|
|
|
<i @click="editUse(item, index)" style="margin-left: 5px;"
|
|
|
|
|
class="icon-bianji1 iconfont"></i>
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span>用途</span>
|
|
|
|
|
<span @click="handleOpenUse" class="icon-box gray">
|
|
|
|
|
<SvgIcon size="16" name="add-btn" />
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="use-list">
|
|
|
|
|
<div class="item" v-for="(item, index) in form.useToList" :key="item.useTo">
|
|
|
|
|
<span>【{{ item.useToName }}】</span>
|
|
|
|
|
<span> {{ item.useToValShow }} </span>
|
|
|
|
|
<i @click="editUse(item, index)" style="margin-left: 5px;"
|
|
|
|
|
class="icon-bianji1 iconfont"></i>
|
|
|
|
|
<i @click="delUse(index)" class="icon-chahao iconfont"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span>舱位延期</span>
|
|
|
|
|
<span style="font-size: 12px;margin-left: 20px;cursor: pointer;font-weight: 400"
|
|
|
|
|
@click="openRoll">
|
|
|
|
|
<span class="iconfont icon-jiahao2fill" style="color: rgba(37, 122, 250, 1);"></span>新增
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cost">
|
|
|
|
|
<BasicTable class="ds-table" @register="registerTable1">
|
|
|
|
|
</BasicTable>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">费用</div>
|
|
|
|
|
<div class="cost">
|
|
|
|
|
<BasicTable class="ds-table" @register="registerTable">
|
|
|
|
|
</BasicTable>
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<span>舱位延期</span>
|
|
|
|
|
<span @click="openRoll" class="icon-box gray">
|
|
|
|
|
<SvgIcon size="16" name="add-btn" />
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cost">
|
|
|
|
|
<BasicTable @register="registerTable1">
|
|
|
|
|
</BasicTable>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div style="width: 26%;padding-right: 20px;margin-top: 53px">
|
|
|
|
|
<div class="card">
|
|
|
|
|
<DsFile ref="dsFile" :id="id" :show="false" height="300">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<h4>附件</h4>
|
|
|
|
|
<a-button type="link" size="mini" style="padding-right: 3px!important;" @click="addFile">
|
|
|
|
|
<span class="iconfont icon-fujian1"></span>
|
|
|
|
|
新增附件
|
|
|
|
|
</a-button>
|
|
|
|
|
<div class="box-item">
|
|
|
|
|
<div class="title">费用</div>
|
|
|
|
|
<div class="cost">
|
|
|
|
|
<BasicTable @register="registerTable">
|
|
|
|
|
</BasicTable>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</DsFile>
|
|
|
|
|
</a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card">
|
|
|
|
|
<div class="title">日志</div>
|
|
|
|
|
<log :logList="form.logList"></log>
|
|
|
|
|
|
|
|
|
|
<div style="width: 26%;">
|
|
|
|
|
<div class="card">
|
|
|
|
|
<DsFile ref="dsFile" :id="id" :show="false" height="300">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<h4>附件</h4>
|
|
|
|
|
<a-button type="link" size="mini" style="padding-right: 3px!important;" @click="addFile">
|
|
|
|
|
<span class="iconfont icon-fujian1"></span>
|
|
|
|
|
新增附件
|
|
|
|
|
</a-button>
|
|
|
|
|
</div>
|
|
|
|
|
</DsFile>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="card">
|
|
|
|
|
<div class="title">日志</div>
|
|
|
|
|
<log :logList="form.logList"></log>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a-modal :footer="null" title="请选择箱型" width="600px" @cancel="boxFlag = false" :visible="boxFlag">
|
|
|
|
|
<div class="boxList">
|
|
|
|
|
<div class="boxItem" :class="{ 'active': item.flag }" @click="handleClick(item)" v-for="item in boxList"
|
|
|
|
@ -300,12 +296,14 @@ import {
|
|
|
|
|
GetCustomerServiceList, GetSaleList, GetVouchingClerkList
|
|
|
|
|
} from '/@/views/operation/seaexport/api/BookingLedger'
|
|
|
|
|
import { useOptionsStore } from '/@/store/modules/options'
|
|
|
|
|
import { SvgIcon } from '/@/components/Icon'
|
|
|
|
|
import log from './log.vue'
|
|
|
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
|
|
const optionsStore = useOptionsStore()
|
|
|
|
|
import { BasicTable, useTable, TableAction } from '/@/components/Table'
|
|
|
|
|
import { BasicForm, useForm } from '/@/components/Form/index'
|
|
|
|
|
import { detialForm, detialTimeForm, useDetailForm, rollForm } from '../columns'
|
|
|
|
|
const activeKey = ref('1')
|
|
|
|
|
//基础信息
|
|
|
|
|
const [registerForm,
|
|
|
|
|
{
|
|
|
|
@ -868,6 +866,8 @@ async function handleSave() {
|
|
|
|
|
createMessage.error(res.message)
|
|
|
|
|
loading.value = false
|
|
|
|
|
}
|
|
|
|
|
}).catch(error => {
|
|
|
|
|
loading.value = false
|
|
|
|
|
})
|
|
|
|
|
} finally {
|
|
|
|
|
}
|
|
|
|
@ -999,20 +999,31 @@ function getWeek(dateTime) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.box-item {
|
|
|
|
|
border: 1px solid rgba(232, 235, 237, 1);
|
|
|
|
|
padding: 15px;
|
|
|
|
|
margin-bottom: 20px
|
|
|
|
|
padding: 15px 20px;
|
|
|
|
|
margin-bottom: 16px;
|
|
|
|
|
border-radius: 6px;
|
|
|
|
|
background: rgba(255, 255, 255, 1);
|
|
|
|
|
border: 1px solid rgba(204, 214, 223, 1);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.main {
|
|
|
|
|
display: flex;
|
|
|
|
|
background-color: rgba(240, 242, 245, 1);
|
|
|
|
|
|
|
|
|
|
.box-top {
|
|
|
|
|
height: 48px;
|
|
|
|
|
line-height: 48px;
|
|
|
|
|
background-color: white;
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
color: black;
|
|
|
|
|
margin-bottom: 15px;
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
margin-bottom: 13px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.week {
|
|
|
|
@ -1263,8 +1274,10 @@ function getWeek(dateTime) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.card {
|
|
|
|
|
border: 1px solid #E8EBED;
|
|
|
|
|
padding: 20px 16px;
|
|
|
|
|
border-radius: 6px;
|
|
|
|
|
background: rgba(255, 255, 255, 1);
|
|
|
|
|
border: 1px solid rgba(204, 214, 223, 1);
|
|
|
|
|
margin-bottom: 20px;
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
@ -1290,7 +1303,7 @@ function getWeek(dateTime) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ds-table .ant-table-container,
|
|
|
|
|
.ds-table-detail .ant-table-container) {
|
|
|
|
|
.ds-table-detail .ant-table-container) {
|
|
|
|
|
padding: 0px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -1320,7 +1333,7 @@ function getWeek(dateTime) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-select-single .ant-select-selector .ant-select-selection-item,
|
|
|
|
|
.ant-select-single .ant-select-selector .ant-select-selection-placeholder) {
|
|
|
|
|
.ant-select-single .ant-select-selector .ant-select-selection-placeholder) {
|
|
|
|
|
line-height: 26px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
@ -1328,15 +1341,17 @@ function getWeek(dateTime) {
|
|
|
|
|
.use-list {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
border: 1px solid rgba(232, 235, 237, 1);
|
|
|
|
|
padding: 5px;
|
|
|
|
|
background: #f5f9fc;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
background: rgba(240, 242, 245, 1);
|
|
|
|
|
color: black;
|
|
|
|
|
margin-right: 15px;
|
|
|
|
|
display: flex;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
height: 26px;
|
|
|
|
|
line-height: 26px;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
}
|
|
|
|
@ -1345,4 +1360,74 @@ function getWeek(dateTime) {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-nav-list) {
|
|
|
|
|
display: flex;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 48px;
|
|
|
|
|
line-height: 48px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-tab + .ant-tabs-tab) {
|
|
|
|
|
margin: 0px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-ink-bar) {
|
|
|
|
|
height: 3px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-tab-btn) {
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
font-weight: 200;
|
|
|
|
|
color: #7a8996;
|
|
|
|
|
line-height: 14px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-tab-active .ant-tabs-tab-btn) {
|
|
|
|
|
color: #121826 !important;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-tab) {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
text-align: center;
|
|
|
|
|
width: 5%;
|
|
|
|
|
line-height: 12px;
|
|
|
|
|
padding: 17px 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:deep(.ant-tabs-nav) {
|
|
|
|
|
margin: 0px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.icon-box {
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
background: rgba(255, 255, 255, 1);
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
height: 26px;
|
|
|
|
|
width: 26px;
|
|
|
|
|
line-height: 27px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.ctn-btn {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
margin-left: 8px;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
background: rgba(240, 242, 245, 1);
|
|
|
|
|
padding: 5px 6px;
|
|
|
|
|
font-weight: 300;
|
|
|
|
|
|
|
|
|
|
.iconfont {
|
|
|
|
|
font-size: 14px
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.gray {
|
|
|
|
|
background: rgba(240, 242, 245, 1) !important;
|
|
|
|
|
margin-left: 10px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|