<template>
	<view class="min-body">
		<!-- <u-navbar title="充值结果" placeholder @leftClick="leftClick(paypage,'/pages/pages-recharge/index/index')" ></u-navbar> -->
		<view class="mt-30" v-if="pay_state == 1">
			<!-- {{paypage}} -->
			<view class="white-box-top">
				<!-- <image class="img" src="https://img.agrimedia.cn/chwl/v2/success-img.png" mode="aspectFit"></image> -->
				<u-image :showLoading="true" src="https://img.agrimedia.cn/chwl/v2/success-img.png" width="348px" height="100px" mode="aspectFit"></u-image>
			</view>
			<!-- <image src="https://img.agrimedia.cn/chwl/v2/success-img.png" mode="aspectFit"></image> -->
			<cardstyle :width="48"></cardstyle>
			<view class="white-box-bottom">
				<view class="flbtn bd-dashed" style="padding-top: 0;">
					<view class="big-666">
						充值方式
					</view>
					<view class="big-333">
						{{orderInfo['pay_type']}}
					</view>
				</view>
				<view class="flbtn bd-dashed">
					<view class="big-666">
						充值时间
					</view>
					<view class="big-333">
						{{orderInfo['create_time']}}
					</view>
				</view>
				<view class="flbtn bd-dashed">
					<view class="big-666">
						充值金额
					</view>
					<view class="big-333" style="color: #EE3232;">
						￥{{orderInfo['amount']/100}}
					</view>
				</view>
				<view class="flbtn bd-dashed">
					<view class="big-666">
						实到余额
					</view>
					<view class="big-333" style="color: #EE3232;">
						￥{{orderInfo['quota_amount']/100}}
					</view>
				</view>
			</view>
		</view>
		<view v-else style="font-size: 30rpx;text-align: center;margin: 60rpx auto;">
			支付失败
		</view>
	</view>
</template>

<script>
	import {
		checkOrderStatusAPI
	} from '@/request/recharge/index.js';
	import mixin from '@/static/js/mixin/mixin.js';
	let time = null;
	export default {
		mixins:[mixin],
		data() {
			return {
				// 是否返回上一页
				paypage:false,
				pay_state: -1,
				order_sn: '',
				type: -1,
				orderInfo: {
					create_time: '',
					pay_type: '微信支付',
					amount: 0,
					quota_amount: 0
				}
			}
		},
		methods: {
			init() {
				checkOrderStatusAPI({
					order_sn: this['order_sn'],
					type: this['type']
				}).then(res => {
					if (res['data']['pay_status'] != 0) {
						this['pay_state'] = 1;
					};
					this['orderInfo'] = res['data'];
				})
			},
			
			ScheduledExecution(callback,condition){
				console.log('进入倒计时');
				clearInterval(this['time']);
				this['time'] = null;
				console.log(condition(),'condition');
				this['time'] = setInterval(()=>{
					if(!condition()){
						console.log('执行倒计时');
						callback();
					}else{
						clearInterval(this['time']);
						this['time'] = null;
					}
				},1000)
				
				
			}
		},
		onShow() {
			this.ScheduledExecution(this.init,()=>{
				return this['pay_state'] == 1;
			})
		},
		onUnload() {
			clearInterval(this['time']);
			this['time'] = null;
		},
		onLoad(paramet) {
			if (paramet?.order_sn) {
				this['order_sn'] = paramet['order_sn'];
				this['type'] = paramet['type'];
				this.init();
			} else {
				this['pay_state'] = 2;
			}

		}
	}
</script>

<style lang="scss">
	.white-box-top {
		border-radius: 20rpx 20rpx 0 0;
		background-color: #fff;
		padding: 32rpx 0 ;

	}

	.white-box-bottom {
		border-radius: 0 0 20rpx 20rpx;
		background-color: #fff;
		padding: 30rpx;

	}

	.bd-dashed {
		padding: 20rpx 0;
		border-bottom: 2rpx dashed #EDEDED;
	}
</style>
