md
This commit is contained in:
linfso
parent
6a30c625e3
commit
dd23665fb4
@ -12,9 +12,10 @@
|
||||
<div style="width:150px;margin: 0 auto;">
|
||||
<img :src="wxPayQrImageUrl" width="100%" draggable="false"/>
|
||||
</div>
|
||||
<div class="pay-title"><span style="color: black;font-size: 20px;">￥{{ settleBillItem.recMoney-settleBillItem.recedMoney }} </span></div>
|
||||
<!-- -settleBillItem.recedMoney -->
|
||||
<div class="pay-title"><span style="color: red;font-size: 20px;">￥{{ settleBillItem.thisPayMoney }} </span></div>
|
||||
<div style="text-align: center;" >
|
||||
<div>请使用微信[<span style="color:black;font-weight: bold;">24小时</span>]内完成支付</div>
|
||||
<div>请使用微信[<span style="color:blue;font-weight: bold;">24小时</span>]内完成支付</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
@ -43,7 +44,7 @@
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<span class="item-label">应付金额:</span><span class="item-value">￥{{ settleBillItem.recMoney }}</span>
|
||||
<span class="item-label">总费用:</span><span class="item-value">￥{{ settleBillItem.recMoney }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">开票状态:</span>
|
||||
@ -59,11 +60,17 @@
|
||||
<!-- <el-col :span="12">
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<span class="item-label">已付金额:</span><span class="item-value">￥{{ settleBillItem.recedMoney }}</span>
|
||||
<span class="item-label">已付费用:</span><span class="item-value">￥{{ settleBillItem.recedMoney }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label" style="color:red">待支付:</span><span class="item-value" style="color:red">￥{{ settleBillItem.thisPayMoney }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="24" v-for="item in settleBillItem.subBillList" :key="item.id">
|
||||
<el-col style="border-bottom: 2px solid #f0f0f0 ;padding-top: 10px;color: black;font-weight: bold;" :span="24">
|
||||
运单列表：
|
||||
</el-col>
|
||||
<el-col style="border-top: 2px solid #f0f0f0 ;padding-bottom: 10px;" :span="24" v-for="item in settleBillItem.subBillList" :key="item.id">
|
||||
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top:10px">
|
||||
<el-col :span="12">
|
||||
<span class="item-label">运单号:</span><span class="item-value" style="font-size:14px;font-weight: bold;">{{ item.billCode }}</span>
|
||||
@ -91,6 +98,12 @@
|
||||
<el-col :span="12">
|
||||
<span class="item-label">实际重量:</span><span class="item-value">{{ item.waybillDetail.billWeight }}KG</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">体积:</span><span class="item-value">{{ item.waybillDetail.totalVolume }}m³</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">结算重量:</span><span class="item-value">{{ item.waybillDetail.settlementWeight }}KG</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">产品类型:</span><span class="item-value">{{ item.waybillDetail.productTypeName }}</span>
|
||||
</el-col>
|
||||
@ -98,14 +111,14 @@
|
||||
<span class="item-label">寄件公司:</span><span class="item-value">{{ item.waybillDetail.sendCompany }}</span>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<span class="item-label">备注:</span><span class="item-value">{{ item.waybillDetail.remark }} {{ item.waybillDetail.feeRemark }}</span>
|
||||
<span class="item-label">费用备注:</span><span class="item-value">{{ item.waybillDetail.feeRemark }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div style="margin-bottom: 20px;">
|
||||
<!-- <el-button type="primary" v-print="'#payPage'" >打印</el-button> -->
|
||||
<div v-if="settleBillItem!=null" style="margin-bottom: 20px; text-align: center;">
|
||||
<el-button type="primary" v-print="'#payPage'" >打印</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="wechat-payment-container" style="background: #fff;padding: 1rem;">
|
||||
<div v-if="!isWx">请在微信浏览器中打开此页面进行支付</div>
|
||||
<div v-if="payStatus!=0&&isWx" >
|
||||
<div v-if="payStatus!=0">
|
||||
<div v-if="payStatus==1" class="text-center" >
|
||||
<h1 style="font-size: 24px; color: #303133; margin-bottom: 10px;">支付中</h1>
|
||||
<p style="color: #606266; margin-bottom: 30px;">{{ errorMessage }}</p>
|
||||
@ -32,8 +32,8 @@
|
||||
<p style="margin-top: 5px;">客服电话: 400-025-7080</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="isWx">
|
||||
<!-- v-if="isWx" -->
|
||||
<div >
|
||||
<el-form id="payPage" v-if="settleBillItem!=null" ref="form" :model="form" size="mini" label-width="80px">
|
||||
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;">
|
||||
<el-col :span="24">
|
||||
@ -94,9 +94,44 @@
|
||||
<el-col :span="12">
|
||||
<span class="item-label">已付金额:</span><span class="item-value">￥{{ settleBillItem.recedMoney }}</span>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<span class="item-label">结算重量:</span><span class="item-value">{{ settleBillItem.feeWeight }}KG</span>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<span class="item-label">总费用:</span><span class="item-value">￥{{ settleBillItem.recMoney }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">开票状态:</span>
|
||||
<span class="item-value">
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==0">未开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==1">已开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==2">部分开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==3">不开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==4">已完成</span>
|
||||
</span>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12">
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<span class="item-label">已付费用:</span><span class="item-value">￥{{ settleBillItem.recedMoney }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label" >支付金额:</span><span class="item-value" style="color:red;font-size:25px">￥{{ settleBillItem.thisPayMoney }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="24" v-for="item in settleBillItem.subBillList" :key="item.id">
|
||||
<el-col :span="24">
|
||||
<div v-if="settleBillItem!=null&&payStatus==0" style="margin-bottom: 20px;margin-top: 20px;">
|
||||
<el-button type="primary" style="width: 100%;" @click="handleWeixinPay" >确认付款</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col style="border-bottom: 2px solid #f0f0f0 ;padding-top: 10px;color: black;font-weight: bold;" :span="24">
|
||||
运单列表：
|
||||
</el-col>
|
||||
<el-col style="border-top: 2px solid #f0f0f0 ;padding-bottom: 10px;" :span="24" v-for="item in settleBillItem.subBillList" :key="item.id">
|
||||
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top:10px">
|
||||
<el-col :span="12">
|
||||
<span class="item-label">运单号:</span><span class="item-value" style="font-size:14px;font-weight: bold;">{{ item.billCode }}</span>
|
||||
@ -124,6 +159,12 @@
|
||||
<el-col :span="12">
|
||||
<span class="item-label">实际重量:</span><span class="item-value">{{ item.waybillDetail.billWeight }}KG</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">体积:</span><span class="item-value">{{ item.waybillDetail.totalVolume }}m³</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">结算重量:</span><span class="item-value">{{ item.waybillDetail.settlementWeight }}KG</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">产品类型:</span><span class="item-value">{{ item.waybillDetail.productTypeName }}</span>
|
||||
</el-col>
|
||||
@ -131,15 +172,13 @@
|
||||
<span class="item-label">寄件公司:</span><span class="item-value">{{ item.waybillDetail.sendCompany }}</span>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<span class="item-label">备注:</span><span class="item-value">{{ item.waybillDetail.feeRemark }}</span>
|
||||
<span class="item-label">费用备注:</span><span class="item-value">{{ item.waybillDetail.feeRemark }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div v-if="settleBillItem!=null&&payStatus==0" style="margin-bottom: 20px;margin-top: 20px;">
|
||||
<el-button type="primary" style="width: 100%;" @click="handleWeixinPay" >确认付款</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -1,298 +0,0 @@
|
||||
<template>
|
||||
<div style="overflow: auto;">
|
||||
<!-- v-if="settleBillItem!=null" -->
|
||||
<el-form id="payPage" v-if="settleBillItem!=null" ref="form" :model="form" size="mini" label-width="80px">
|
||||
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;">
|
||||
<el-col :span="24">
|
||||
<div style="text-align:center">
|
||||
<div style="display: inline-flex;" >
|
||||
<span><img :src="shortLogo" style="width: 30px;height: 30px;margin-top: 0px;" /></span>
|
||||
<span style="font-size: 20px;font-weight: bold;color: black;">探路供应链（江苏）有限公司</span>
|
||||
</div>
|
||||
<div style="width:150px;margin: 0 auto;">
|
||||
<img :src="wxPayQrImageUrl" width="100%" draggable="false"/>
|
||||
</div>
|
||||
<div class="pay-title"><span style="color: black;font-size: 20px;">￥{{ settleBillItem.recMoney-settleBillItem.recedMoney }} </span></div>
|
||||
<div style="text-align: center;" >
|
||||
<div>请使用微信[<span style="color:black;font-weight: bold;">24小时</span>]内完成支付</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top:10px">
|
||||
<el-col :span="12">
|
||||
<span class="item-label">账单编号:</span>
|
||||
<span class="item-value" style="font-size:14px;font-weight: bold;">{{ settleBillItem.settleBillNo }}</span>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12">
|
||||
<span class="item-label">账单名称:</span><span class="item-value">{{ settleBillItem.settleBillName }}</span>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<span class="item-label">账单日期:</span><span class="item-value">{{ settleBillItem.createTime }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">总票数:</span><span class="item-value">{{ settleBillItem.sendPieceSum }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">总件数:</span><span class="item-value">{{ settleBillItem.pieceNumber }}</span>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<span class="item-label">结算重量:</span><span class="item-value">{{ settleBillItem.feeWeight }}KG</span>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<span class="item-label">应付金额:</span><span class="item-value">￥{{ settleBillItem.recMoney }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">开票状态:</span>
|
||||
<span class="item-value">
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==0">未开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==1">已开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==2">部分开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==3">不开票</span>
|
||||
<span type="info" v-if="settleBillItem.openBillStatus==4">已完成</span>
|
||||
</span>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12">
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<span class="item-label">已付金额:</span><span class="item-value">￥{{ settleBillItem.recedMoney }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="24" v-for="item in emisSettleSubBillList" :key="item.id">
|
||||
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top:10px">
|
||||
<el-col :span="12">
|
||||
<span class="item-label">运单号:</span><span class="item-value" style="font-size:14px;font-weight: bold;">{{ item.billCode }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">寄件日期:</span><span class="item-value">{{ parseTime(item.waybillDetail.sendDate, '{y}-{m}-{d}') }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">发件人:</span><span class="item-value">{{ item.waybillDetail.sendName }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">快件类型:</span><span class="item-value">{{ item.waybillDetail.sendSiteName }}--{{ item.waybillDetail.dispatchUnderlingSiteName }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">总运费:</span><span class="item-value">{{ item.waybillDetail.freight }} CNY</span>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" v-for="feeItem in item.feeitemList" :key="feeItem.id">
|
||||
<span class="item-label">{{ feeItem.feeName }}:</span><span class="item-value">{{ feeItem.billFee }}{{feeItem.currency}}</span>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<span class="item-label">件数:</span><span class="item-value">{{ item.waybillDetail.parcelQty }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">实际重量:</span><span class="item-value">{{ item.waybillDetail.billWeight }}KG</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">产品类型:</span><span class="item-value">{{ item.waybillDetail.productTypeName }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<span class="item-label">寄件公司:</span><span class="item-value">{{ item.waybillDetail.sendCompany }}</span>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<span class="item-label">备注:</span><span class="item-value">{{ item.waybillDetail.remark }} {{ item.waybillDetail.feeRemark }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div style="margin-bottom: 20px;">
|
||||
<!-- <el-button type="primary" v-print="'#payPage'" >打印</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { getBillPayInfo,getWxPayQrCode} from "@/api/oms/emisCommon";
|
||||
import shortLogoImg from '@/assets/logo/short_logo.png'
|
||||
|
||||
import { parseTime } from "@/utils/custom";
|
||||
|
||||
export default {
|
||||
name: "OnlinePayQr",
|
||||
props:{
|
||||
settleBillNo:{
|
||||
type:String
|
||||
}
|
||||
},
|
||||
components: { },
|
||||
dicts: [],
|
||||
data() {
|
||||
return {
|
||||
emisSettlePayRecordOptions: [],
|
||||
settleBillItem:this.settleBillObj,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
shortLogo: shortLogoImg,
|
||||
// 表单参数
|
||||
form: {},
|
||||
|
||||
wxPayQrImageUrl:null,
|
||||
|
||||
emisSettleSubBillList:[],
|
||||
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
created() {
|
||||
this.initData();
|
||||
},
|
||||
|
||||
methods: {
|
||||
initData() {
|
||||
this.reset();
|
||||
this.form.payScope='1';
|
||||
this.form.payRelList=[];
|
||||
|
||||
this.form.recType=1;
|
||||
if(this.settleBillNo){
|
||||
this.loading = true;
|
||||
getInfoBySettleBillNo(this.settleBillNo).then(response => {
|
||||
this.settleBillItem = response.data;
|
||||
this.loading = false;
|
||||
});
|
||||
|
||||
getWxPayQrCode(this.settleBillNo).then(response => {
|
||||
this.wxPayQrImageUrl = response.data;
|
||||
});
|
||||
|
||||
let qParam ={
|
||||
pageNum:1,
|
||||
pageSize:500,
|
||||
"settleBillNo":this.settleBillNo,
|
||||
}
|
||||
listEmisSettleSubBill(qParam).then(response => {
|
||||
this.emisSettleSubBillList = response.rows;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.reset();
|
||||
this.$emit("on-cancel");
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
payScope:null,
|
||||
params:{
|
||||
billCodeStr:null,
|
||||
},
|
||||
payRelList:[],
|
||||
|
||||
id: null,
|
||||
payId: null,
|
||||
payType: null,
|
||||
recType: null,
|
||||
payMan: null,
|
||||
payManCode: null,
|
||||
settleBillNo: this.settleBillNo,
|
||||
blAudit: null,
|
||||
auditDate: null,
|
||||
auditManCode: null,
|
||||
auditSiteCode: null,
|
||||
customerCode: null,
|
||||
customerName: null,
|
||||
payMoney: null,
|
||||
payStatus: null,
|
||||
payStatusDesc: null,
|
||||
breakType: null,
|
||||
breakReason: null,
|
||||
breakEmpCode: null,
|
||||
recManCode: null,
|
||||
settleType: this.settleType,
|
||||
refundDate: null,
|
||||
refundManCode: null,
|
||||
refundSeq: null,
|
||||
refundMode: null,
|
||||
refundMoney: null,
|
||||
refundReason: null,
|
||||
refundRemark: null,
|
||||
refundOpManCode: null,
|
||||
refundRegisterSiteCode: null,
|
||||
refundRegisterManCode: null,
|
||||
satisfyMoney: null,
|
||||
satisfyReason: null,
|
||||
allowanceMoney: null,
|
||||
allowanceReason: null,
|
||||
deductionMoney: null,
|
||||
deductionReason: null,
|
||||
otherMoney: null,
|
||||
otherReason: null,
|
||||
tradeDate: null,
|
||||
remark: null,
|
||||
delFlag: null,
|
||||
createBy: null,
|
||||
createTime: null,
|
||||
updateBy: null,
|
||||
updateTime: null,
|
||||
createSite: null,
|
||||
updateSite: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$emit("on-changed");
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
|
||||
.pay-dialog-center {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.pay-title {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color: #2e2f33;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pay-count{
|
||||
color: #2962ff;
|
||||
}
|
||||
|
||||
.item-label{
|
||||
font-size: 12px;
|
||||
color: #2e2f33;
|
||||
}
|
||||
|
||||
.item-value{
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: #2e2f33;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user