<template>
	<page-meta :page-style="themeColor"></page-meta>
	<view class="launch-mask" v-if="show == true">
		<view class="mask-img">
			<image :src="$util.img('public/uniapp/pay/invite_friends_share.png')" mode="aspectFit"></image>
		</view>
		<view class="mask-word">点击右上角跳转到浏览器打开</view>
	</view>
</template>
<script>
export default {
	name: 'wx_pay',
	data() {
		return {
			show : true,
			wx_alipay : "",
			out_trade_no : ""
		};
	},
	onLoad(options) {
		this.wx_alipay = options.wx_alipay || '';
		this.out_trade_no = options.out_trade_no || '';

		// ========== 核心修改：用条件编译隔离H5/小程序环境 ==========
		// H5环境：保留原有跳转逻辑（不改动）
		// #ifdef H5
		if(!this.$util.isWeiXin() && this.wx_alipay){
			this.show = false;
			location.href = this.wx_alipay;
		}
		// #endif

		// 小程序环境：禁用location，仅提示+清除定时器（避免报错）
		// #ifdef MP
		if(this.wx_alipay){
			// 友好提示用户
			this.$util.showToast({
				title: '该支付方式需在浏览器打开',
				icon: 'none',
				duration: 3000
			});
			// 可选：返回上一页（支付选择页），取消下面注释即可
			// setTimeout(() => {
			// 	uni.navigateBack({ delta: 1 });
			// }, 1500);
		}
		// #endif

		this.checkPayStatus();
	},
	methods: {
		getPayInfo(out_trade_no) {
			this.$api.sendRequest({
				url: '/api/pay/info',
				data: {
					out_trade_no
				},
				success: res => {
					if (res.code >= 0 && res.data) {
						this.checkPayStatus();
					} 
				}
			});
		},
		checkPayStatus() {
			var that = this;
			var timer = setInterval(() => {
				that.$api.sendRequest({
					url: '/api/pay/status',
					data: { out_trade_no: that.out_trade_no },
					success: res => {
						if (res.code == 0) {
							if (res.data.pay_status == 2) {
								clearInterval(timer);
								that.$util.redirectTo('/pages_tool/pay/result', { code: that.out_trade_no }, '', 'redirectTo');
							}
						} else {
							clearInterval(timer);
						}
					},
					// 新增：请求失败时清除定时器，避免内存泄漏
					fail: () => {
						clearInterval(timer);
					}
				});
			}, 1000);
		},
	},
};
</script>

<style lang="scss">
.launch-mask{
	position:fixed;
	top:0px;
	left: 0px;
	width:100%;
	height: 100%;
	background:rgba(0,0,0,0.8);
	.mask-img{
		text-align: right;
		margin:10% 10px 10px 30px;
		image{
			width: 50px;
			height:117px;
			margin-right:9%
		}
	}
	.mask-word{
		color: #fff;
		text-align: center;
		font-weight: bold;
		font-size: 18px;
		text{
			color:#FF0036 !important
		}
	}
}
</style>