dev
张同海 2 years ago
parent 9c39a0b1a2
commit af9c755c60

@ -4,11 +4,20 @@
<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="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}" @click="changeOrder(sindex)">
<div
class="sed-order-label"
v-for="(sedDetail, sindex) in sedOrderList"
:key="sindex"
:class="{ active: editIndex === sindex }"
@click="changeOrder(sindex)"
>
<i class="iconfont icon-dingdan"></i>
分单{{ sindex+1 }}: {{ sedDetail.hblno || '请填写分单号' }}
分单{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
<span class="no-save" v-if="sedDetail.isNoSave && editIndex !== sindex"> </span>
</div>
<div class="sed-order-btn" @click="addSedOrder"><i class="iconfont icon-jiahao2fill"></i>添加分单</div>
@ -17,7 +26,9 @@
</a-col>
<a-col :span="showSecNav ? 19 : 24">
<template v-if="editDetails">
<div class="order-title"><i class="iconfont icon-dingdan"></i> 当前分单号 <span>{{ editDetails.hblno }}</span></div>
<div class="order-title">
<i class="iconfont icon-dingdan"></i> 当前分单号 <span>{{ editDetails.hblno }}</span>
</div>
<sedOperationArea :details="editDetails" @save="saveFun" @copy="copyFun"></sedOperationArea>
<a-tabs type="card">
<a-tab-pane key="1" tab="基础信息">
@ -56,7 +67,7 @@
</a-row>
</div>
</template>
<script>
<script>
import sedOperationArea from '../modules/sedOperationArea'
import basicInfo from '../modules/basicInfo'
import mailingInfo from '../modules/mailingInfo'
@ -70,12 +81,12 @@ import ediMore from './ediMore'
import { BookingOrderUpdate, BookingOrderAdd } from '@/api/modular/main/BookingLedger'
export default {
name: 'SedOrder',
props: {
props: {
sedOrderList: {
type: Array,
default: () => {
return []
},
}
},
isAdd: {
type: Boolean,
@ -97,7 +108,7 @@ export default {
remarksInfo,
goodsTable,
basicItem,
ediMore,
ediMore
},
data() {
return {
@ -112,16 +123,16 @@ export default {
},
watch: {
sedOrderList: {
handler (nval, oval) {
handler(nval, oval) {
if (nval.length > 0) {
if (!nval[this.editIndex].bookingEDIExt) {
nval[this.editIndex].bookingEDIExt = {
weiTuoFang: '',
ediAttn: '',
ediAttnTel: '',
ediAttnMail: ''
}
weiTuoFang: '',
ediAttn: '',
ediAttnTel: '',
ediAttnMail: ''
}
}
this.editDetails = nval[this.editIndex]
} else {
this.editDetails = null
@ -130,7 +141,7 @@ export default {
deep: true
},
editDetails: {
handler (nval, oval) {
handler(nval, oval) {
this.$emit('changeHB', this.sedOrderList)
if (nval !== oval) {
// localStorage.setItem(`${this.id}`, true)
@ -146,7 +157,7 @@ export default {
this.id = this.$route.query.id
}
}
},
},
created() {
if (this.sedOrderList.length > 0) {
const data = JSON.parse(JSON.stringify(this.sedOrderList[0]))
@ -171,7 +182,7 @@ export default {
// }, 1500)
},
methods: {
addSedOrder () {
addSedOrder() {
if (this.isAdd) {
this.$message.error('请先保存主单')
return false
@ -196,7 +207,7 @@ export default {
this.editIndex = this.sedOrderList.length
this.sedOrderList.push(data)
},
changeDetailFun (data) {
changeDetailFun(data) {
const { detail, type } = data
if (!detail.bookingEDIExt) {
detail.bookingEDIExt = {
@ -216,22 +227,22 @@ export default {
},
ifCompare(object1, object2) {
var o1keys = Object.keys(object1);
var o2keys = Object.keys(object2);
if (o2keys.length !== o1keys.length) return false;
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;
let key = o1keys[i]
if (!o2keys.includes(key)) return false
if (object2[key] !== object1[key]) return false
}
return true;
return true
},
//
//
refreshPage() {
// this.init()
},
saveFun () {
debugger
saveFun() {
// debugger
if (this.editDetails.id !== 0 && Number(this.editDetails.id) !== Number(this.$route.query.id)) {
this.bookingOrderUpdate()
} else {
@ -239,7 +250,7 @@ export default {
}
},
bookingOrderUpdate () {
bookingOrderUpdate() {
if (!this.editDetails.hblno) {
this.$message.error('请输入分提单号')
return false
@ -247,23 +258,23 @@ export default {
let data = JSON.parse(JSON.stringify(this.editDetails))
delete data.isNoSave
BookingOrderUpdate(data)
.then((res) => {
if (res.success) {
this.sedOrderList[this.editIndex].isNoSave = false
this.editDetails.isNoSave = false
this.$message.success('保存成功')
this.$emit('changeHB', this.sedOrderList)
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch((err) => {
console.log(err)
})
.then(res => {
if (res.success) {
this.sedOrderList[this.editIndex].isNoSave = false
this.editDetails.isNoSave = false
this.$message.success('保存成功')
this.$emit('changeHB', this.sedOrderList)
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch(err => {
console.log(err)
})
},
bookingOrderAdd () {
bookingOrderAdd() {
if (!this.editDetails.hblno) {
this.$message.error('请输入分提单号')
return false
@ -276,24 +287,24 @@ export default {
item.id = 0
})
BookingOrderAdd(data)
.then((res) => {
if (res.success) {
this.sedOrderList[this.editIndex].isNoSave = false
this.editDetails.isNoSave = false
this.sedOrderList[this.editIndex].id = res.data
this.$message.success('保存成功')
this.$emit('changeHB', this.sedOrderList)
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch((err) => {
console.log(err)
})
.then(res => {
if (res.success) {
this.sedOrderList[this.editIndex].isNoSave = false
this.editDetails.isNoSave = false
this.sedOrderList[this.editIndex].id = res.data
this.$message.success('保存成功')
this.$emit('changeHB', this.sedOrderList)
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch(err => {
console.log(err)
})
},
changeOrder (index) {
changeOrder(index) {
// if (!this.editDetails.isNoSave) {
// this.$message.error(`${this.editDetails.hblno}`)
// }
@ -314,7 +325,7 @@ export default {
}, 1000)
},
copyFun () {
copyFun() {
const _data = JSON.parse(JSON.stringify(this.editDetails))
_data.isNoSave = true
_data.hblno = ''
@ -333,14 +344,14 @@ export default {
this.sedOrderList.push(_data)
},
openNav () {
openNav() {
this.showSecNav = !this.showSecNav
}
}
}
</script>
<style lang="less">
@import url('../index.less');
<style lang="less">
@import url('../index.less');
.base-tit {
font-size: 14px;
font-weight: 600;
@ -368,13 +379,13 @@ export default {
min-height: 200px;
// background: #ffffff;
}
.show-content{
.show-content {
}
.hide-content{
.hide-content {
padding-left: 60px;
position: relative;
}
.nav-min-icon{
.nav-min-icon {
width: 50px;
height: 50px;
text-align: center;
@ -389,30 +400,30 @@ export default {
left: 0;
cursor: pointer;
}
.sed-order-list{
background: #fff;
box-shadow: 0 0 10px #eee;
padding: 10px 20px;
.sed-order-list {
background: #fff;
box-shadow: 0 0 10px #eee;
padding: 10px 20px;
// height: 100%;
height: calc(100vh - 240px);
display: flex;
flex-direction: column;
padding-top: 0px;
transition: .5s all;
transition: 0.5s all;
border-radius: 4px;
&.show-nav{
&.show-nav {
width: 100%;
animation-name: showNav 0.6s;
animation-fill-mode:forwards;
.tit{
display: inline-block;
animation-fill-mode: forwards;
.tit {
display: inline-block;
animation-name: showText 0.6s;
animation-fill-mode:forwards;
animation-fill-mode: forwards;
}
.sec-order{
.sec-order {
display: block;
animation-name: showText 0.6s;
animation-fill-mode:forwards;
animation-fill-mode: forwards;
}
@keyframes showNav {
0% {
@ -434,19 +445,19 @@ export default {
}
}
}
&.hide-nav{
&.hide-nav {
width: 58px;
animation-name: hideNav 0.6s;
animation-fill-mode:forwards;
.tit{
animation-fill-mode: forwards;
.tit {
display: none;
animation-name: hideText 0.6s;
animation-fill-mode:forwards;
animation-fill-mode: forwards;
}
.sec-order{
.sec-order {
display: none;
animation-name: hideText 0.6s;
animation-fill-mode:forwards;
animation-fill-mode: forwards;
}
@keyframes hideNav {
0% {
@ -465,7 +476,7 @@ export default {
}
}
}
.sed-order-title{
.sed-order-title {
height: 50px;
line-height: 50px;
font-weight: 600;
@ -473,7 +484,7 @@ export default {
color: #333;
border-bottom: 1px solid #eee;
margin-bottom: 10px;
i{
i {
color: #43c673;
font-size: 18px;
line-height: 50px;
@ -481,103 +492,104 @@ export default {
vertical-align: top;
margin-right: 6px;
}
.right{
.right {
float: right;
font-weight: 500;
color: #999;
cursor: pointer;
}
}
.sed-order-label{
height: 40px;
line-height: 40px;
color: #999;
font-size: 14px;
text-align: left;
overflow: hidden;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
.sed-order-label {
height: 40px;
line-height: 40px;
color: #999;
font-size: 14px;
text-align: left;
overflow: hidden;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
// display: flex;
padding-left: 10px;
}
.active{
}
.active {
color: @primary-color;
// background: #f5f9fe;
position: relative;
&::after{
&::after {
content: '';
position: absolute;
top: 0;left: 0;
width:100%;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
background: @primary-color;
opacity: .04;
opacity: 0.04;
}
}
.sed-order-btn{
margin: 20px auto;
width: 80%;
height: 40px;
line-height: 40px;
border-radius: 4px;
border: 1px solid @primary-color;
color: @primary-color;
text-align: center;
}
.sed-order-btn {
margin: 20px auto;
width: 80%;
height: 40px;
line-height: 40px;
border-radius: 4px;
border: 1px solid @primary-color;
color: @primary-color;
text-align: center;
cursor: pointer;
i{
margin-right: 10px;
font-size: 16px;
}
&:hover{
i {
margin-right: 10px;
font-size: 16px;
}
&:hover {
background: @primary-color;
color: #fff;
-webkit-box-shadow:0 3px 10px 3px rgba(0,0,0,.1);
box-shadow: 0 3px 10px 3px rgba(0,0,0,.1);
-webkit-user-select:0 3px 10px 3px rgba(0,0,0,.1);
-webkit-box-shadow: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
-webkit-user-select: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
}
}
}
}
.sec-order{
.sec-order {
flex: 1;
overflow: auto;
&::-webkit-scrollbar {
display: none;
display: none;
}
}
.order-title{
height: 50px;
line-height: 50px;
font-size: 14px;
font-weight: 600;
color: #666;
padding: 0 20px;
margin-bottom: 10px;
background: #fff;
i{
.order-title {
height: 50px;
line-height: 50px;
font-size: 14px;
font-weight: 600;
color: #666;
padding: 0 20px;
margin-bottom: 10px;
background: #fff;
i {
margin-right: 4px;
display: inline-block;
vertical-align: top;
color: #43c673;
}
span{
span {
color: #ffa93e;
}
}
.sed-no-data {
margin:220px auto;
margin: 220px auto;
text-align: center;
width: 100%;
text-align: center;
i{
i {
display: block;
line-height: 140px;
font-size: 120px;
color: #999;
}
.no-data-text{
.no-data-text {
font-size: 16px;
color: #666;
line-height: 24px;
@ -588,7 +600,7 @@ export default {
}
}
.no-save{
.no-save {
float: right;
font-size: 12px;
color: #ff6646;
@ -600,4 +612,4 @@ export default {
// right: -26px;
// }
// }
</style>
</style>

@ -848,7 +848,7 @@ export default {
return false
},
openModel(type) {
debugger
// debugger
if (['bookingSpace', 'cutOff', 'initCabin', 'ladingBill', 'vgmlink'].includes(type)) {
// /
this.modelType = type
@ -883,7 +883,6 @@ export default {
} else if (type === 'vgmlink') {
this.getVgmLink()
}
},
emnuHeader(type) {
let title = ''
@ -1334,10 +1333,10 @@ export default {
this.$message.success({ content: '下载失败' })
})
},
onTraceChange (values) {
onTraceChange(values) {
console.log(this.traceValue)
},
traceSend () {
traceSend() {
if (!this.traceValue) {
this.$message.error('请选择订阅内容')
return false
@ -1364,13 +1363,13 @@ export default {
SendTrace([query])
.then(res => {
if (res.success) {
const tip = `${ this.traceValue === '1' ? '起运港' : '目的港'}订阅成功`
const tip = `${this.traceValue === '1' ? '起运港' : '目的港'}订阅成功`
this.$message.success(tip)
} else {
this.$message.success(res.message)
}
})
.catch((err) => {
.catch(err => {
console.log(err)
})
}
@ -1681,10 +1680,10 @@ export default {
}
}
}
.trace-box{
.trace-box {
padding: 20px 0;
}
.trace-check{
.trace-check {
margin-left: 10px;
}
</style>

Loading…
Cancel
Save