<template>
	<div class="login-box">
		<img src="@/static/pic_xcx_dl.png" alt="" class="my_img">
		<div class="wrapper">
			<div class="logo-box">
				<!-- <img src="../../static/img/logo.png" alt="" class="img"> -->
				<p>安徽省刷制品质量检验检测中心</p>
			</div>
			<div class="btn-wrapper">
				<!-- <button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				  <image class="avatar" :src="avatarUrl"></image>
				</button> 
				<input type="nickname" class="weui-input" placeholder="请输入昵称"/> -->
				<button class="btn" open-type="getUserInfo" @getuserinfo="getuserinfo" >
					<!-- <img src="../../static/wx.png" alt="" class="img imguy"> -->
					手机号快捷登录
				</button>
			</div>
		
			<div class="box_hei" @click="btn" v-if="box_status">
				<div  @click.stop="btns" class="hei_box">
					<div class="box_top">
						<div class="box_title">
							<div>
								安徽省刷制品质量检验检测中心 申请使用
							</div>
						</div>
						<div class="box_nameq">你的手机号码</div>
					</div>
					<!-- <div class="boxs"></div> -->
					<div class="box_btns">
						<div @click="btn" class="box_btn box_btn1">拒绝</div>
						<button class="box_btn box_btn2" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">允许</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				yqr_id: '',
				box_status: false,
				phone: '',
				openid: '',
				//用户名
				nickName:'',
				//用户头像
				avatarUrl:'',
				//code
				code:'',
				//userinfo
				userInfo:{},
				mode:''
				

			}
		},
		onLoad(option) {
			console.log(option)
			this.mode = option.name
			console.log(this.mode)
			// 默认地址
			// let {yq_id} = data
			var yqr_id = uni.getStorageSync('yqr_id')
			if(yqr_id){
				this.yqr_id = yqr_id
			}
			const _this = this
			uni.authorize({
				scope: 'scope.userLocation',
				success: (ress) => {
					
				}
			})
		},
		
		methods: {
			btns() {
				
			},
			btn() {
				this.box_status = false
			},
			onChooseAvatar(e) {
				console.log(e,23)
			    const { avatarUrl } = e.detail 
				this.avatarUrl = avatarUrl
			    
			  },
			async getPhoneNumber(e){
				console.log(e.detail.code,456)
				const {iv,encryptedData} = e.detail
				console.log(iv,encryptedData)
				let res = await this.$http.uniApi({events: uni.login})
				console.log(res,9876)
						if(res.code) {
							console.log(res.code,9876)
							this.$http.post("weChat/login",{
								code: e.detail.code,
							}).then(red => {
								console.log(red)
								if(red.code == 200){
									// console.log(JSON.parse(red.data).phoneNumber,9999)
									this.box_status = false
									// var phone = JSON.parse(red.data).phoneNumber 
									// this.bindUserinfo({code: this.code,nickName: this.nickName, avatarUrl:this.avatarUrl,phone:phone})
									// uni.setStorageSync('token', red.data.token)
									uni.setStorageSync('phone', red.msg)
									console.log(red.msg)
									// uni.setStorageSync('deptInfo', red.data.dept)
									// console.log(red.data.dept)
									// uni.setStorageSync('mode', this.mode)
									// if(this.mode == 'TEACHER'){
									// 	uni.setStorageSync('company', red.data.company)
									// }
									// uni.setStorageSync('ztype', red.data.type)
									// if(this.mode == 'PARENT'){
									// 	//家长端
									// 	//未绑定
									// 	wx.redirectTo({
									// 	   url: '/pages/parents/parHome?id=' + 1
									// 	})
										
									// }else if(this.mode == 'TEACHER'){
										//老师端
										uni.switchTab({
											url: '/pages/tab/index'
										})
									// }
									// uni.setStorageSync('dzstatus', 'false')
									// uni.reLaunch({
									// 	url: '/pages/table/index'
									// })
									
								}else{
									uni.showToast({
										title: red.msg,
										duration: 1000,
										icon: 'none'
									});
								}
							})
						}
			},
			bindUserinfo(params) {
				const _this = this
				console.log(params)
				this.$http.post('user/login', {
					wxId: params.code,
					headImg: params.avatarUrl,
					userName:  params.nickName,
					inviteCode:'',
					phone:params.phone
					// pid: this.yqr_id || '',
				}).then(res => {
					if(res.code == '200') {
						console.log(res)
						this.openid = res.data
						console.log(this.openid)
						uni.setStorageSync('token', this.openid)
						uni.setStorageSync('yq_id', res.data.id)
						setTimeout(function(){
							uni.redirectTo({
							  url: '../index/index'　　// 
							})
						},1000)
						// this.box_status=true
						// uni.getLocation({
						// 	success: red => {
						// 		_this.$http.post("index/index/getDefaultStore",{
						// 			lng: red.longitude,
						// 			lat: red.latitude,
						// 			openid: res.data.openid,
						// 		}).then(res => {
						// 			let adss = {
						// 				id: res.data.id,
						// 				lat: res.data.lat,
						// 				lng: res.data.lng,
						// 				name: res.data.name
						// 			}
						// 			// uni.setStorageSync('adss', res)
						// 			// uni.setStorageSync('zx_adss', adss)
						// 			// uni.setStorageSync('xz_adss', adss)
						// 			uni.request({
						// 				// url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${adss.lat},${adss.lng}&key=3YYBZ-KBURK-3QTJG-AK2RC-KBBRS-T4FVR`,
						// 				success: function (result) {
						// 					// uni.setStorageSync('city', result.data.result.address_component.city)
						// 				}
						// 			})
						// 		})
						// 	}
						// })
						// this.$http.post('app_user/findUserDetail').then((red) => {
						// 	uni.setStorageSync('userInfo',red.data)
						// })
					}
				})
			},
			
			async getuserinfo(e) {
				console.log(e,9999)
				const {nickName, avatarUrl, ...userInfo} = e.detail.userInfo
				// uni.navigateTo({
				// 	url: `login_phone?nickName=${nickName}&avatarUrl=${avatarUrl}`
				// })
				try{
					let res = await this.$http.uniApi({events: uni.login})
					if(res.code) {
						console.log(res)
						console.log(res.code)
						console.log(nickName)
						console.log(avatarUrl)
						this.avatarUrl = avatarUrl
						this.nickName = nickName
						this.code = res.code
						this.userInfo =e.detail.userInfo
						uni.setStorageSync('userInfo', e.detail.userInfo)
						// this.bindUserinfo({code: res.code, nickName, avatarUrl})
						this.box_status=true
					}
				} catch(e){
					//TODO handle the exception
				}
			},
		}
	}
</script>

<style lang="scss">
	.my_img{
		width: 100%;
		height: 426upx;
		position: absolute;
		top: 0;
		left: 0;
	}
	.box_hei{
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.8);
		position: fixed;
		top: 0;
		left: 0;
		.hei_box{
			background: #fff;
			border-radius:22upx 22upx 0 0;
			height: 440upx;
			padding: 52upx 28upx 104upx;
			position: absolute;
			bottom:0;
			width: 100%;
			box-sizing: border-box;
			.box_top{
				padding: 0 18upx 62upx;
				.box_title{
					display: flex;
					justify-content: space-between;
					font-size: 30upx;
					margin-bottom: 30upx;
					div{
						display: flex;
						align-items: center;
						color: #333333;
					}
					.img{
						margin-right: 14upx;
						width: 180upx;
						height: 48upx;
					}
					.imgs{
						width: 40upx;
						height: 40upx;
					}
				}
				.box_nameq{
					color: #333333;
					font-size: 44upx;
					font-weight: bold;
				}
			}
			.box_phone{
				height: 106upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				font-size: 28upx;
				color: #A6A6A6;
				border-bottom: 1upx solid #EBEBEB;
				border-top: 1upx solid #EBEBEB;
				div{
					display: flex;
					align-items: center;
				}
				.img{
					width: 26upx;
					height: 22upx;
				}
				span{
					color: #333333;
					font-size: 32upx;
					padding-right: 18upx;
					font-weight: bold;
				}
			}
			.box_qita{
				height: 106upx;
				font-size: 28upx;
				color: #7CA4FC;
				line-height: 106upx;
			}
			.boxs{
				height: 50upx;
			}
			.box_btns{
				margin-top: 10upx;
				display: flex;
				justify-content: space-between;
				.box_btn{
					width: 324upx;
					height: 82upx;
					font-size: 32upx;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 4upx;
				}
				.box_btn1{
					background: #F3F3F3;
					color: #33B925;
				}
				.box_btn2{
					background: #37962B;
					color: #FFFFFF;
				}
			}
		}
	}
	.login-box{
		border-top: 1px solid #f5f5f5;
		box-sizing: border-box;
		height: 100%;
		position: absolute;
		width: 100%;
		.wrapper{
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			height: 100%;
			padding-top: 150upx;
			.logo-box{
				display: flex;
				flex-direction: column;
				justify-content: center;
				.img{
					width: 198upx;
					height: 113upx;
					margin-bottom: 32upx;
				}
				p{
					text-align: center;
					color: #100E0E;
					font-weight: bold;
					margin-bottom: 104upx;
				}
			}
			.btn-wrapper{
				flex: 0 0 400upx;
				.btn{
					width: 676upx;
					height: 96upx;	
					background-color: #12C469;
					color: #fff;
					display: flex;
					align-items: center;
					justify-content: center;
					.img{
						width: 52upx;
						height: 42upx;
						margin-right: 10upx;
					}
					&:after{
						border:none
					}
				}
			}
		}
	}
	.imguy{
		width: 22upx;
		height: 22upx;
	}
</style>
