<template>
	<div class="payCenter">
		<div class="error-text">
			<van-icon v-if="errorText" class="error-icon" name="warning-o" />
			{{ errorText }}
		</div>
	</div>
</template>

<script>
import { changeTwoDecimal, getUrlCode } from '@/utils/common'
export default {
	name: 'payCenter',
	data() {
		let query = this.$route.query
		return {
			amount: changeTwoDecimal(query.amount), // 支付金额
			orderNo: query.orderNo, // 订单号
			sign: query.sign, // 签名
			payType: query.payType,
			errorText: null, // 错误信息
			orderBody: query.orderBody,
			orderSubject: query.orderSubject,
			code: null,
			platform: query.platform
		}
	},
	mounted() {
		// 判断当前浏览器
		const payType = this.payType
		const ua = window.navigator.userAgent.toLowerCase()
		if (ua.match(/MicroMessenger/i) == 'micromessenger') {
			if(payType === 'wx_pub') {
				//授权
				let code = getUrlCode('code')
				if(code) {
					this.code = code // 赋值code码
					this.onPayPage() // 跳转支付页
				} else {
					this.goAuth()
				}
                document.title = '微信支付'
			} else if(payType == 'alipay_qr') {
				this.errorText = '请使用支付宝扫码'
			}
		} else if (ua.match(/AlipayClient/i) == 'alipayclient') {
			if(payType === 'wx_pub') {
				this.errorText = '请使用微信扫码'
			} else if(payType == 'alipay_qr') {
				// 支付宝支付
                document.title = '支付宝支付'
                this.onPayPage() // 跳转支付页
			}
		} else {
			this.errorText = '请在微信或支付宝客户端打开'
		}
		this.errorText && (document.title = 'ERROR')
	},
	methods: {
        onPayPage() {
            // 跳转对应支付页
            this.$router.replace({
                path: 'payDefine',
                query: {
                    amount: this.amount, // 支付金额
                    orderNo: this.orderNo, // 订单号
                    sign: this.sign, // 签名
                    payType: this.payType,
                    orderBody: this.orderBody,
					orderSubject: this.orderSubject,
					platform: this.platform, // 平台
					code: this.code // 获取授权码
                }
            })
        },
		goAuth() { // 用户授权
			// let urls = this.config.value = window.location.origin + '/#/payDefine?orderNo=' + this.orderNo + '&sign=' + this.sign + '&amount=' + this.amount + '&payType=' + this.payType + '&orderBody=' + this.orderBody + '&orderSubject=' + this.orderSubject
			let urlNow = encodeURIComponent(window.location.href);
			let scope = 'snsapi_base'; //snsapi_userinfo   //静默授权 用户无感知
			let appid = 'wx751141096e75a4ee';
			// let appid = 'wx80f175c0eb6836e9';
			let url =
				`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${urlNow}&response_type=code&scope=${scope}&state=STATE&connect_redirect=1#wechat_redirect`;
			window.location.replace(url)
		}
	},
	destroyed() {
		this.$toast.clear()
		this.$dialog.close()
		document.title = '管乐迷'
	}
}
</script>

<style lang="less">
.payCenter {
    min-height: 100vh;
    overflow: hidden;
}
.error-icon {
	display: block;
	color: #ffb07b;
	font-size: 120px;
	margin-bottom: .3rem;
}
.error-text {
    font-size: .15rem;
    width: 100%;
    text-align: center;
    color: #3F3F3F;
    margin-top: 100px;
}
</style>