<template>
	<view style="background-color: white; width: 100%; min-height: 100vh;">
		<!-- <uni-popup ref="popup" type="bottom"> -->
		<view class="header">
			<image :src="$img1('common/logo.png?x=1')"></image>
		</view>
		<view class="" style="width: 676rpx; height: 2rpx; background-color: #E8E8E8; margin-left: 38rpx;">

		</view>
		<view class="content">
			<view>申请获取以下权限</view>
			<text style="color: #979797;">获得您的手机号</text>
		</view>
		<!-- type='primary' -->
		<view class="flex center column" style="width: 100%;">
			<button class="bottom flex center" withCredentials="true" lang="zh_CN" open-type="getPhoneNumber"
				@getphonenumber="getPhoneNumber">
				授权手机号
			</button>

			<view class="quxiao" @click="back()">取消</view>
		</view>


		<!-- </uni-popup> -->
	</view>
</template>

<script>
export default {
	data() {
		return {
			z_imgPath: this.$z_img2
		}
	},
	created() {
		//默认加载
		// this.login();
	},
	methods: {
		back() {
			// 尝试返回上一页
			let that = this;
			uni.navigateBack({
				fail: function() {
					// 如果返回失败，表示没有上一页，则跳转到首页
					that.$customRouter.navigateTo('/pages/user/index', {}, 'reLaunch');
				}
			});
		},
		getPhoneNumber(e) {
			// console.log(e)
			let that = this
			uni.login({
				success(res) {
					// console.log(res)
					uni.checkSession({
						success() {
							that.req({
								url: 'login_bind_mobile',
								data: {
									code: e.detail.code,
									encryptedData: e.detail.encryptedData,
									iv: e.detail.iv
								},
								success(res) {
									if (res.status == 1) {
										// uni.setStorageSync('token', res.data)
										uni.showToast({
											title: '绑定成功~',
											icon: 'success',
											success() {
												// var pageurl = uni.getStorageSync(
												// 	'page');
												setTimeout(() => {
													// 返回上一页而不是跳转到首页
													uni.navigateBack({
														fail: function() {
															// 如果返回失败，表示没有上一页，则跳转到首页
															that.$customRouter.navigateTo('/pages/user/index', {}, 'reLaunch');
														}
													});
												}, 1000)
											}
										})
									}
								}
							})
						}
					})
				}
			})
		}
	}
}
</script>

<style>
/* .box {
		position: fixed;
		bottom: 0;
	} */

.header {
	padding-top: 90rpx;
	/* padding: 90rpx 0 90rpx 50rpx; */
	text-align: center;
	width: 100%;
	height: 300rpx;
	line-height: 450rpx;
}

.header image {
	width: 200rpx;
	height: 200rpx;
	border-radius: 50%;
}

.content {
	margin-top: 68rpx;
	margin-left: 50rpx;
	margin-bottom: 90rpx;
	color: #333333;
	font-size: 28rpx;
}

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

.bottom {
	/* border-radius: 80rpx; */
	width: 416rpx;
	height: 80rpx;
	margin: 70rpx 50rpx;
	font-size: 28rpx;
}

button::after {
	border: none;
}

button {
	background: #333333;
	font-size: 28rpx;
	font-weight: 400;
	color: #CDEF27;
	border-radius: 16rpx;
}

.quxiao {
	background-color: #CDEF27;
	width: 416rpx;
	height: 80rpx;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 16rpx;
	font-size: 28rpx;
	font-weight: 400;
	color: #333333;
}
</style>