<template>
	<view class="oneSubmitted">
		<CustomReturn bgColor="none" title="登录" />
		<view class="oneSubmitted-v2">
			<image class="oneSubmitted-v2-bg" src="@/static/imagesV2/icon29.png" mode="widthFix"></image>
			<PaddingTopB>
				<view style="width: 100%;">
					<view class="oneSubmitted-v2-1">
						<image class="oneSubmitted-v2-1-i" src="@/static/imagesV2/icon68.png" mode="widthFix"></image>
					</view>
					<view class="oneSubmitted-v2-2">

						<view class="oneSubmitted-v2-2-1" @click="openMajor">
							<view class="oneSubmitted-v2-2-1-l">
								<text style="color: #979797;" v-if="!school.id">请选择学校</text>
								<text v-else>{{ school.name }}</text>
							</view>
							<u-icon name="arrow-down-fill" size="10"></u-icon>
						</view>
						<!-- #ifdef APP-PLUS -->
						<view class="oneSubmitted-v2-2-1">
							<input v-model="phoneNumber" class="oneSubmitted-v2-2-1-i" type="text"
								placeholder="请输入账号/手机号" />
						</view>
						<view class="oneSubmitted-v2-2-1" style="margin-bottom: 20rpx;"
							v-if="loginType === LOGINMETHOD.CODE">
							<input class="oneSubmitted-v2-2-1-i" type="text" v-model="code" placeholder="请输入验证码" />
							<view class="oneSubmitted-v2-2-1-r">
								<Countdown ref="countdownRef" @start="sendCode" />
							</view>
						</view>
						<view class="oneSubmitted-v2-2-1" style="margin-bottom: 20rpx;" v-else>
							<input class="oneSubmitted-v2-2-1-i" type="text" v-if="isPlaintext" v-model="password" placeholder="请输入密码" />
							<input class="oneSubmitted-v2-2-1-i" type="password" v-else v-model="password" placeholder="请输入密码" />
							<view @click="changePlaintext">
								<u-icon name="eye-off" v-if="isPlaintext" color="#BDBDBD" size="20"></u-icon>
								<u-icon name="eye-fill" v-else color="#BDBDBD" size="20"></u-icon>
							</view>
						</view>
					<view class="oneSubmitted-v2-2-c" @click="">
						<text v-if="loginType === LOGINMETHOD.CODE"
							@click="changeLoginType(LOGINMETHOD.PASSWORDLOGIN)">密码登录</text>
						<text v-else @click="changeLoginType(LOGINMETHOD.CODE)">验证码登录</text>
					</view>
					<view class="oneSubmitted-v2-2-xy">
						<Protocol v-model="isReadProtocol" />
					</view>
					<!-- #endif -->
					<!-- #ifdef APP-PLUS -->
					<view class="oneSubmitted-v2-2-2" @click="appLogin">
						登录
					</view>
					<view class="oneSubmitted-v2-2-4">
						<view class="oneSubmitted-v2-2-4-i" @click="oneClickLogin">
							<image src="@/static/imagesV2/icon71.png" mode="widthFix"></image>
						</view>
					</view>
					<!-- #endif -->
					<!-- #ifdef MP-WEIXIN -->
					<view class="oneSubmitted-v2-2-2" v-if="!school.id" @click="prompt">
						登录
					</view>
					<button class="oneSubmitted-v2-2-2" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber"
						v-else>
						登录
					</button>
					<view class="oneSubmitted-v2-2-3">
						本小程序为中志教育内部系统，不对外开放
					</view>
					<!-- #endif -->
				</view>
		</view>
		</PaddingTopB>
	</view>
	<!-- 登录-->
	<!-- <view class="header-wrap"></view> -->

	<!-- <view class="content-wrap1 area flex">
			<view class="content-item flex">
				<image class="img" src="/static/images/logo.png" mode=""></image>
				<view class="botm-btn-2" @click="openMajor">
					<text style="color: #979797;" v-if="!school.id">请选择学校</text>
					<text v-else>{{ school.name }}</text>
				</view>
				<view class="botm-btn" style="position: relative;" v-if="!school.id">
					<button style="position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;" @click="prompt"></button>
					登录
				</view>
				<view class="botm-btn" style="position: relative;" v-else>
					<button open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber" style="position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;"></button>
					登录
				</view>
				<view class="samll-text" style="color: red;">
					本小程序为中志教育内部系统,不对外开放
				</view>
			</view>
		</view> -->
	<u-picker :show="show" :columns="columns" @cancel="show = false" keyName="name" @confirm="confirm"></u-picker>
	</view>
</template>

<script>
	import CustomReturn from "@/components/CustomReturn/index.vue"
	import PaddingTopB from "@/components/PaddingTopB/index.vue"
	import Countdown from "@/components/Countdown/index.vue"
	import Protocol from "@/components/Protocol/index.vue"
	import Vue from 'vue'
	import {
		mapState,
		mapMutations
	} from 'vuex'
	/**
	 * 大咖课类型
	 */
	const LOGINMETHOD = {
		/**
		 * 密码登录
		 * @value 1
		 */
		'PASSWORDLOGIN': 1,
		/**
		 * 验证码登录
		 * @value 1
		 */
		'CODE': 2
	}
	var that
	export default {
		components: {
			CustomReturn,
			PaddingTopB,
			Countdown,
			Protocol
		},
		data() {
			return {
				LOGINMETHOD,
				loginType: LOGINMETHOD.PASSWORDLOGIN,
				show: false,
				columns: [],
				school: {},
				// 手机号/账号
				phoneNumber: '',
				// 验证码
				code: '',
				// 密码
				password: '',
				// 协议状态
				isReadProtocol: false,
				// 是否是明文密码
				isPlaintext: false
			}
		},
		onLoad(option) {
			that = this
			console.log(option);
			console.log(process.env.NODE_ENV)
			this.getColumns()
		},
		methods: {
			changePlaintext() {
				this.isPlaintext = !this.isPlaintext
			},
			changeLoginType(type) {
				this.loginType = type
			},
			sendCode() {
				if(!this.phoneNumber) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					})
					return
				}
				let form = {
					phone: this.phoneNumber
				}
				console.log(form)
				that.$service.P_post('login/send_sms', form).then(res => {
					if (res.code == 1) {
						this.$refs.countdownRef.start()
					} else {
						if (res.msg) {
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						} else {
							uni.showToast({
								icon: 'none',
								title: '获取数据失败'
							})
						}
					}
				})
			},
			oneClickLogin() {
				if (!this.school.id) {
					uni.showToast({
						icon: 'none',
						title: '请选择学校'
					})
					return
				}
				this.loginPhone()
			},
			// 手机号一键登录
			loginPhone(callBack = null) {
				let that = this
				uni.showLoading({
					title: '加载中'
				})
				uni.preLogin({
					provider: 'univerify',
					success(res) {
						//预登录成功
						uni.hideLoading()
						if (callBack) {
							callBack()
						}
						uni.login({
							provider: 'univerify',
							univerifyStyle: { // 自定义登录框样式
								"fullScreen": true,
								"authButton": {
									"normalColor": '#2d81ff',
									"highlightColor": "#2d81ff",
									"disabledColor": "#2d81ff",
									"title": '本机号码一键登录/注册'
								},
								"otherLoginButton": {
									"title": "其他登录方式"
								},
								"privacyTerms": {
									"defaultCheckBoxState": false,
									"checkBoxSize": 14,
									"termsColor": "#2d81ff",
									"textColor": "#202020",
									// "uncheckedImage": "static/login/icon4.png",
									// "checkedImage": "static/login/icon5.png",
									"isCenterHint": true,
									"privacyItems": [{
											"url": "https://edudev.baoshanjiaoyu.com/agreement/yonghuxieyi.html", // 点击跳转的协议详情页面  
											"title": "校园通用户协议" // 协议名称  
										},
										{
											"url": "https://edudev.baoshanjiaoyu.com/agreement/yinsixieyi.html", // 点击跳转的协议详情页面  
											"title": "校园通隐私政策" // 协议名称  
										}
									]
								}
							},
							success(res) { // 登录成功
								console.log('===========》', res)
								uni.closeAuthView()
								let form = {
									access_token: res.authResult.access_token,
									openid: res.authResult.openid,
									school_id: that.school.id
								}
								that.$service.P_post('login/loginByOperator', form).then(res => {
									if (res.code == 1) {
										that.jumpLogic(res.data)
									} else {
										if (res.msg) {
											uni.showToast({
												icon: 'none',
												title: res.msg
											})
										} else {
											uni.showToast({
												icon: 'none',
												title: '获取数据失败'
											})
										}
									}
									
								})
							},
							// 当用户点击自定义按钮时，会触发uni.login的fail回调[点击其他登录方式，可以跳转页面]
							// 判断返回数据执行任意逻辑
							fail(res) { // 登录失败
								console.log(res.errCode)
								console.log(res.errMsg)
								uni.closeAuthView()
								uni.hideLoading()
								if (res.code == 30003) {
									uni.navigateBack({
										delta: 1
									})
								}
								if (res.code == "30002") {
									console.log('密码登录');
								} else if (res.code == "30008") {
									console.log('自定义按钮登录方式');
								}
							}
						})
					},
					fail(res) { // 预登录失败
						// 不显示一键登录选项（或置灰）
						// 根据错误信息判断失败原因，如有需要可将错误提交给统计服务器
						uni.hideLoading()
						if (callBack) {
							callBack()
						}
						uni.closeAuthView()
						// uni.navigateTo({
						// 	url: '/pages/Login/Login'
						// })
						console.log('失败', 2222);
						console.log(res.errCode)
						console.log(res.errMsg)
					}
				});
			},
			prompt() {
				uni.showToast({
					icon: 'none',
					title: '请选择学校'
				})
			},
			confirm(e) {
				this.school = e.value[0]
				this.show = false
			},
			getColumns() {
				var jkurl = '/login/school'
				console.log('columns')
				that.$service.P_get(jkurl).then(res => {
					console.log('columns', res)
					this.columns = [res.data]
				}).catch(e => {
					console.log('catch', e)
				})
			},
			openMajor() {
				this.show = true
			},
			onGetPhoneNumber(e) {
				var that = this
				if (e.detail.errMsg == "getPhoneNumber:fail user deny") { //用户决绝授权  
				} else { //允许授权  
					console.log(e)
					//e.detail.encryptedData      //加密的用户信息  
					//e.detail.iv     //加密算法的初始向量  时要用到  
					// uni.setStorageSync('res_code', res_login.code);
					var datas = {
						code: e.detail.code
					}
					var jkurl = 'login/getPhone'

					that.$service.P_post(jkurl, datas).then(res => {
						that.btnkg = 0
						console.log(res)
						if (res.code == 1) {
							that.htmlReset = 0
							var datas = res.data
							console.log(typeof datas)

							// if (typeof datas == 'string') {
							// 	datas = JSON.parse(datas)
							// }
							var datas = JSON.stringify(datas)
							console.log(res)
							// uni.showModal({
							// 	title:e.detail.code,
							// 	content:datas
							// })
							// return
							that.getdata(datas)
						} else {
							if (res.msg) {
								uni.showToast({
									icon: 'none',
									title: res.msg
								})
							} else {
								uni.showToast({
									icon: 'none',
									title: '获取数据失败'
								})
							}
						}
					}).catch(e => {
						that.htmlReset = 1
						that.btnkg = 0
						// that.$refs.htmlLoading.htmlReset_fuc(1)
						console.log(e)
						uni.showToast({
							icon: 'none',
							title: '获取数据失败，请检查您的网络连接'
						})
					})
				}
			},
			login_fuc() {
				// /pages/index/index
				// console.log(that.$service.VER)
				// return
				if (that.$service.VER == 0) {
					uni.setStorageSync('identity', 0)
					uni.switchTab({
						url: '/pages/index/index'
					})
					return

				} else {

					that.getdata('18300000000')
				}

			},
			login_fuc1() {
				that.getdata('15536043014')
				return
				uni.setStorageSync('identity', 1)
				uni.reLaunch({
					url: '/pages/tch_index/tch_index'
				})
			},
			appLogin() {
				// #ifdef APP-PLUS
				if(!this.isReadProtocol) {
					uni.showToast({
						icon: 'none',
						title: '请阅读并同意《用户协议》和《隐私政策》'
					})
					return
				}
				if (!this.school.id) {
					uni.showToast({
						icon: 'none',
						title: '请选择学校'
					})
					return
				}
				if(!this.phoneNumber) {
					uni.showToast({
						icon: 'none',
						title: '请填写手机号'
					})
					return
				}
				if(this.loginType === LOGINMETHOD.PASSWORDLOGIN) {
					if(!this.password) {
						uni.showToast({
							icon: 'none',
							title: '请输入密码'
						})
						return
					}
					let form = {
						school_id: this.school.id,
						phone: this.phoneNumber,
						pass: this.password
					}
					that.$service.P_post('login/loginByPassword', form).then(res => {
						if (res.code == 1) {
							that.jumpLogic(res.data)
						} else {
							if (res.msg) {
								uni.showToast({
									icon: 'none',
									title: res.msg
								})
							} else {
								uni.showToast({
									icon: 'none',
									title: '获取数据失败'
								})
							}
						}
					})
				} else if(this.loginType === LOGINMETHOD.CODE) {
					if(!this.code) {
						uni.showToast({
							icon: 'none',
							title: '请输入验证码'
						})
						return
					}
					let form = {
						school_id: this.school.id,
						phone: this.phoneNumber,
						code: this.code
					}
					that.$service.P_post('login/loginByCode', form).then(res => {
						if (res.code == 1) {
							that.jumpLogic(res.data)
						} else {
							if (res.msg) {
								uni.showToast({
									icon: 'none',
									title: res.msg
								})
							} else {
								uni.showToast({
									icon: 'none',
									title: '获取数据失败'
								})
							}
						}
					})
				}
				// #endif
			},
			getdata(tel) {

				// #ifdef MP-WEIXIN
				wx.login({
					success: function(res_login) {
						console.log(res_login)
						uni.setStorageSync('res_code', res_login.code);
						var datas = {
							code: res_login.code,
							type: 1,
							phone: tel,
							school_id: that.school.id
						}
						var jkurl = '/login'

						that.$service.P_post(jkurl, datas).then(res => {
							that.btnkg = 0
							console.log(res)
							if (res.code == 1) {
								that.htmlReset = 0
								var datas = res.data
								console.log('datas', datas)

								if (typeof datas == 'string') {
									datas = JSON.parse(datas)
								}

								that.jumpLogic(datas)

							} else {

								if (res.msg) {
									uni.showToast({
										icon: 'none',
										title: res.msg
									})
								} else {
									uni.showToast({
										icon: 'none',
										title: '获取数据失败'
									})
								}
							}
						}).catch(e => {
							that.htmlReset = 1
							that.btnkg = 0
							// that.$refs.htmlLoading.htmlReset_fuc(1)
							console.log(e)
							uni.showToast({
								icon: 'none',
								title: '获取数据失败，请检查您的网络连接'
							})
						})
					}
				})
				// #endif
			},

			jumpLogic(datas) {
				console.log(datas)
				var identity = datas.identity
				var token = datas.token
				uni.setStorageSync('identity', identity)
				uni.setStorageSync('token', token)
				that.$store.commit('login', datas)
				uni.showToast({
					icon: 'none',
					title: '登陆成功'
				})
				setTimeout(function() {
					// uni.reLaunch({
					// 	url:'/new_tec/homePage/homePage' 
					// })
					// return
					if (identity == 2) {
						uni.reLaunch({
							url: '/pages/tch_index/tch_index'
						})
					} else if (identity == 1) {
						uni.switchTab({
							url: '/pages/index/index'
						})
					} else if (identity == 4) {
						uni.reLaunch({
							url: '/new_tec/homePage/homePage'
						})
					} else {
						uni.reLaunch({
							url: '/pages/admin_index/admin_index'
						})
					}
				}, 1000)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.oneSubmitted {
		position: relative;
	}

	.oneSubmitted-v2 {
		position: relative;
		background-color: #ebf5ff;

		.oneSubmitted-v2-bg {
			position: absolute;
			width: 100%;
		}

		.oneSubmitted-v2-1 {
			text-align: center;
			margin-top: 150rpx;

			.oneSubmitted-v2-1-i {
				height: 240rpx;
				width: 240rpx;
			}
		}

		.oneSubmitted-v2-2 {
			padding: 0 75rpx;

			.oneSubmitted-v2-2-1 {
				display: flex;
				background-color: #FFFFFF;
				height: 102rpx;
				align-items: center;
				border-radius: 300rpx;
				padding: 0 40rpx;
				box-sizing: border-box;
				margin-bottom: 49rpx;

				&:last-child {
					margin-bottom: 0;
				}

				.oneSubmitted-v2-2-1-l {
					flex-grow: 1;
				}

				.oneSubmitted-v2-2-1-i {
					flex-grow: 1;
					font-size: 32rpx;
				}

				.oneSubmitted-v2-2-1-r {
					width: 200rpx;
					display: flex;
					justify-content: flex-end;
					flex-shrink: 0;
				}
			}

			.oneSubmitted-v2-2-c {
				margin-bottom: 30rpx;
				text-align: right;
				padding-right: 20rpx;
				color: #646464;
				font-size: 28rpx;
			}

			.oneSubmitted-v2-2-xy {}

			.oneSubmitted-v2-2-2 {
				height: 90rpx;
				border-radius: 200rpx;
				font-size: 34rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 90rpx;
				margin-top: 60rpx;
				background-color: #2D81FF;
			}

			.oneSubmitted-v2-2-3 {
				font-size: 24rpx;
				margin-top: 26rpx;
				text-align: center;
				color: #323232;
			}
			.oneSubmitted-v2-2-4{
				display: flex;
				justify-content: center;
				margin-top: 40rpx;
				.oneSubmitted-v2-2-4-i{
					width: 88rpx;
					height: 88rpx;
					image{
						height: 100%;
						width: 100%;
					}
				}
			}
		}
	}

	.content-wrap1 {
		min-height: 608rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		justify-content: center;
		align-items: center;
		position: relative;
		margin-top: -200rpx;
		padding-top: 80rpx;
		padding-bottom: 60rpx;
	}

	.content-item {
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.img {
		width: 172rpx;
		height: 172rpx;
		background: #2D81FF;
		border-radius: 32rpx;
	}

	.botm-btn {
		width: 576rpx;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		background: #2D81FF;
		box-shadow: 6rpx 10rpx 30rpx 0rpx rgba(45, 129, 255, 0.2);
		border-radius: 46rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		margin: 28rpx 0 28rpx 0;

	}

	.botm-btn1 {
		margin-top: 40rpx;
	}

	.botm-btn-2 {
		margin-top: 40rpx;
		background-color: #F4F4F4;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 68rpx;
		border-radius: 200rpx;
		font-size: 25rpx;
	}

	.samll-text {
		height: 28rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #545D6E;
	}

	.login_top {
		width: 100%;
	}
</style>