<template>
	<view class="waiting">
		<u--image
			src="/static/favicon.png"
			width="288rpx"
			height="288rpx"
			mode="aspectFit"
			:fade="true"
			duration="200"
		></u--image>
		<button
			class="login"
			@click="login"
		>
			授权登录
		</button>
	</view>
</template>

<script>
	import { getAccessToken, getOpenId } from '@/utils/auth'
	import { qrLogin } from '@/api/login'

	export default {
		data() {
			return {
				scene: '',
			}
		},
		methods: {
			login() {
				if (!this.scene) {
					uni
						.showModal({
							content: '链接失效，请重新扫码',
							showCancel: false,
						})
						.then(() => {
							uni.exitMiniProgram({
								success: res => {
									console.log(res)
								},
							})
						})
				} else {
					uni.showLoading({
						title: '登陆中。。。',
					})
					uni.login({
						success: res => {
							console.log('微信code', res.code)
							qrLogin({
								code: this.scene,
								openid: res.code,
							}).then(res => {
								setTimeout(() => {
									uni.hideLoading()
									uni.switchTab({
										url: '/pages/index',
									})
								}, 3000)
							})
						},
						fail: err => {
							uni.showToast({
								title: err,
								duration: 2000,
								icon: 'none',
							})
						},
					})
				}
			},
		},
		onLoad(query) {
			// scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
			this.scene = decodeURIComponent(query.scene)
		},
	}
</script>

<style lang="scss" scoped>
	.waiting {
		height: 100vh;
		display: flex;
		flex-flow: column nowrap;
		justify-content: center;
		align-items: center;
		background: #17c653;
		gap: 40px;
		.login {
			display: flex;
			padding: var(--Number-12px, 24rpx) var(--Number-40px, 80rpx);
			justify-content: center;
			align-items: center;
			border-radius: var(--Number-120px, 240rpx);
			background: var(--LightMode-Light-Light, #fff);
			box-shadow: 0px 6rpx 8rpx 0px rgba(0, 0, 0, 0.03);
			color: var(--LightMode-Success-Success, #17c653);
			font-family: 'PingFang SC';
			font-size: 32rpx;
			font-style: normal;
			font-weight: 500;
			line-height: normal;
		}
		.title {
			font-family: 'PingFang SC';
			font-size: 32rpx;
			font-style: normal;
			font-weight: 500;
			line-height: normal;
		}
	}
</style>
