<!--
|
* @Author: 小明丶
|
* @Date: 2020-06-19 15:59:27
|
* @LastEditors: zxq
|
* @LastEditTime: 2022-11-11 09:35:55
|
* @Description: 支付结果页面
|
-->
|
<template>
|
<div class="pay-result-page">
|
<v-navbar title="支付结果"></v-navbar>
|
<div class="result-box">
|
<img :src="url" alt />
|
<!-- <img src="../../../static/img/faile.png" alt />
|
<img src="../../../static/img/ing.png" alt /> -->
|
<p>{{titleText}}</p>
|
<p>{{tipText}}</p>
|
</div>
|
<div class="btn-box">
|
<button @click="goBack" v-if="preSettleStatus == 2">返回</button>
|
</div>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
preSettleStatus:'',
|
url: "./static/img/ing.png", //图片地址
|
titleText: "支付中", //标题文字
|
tipText: "正在进行支付,请稍后…", //提示文字
|
timer: "" //定时器
|
};
|
},
|
created() {
|
this.init()
|
},
|
methods: {
|
init() {
|
//判断用户查询哪一个行为的支付结果
|
if(this.$route.query.model == 1){
|
this.$api.findRepayResult({ repayId: this.$route.query.repayId}).then(res => {
|
this.preSettleStatus = res.body.repaySts
|
if (res.body.repaySts == 2) {
|
this.url = "./static/img/faile.png";
|
this.titleText = "支付失败";
|
this.tipText = res.body.failMsg;
|
}
|
if (res.body.repaySts == 1) {
|
this.url = "./static/img/success.png";
|
this.titleText = "支付成功";
|
this.tipText = "支付成功,跳转中请稍后…";
|
this.timer = setTimeout(()=>{
|
this.goBack()
|
},3000)
|
}
|
if (res.body.repaySts == 0) {
|
this.url = "./static/img/ing.png";
|
this.titleText = "支付中";
|
this.tipText = "正在进行支付,请稍后…";
|
}
|
});
|
}
|
if(this.$route.query.model == 2){
|
this.$api.preSettleStatus({ orderId: this.$route.query.orderId}).then(res => {
|
this.preSettleStatus = res.body.status
|
if (res.body.status == 2) {
|
this.url = "./static/img/faile.png";
|
this.titleText = "支付失败";
|
this.tipText = res.body.msg;
|
}
|
if (res.body.status == 1) {
|
this.url = "./static/img/success.png";
|
this.titleText = "支付成功";
|
this.tipText = "支付成功,跳转中请稍后…";
|
this.timer = setTimeout(()=>{
|
this.goBack()
|
},3000)
|
}
|
if (res.body.status == 0) {
|
this.url = "./static/img/ing.png";
|
this.titleText = "支付中";
|
this.tipText = "正在进行支付,请稍后…";
|
this.timer = setInterval(()=>{
|
this.init()
|
},3000)
|
}
|
});
|
}
|
|
},
|
goBack(){
|
this.$router.push({
|
path:'/order/order-detail',
|
query:{id:this.$route.query.orderId}
|
})
|
}
|
},
|
beforeDestroy(){
|
clearInterval(this.timer)
|
clearTimeout(this.timer)
|
}
|
};
|
</script>
|
<style lang="less" scoped>
|
.pay-result-page {
|
& {
|
min-height: 100vh;
|
background: @c-back;
|
}
|
.result-box {
|
& {
|
background: #fff;
|
text-align: center;
|
margin-top: 10px;
|
padding: 31px 0 24px;
|
}
|
img {
|
width: 83px;
|
height: 81px;
|
}
|
p:nth-of-type(1) {
|
font-size: 16px;
|
font-family: PingFang SC;
|
font-weight: 500;
|
color: rgba(51, 51, 51, 1);
|
margin-top: 20px;
|
}
|
p:nth-of-type(2) {
|
font-size: 14px;
|
font-family: PingFang SC;
|
font-weight: 500;
|
color: rgba(153, 153, 153, 1);
|
margin-top: 12px;
|
}
|
}
|
.btn-box{
|
text-align: center;
|
margin-top: 32px;
|
button{
|
width:320px;
|
height:44px;
|
background:rgba(81,148,254,1);
|
border-radius:22px;
|
border: 0;
|
outline: none;
|
color: #fff;
|
}
|
}
|
}
|
</style>
|