|
|
|
|
@ -1,5 +1,5 @@
|
|
|
|
|
<template> |
|
|
|
|
<basic-container v-loading="details.loadingObj.pageLaoding"> |
|
|
|
|
<basic-container v-loading="details.loadingObj.pageLoading"> |
|
|
|
|
<div class="avue-crud"> |
|
|
|
|
<el-tabs type="border-card" v-model="activeTab" @tab-click="handleTabClick"> |
|
|
|
|
<el-tab-pane label="详 情 信 息" name="tab1"> |
|
|
|
|
@ -8,7 +8,7 @@
|
|
|
|
|
<div class="flex-c-sb form_top"> |
|
|
|
|
<div> |
|
|
|
|
<div class="flex-c-sb" style="font-size: 16px"> |
|
|
|
|
<div class="flex-c-c" v-if="query.brand"> |
|
|
|
|
<div class="flex-c-c" style="margin-right: 50px" v-if="query.brand"> |
|
|
|
|
<el-icon color="#172e60"><User /></el-icon> |
|
|
|
|
品牌: |
|
|
|
|
<span class="red">{{ query.brand }}</span> |
|
|
|
|
@ -28,18 +28,33 @@
|
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<div class="flex-c-c"> |
|
|
|
|
<div style="margin-right: 10px" class="flex-c-c"> |
|
|
|
|
<el-icon size="1rem"><User /></el-icon> |
|
|
|
|
<span style="margin-left: 10px">{{ query.agent }}</span> |
|
|
|
|
<div> |
|
|
|
|
<div v-if="details.query.orderCode" class="flex-c-sb mb10"> |
|
|
|
|
<div class="flex-c-c" style="margin-right: 50px"> |
|
|
|
|
<el-icon color="#172e60"><Shop /></el-icon> |
|
|
|
|
商场名称： |
|
|
|
|
<span class="red">{{ query.dealerName || '暂无数据' }}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="flex-c-c"> |
|
|
|
|
<el-icon color="#172e60"><Shop /></el-icon> |
|
|
|
|
商场编码： |
|
|
|
|
<span class="red">{{ query.dealerCode || '暂无数据' }}</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<div class="flex-c-c"> |
|
|
|
|
<div style="margin-right: 10px" class="flex-c-c"> |
|
|
|
|
<el-icon size="1rem"><User /></el-icon> |
|
|
|
|
<span style="margin-left: 10px">{{ query.agent }}</span> |
|
|
|
|
</div> |
|
|
|
|
<el-date-picker |
|
|
|
|
v-model="query.documentMakingTime" |
|
|
|
|
prefix-icon="Calendar" |
|
|
|
|
readonly |
|
|
|
|
type="datetime" |
|
|
|
|
placeholder="创建时间" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
<el-date-picker |
|
|
|
|
v-model="query.documentMakingTime" |
|
|
|
|
prefix-icon="Calendar" |
|
|
|
|
readonly |
|
|
|
|
type="datetime" |
|
|
|
|
placeholder="创建时间" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
@ -440,12 +455,7 @@
|
|
|
|
|
<el-form label-width="fit-content" :rules="details.rules"> |
|
|
|
|
<el-row> |
|
|
|
|
<el-form-item label="支付方式:"> |
|
|
|
|
<el-select |
|
|
|
|
v-model="query.payType" |
|
|
|
|
disabled |
|
|
|
|
class="m-2" |
|
|
|
|
placeholder="支付方式" |
|
|
|
|
> |
|
|
|
|
<el-select v-model="query.payType" disabled> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in query.payTypeList || []" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -456,12 +466,7 @@
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="付款方式:" prop="payWay"> |
|
|
|
|
<el-select |
|
|
|
|
v-model="query.payWay" |
|
|
|
|
disabled |
|
|
|
|
class="m-2" |
|
|
|
|
placeholder="付款方式" |
|
|
|
|
> |
|
|
|
|
<el-select v-model="query.payWay" disabled> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in query.payWayList || []" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -683,13 +688,7 @@
|
|
|
|
|
<div> |
|
|
|
|
<el-row> |
|
|
|
|
<el-form-item label-width="fit-content" label="支付方式:"> |
|
|
|
|
<el-select |
|
|
|
|
disabled |
|
|
|
|
v-model="query.payType" |
|
|
|
|
:teleported="false" |
|
|
|
|
class="m-2" |
|
|
|
|
placeholder="支付方式" |
|
|
|
|
> |
|
|
|
|
<el-select disabled v-model="query.payType" :teleported="false"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in details.info.payTypeList" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -700,13 +699,7 @@
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="付款方式:" label-width="fit-content" prop="payWay"> |
|
|
|
|
<el-select |
|
|
|
|
disabled |
|
|
|
|
v-model="query.payWay" |
|
|
|
|
:teleported="false" |
|
|
|
|
class="m-2" |
|
|
|
|
placeholder="付款方式" |
|
|
|
|
> |
|
|
|
|
<el-select disabled v-model="query.payWay" :teleported="false"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in details.info.payWayList" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -824,7 +817,7 @@
|
|
|
|
|
label-width="fit-content" |
|
|
|
|
class="el-times" |
|
|
|
|
> |
|
|
|
|
<el-select disabled v-model="query.deliveryWay" class="m-2" placeholder="送货方式"> |
|
|
|
|
<el-select disabled v-model="query.deliveryWay"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in query.deliveryWayList" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -840,7 +833,7 @@
|
|
|
|
|
label-width="fit-content" |
|
|
|
|
class="el-times" |
|
|
|
|
> |
|
|
|
|
<el-select disabled v-model="query.urgency" class="m-2" placeholder="紧急度"> |
|
|
|
|
<el-select disabled v-model="query.urgency"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in query.urgencyList || []" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -863,14 +856,7 @@
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="回单要求:" label-width="fit-content" class="el-times"> |
|
|
|
|
<el-select |
|
|
|
|
disabled |
|
|
|
|
v-model="query.receipt" |
|
|
|
|
class="m-2" |
|
|
|
|
filterable |
|
|
|
|
multiple |
|
|
|
|
placeholder="回单要求" |
|
|
|
|
> |
|
|
|
|
<el-select disabled v-model="query.receipt" filterable multiple> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in query.receiptList" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -881,12 +867,7 @@
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="运输方式:" label-width="fit-content" class="el-times"> |
|
|
|
|
<el-select |
|
|
|
|
disabled |
|
|
|
|
v-model="query.transportType" |
|
|
|
|
class="m-2" |
|
|
|
|
placeholder="运输方式" |
|
|
|
|
> |
|
|
|
|
<el-select disabled v-model="query.transportType"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in query.transportTypeList" |
|
|
|
|
:key="item.dictValue" |
|
|
|
|
@ -934,9 +915,7 @@
|
|
|
|
|
审 核 |
|
|
|
|
</el-button> |
|
|
|
|
<el-button type="primary" icon="el-icon-edit" @click="handleEdit"> 修 改</el-button> |
|
|
|
|
<el-button type="primary" icon="el-icon-printer" @click="searchReset()"> |
|
|
|
|
打 印</el-button |
|
|
|
|
> |
|
|
|
|
<el-button type="primary" icon="el-icon-printer" @click="handlePrint"> 打 印</el-button> |
|
|
|
|
<el-button type="primary" icon="el-icon-close" @click="back()"> 关 闭</el-button> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
@ -1043,6 +1022,14 @@
|
|
|
|
|
</el-tabs> |
|
|
|
|
</div> |
|
|
|
|
</basic-container> |
|
|
|
|
|
|
|
|
|
<!-- 运单打印 --> |
|
|
|
|
<WaybillPrintTemplate |
|
|
|
|
v-model="details.popUpShow.WaybillPrintTemplate" |
|
|
|
|
:html="details.html" |
|
|
|
|
width="70%" |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
|
<edittablehead |
|
|
|
|
@setcolum="setnewcolum" |
|
|
|
|
@closce="showdrawer" |
|
|
|
|
@ -1078,6 +1065,7 @@ import {
|
|
|
|
|
} from '@/option/distribution/BookingNote'; |
|
|
|
|
import { useRouter, useRoute } from 'vue-router'; |
|
|
|
|
import { postFindWaybillDetail, postCheckWaybill } from '@/api/distribution/CreateOrder.js'; |
|
|
|
|
import { postPrintBatch } from '@/api/waybill/WaybillOrderList.js'; |
|
|
|
|
import { getLazyTreeAll } from '@/api/base/region'; |
|
|
|
|
import { |
|
|
|
|
postWarehouseFindWaybillInfo, |
|
|
|
|
@ -1360,7 +1348,7 @@ const details = reactive<any>({
|
|
|
|
|
loadingObj: { |
|
|
|
|
/** 配载信息loading */ |
|
|
|
|
stowageLoading: false, |
|
|
|
|
pageLaoding: false, |
|
|
|
|
pageLoading: false, |
|
|
|
|
}, |
|
|
|
|
/** 列表复选框选中的数据 */ |
|
|
|
|
selectionList: [], |
|
|
|
|
@ -1372,11 +1360,10 @@ const details = reactive<any>({
|
|
|
|
|
pageSize: 30, |
|
|
|
|
total: 0, |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
/** 弹出层显示 */ |
|
|
|
|
popUpShow: { |
|
|
|
|
/** 装车详情 */ |
|
|
|
|
truckLoadingDetailVisited: false, |
|
|
|
|
/** 打印弹窗 */ |
|
|
|
|
WaybillPrintTemplate: false, |
|
|
|
|
}, |
|
|
|
|
/** 列表Dom节点 */ |
|
|
|
|
listNode: '', |
|
|
|
|
@ -1385,6 +1372,8 @@ const details = reactive<any>({
|
|
|
|
|
activeTabItem: 'tabItem1', |
|
|
|
|
/** 回单列表 */ |
|
|
|
|
receiptImgList: [], |
|
|
|
|
/** 打印html */ |
|
|
|
|
html: '', |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const info = ref<any>({}); |
|
|
|
|
@ -1445,7 +1434,7 @@ getLazyTreeAll().then(res => {
|
|
|
|
|
/** 请求页面数据 */ |
|
|
|
|
const onLoad = async () => { |
|
|
|
|
try { |
|
|
|
|
details.loadingObj.pageLaoding = true; |
|
|
|
|
details.loadingObj.pageLoading = true; |
|
|
|
|
|
|
|
|
|
details.pageInfo = { ...$route.query }; |
|
|
|
|
|
|
|
|
|
@ -1526,14 +1515,14 @@ const onLoad = async () => {
|
|
|
|
|
} catch (error) { |
|
|
|
|
console.log('error :>> ', error); |
|
|
|
|
} finally { |
|
|
|
|
details.loadingObj.pageLaoding = false; |
|
|
|
|
details.loadingObj.pageLoading = false; |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
/** 查看运单跟踪 */ |
|
|
|
|
const handleFindInfo = async type => { |
|
|
|
|
try { |
|
|
|
|
details.loadingObj.pageLaoding = true; |
|
|
|
|
details.loadingObj.pageLoading = true; |
|
|
|
|
details.data = []; |
|
|
|
|
const submitData = { |
|
|
|
|
waybillId: $route.query.id, |
|
|
|
|
@ -1572,7 +1561,7 @@ const handleFindInfo = async type => {
|
|
|
|
|
} catch (error) { |
|
|
|
|
console.log('error :>> ', error); |
|
|
|
|
} finally { |
|
|
|
|
details.loadingObj.pageLaoding = false; |
|
|
|
|
details.loadingObj.pageLoading = false; |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
@ -1775,7 +1764,7 @@ const handleAudit = () => {
|
|
|
|
|
cancelButtonText: '取消', |
|
|
|
|
type: 'warning', |
|
|
|
|
}).then(async () => { |
|
|
|
|
details.loadingObj.pageLaoding = true; |
|
|
|
|
details.loadingObj.pageLoading = true; |
|
|
|
|
try { |
|
|
|
|
const res = await postCheckWaybill({ waybillId: $route.query.id }); |
|
|
|
|
|
|
|
|
|
@ -1787,7 +1776,7 @@ const handleAudit = () => {
|
|
|
|
|
} catch (error) { |
|
|
|
|
console.log('error :>> ', error); |
|
|
|
|
} finally { |
|
|
|
|
details.loadingObj.pageLaoding = false; |
|
|
|
|
details.loadingObj.pageLoading = false; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
@ -1817,6 +1806,40 @@ const handleFindContractList = async () => {
|
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
/** 打印 */ |
|
|
|
|
const handlePrint = async () => { |
|
|
|
|
try { |
|
|
|
|
details.loadingObj.pageLoading = true; |
|
|
|
|
|
|
|
|
|
const res = await postPrintBatch({ |
|
|
|
|
ids: $route.query.id, |
|
|
|
|
tempId: 15, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const { code, data } = res.data; |
|
|
|
|
|
|
|
|
|
if (code !== 200 || !data || data.length === 0) return; |
|
|
|
|
|
|
|
|
|
let _html = ''; |
|
|
|
|
|
|
|
|
|
for (let i = 0; i < data.length; i++) { |
|
|
|
|
const value = data[i]; |
|
|
|
|
|
|
|
|
|
_html += JSON.parse(JSON.stringify(value.templateHtml)); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
console.log('res :>> ', res); |
|
|
|
|
|
|
|
|
|
details.html = _html; |
|
|
|
|
|
|
|
|
|
details.popUpShow.WaybillPrintTemplate = true; |
|
|
|
|
} catch (error) { |
|
|
|
|
console.log('error :>> ', error); |
|
|
|
|
} finally { |
|
|
|
|
details.loadingObj.pageLoading = false; |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
watch( |
|
|
|
|
() => $route.query, |
|
|
|
|
() => { |
|
|
|
|
@ -1827,7 +1850,9 @@ watch(
|
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
|
$borderColor: #172e60; |
|
|
|
|
$borderColor: var(--el-color-primary); |
|
|
|
|
$borderType: 1px solid $borderColor; |
|
|
|
|
|
|
|
|
|
:deep(.el-date-editor.el-input, .el-date-editor.el-input__wrapper) { |
|
|
|
|
height: 100% !important; |
|
|
|
|
} |
|
|
|
|
@ -1839,20 +1864,20 @@ $borderColor: #172e60;
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.border-left { |
|
|
|
|
border-left: 1px dashed $borderColor; |
|
|
|
|
border-left: $borderType; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 页面字体大小 |
|
|
|
|
.avue-crud { |
|
|
|
|
font-size: 12px !important; |
|
|
|
|
} |
|
|
|
|
// .avue-crud { |
|
|
|
|
// font-size: 12px !important; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.form_top { |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.border-top { |
|
|
|
|
border-top: 1px dashed $borderColor; |
|
|
|
|
border-top: $borderType; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
:deep(.el-date-editor.el-input, .el-date-editor.el-input__wrapper) { |
|
|
|
|
@ -1863,14 +1888,14 @@ $borderColor: #172e60;
|
|
|
|
|
width: 100%; |
|
|
|
|
display: flex; |
|
|
|
|
// border-top: 1px solid $borderColor; |
|
|
|
|
border-left: 1px dashed $borderColor; |
|
|
|
|
border-left: $borderType; |
|
|
|
|
border-bottom: none; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
|
|
|
|
|
&:first-child { |
|
|
|
|
// display: block; |
|
|
|
|
border-top: 1px dashed $borderColor; |
|
|
|
|
border-left: 1px dashed $borderColor; |
|
|
|
|
border-top: $borderType; |
|
|
|
|
border-left: $borderType; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
|
|
|
|
|
> div { |
|
|
|
|
@ -1880,8 +1905,8 @@ $borderColor: #172e60;
|
|
|
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|
display: block; |
|
|
|
|
border-bottom: 1px dashed $borderColor; |
|
|
|
|
border-right: 1px dashed $borderColor; |
|
|
|
|
border-bottom: $borderType; |
|
|
|
|
border-right: $borderType; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
|
|
|
|
|
> div { |
|
|
|
|
@ -1893,8 +1918,8 @@ $borderColor: #172e60;
|
|
|
|
|
> div { |
|
|
|
|
flex: 1; |
|
|
|
|
padding: 5px; |
|
|
|
|
border-bottom: 1px dashed $borderColor; |
|
|
|
|
border-right: 1px dashed $borderColor; |
|
|
|
|
border-bottom: $borderType; |
|
|
|
|
border-right: $borderType; |
|
|
|
|
display: inline-flex; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
} |
|
|
|
|
@ -1959,18 +1984,18 @@ $borderColor: #172e60;
|
|
|
|
|
--el-color-danger: #f00; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
:deep(.el-form-item.is-error .el-input__wrapper) { |
|
|
|
|
--el-color-danger: #f00; |
|
|
|
|
} |
|
|
|
|
// :deep(.el-form-item.is-error .el-input__wrapper) { |
|
|
|
|
// --el-color-danger: #f00; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
:deep( |
|
|
|
|
.el-form-item.is-required:not(.is-no-asterisk).asterisk-left > .el-form-item__label:before, |
|
|
|
|
.el-form-item.is-required:not(.is-no-asterisk).asterisk-left |
|
|
|
|
> .el-form-item__label-wrap |
|
|
|
|
> .el-form-item__label:before |
|
|
|
|
) { |
|
|
|
|
--el-color-danger: #f00; |
|
|
|
|
} |
|
|
|
|
// :deep( |
|
|
|
|
// .el-form-item.is-required:not(.is-no-asterisk).asterisk-left > .el-form-item__label:before, |
|
|
|
|
// .el-form-item.is-required:not(.is-no-asterisk).asterisk-left |
|
|
|
|
// > .el-form-item__label-wrap |
|
|
|
|
// > .el-form-item__label:before |
|
|
|
|
// ) { |
|
|
|
|
// --el-color-danger: #f00; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
// 底部 |
|
|
|
|
.footer { |
|
|
|
|
@ -2024,4 +2049,29 @@ $borderColor: #172e60;
|
|
|
|
|
.receipt_img { |
|
|
|
|
border-radius: 5px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// tab样式 |
|
|
|
|
:deep(.el-tabs__item.is-active) { |
|
|
|
|
color: var(--el-color-primary); |
|
|
|
|
font-weight: bold; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
:deep(.el-tabs__item:hover) { |
|
|
|
|
color: var(--el-color-primary); |
|
|
|
|
font-weight: bold; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
:deep(.el-tabs__item) { |
|
|
|
|
color: #959a9e; |
|
|
|
|
transition: all 0.3s; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 禁止样式 |
|
|
|
|
:deep(.el-input.is-disabled .el-input__wrapper) { |
|
|
|
|
background: #fff; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
:deep(.el-input.is-disabled .el-input__inner) { |
|
|
|
|
-webkit-text-fill-color: var(--el-color-primary) !important; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
