qingyuyiliao/pages/index/surePay.vue

<template>
	<!-- 确认支付页面 -->
	<view class="sure-pay-home">
		<view class="image" v-if="payStatus==0">
			<image src="../../static/image/pay.png" mode=""></image>
			<view class="text">
				正在支付请稍后
			</view>
		</view>
		<view class="image" v-if="payStatus==1">
			<image src="../../static/image/paysuccess.png" mode=""></image>
			<view class="text">
				支付成功，即将跳转吸氧页面
			</view>
			<view class="num">
				{{count}}s
			</view>
			<view class="submit" @click="skipNew()">
				立即跳转
			</view>
		</view>
		<view class="image" v-if="payStatus==2">
			<image src="../../static/image/payfail.png" mode=""></image>
			<view class="text">
				支付失败
			</view>
		</view>
	</view>
</template>

<script>
	var app = getApp()
	export default {
		data() {
			return {
				payStatus: '',
				count: 5,
				order_no: '',
				downtime:''
			}
		},
		onLoad(options) {
			let that=this
			console.log(options)
			this.order_no = options.order_no
			let params = {
				order_no: options.order_no
				// order_no: 'O20210419161056350041'
			}
			 this.surePay(params)
		

		},
		methods: {
			//立即跳转
			skipNew: function() {
				clearInterval(this.downtime)
				uni.reLaunch({
					 url: './order?order_no=' + this.order_no
				})
			},
			surePay: function(params) {
				let that = this
				app.request('/order', params, 'get').then(res => {
					console.log(res, '确认您订单')
					this.payStatus = res.data.data.pay_status
					if (this.payStatus == 0) {
						console.log(this.payStatus, 'ppppp')
						setInterval(function() {
							console.log('0000')
							that.surePay()
						}, 5000);
					} else if (this.payStatus == 1) {
						this.downtime = setInterval(function() {
							that.count--
							console.log(that.count, '+++++++++++')
							if (that.count == 0) {
								clearInterval(that.downtime)
								uni.reLaunch({
									 url: './order?order_no=' + that.order_no

								})
							}
						}, 1000);

					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.sure-pay-home {
		height: 100vh;
		background-color: #FFFFFF;

		.image {

			text-align: center;

			image {
				margin-top: 40%;
				height: 150upx;
				width: 150upx;

			}

			.text {
				margin-top: 50upx;
				font-size: 30upx;
			}

			.num {
				font-size: 30upx;
				color: $mine-background-color;
				font-weight: 500;
			}

			.submit {
				background-color: $mine-background-color;
				width:400upx;
				color: #FFFFFF;
				margin: 0 auto;
				height: 80upx;
				line-height: 80upx;
				// padding: 20upx;
				font-size: 26upx;
				border-radius: 20upx;
				margin-top: 50upx;

			}
		}
	}
</style>