<template>
	<view class="flex-col page">
		<view class="flex-col group_5">
			<view class="justify-center group_6">
				<view class="flex-row">
					<image src="http://images.wanjunshijie.com/product/cook/assets/79cb071c6f7b292b807fb0eb4820adf8.png"
						class="image_6" />
					<image src="http://images.wanjunshijie.com/product/cook/assets/42596c685ca04c384dae1fccae75293c.png"
						class="image_8" />
				</view>
				<image src="http://images.wanjunshijie.com/product/cook/assets/9086dbc457542c7e987a30bc03226717.png"
					class="image_6 image_9" />
			</view>
			<view class="flex-col group_8">
				<button @click="getinfo" class="flex-col items-center button">
					<text>微信授权登录</text>
				</button>
				<view class="flex-row group_9">
					<view class="group_10">
						<u-checkbox-group size="10" shape="circle" activeColor="#4293F5">
							<u-checkbox :checked="checked" size="14" shape="circle" activeColor="#FEC846"
								v-model="checked" labelColor="#171717" labelSize="12" label="点击授权登录即表示同意"
								@change="getchecked">
							</u-checkbox>
						</u-checkbox-group>
						<text class="text_8" @click="goagreement">《厨师到家用户协议》</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		miniappsession,
		saveminiprofile
	} from '../../config/api.js'
	export default {
		data() {
			return {
				checked: true,
				code: ''
			};
		},
		methods: {
			getchecked(e) {
				this.checked = e
			},
			goagreement() {
				uni.navigateTo({
					url: '/packages/pages/agreement/index'
				})
			},
			// login() {
			// 	var that = this;
			// 	uni.login({
			// 		provider: 'weixin',
			// 		success: function(res) {
			// 			console.log(res)
			// 			that.code = res.code
			// 			that.userlogin()
			// 		}
			// 	});
			// },
			// 获取用户信息
			getinfo() {
				var that = this;
				console.log('获取用户信息')
				wx.getUserProfile({
					desc: '用于用户登录', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						console.log(res)
						that.iv = res.iv
						that.encryptedData = res.encryptedData
						that.nickName = res.userInfo.nickName
						that.sex = res.userInfo.gender
						that.pic = res.userInfo.avatarUrl
						uni.login({
							provider: 'weixin',
							success: function(loginRes) {
								that.code = loginRes.code
								that.userlogin()
							}
						});
					}
				})
			},
			userlogin() {
				var that = this;
				var data = {
					"code": this.code,
				}
				miniappsession(data).then(res => {
					if (res.code == 1) {
						uni.showToast({
							title: '登录成功',
							icon: 'none'
						})
						uni.setStorageSync('token', res.data.userinfo.token)
						uni.setStorageSync('user_id', res.data.userinfo.user_id)
						that.saveminiprofile()
						uni.reLaunch({
							url: '/pages/home/home'
						})
					}
				}).catch(err => {

				})
			},
			saveminiprofile() {
				var data = {
					"nickname": this.nickName,
					"avatar": this.pic,
				}
				saveminiprofile(data, {
					custom: {
						auth: true
					}
				}).then(res => {

				}).catch(err => {

				})
			},
		}
	};
</script>

<style scoped lang="scss">
	.page {
		background-color: rgb(255, 255, 255);
		width: 100%;
		height: 100%;
		overflow-y: auto;

		.group_5 {
			padding: 124rpx 24rpx 689rpx 26rpx;
			flex: 1 1 auto;
			overflow-y: auto;

			.group_6 {
				padding: 0 155rpx;

				.image_6 {
					width: 128rpx;
					height: 128rpx;
				}

				.image_9 {
					margin-left: 43rpx;
				}

				.image_8 {
					margin-left: 40rpx;
					align-self: center;
					width: 49rpx;
					height: 41rpx;
				}
			}

			.group_8 {
				margin-top: 88rpx;

				.button {
					padding: 25rpx 0;
					color: rgb(255, 255, 255);
					font-size: 36rpx;
					width: 690rpx;
					line-height: 34rpx;
					white-space: nowrap;
					background-color: rgb(53, 173, 26);
					border-radius: 10rpx;
				}

				.group_9 {
					margin-top: 55rpx;

					.image_10 {
						margin: 3rpx 0;
						width: 18rpx;
						height: 18rpx;
					}

					.group_10 {
						margin-left: 13rpx;
						line-height: 24rpx;
						display: flex;
						justify-content: flex-start;
						align-items: center;
						flex-wrap: nowrap;
						flex-direction: row;
						white-space: nowrap;
						height: 24rpx;

						.text_7 {
							color: rgb(0, 0, 0);
							font-size: 24rpx;
							line-height: 24rpx;
						}

						.text_8 {
							color: rgb(51, 131, 223);
							font-size: 24rpx;
							line-height: 24rpx;
						}
					}
				}
			}
		}
	}
</style>