146 lines
3.6 KiB
Vue
146 lines
3.6 KiB
Vue
<template>
|
||
<view>
|
||
<view class="vertical results">
|
||
<block v-if="loding">
|
||
<u-loading-icon mode="circle" size="58" color="#34CE98"></u-loading-icon>
|
||
<view class="circle-toast">
|
||
<view class="sub-title">已等待{{time}}秒</view>
|
||
<view class="sub-title">查询支付结果中，请耐心等待...</view>
|
||
</view>
|
||
</block>
|
||
<block v-else>
|
||
<view v-if="success">
|
||
<uni-icons type="checkbox-filled" size="88" color="#34CE98"></uni-icons>
|
||
<view class="title">支付成功</view>
|
||
<view class="sub-title">{{remove}}</view>
|
||
<button class="results-button" type="default" size="default" @click="navBack">返回</button>
|
||
</view>
|
||
<view v-else>
|
||
<uni-icons type="info-circle-fill" size="88" color="#34CE98"></uni-icons>
|
||
<view class="title">{{code === 0 ? '查询失败' : '订单不存在'}}</view>
|
||
<view class="sub-title">{{code === 0 ? '暂未查询到您的支付信息，如支付成功未到账请联系管理员': '暂未查询到您的订单信息'}}</view>
|
||
<button class="results-button" type="default" size="default" @click="navBack">返回</button>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { hmState } from '@/apis/interfaces/pay.js'
|
||
var outTime;
|
||
export default {
|
||
data() {
|
||
return {
|
||
type : 'recharge',
|
||
hash : '',
|
||
time : 0,
|
||
loding : false,
|
||
success : false,
|
||
code : 0,
|
||
remove : '充值成功，预计10秒内到账，可在账户交易记录中查询，以实际到账时间为准，如充值失败金额将原路退还'
|
||
};
|
||
},
|
||
created() {
|
||
this.type = this.$Route.query.type
|
||
if(this.type === 'vip') this.remove = '恭喜您成功开通共力生态会员'
|
||
if(this.type === 'buy') this.remove = '订单支出成功，可在个人中心中订单中查询您购物的订单'
|
||
this.queryState()
|
||
},
|
||
methods:{
|
||
queryState(){
|
||
this.loding = true
|
||
let outTimeN = 0
|
||
outTime = setInterval(() => {
|
||
hmState(this.type, this.$Route.query.orderId).then(res => {
|
||
outTimeN += 1
|
||
this.time = outTimeN
|
||
if(res.code === 1){
|
||
clearInterval(outTime)
|
||
this.success = true
|
||
this.loding = false
|
||
}
|
||
if(res.code === 0 && outTimeN >= 10){
|
||
clearInterval(outTime)
|
||
this.code = 0
|
||
this.loding = false
|
||
}
|
||
if(res.code === 2){
|
||
clearInterval(outTime)
|
||
this.code = 2
|
||
this.loding = false
|
||
}
|
||
}).catch(err => {
|
||
uni.showToast({
|
||
title: err.message,
|
||
icon : 'none'
|
||
})
|
||
})
|
||
}, 1000)
|
||
},
|
||
navBack(){
|
||
uni.navigateBack()
|
||
}
|
||
},
|
||
onUnload() {
|
||
clearInterval(outTime)
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.results{
|
||
height: 100vh;
|
||
box-sizing: border-box;
|
||
text-align: center;
|
||
padding-left: $padding * 3;
|
||
padding-right: $padding * 3;
|
||
padding-bottom: 20vh;
|
||
.title{
|
||
font-size: $title-size + 8;
|
||
color: $text-color;
|
||
font-weight: bold;
|
||
line-height: 80rpx;
|
||
padding: $padding 0;
|
||
}
|
||
.sub-title{
|
||
color: $text-gray;
|
||
line-height: 40rpx;
|
||
}
|
||
.hash{
|
||
background-color: white;
|
||
padding: $padding * 2;
|
||
border-radius: $radius-lg;
|
||
margin-top: $margin * 2;
|
||
font-size: $title-size;
|
||
color: $text-color;
|
||
.hash-title{
|
||
padding-bottom: $padding;
|
||
}
|
||
.hash-text{
|
||
word-break:break-all;
|
||
}
|
||
}
|
||
.results-button{
|
||
width: 100%;
|
||
margin-top: $margin * 3;
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
border-radius: 45rpx;
|
||
background-color: $main-color;
|
||
color: white;
|
||
font-size: $title-size;
|
||
font-weight: bold;
|
||
&::after{
|
||
display: none;
|
||
}
|
||
}
|
||
.circle-toast{
|
||
padding-top: 60rpx;
|
||
.sub-title{
|
||
line-height: 60rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|