<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>热点key探测</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="description" content="热点Key探测">
	<!--样式 -->
	<script type="text/javascript" th:src="@{/static/admin/assets/js/jquery.min.js}"></script>
	<link rel="stylesheet" th:href="@{/static/admin/assets/css/loader-style.css}">
	<link rel="stylesheet" th:href="@{/static/admin/assets/css/bootstrap.css}">
	<link rel="stylesheet" th:href="@{/static/admin/assets/css/signin.css}">
	<!--icons -->
    <link rel="icon" th:href="@{/static/admin/images/jd.ico}" type="image/x-icon">
    <style type="text/css">

.slidercaptcha canvas:first-child {
	border-radius: 4px;
	border: 1px solid #e6e8eb;
}

    </style>
</head>
<body>

<div id="preloader">
	<div id="divstatus">
		&nbsp;
	</div>
</div>
<div class="container">
	<div class="" id="login-wrapper" style="margin-top: 20%">
		<div class="row">
			<div class="col-md-4 col-md-offset-4">
				<div id="logo-login">
					<h1>热点key探测
					<span>v1</span>
					</h1>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="col-md-4 col-md-offset-4">
				<div class="account-box">
					<!--<form role="form"  method="post" id="loginForm">-->
					<form role="form"  method="post" id="loginf">
						<div class="form-group">
							<a href="#" class="pull-right label-forgot">忘记账号?</a>
							<label>账号</label>
							<input type="text" placeholder="请输入账号"  name="userName" id="loginname"  class="form-control">
						</div>
						<div class="form-group">
							<a href="#" class="pull-right label-forgot">忘记密码?</a>
							<label>密码</label>
							<input type="password" placeholder="请输入密码" name="pwd" id="password"  class="form-control">
						</div>

						<button class="btn btn btn-primary pull-right" onclick="sub()" type="submit">登录</button>
					</form>

					<div class="row-block">
						<div class="row">
						<!--	<div class="col-md-12 row-block">
							&lt;!&ndash;	<a href="index-2.html" class="btn btn-primary btn-block" style="margin-top: 11px">新建账号</a>&ndash;&gt;
								<a href="#" class="btn btn-primary btn-block" style="margin-top: 11px">新建账号</a>
							</div>-->
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div id="test1" class="">
</div>




<!-- 页面预加载插件 -->
<script type="text/javascript" th:src="@{/static/admin/assets/js/preloader.js}"></script>
<!-- bootstarp -->
<script type="text/javascript" th:src="@{/static/admin/assets/js/bootstrap.js}"></script>
<script type="text/javascript" th:src="@{/static/admin/assets/js/app.js}"></script>
<script type="text/javascript" th:src="@{/static/admin/assets/js/load.js}"></script>
<!-- 弹窗 -->
<script  th:src="@{/static/admin/assets/js/layer/layer.js}" type="text/javascript"></script>
<script th:src="@{/static/admin/assets/js/bootstrap/js/base_list.js}" type="text/javascript"></script>
<!-- jquery-validate 表单验证插件 -->
<script type="text/javascript" th:src="@{/static/admin/assets/js/validate/jquery.validate.min.js}"></script>
<script type="text/javascript" th:src="@{/static/admin/assets/js/validate/messages_zh.min.js}"></script>
<script type="text/javascript" th:src="@{/static/admin/assets/js/validate/jquery.validate.extend.js}"></script>
<script type="text/javascript" th:inline="javascript">
var isRoll=false;
$(document).ready(function(){
	(function(window,document){
		window.v2={
			version:"3.2",
			init:function(){
				this.loginSubmit();
				this.showdd();
			},
			showdd:function(){
				var timer;
				var current = 0;
				var fhi = 1;
				var current2 = 1;
				var showfh=function(){
					fhi = 1;
					timer = setInterval(xzfh2, 10);
				};
				var xzfh=function(){
					current = (current)%360;
					document.body.style.transform = 'rotate('+current+'deg)';
					current ++;
					if(current>360){current = 0;}
				};
				var xzfh2=function(){
					if(fhi>50){
						document.body.style.transform = '';
						clearInterval(timer);
						return;
					}
					current = (current2)%360;
					document.body.style.transform = 'rotate('+current+'deg)';
					current ++;
					if(current2 == 1){current2 = -1;}else{current2 = 1;}
					fhi++;
				};
				return {
					init:function(){
						showfh();
					}
				};
			},

		};

	})(window,document);
})

function sub(){
	$("#loginf").validate({
		rules:{
			userName:{
				required:true,
				minlength: 1,
				maxlength: 20,
			},
			pwd:{
				required:true,
				minlength: 1,
				maxlength: 20,
			}
		},
		submitHandler:function(form){
			if(isRoll){
				$('#myModal').modal('show');
			}else{
				var user=$("#loginf").serialize();
				$.ajax({
					cache : false,
					type : "POST",
					url :  "/user/login",
					data : user,
					async : false,
					dataType : "json",
					error : function(XMLHttpRequest){
						$.modal.alertError(XMLHttpRequest.responseJSON.msg);
					},
					success : function(result) {
						if(result.code==200){
							let token = result.data.token;
							// result.getco
							window.localStorage.setItem('token', token);
							window.localStorage.setItem('time', Date.now());
							location.href = '/user/index?text='+result.data.info;
						}else{
							v2.showdd().init();
							layer.msg(result.msg, function(){
								//关闭后的操作
							});
						}
					}
				});
			}
		}
	});
}

</script>

</body>
</html>