470 lines
18 KiB
Vue
470 lines
18 KiB
Vue
<template>
|
|
<div class="" >
|
|
<el-descriptions :title="$t('发货信息')" size="small" :column="4">
|
|
<el-descriptions-item label="运单号">{{ form.billCode }}</el-descriptions-item>
|
|
<el-descriptions-item label="寄件网点">{{ form.sendSiteName }}</el-descriptions-item>
|
|
<el-descriptions-item label="所属线路">{{ form.transLineTypeName }}</el-descriptions-item>
|
|
<!-- <el-descriptions-item label="产品类型">{{ form.productTypeName }}({{ form.timeType }})</el-descriptions-item> -->
|
|
<el-descriptions-item label="寄件日期">{{ parseTime(form.sendDate, '{y}-{m}-{d}') }}</el-descriptions-item>
|
|
<el-descriptions-item label="订单号">{{ form.orderSn }}</el-descriptions-item>
|
|
<el-descriptions-item label="目的网点">{{ form.dispatchUnderlingSiteName }}</el-descriptions-item>
|
|
<el-descriptions-item label="产品类型">{{ form.productTypeName }}</el-descriptions-item>
|
|
<el-descriptions-item label="预计达到日期">{{ parseTime(form.estimateDate, '{y}-{m}-{d}') }}</el-descriptions-item>
|
|
<el-descriptions-item label="进仓单号">{{ form.warehouseInNo }}</el-descriptions-item>
|
|
<el-descriptions-item label="目的地">{{ form.destinationName }}</el-descriptions-item>
|
|
<el-descriptions-item label="时效">{{ form.timeType }}</el-descriptions-item>
|
|
<el-descriptions-item label="签收日期">{{ parseTime(form.signDate, '{y}-{m}-{d}') }}</el-descriptions-item>
|
|
<el-descriptions-item label="取件方式">
|
|
<dict-tag :options="dict.type.emis_qujian_fangshi" :value="form.pickupMethod"/>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="清关方式">
|
|
<dict-tag :options="dict.type.emis_customs_clear" :value="form.customsClear"/>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="报关方式">
|
|
<dict-tag :options="dict.type.emis_declare_mode" :value="form.customsEclaration"/>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="派送方式">
|
|
<dict-tag :options="dict.type.emis_tab_dispatch_mode" :value="form.dispatchMethod"/>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="派件员">{{ form.dispatchManName }}/{{ form.operateEmployeeName }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="合同号" :span="4">{{ form.custOrderId }}</el-descriptions-item>
|
|
<el-descriptions-item label="取件员/操作员">{{ form.takePieceEmployeeName }}/{{ form.operateEmployeeName }}</el-descriptions-item>
|
|
<el-descriptions-item label="录单员">{{ form.registerManName }}</el-descriptions-item>
|
|
<el-descriptions-item v-if="form.paymentType == 2 || form.paymentType == 4 || form.paymentType == 5" label="月结客户" >{{ form.customerName }}</el-descriptions-item>
|
|
<el-descriptions-item label="回款联系人">{{ form.payee }}</el-descriptions-item>
|
|
<el-descriptions-item label="销售联系人">{{ form.salesmen }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
|
|
<el-descriptions :title="$t('收寄件信息')" size="small" :column="4" style="margin-top:10px">
|
|
<el-descriptions-item label="寄件人">{{ form.sender.name }}</el-descriptions-item>
|
|
<el-descriptions-item label="寄件电话">{{ form.sender.phone }}</el-descriptions-item>
|
|
<el-descriptions-item label="寄件公司" :span="4">{{ form.sender.company }}</el-descriptions-item>
|
|
<!-- <el-descriptions-item label="寄件人国家">{{ form.sendCountry }}</el-descriptions-item> -->
|
|
<!-- <el-descriptions-item label="寄件省">{{ form.sendProvince }}</el-descriptions-item> -->
|
|
<!-- <el-descriptions-item label="寄件市">{{ form.sendCity }}</el-descriptions-item> -->
|
|
<!-- <el-descriptions-item label="寄件区">{{ form.sendCounty }}</el-descriptions-item> -->
|
|
<!-- <el-descriptions-item label="寄件县">{{ form.sendTown }}</el-descriptions-item> -->
|
|
<el-descriptions-item label="寄件地址" :span="4" >{{ form.sender.address }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="收件人" :span="1">{{ form.reciever.name }}</el-descriptions-item>
|
|
<el-descriptions-item label="收件电话" :span="1">{{ form.reciever.phone }}</el-descriptions-item>
|
|
<el-descriptions-item label="收件公司" :span="4">{{ form.reciever.company }}</el-descriptions-item>
|
|
<!-- <el-descriptions-item label="收件客户">{{ }}</el-descriptions-item> -->
|
|
<el-descriptions-item label="收件地址" >{{ form.reciever.address }}</el-descriptions-item>
|
|
|
|
</el-descriptions>
|
|
|
|
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top: 10px;">
|
|
<el-col :span="12">
|
|
<el-descriptions :title="$t('货物信息')" size="small" :column="4" style="margin-top:10px">
|
|
<el-descriptions-item label="货物名称" :span="4">{{ form.goodsInfo }}</el-descriptions-item>
|
|
<el-descriptions-item label="件数">{{ form.parcelQty }}件</el-descriptions-item>
|
|
<el-descriptions-item label="包装类型" :span="4">
|
|
<dict-tag v-if="form.packType&&form.packType!=''" :options="dict.type.emis_tab_packing_type" :value="form.packType.split(',')"/>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="实际重量">{{ form.billWeight }}(kg)</el-descriptions-item>
|
|
<el-descriptions-item label="体积">{{ form.totalVolume }}(m³)</el-descriptions-item>
|
|
<el-descriptions-item label="体积重量" :span="4">{{ form.volumeWeight }}(kg)</el-descriptions-item>
|
|
<el-descriptions-item label="货物尺寸" :span="4">
|
|
<el-table
|
|
class="cargoList"
|
|
:cell-style="{
|
|
'padding': '0px!important',
|
|
'padding-left': '0px!important',
|
|
'padding-right': '0px!important',
|
|
'font-size':'11px'
|
|
}"
|
|
:header-cell-style="{
|
|
'font-size':'11px'
|
|
}"
|
|
border
|
|
stripe
|
|
:data="form.cargoList"
|
|
size="small"
|
|
style="width: 100%"
|
|
max-height="300px"
|
|
>
|
|
|
|
<el-table-column :label="$t('序号')" align="center" width="60">
|
|
<template slot-scope="scope">
|
|
<span > {{scope.$index+1}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="length" :label="$t('长(cm)')" align="center" width="60">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.length }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="width" :label="$t('宽(cm)')" align="center" width="60">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.width }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="height" :label="$t('高(cm)')" align="center" width="60">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.height }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="cargoQty" :label="$t('件数')" align="center" width="60">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.cargoQty }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="volume" :label="$t('体积(m³)')" align="center" width="80">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.volume }}
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<!-- <el-table-column prop="volume" :label="$t('描述')" align="center" width="80">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.goodsName }}
|
|
</template>
|
|
</el-table-column> -->
|
|
|
|
</el-table>
|
|
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="结算重量" :span="4">{{ form.settlementWeight }}(kg)</el-descriptions-item>
|
|
|
|
</el-descriptions>
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
<el-col :span="12">
|
|
<el-descriptions :title="$t('收费信息')" size="small" :column="4" style="margin-top:10px">
|
|
<el-descriptions-item label="计费方式" :span="4">
|
|
<dict-tag :options="dict.type.emis_calc_fee_type" :value="form.calcFeeType"/>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="是否特殊报价" :span="1">
|
|
<span v-if="form.blSpecialQuote == 1"> 是 </span>
|
|
<span v-else> 否 </span>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="是否敏感物" :span="4">
|
|
<span v-if="form.blSensitive == 1"> 是 </span>
|
|
<span v-else> 否 </span>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="支付方式" :span="4">
|
|
<dict-tag :options="dict.type.emis_payment_type" :value="form.paymentType"/>
|
|
</el-descriptions-item>
|
|
<!-- <el-descriptions-item label="费用币种">{{ form.currency }}</el-descriptions-item> -->
|
|
<el-descriptions-item v-if="form.paymentType == 2 || form.paymentType == 4 || form.paymentType == 5" label="月结客户" >{{ form.customerName }}</el-descriptions-item>
|
|
<el-descriptions-item label="回款联系人">{{ form.payee }}</el-descriptions-item>
|
|
<el-descriptions-item label="销售联系人" :span="3">{{ form.salesmen }}</el-descriptions-item>
|
|
<el-descriptions-item label="费用明细" :span="4">
|
|
<el-table
|
|
class="cargoList"
|
|
:cell-style="{
|
|
'padding': '0px!important',
|
|
'padding-left': '0px!important',
|
|
'padding-right': '0px!important',
|
|
'font-size':'11px'
|
|
}"
|
|
:header-cell-style="{
|
|
'font-size':'11px'
|
|
}"
|
|
border
|
|
stripe
|
|
:data="form.feeItems"
|
|
size="mini"
|
|
max-height="300px"
|
|
style="width: 100%"
|
|
>
|
|
|
|
|
|
<el-table-column prop="feeName" :label="$t('收费项')" align="center" width="70">
|
|
<template slot-scope="scope">
|
|
<span style="font-weight:600;color:red">{{ scope.row.feeName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="fee" :label="$t('应收')" align="center" width="50">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.fee }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="initialWeightFee" :label="$t('首重费')" align="center" width="60">
|
|
<template slot-scope="scope">
|
|
<div> {{scope.row.initialWeightFee}} </div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="addWeightPrice" :label="$t('续重单价')" align="center" width="70">
|
|
<template slot-scope="scope">
|
|
<div> {{scope.row.addWeightPrice}} </div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="realFee" :label="$t('实收')" align="center" width="50">
|
|
<template slot-scope="scope">
|
|
<div> {{scope.row.realFee}} </div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="remark" :label="$t('描述')" align="center" min-width="50">
|
|
<template slot-scope="scope">
|
|
<div> {{scope.row.remark}} </div>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="运费" :span="4"><span style="color:red;font-weight:bold;font-size:15px">{{ form.freight }}</span></el-descriptions-item>
|
|
|
|
<el-descriptions-item label="费用备注" :span="4">{{ form.feeRemark }}</el-descriptions-item>
|
|
|
|
|
|
</el-descriptions>
|
|
</el-col>
|
|
</el-row>
|
|
<el-descriptions title="" size="small" :column="1" style="margin-top:10px;margin-bottom: 30px;">
|
|
<el-descriptions-item label="运单备注" :span="4">{{ form.remark }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { getWaybillDetail} from "@/api/emis/emisWaybill";
|
|
import { parseTime } from "@/utils/custom";
|
|
|
|
|
|
export default {
|
|
name: "WaybillDetailReadOnly",
|
|
// name: "WaybillModify",
|
|
props: {
|
|
billCode: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
},
|
|
components: {
|
|
|
|
},
|
|
dicts: ['emis_qujian_fangshi','emis_declare_mode','emis_customs_clear',
|
|
'emis_tab_packing_type','emis_tab_dispatch_mode','emis_payment_type',
|
|
'emis_calc_fee_type','emis_print_type'],
|
|
data() {
|
|
return {
|
|
canViewDetail:false,
|
|
activeNames:['1','2','3','4'],
|
|
form:{
|
|
id:null,
|
|
reciever: {
|
|
country: null,
|
|
name: null,
|
|
phone:null,
|
|
province: null,
|
|
city: null,
|
|
district: null,
|
|
town: null,
|
|
address: null,
|
|
postCode: null,
|
|
email: null,
|
|
company: null,
|
|
},
|
|
sender: {
|
|
country: null,
|
|
name: null,
|
|
phone:null,
|
|
province: null,
|
|
city: null,
|
|
district: null,
|
|
town: null,
|
|
address: null,
|
|
postCode: null,
|
|
email: null,
|
|
company: null,
|
|
},
|
|
feeItems: [],
|
|
cargoList: [],
|
|
attachmentList: [],
|
|
printTypeCheckList:[],
|
|
billCode: null,
|
|
orderDate: null,
|
|
openId: null,
|
|
customerCode: null,
|
|
paymentType: null,
|
|
calcFeeType: '1',
|
|
custNo: null,
|
|
productTypeSelArr: null,
|
|
transLine: null,
|
|
productType: null,
|
|
customsClear: null,
|
|
customsEclaration: null,
|
|
packType: null,
|
|
dispatchMethod: "1",
|
|
pickupMethod: null,
|
|
pickStartDate: null,
|
|
pickFinishDate: null,
|
|
intoWarehouseCode: null,
|
|
intoWarehouseName: null,
|
|
intoWarehouseAddress: null,
|
|
intoWarehouseContact: null,
|
|
intoWarehousePhone: null,
|
|
intoWarehouseBillCode: null,
|
|
customerDeliveryBeginTime: null,
|
|
goodsType:null,
|
|
goodsInfo: null,
|
|
length:null,
|
|
width:null,
|
|
height:null,
|
|
totalWeight: null,
|
|
totalVolume: null,
|
|
parcelQty: null,
|
|
billWeight: null,
|
|
volumeWeight: null,
|
|
settlementWeight: null,
|
|
feeWeight: null,
|
|
freight: null,
|
|
blOverLong: null,
|
|
blOverWeight: null,
|
|
overWeightNumber: null,
|
|
feeRemark: null,
|
|
realValue: null,
|
|
takePieceEmployeeCode: null,
|
|
sendSiteCode: null,
|
|
sendSiteName: null,
|
|
destinationCountry: null,
|
|
destinationCode: null,
|
|
dispatchUnderlingSiteCode: null,
|
|
destinationCenterCode: null,
|
|
marketManCode: null,
|
|
payee: null,
|
|
salesmen: null,
|
|
operateEmployeeCode: null,
|
|
blMessage: null,
|
|
blAcceptMessage: null,
|
|
meterType:null,
|
|
blGenSubbill:null,
|
|
billCodeSub:null,
|
|
blSpecialQuote:null,
|
|
blSensitive:null,
|
|
lockFlag:null,
|
|
lockReason:null,
|
|
},
|
|
// 遮罩层
|
|
loading: true,
|
|
// 表单校验
|
|
rules: {
|
|
|
|
}
|
|
};
|
|
},
|
|
computed: {
|
|
},
|
|
watch: {
|
|
billCode(newVal){
|
|
this.initData();
|
|
}
|
|
},
|
|
|
|
created() {
|
|
this.initData();
|
|
},
|
|
methods: {
|
|
openCollapse(index){
|
|
|
|
},
|
|
initData() {
|
|
|
|
console.log("====billCode=1=>",this.billCode)
|
|
if(this.billCode && this.billCode!=undefined) {
|
|
this.loading = true;
|
|
getWaybillDetail(this.billCode).then(response => {
|
|
this.form = response.data;
|
|
console.log("====response.data=1=>",response.data)
|
|
this.loading = false;
|
|
});
|
|
}
|
|
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
.el-descriptions-item__content{
|
|
font-weight:bold;
|
|
color: #000;
|
|
}
|
|
|
|
.el-form-item__label {
|
|
color: #000;
|
|
}
|
|
|
|
.el-input-group__append {
|
|
padding: 0 4px;
|
|
}
|
|
|
|
.el-row{
|
|
display:flex;
|
|
flex-wrap: wrap;
|
|
// padding-right: 10px;
|
|
}
|
|
|
|
.el-form-item__label {
|
|
font-size: 12px!important;
|
|
}
|
|
|
|
|
|
.platform-auto-complete {
|
|
.el-autocomplete-suggestion__wrap {
|
|
padding: 5px 0;
|
|
ul li {
|
|
pointer-events: none; // 阻止可点击事件
|
|
.default {
|
|
text-align: center;
|
|
color: #999;
|
|
}
|
|
&:hover {
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.el-collapse {
|
|
border-top: none!important;
|
|
border-bottom: none!important;
|
|
}
|
|
|
|
.el-table .el-table__cell:first-child .cell {
|
|
padding: 0px;
|
|
}
|
|
|
|
.el-table .cell {
|
|
padding: 0px;
|
|
}
|
|
|
|
.cargoList{
|
|
.el-input__inner {
|
|
height: 28px;
|
|
line-height: 28px;
|
|
border: none;
|
|
background: #ffffcd;
|
|
font-size: 10px;
|
|
padding: 0px;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.el-descriptions__title{
|
|
font-size: 12px;
|
|
}
|
|
|
|
.el-collapse-item__content {
|
|
padding-bottom: 0px;
|
|
}
|
|
.el-collapse-item__header{
|
|
pointer-events: none;
|
|
}
|
|
|
|
.el-collapse-item__arrow {
|
|
pointer-events: auto;
|
|
}
|
|
|
|
</style>
|
|
|