<template>
	<view style="width: 100%;">
		<web-view id="webview" :src="state.url" style="width: 100%;"></web-view>
	</view>
</template>

<script setup>
	import {
		reactive
	} from 'vue'
	import {
		onShow,onHide,onUnload,onLoad
	} from '@dcloudio/uni-app'
	import {
		getOrderInfo
	} from '@/api/video/index.js'
	const state = reactive({
		orderId: '',
		timer: null,
		timer1: null,
		maxAjaxNum: 5,
		ajaxNum: 0,
		url: null, //要打开的外部链接
		viewerUrl: '/hybrid/html/web/viewer.html',
		webviewStyles: {
			width: '750px',
			height: '100%',
		}
	})

	function getOrder() {
		getOrderInfo({
			orderId: state.orderId
		}).then(res => {
			state.ajaxNum+=1
			
			console.log(res);
			if (res == 1) {
				uni.hideLoading()
				const sysInfo = uni.getSystemInfoSync();
				let isIos = sysInfo.platform == 'ios'
				if (isIos) {
					uni.navigateBack()
					uni.showToast({
						title: '支付成功',
						icon: 'none'
					})
					setTimeout(() => {
						uni.navigateBack()
					}, 1500)
				} else {
					uni.showToast({
						title: '支付成功',
						icon: 'none'
					})
					state.timer1 = setTimeout(() => {
						cleartimer()
						uni.navigateBack()
					}, 500)
				}
			} else {
				
			}
			
			if(state.ajaxNum>=state.maxAjaxNum){
				uni.navigateBack()
				cleartimer()
			}
		});
	}
	
	function cleartimer(){
		console.log('cleartimer');
		uni.hideLoading()
		clearInterval(state.timer)
		clearTimeout(state.timer1)
		state.timer=null
		state.timer1=null
		state.ajaxNum=0
	}
	onShow(() => {
		// #ifdef APP
		uni.showLoading({
			title: '支付中'
		})
		// #endif
		state.ajaxNum=0;
		getOrder()
		clearInterval(state.timer)
		state.timer=setInterval(()=>{
			getOrder()
		},2000)
	})
	onHide(() => {
		console.log('onHide');
		cleartimer()
		uni.hideLoading()
	})
	onUnload(() => {
		console.log('onUnload');
		cleartimer()
		uni.hideLoading()
		uni.hideLoading()
	})
	onLoad((option) => {
		state.url = option.url
		state.orderId = option.orderId
	})
</script>
<style lang="scss">
	.webview {
		width: 100%;
		height: 100%;
	}
</style>