whm
/
BookingHeChuanFront
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

12/27

Browse Source
dev
张同海 2 years ago
parent 9c39a0b1a2
commit af9c755c60
2 changed files with 161 additions and 150 deletions
Show Stats Download Patch File Download Diff File

294
src/views/main/BookingLedger/detail/components/sedOrder.vue
Unescape Escape View File

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

15
src/views/main/BookingLedger/detail/modules/operationArea.vue
Unescape Escape View File

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

Write Preview
Loading…
Cancel
Save