<template>
|
<el-dialog title="查看对账汇总"
|
width="80%"
|
ref="dialog"
|
id="peAdd"
|
@close="close"
|
:visible.sync="dialogVisible">
|
<div class="viewContent">
|
<div class="contentItem">
|
<div class="left">
|
<label for="">对账批次:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.checkBatchNo">
|
</div>
|
<div class="right">
|
<label for="">接入机构:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.institution">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">商户号:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.merId">
|
</div>
|
<div class="right">
|
<label for="">支付公司:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.payCompany">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">对账日期:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.checkDate">
|
</div>
|
<div class="right">
|
<label for="">对账状态:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.checkStatus">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">对账文件:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.fileName">
|
</div>
|
<div class="right">
|
<label for="">文件获取时间:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.fileAccessTime">
|
</div>
|
</div>
|
<div class="line"></div>
|
<h5>对账单汇总</h5>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">代收总笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.recsTime">
|
</div>
|
<div class="right">
|
<label for="">代收总金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.recsAmount">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">代付总笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.paysTime">
|
</div>
|
<div class="right">
|
<label for="">代付总金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.paysAmount">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">代收手续费:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.recFee">
|
</div>
|
<div class="right">
|
<label for="">代付手续费:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.payFee">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">退款笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.refundTime">
|
</div>
|
<div class="right">
|
<label for="">退款金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.refundAmount">
|
</div>
|
</div>
|
<div class="line"></div>
|
<h5>对账结果</h5>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">平账笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.correctTime">
|
</div>
|
<div class="right">
|
<label for="">对方无我方有笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.whavetnoTime">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">平账金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.correctAmount">
|
</div>
|
<div class="right">
|
<label for="">对方无我方有金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.whavetnoAmount">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">对方有我方无笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.wnothaveTime">
|
</div>
|
<div class="right">
|
<label for="">金额错笔数:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.errorAmountTime">
|
</div>
|
</div>
|
<div class="contentItem">
|
<div class="left">
|
<label for="">对方有我方无金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.wnothaveAmount">
|
</div>
|
<div class="right">
|
<label for="">金额错金额:</label>
|
<input type="text"
|
disabled
|
v-model="maskData.errorAmountSum">
|
</div>
|
</div>
|
<div class="btn">
|
<el-button
|
@click="close">取消</el-button>
|
</div>
|
</div>
|
</el-dialog>
|
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
maskData: "",
|
dialogVisible: this.value
|
};
|
},
|
|
props: {
|
Data: {
|
type: Object,
|
default() {
|
return {};
|
}
|
},
|
|
value: {
|
type: Boolean,
|
default: false
|
}
|
},
|
|
|
watch: {
|
value: function(n) {
|
this.dialogVisible = n
|
if(n) {
|
this.getMaskData();
|
}
|
}
|
},
|
methods: {
|
// 取消按钮
|
cancel() {
|
this.$emit("showMask");
|
},
|
// // 获取传递过来的数据
|
getMaskData() {
|
this.maskData = JSON.parse(JSON.stringify(this.Data));
|
if (this.maskData.checkStatus == "0") {
|
this.maskData.checkStatus = "未对账";
|
} else if (this.maskData.checkStatus == "1") {
|
this.maskData.checkStatus = "对账中";
|
} else if (this.maskData.checkStatus == "2") {
|
this.maskData.checkStatus = "已对账";
|
}
|
},
|
|
// 关闭
|
close() {
|
this.$emit("input", false);
|
}
|
}
|
};
|
</script>
|
|
|
<style lang="less" scoped>
|
.title {
|
background-color: #e4e4e4;
|
height: 56px;
|
line-height: 40px;
|
border-radius: 6px;
|
padding: 6px;
|
font-size: 16px;
|
}
|
.viewContent {
|
padding: 0px 16px;
|
padding-bottom: 20px;
|
.contentItem {
|
width: 100%;
|
height: 56px;
|
padding: 10px 0px;
|
label {
|
display: inline-block;
|
width: 120px;
|
text-align: right;
|
height: 36px;
|
line-height: 56px;
|
}
|
input {
|
padding: 0px 8px;
|
width: 240px;
|
height: 36px;
|
outline: none;
|
border-radius: 4px;
|
border: 1px solid #ccc;
|
}
|
input:disabled {
|
background-color: #fff;
|
}
|
.left {
|
width: 50%;
|
float: left;
|
}
|
.right {
|
width: 50%;
|
float: right;
|
}
|
}
|
.line {
|
width: 100%;
|
height: 1px;
|
background-color: #aaa;
|
margin: 16px 0px;
|
}
|
> h5 {
|
margin: 6px 0px;
|
font-size: 16px;
|
}
|
.btn {
|
width: 70px;
|
margin: 20px auto;
|
}
|
}
|
|
</style>
|