<template>
	<view class="all">
		<view v-if="isCanUse">
			<view>
				<view class="header">
					<image :src="$img1('common/logo.png?x=1')"></image>
				</view>
				<view class="content">
					<view>申请获取以下权限</view>
					<text>获得你的公开信息(昵称，头像、地区等)</text>
				</view>

				<view @click="isAgree = !isAgree" class="agree">
					<view class="icon">
						<image v-if="isAgree" :src="$img1('common/check_act.png')" lazy-load></image>

						<image v-else :src="$img1('common/check.png')" lazy-load></image>
					</view>

					<view class="agree-r">
						我已阅读并同意
						<text @click.stop="$c.to({ url: '/pages/guize/guize?type=4' })">
							《用户协议》
						</text>
						和
						<text @click.stop="$c.to({ url: '/pages/guize/guize?type=5' })">
							《隐私政策》
						</text>
					</view>
				</view>

				<view class="btn-list">
					<view @click="$c.to({ type: 3, url: '/pages/shouye/index' })" class="cancel">
						拒绝
					</view>

					<button v-if="isAgree" class="bottom" type="primary" withCredentials="true" lang="zh_CN"
						@click="getUserProfile">
						授权登录
					</button>

					<button v-else class="bottom" type="primary" withCredentials="true" lang="zh_CN"
						@click="getUserProfile">
						授权登录
					</button>
				</view>

				<!-- <button
          class="bottom"
          withCredentials="true"
          lang="zh_CN"
          @tap="getUserProfile"
        >
          授权登录
        </button> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				z_imgPath: this.$z_img2,
				SessionKey: '',
				OpenId: '',
				nickName: null,
				avatarUrl: null,
				isCanUse: uni.getStorageSync('isCanUse') || true, //默认为true
				code: '',
				isAgree: false
			}
		},
		onLoad(option) {
			//默认加载
			// this.login();
			console.log(window.location.href, option);
			if (option != null) {
				if (option.code != null) {
					//登录
					this.h5Login(option.code);
				}
			}
		},
		methods: {
			//第一授权获取用户信息===》按钮触发
			getUserProfile(e) {
				if (!this.isAgree) {
					return this.$c.toast({
						title: '请阅读并同意《用户协议》和《隐私政策》'
					})
				}
				// #ifdef H5
				this.h5UserProfile();
				// #endif
				// #ifdef MP-WEIXIN
				this.wxUserProfile();
				// #endif


			},
			wxUserProfile() {
				var that = this
				uni.getUserProfile({
					desc: '用于向用户发送商品', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					lang: 'zh_CN',
					success: res => {
						uni.login({
							provider: 'weixin',
							success: function(loginRes) {
								that.req({
									url: 'login',
									data: {
										code: loginRes.code,
										nickname: res.userInfo.nickName,
										headimg: res.userInfo.avatarUrl,
										pid: uni.getStorageSync('pid')
									},
									success: function(res) {
										if (res.status == 1) {
											uni.setStorageSync('token', res.data)
											var lgurl = uni.getStorageSync(
												'lgurl') //获取页面路径
											var lgdata = uni.getStorageSync(
												'lgurldata') //获取页面参数
											if (lgurl) {
												lgdata = JSON.parse(lgdata)
												// 拼接参数
												let param = ''
												for (let key in lgdata) {
													param += '&' + key + '=' + lgdata[
														key]
												}
												param = '/' + lgurl + param.replace(
													'&', '?')
												uni.setStorageSync('lgurl', '')
												uni.setStorageSync('lgurldata', '')
												console.log(param)
												setTimeout(() => {
													uni.reLaunch({
														url: param
													})
												}, 1000)
											} else {
												uni.reLaunch({
													url: 'index'
												})
											}
										}
									}
								})
							},
							complete: (e) => {
								console.log(e, '登录');
							}
						})
					},
					complete: (e) => {
						console.log(e, '用于向用户发送商品');
					}
				})

			},
			h5Login(code) {
				var that = this;
				that.req({
					url: 'h5login',
					data: {
						code: code,
						pid: uni.getStorageSync('pid')
					},
					success: function(res) {
						if (res.status == 1) {
							uni.setStorageSync('token', res.data)
							var lgurl = uni.getStorageSync(
								'lgurl') //获取页面路径
							var lgdata = uni.getStorageSync(
								'lgurldata') //获取页面参数
							if (lgurl) {
								lgdata = JSON.parse(lgdata)
								// 拼接参数
								let param = ''
								for (let key in lgdata) {
									param += '&' + key + '=' + lgdata[
										key]
								}
								param = '/' + lgurl + param.replace(
									'&', '?')
								uni.setStorageSync('lgurl', '')
								uni.setStorageSync('lgurldata', '')
								console.log(param)
								setTimeout(() => {
									uni.reLaunch({
										url: param
									})
								}, 1000)
							} else {
								uni.reLaunch({
									url: 'index'
								})
							}
						}
					}
				})
			},
			h5UserProfile() {
				var that = this;
				console.log('进入h5')
				//http://api.zpc-xy.com/login.html
				//http://192.168.195.30:8080/#/pages/user/login?code=021gjuFa1F8OOH0uLeJa1T5fMh4gjuFA&state=STATE
				//http://192.168.195.30:8080/pages/user/login pages/user/wxlogin
				
				// var redirect_uri = escape(this.$loginPage);
				window.location.href =this.$wxloginPage;
					// `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx0e33d80d35e4a3b1&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`;
			}
		}
	}
</script>

<style lang="scss">
	.all {
		min-height: 100vh;
		// background: url($imgurl+'common/pageBg1.png') no-repeat 0 0 / 100% auto;
	}

	.header {
		margin: 0 0 90rpx 50rpx;
		padding: 90rpx 0 0;
		border-bottom: 1px solid #ccc;
		text-align: center;
		width: 650rpx;
		height: 300rpx;
		line-height: 450rpx;
	}

	.header image {
		width: 200rpx;
		height: 200rpx;
	}

	.content {
		margin-left: 50rpx;
		margin-bottom: 90rpx;
		color: #fff;
	}

	.content text {
		display: block;
		margin-top: 40rpx;
	}

	.agree {
		display: flex;
		padding: 0 50rpx;

		.icon {
			width: 32rpx;
			height: 32rpx;
		}

		.agree-r {
			flex: 1;
			word-wrap: break-word;
			word-break: break-all;
			padding-left: 20rpx;
			line-height: 32rpx;

			font-size: 26rpx;
			color: #9d9d9d;

			text {
				color: #ff873a;
			}
		}
	}

	.btn-list {
		display: flex;
		justify-content: space-evenly;
		padding: 50rpx 0 0;

		.cancel {
			width: 240rpx;
			box-sizing: border-box;
			border-radius: 80rpx;
			font-size: 35rpx;
			background: #666;
			color: #fff;
			display: flex;
			justify-content: center;
			align-items: center;
			background: #AD77EF;
			filter: grayscale(1);
		}

		.bottom {
			background: #ff873a;
			margin: 0;
			width: 380rpx;
			box-sizing: border-box;
			border-radius: 80rpx;
			font-size: 35rpx;
		}
	}
</style>