<!doctype html>
<html lang="zh">
<head>
	<link rel="stylesheet" type="text/css" href="../static/css/normalize.css" />
	<link rel="stylesheet" type="text/css" href="../static/css/htmleaf-demo.css">
	<link rel="stylesheet" type="text/css" href="../static/css/login_styles.css">
	<link  rel="shortcut icon" href="/static/img/favicon.ico">
</head>
<script src="/static/js/jquery-1.11.2.min.js"></script>
<script src="/static/js/layer.js"></script>
<script src="/static/js/jquery.gradientify.js"></script>
<body>
	<div class="htmleaf-container">

		<div class="login-wrap in-center">
			<div class="login-html ">
				<input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">登录</label>
				<input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">注册</label>
				<div class="login-form">
					<div class="sign-in-htm">
						<div class="group">
							<label for="user" class="label">账号</label>
							<input id="user" type="text" class="input">
						</div>
						<div class="group">
							<label for="pass" class="label">密码</label>
							<input id="pass" type="password" class="input" data-type="password">
						</div>
					
						<div class="group">
							<br>
							<input type="submit" id="login" class="button" value="登录">
						</div>
						<div class="hr"></div>
						<div class="foot-lnk">
							<a href="/" style="color: #6b708d">欢迎使用XXX学校学生考勤系统</a>
						</div>
					</div>
					<div class="sign-up-htm">
						<div class="group">
							<label for="user" class="label">账号(学号)</label>
							<input id="reg_user" type="text" class="input">
						</div>
						<div class="group">
							<label for="pass" class="label">密码</label>
							<input id="reg_pass" type="password" class="input" data-type="password">
						</div>
						<div class="group">
							<label for="pass" class="label">手机号</label>
							<input id="reg_iphone" type="text" class="input">
						</div>
						<div class="radio">
							<input id="r1" type="radio" class = "radio1" name="radio" value="2" checked>
							<label for="r1" class="stu-radio">学生</label>
							<input id="r2" type="radio" class = "radio2" name="radio" value="1" >
							<label for="r2" class="tch-radio">老师</label>
						</div>
						<div class="group">
							<br>
							<input type="submit" class="reg_button" id="reg" value="注册">
						</div>
						<div class="reg-hr"></div>
							<div class="foot-lnk">
							<a href="/" style="color: #6b708d">欢迎使用XXX学校学生考勤系统</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
</body>
</html>
<script>
	$(document).ready(function() {
		$("body").gradientify({
			gradients: [
				{ start: [255,236,210], stop: [252,182,159] },
				{ start: [238,162,162], stop: [122,197,216] },
				{ start: [159,172,230], stop: [116,235,213] },
				{ start: [101,153,153], stop: [244,121,31]  },
				{ start: [247,183,51] , stop: [255,94,98]   },
				{ start: [255,94,98]  , stop: [225,238,195] }

			],
			transition_time:3
		});
	});

	$("#login").click(function(){
		let user = $("#user").val();
		let pass = $("#pass").val();
		if (!user){
			return layer.msg('请输入账号');
		}
		if(!pass){
			return layer.msg('请输入密码');
		}
		$.ajax({
			url:'/user/login',
			data:JSON.stringify({
				userAccount:user,
				userPw: pass,
			}),
			type:"post",
			contentType:"application/json",
			success:function(data){
				if(data == 'true'){
					layer.msg('操作成功~');
					setTimeout(function(){
						window.location.href = "/index/systemIndex";
					},1000)
				}else if(data == 'true-admin'){
					layer.msg('操作成功~');
					setTimeout(function(){
						window.location.href = "/index/userIndex";
					},1000)
				}else if(data == 'false-account'){
					layer.msg('用户名错误~');
				}else if(data == 'false-pw'){
					layer.msg('密码错误~');
				}else{
					layer.msg('错误~');
				}

			}
		})

	})

	$("#reg").click(function(){

		let user = $("#reg_user").val();
		let pass = $("#reg_pass").val();
		let iphone = $("#reg_iphone").val();
		let lv = $("input[name = 'radio']:checked").val();
		let reg = /^[0-9]{11}$/;

		if (!user){
			return layer.msg('请输入账号');
		}
		if(!pass){
			return layer.msg('请输入密码');
		}
		if (pass.length>30){
			return layer.msg('密码过长');
		}
		if((!reg.test(iphone))&&iphone!=""){
			return layer.msg('请输入正确手机号');
		}
		$.ajax({
			url:'/user/userRegister',
			data:JSON.stringify({
				userAccount:user,
				userPw: pass,
				iphone:iphone,
				userLv:lv
			}),
			type:"post",
			contentType:"application/json",
			success:function(data){
				if(data == 'true'){
					layer.msg('操作成功~');
					setTimeout(function(){
						window.location.href = "/";
					},1000)
				}else if(data == 'false-has-double'){
					layer.msg('重名~');
				}else{
					layer.msg('操作失败~');
				}

			}
		})

	})

</script>