|
@@ -1,11 +1,5 @@
|
|
|
<template>
|
|
|
- <el-drawer
|
|
|
- append-to-body
|
|
|
- title="发货详情"
|
|
|
- v-loading="load"
|
|
|
- :visible.sync="drawer"
|
|
|
- @close="close"
|
|
|
- :direction="direction"
|
|
|
+ <el-drawer append-to-body title="发货详情" v-loading="load" :visible.sync="drawer" @close="close" :direction="direction"
|
|
|
size="50%">
|
|
|
<div class="content" v-if="value.orderType == 'B2B'">
|
|
|
<deliveryGoodsInfo :sendState="true" ref="info" :readOnly="true" />
|
|
@@ -18,47 +12,43 @@
|
|
|
实际送达和实际费用
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<div class="send-type">
|
|
|
- <el-popover
|
|
|
- v-for="(item,index) of priceData" :key="index"
|
|
|
- placement="top-start"
|
|
|
- width="200"
|
|
|
- trigger="hover">
|
|
|
+ <el-popover v-for="(item, index) of priceData" :key="index" placement="top-start" width="200" trigger="hover">
|
|
|
<div class="price-info">
|
|
|
<div class="price-title">预估费用明细:</div>
|
|
|
<div class="price-row freight">
|
|
|
<span class="p-label">运费:</span>
|
|
|
- <span class="p-value">¥{{item.estimateFreight}}</span>
|
|
|
+ <span class="p-value">¥{{ item.estimateFreight }}</span>
|
|
|
</div>
|
|
|
<div class="price-row">
|
|
|
<span class="p-label">单价:</span>
|
|
|
- <span class="p-value">¥{{item.unitprice}}</span>
|
|
|
+ <span class="p-value">¥{{ item.unitprice }}</span>
|
|
|
</div>
|
|
|
<div class="price-row">
|
|
|
<span class="p-label">重量:</span>
|
|
|
- <span class="p-value">{{item.weight}}</span>
|
|
|
+ <span class="p-value">{{ item.weight }}</span>
|
|
|
</div>
|
|
|
<div class="price-row">
|
|
|
<span class="p-label">体积:</span>
|
|
|
- <span class="p-value">{{item.volume}}</span>
|
|
|
+ <span class="p-value">{{ item.volume }}</span>
|
|
|
</div>
|
|
|
<div class="price-row">
|
|
|
<span class="p-label">单位:</span>
|
|
|
- <span class="p-value">{{item.unit}}</span>
|
|
|
+ <span class="p-value">{{ item.unit }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div slot="reference" class="send-item" :title="item.ruleName" :class="{'ont':value.priceId == item.id}" >
|
|
|
- <div class="label-name">{{item.ruleName}}</div>
|
|
|
+ <div slot="reference" class="send-item" :title="item.ruleName" :class="{ 'ont': value.priceId == item.id }">
|
|
|
+ <div class="label-name">{{ item.ruleName }}</div>
|
|
|
<div class="send-info">
|
|
|
- <div class="s-time">{{item.endTime}}前</div>
|
|
|
- <div class="send-price">¥{{item.estimateFreight}}</div>
|
|
|
+ <div class="s-time">{{ item.endTime }}前</div>
|
|
|
+ <div class="send-price">¥{{ item.estimateFreight }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<div class="space"></div>
|
|
|
<div class="deli-footer">
|
|
|
<div class="send-btn" @click="showLogistics">物流信息</div>
|
|
@@ -101,33 +91,33 @@
|
|
|
<script lang="ts">
|
|
|
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
|
|
|
import DeliveryGoodsInfo from "./deliveryGoodsInfo.vue";
|
|
|
-import { queryOrderByOrderId,cancleSendOrder,cancleWmsTradeOrder } from '@/api/delivery'
|
|
|
+import { queryOrderByOrderId, cancleSendOrder, cancleWmsTradeOrder } from '@/api/delivery'
|
|
|
import api from '@/api/currency'
|
|
|
-@Component({components:{DeliveryGoodsInfo}})
|
|
|
+@Component({ components: { DeliveryGoodsInfo } })
|
|
|
export default class DeliveryDetail extends Vue {
|
|
|
- drawer=false;
|
|
|
- direction='rtl'
|
|
|
+ drawer = false;
|
|
|
+ direction = 'rtl'
|
|
|
load = false;
|
|
|
- priceData:Array<any>=[];
|
|
|
- value:any={};
|
|
|
- wmsState='';
|
|
|
- operationFlag:string=''
|
|
|
- setShow(v:boolean){
|
|
|
- this.drawer=v;
|
|
|
+ priceData: Array<any> = [];
|
|
|
+ value: any = {};
|
|
|
+ wmsState = '';
|
|
|
+ operationFlag: string = ''
|
|
|
+ setShow(v: boolean) {
|
|
|
+ this.drawer = v;
|
|
|
}
|
|
|
showLogistics() {
|
|
|
this.drawer = false;
|
|
|
- this.$emit('showLogistics',this.value.tmsOrderNo)
|
|
|
+ this.$emit('showLogistics', this.value.tmsOrderNo)
|
|
|
}
|
|
|
- close(){
|
|
|
- this.value={}
|
|
|
- this.priceData=[];
|
|
|
+ close() {
|
|
|
+ this.value = {}
|
|
|
+ this.priceData = [];
|
|
|
}
|
|
|
- getWmsState(s:any){
|
|
|
+ getWmsState(s: any) {
|
|
|
let n = '';
|
|
|
- switch(s){
|
|
|
+ switch (s) {
|
|
|
case 1:
|
|
|
- n = '创建';
|
|
|
+ n = 'oms 已完成向 wms 的订单推送';
|
|
|
break;
|
|
|
case 2:
|
|
|
n = '确认';
|
|
@@ -141,48 +131,48 @@ export default class DeliveryDetail extends Vue {
|
|
|
}
|
|
|
return n;
|
|
|
}
|
|
|
- setData(v:any){
|
|
|
- if(!v || !v.id) {
|
|
|
+ setData(v: any) {
|
|
|
+ if (!v || !v.id) {
|
|
|
this.$message('缺少订单id');
|
|
|
return
|
|
|
}
|
|
|
this.operationFlag = v.upSourceName
|
|
|
this.load = true;
|
|
|
queryOrderByOrderId({
|
|
|
- omsOrderId:v.id
|
|
|
- }).then((res:any) => {
|
|
|
+ omsOrderId: v.id
|
|
|
+ }).then((res: any) => {
|
|
|
this.load = false;
|
|
|
- if(res.data) {
|
|
|
+ if (res.data) {
|
|
|
this.value = res.data;
|
|
|
this.loadWarehouse();
|
|
|
- if(res.data.subItemList){
|
|
|
- this.value.subItem=[];
|
|
|
- for(const item of this.value.subItemList){
|
|
|
+ if (res.data.subItemList) {
|
|
|
+ this.value.subItem = [];
|
|
|
+ for (const item of this.value.subItemList) {
|
|
|
this.value.subItem.push({
|
|
|
- tmsGoodsCode:item.tmsGoodsCode,
|
|
|
- name:item.tmsGoodsName,
|
|
|
- tmsGoodsTotalPrice:item.tmsGoodsTotalPrice,
|
|
|
- price:item.tmsGoodsPrice,
|
|
|
- weight:item.tmsWeight,
|
|
|
- tmsQuantity:item.tmsQuantity
|
|
|
+ tmsGoodsCode: item.tmsGoodsCode,
|
|
|
+ name: item.tmsGoodsName,
|
|
|
+ tmsGoodsTotalPrice: item.tmsGoodsTotalPrice,
|
|
|
+ price: item.tmsGoodsPrice,
|
|
|
+ weight: item.tmsWeight,
|
|
|
+ tmsQuantity: item.tmsQuantity
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
- if(res.data.pricePlan){
|
|
|
- try{
|
|
|
+ if (res.data.pricePlan) {
|
|
|
+ try {
|
|
|
this.priceData = JSON.parse(res.data.pricePlan);
|
|
|
- }catch(e){
|
|
|
+ } catch (e) {
|
|
|
this.priceData = [];
|
|
|
console.error('价格列表数据转换错误!')
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
- this.$nextTick(()=>{
|
|
|
- if(this.$refs.info){
|
|
|
+ this.$nextTick(() => {
|
|
|
+ if (this.$refs.info) {
|
|
|
(this.$refs.info as any).setValue(this.value)
|
|
|
}
|
|
|
})
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
// this.drawer = false;
|
|
|
this.$message('未找到发货明细数据!')
|
|
|
}
|
|
@@ -195,23 +185,23 @@ export default class DeliveryDetail extends Vue {
|
|
|
pageNo: 1,
|
|
|
pageSize: 1000
|
|
|
}, 'maindataStorehouse').then((res: any) => {
|
|
|
- if(res.data.records.length > 0){
|
|
|
- for(const item of res.data.records){
|
|
|
- if(this.value.storeHouseOutId === item.id){
|
|
|
+ if (res.data.records.length > 0) {
|
|
|
+ for (const item of res.data.records) {
|
|
|
+ if (this.value.storeHouseOutId === item.id) {
|
|
|
this.value.storeHouseName = item.name
|
|
|
}
|
|
|
}
|
|
|
- this.$nextTick(()=>{
|
|
|
+ this.$nextTick(() => {
|
|
|
(this.$refs.info as any).setValue(this.value);
|
|
|
})
|
|
|
}
|
|
|
- }).catch(() => {})
|
|
|
+ }).catch(() => { })
|
|
|
}
|
|
|
cancelB2CDelivery() {
|
|
|
- if(this.operationFlag === 'DS_JUSHUITAN'){
|
|
|
+ if (this.operationFlag === 'DS_JUSHUITAN') {
|
|
|
this.$message({
|
|
|
- message:'点三订单禁止取消发货!',
|
|
|
- type:'warning'
|
|
|
+ message: '点三订单禁止取消发货!',
|
|
|
+ type: 'warning'
|
|
|
})
|
|
|
return
|
|
|
}
|
|
@@ -221,99 +211,106 @@ export default class DeliveryDetail extends Vue {
|
|
|
type: 'warning'
|
|
|
}).then(() => {
|
|
|
this.load = true;
|
|
|
- cancleWmsTradeOrder({saleOrderCode:this.value.wmsSaleorderCode}).then((res:any) => {
|
|
|
+ cancleWmsTradeOrder({ saleOrderCode: this.value.wmsSaleorderCode }).then((res: any) => {
|
|
|
this.drawer = false;
|
|
|
- this.load =false;
|
|
|
+ this.load = false;
|
|
|
this.$message({
|
|
|
- message:'该订单的发货已被取消!',
|
|
|
- type:'success'
|
|
|
+ message: '该订单的发货已被取消!',
|
|
|
+ type: 'success'
|
|
|
})
|
|
|
this.$emit('handleSuccess');
|
|
|
}).catch(() => {
|
|
|
this.load = false;
|
|
|
})
|
|
|
- }).catch(() => {});
|
|
|
+ }).catch(() => { });
|
|
|
}
|
|
|
- cancelDelivery(){
|
|
|
+ cancelDelivery() {
|
|
|
let msg = '';
|
|
|
- if(this.operationFlag === 'DS_JUSHUITAN'){
|
|
|
+ if (this.operationFlag === 'DS_JUSHUITAN') {
|
|
|
this.$message({
|
|
|
- message:'点三订单禁止取消发货!',
|
|
|
- type:'warning'
|
|
|
+ message: '点三订单禁止取消发货!',
|
|
|
+ type: 'warning'
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
- if(this.value.shippingType == 'MORE'){
|
|
|
+ if (this.value.shippingType == 'MORE') {
|
|
|
msg = '此操作将导致整车订单的发货被取消,是否继续?'
|
|
|
}
|
|
|
- if(this.value.shippingType == 'ONE'){
|
|
|
+ if (this.value.shippingType == 'ONE') {
|
|
|
msg = '此操作将导致该订单的发货被取消,是否继续?'
|
|
|
}
|
|
|
- if(msg){
|
|
|
+ if (msg) {
|
|
|
this.$confirm(msg, '提示', {
|
|
|
confirmButtonText: '继续',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'warning'
|
|
|
}).then(() => {
|
|
|
this.load = true;
|
|
|
- cancleSendOrder({orderNos:[this.value.tmsOrderNo]}).then((res:any) => {
|
|
|
+ cancleSendOrder({ orderNos: [this.value.tmsOrderNo] }).then((res: any) => {
|
|
|
this.drawer = false;
|
|
|
- this.load =false;
|
|
|
+ this.load = false;
|
|
|
this.$message({
|
|
|
- message:'该订单的发货已被取消!',
|
|
|
- type:'success'
|
|
|
+ message: '该订单的发货已被取消!',
|
|
|
+ type: 'success'
|
|
|
})
|
|
|
this.$emit('handleSuccess');
|
|
|
}).catch(() => {
|
|
|
this.load = false;
|
|
|
})
|
|
|
- }).catch(() => {});
|
|
|
+ }).catch(() => { });
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-.content{
|
|
|
+.content {
|
|
|
width: 100%;
|
|
|
box-sizing: border-box;
|
|
|
padding: 0 16px;
|
|
|
background-color: #FFF;
|
|
|
- .send-box{
|
|
|
+
|
|
|
+ .send-box {
|
|
|
width: 100%;
|
|
|
box-sizing: border-box;
|
|
|
padding: 16px;
|
|
|
padding-bottom: 0;
|
|
|
margin-bottom: 16px;
|
|
|
- background-color: rgba(160,205,255,0.22);
|
|
|
- .pri-title{
|
|
|
+ background-color: rgba(160, 205, 255, 0.22);
|
|
|
+
|
|
|
+ .pri-title {
|
|
|
width: 100%;
|
|
|
padding-bottom: 8px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- .title-item{
|
|
|
+
|
|
|
+ .title-item {
|
|
|
width: 188px;
|
|
|
font-size: 12px;
|
|
|
- span{
|
|
|
+
|
|
|
+ span {
|
|
|
color: #1684FC;
|
|
|
padding-left: 8px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .send-type{
|
|
|
+
|
|
|
+ .send-type {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- flex-wrap:wrap;
|
|
|
- .send-item{
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .send-item {
|
|
|
width: 165px;
|
|
|
box-sizing: border-box;
|
|
|
- border:solid 3px #999;
|
|
|
+ border: solid 3px #999;
|
|
|
border-radius: 6px;
|
|
|
overflow: hidden;
|
|
|
margin-right: 32px;
|
|
|
margin-bottom: 16px;
|
|
|
+
|
|
|
// cursor: pointer;
|
|
|
- .label-name{
|
|
|
+ .label-name {
|
|
|
background-color: #999;
|
|
|
color: #FFF;
|
|
|
font-size: 16px;
|
|
@@ -321,52 +318,64 @@ export default class DeliveryDetail extends Vue {
|
|
|
padding: 2px 0 4px;
|
|
|
text-align: center;
|
|
|
}
|
|
|
- .send-info{
|
|
|
+
|
|
|
+ .send-info {
|
|
|
padding: 8px 0;
|
|
|
text-align: center;
|
|
|
background-color: #FFF;
|
|
|
- .s-time{
|
|
|
+
|
|
|
+ .s-time {
|
|
|
font-size: 14px;
|
|
|
color: #1684FC;
|
|
|
}
|
|
|
- .send-price{
|
|
|
+
|
|
|
+ .send-price {
|
|
|
font-size: 20px;
|
|
|
padding-top: 4px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .onSend{
|
|
|
- border:solid 3px #1684FC;
|
|
|
- .label-name{
|
|
|
+
|
|
|
+ .onSend {
|
|
|
+ border: solid 3px #1684FC;
|
|
|
+
|
|
|
+ .label-name {
|
|
|
background-color: #1684FC;
|
|
|
}
|
|
|
}
|
|
|
- .ont{
|
|
|
- border:solid 3px #FF0404;
|
|
|
- .label-name{
|
|
|
+
|
|
|
+ .ont {
|
|
|
+ border: solid 3px #FF0404;
|
|
|
+
|
|
|
+ .label-name {
|
|
|
background-color: #FF0404;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .s-row{
|
|
|
+
|
|
|
+ .s-row {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
padding-bottom: 16px;
|
|
|
- .s-col{
|
|
|
+
|
|
|
+ .s-col {
|
|
|
width: 100%;
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
- .width50{
|
|
|
+
|
|
|
+ .width50 {
|
|
|
width: 50%;
|
|
|
}
|
|
|
}
|
|
|
- .s-row:last-child{
|
|
|
+
|
|
|
+ .s-row:last-child {
|
|
|
padding: 16;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-.deli-footer{
|
|
|
+
|
|
|
+.deli-footer {
|
|
|
height: 60px;
|
|
|
box-shadow: 0 -5px 10px #EEE;
|
|
|
width: 100%;
|
|
@@ -380,12 +389,13 @@ export default class DeliveryDetail extends Vue {
|
|
|
left: 0;
|
|
|
bottom: 0;
|
|
|
z-index: 10;
|
|
|
- .send-btn{
|
|
|
+
|
|
|
+ .send-btn {
|
|
|
width: 120px;
|
|
|
height: 40px;
|
|
|
line-height: 40px;
|
|
|
border-radius: 8px;
|
|
|
- background: linear-gradient(129.2deg, rgba(22,132,252,1) 9.81%,rgba(93,167,249,1) 97.4%);
|
|
|
+ background: linear-gradient(129.2deg, rgba(22, 132, 252, 1) 9.81%, rgba(93, 167, 249, 1) 97.4%);
|
|
|
color: rgba(255, 255, 255, 100);
|
|
|
font-size: 14px;
|
|
|
text-align: center;
|
|
@@ -394,7 +404,8 @@ export default class DeliveryDetail extends Vue {
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
-.space{
|
|
|
+
|
|
|
+.space {
|
|
|
height: 60px;
|
|
|
width: 100%;
|
|
|
margin-top: 16px;
|