<!DOCTYPE html>
|
<html lang="zh-CN">
|
|
<head>
|
<meta charset="utf-8">
|
<title>自动仓储 - 管理系统</title>
|
<link rel="icon" type="image/x-icon" href="../static/image/log.png" />
|
<link rel="stylesheet" href="../static/layui/css/layui.css" media="all">
|
<link rel="stylesheet" href="../static/css/login0.css">
|
</head>
|
|
<body>
|
<div class="dowebok">
|
<div class="container">
|
<div class="left">
|
<div class="login">登录</div>
|
<div class="eula">欢迎光临,请输入您的电子邮箱和密码以登录!</div>
|
</div>
|
<div class="right">
|
<svg viewBox="0 0 320 300">
|
<defs>
|
<linearGradient inkscape:collect="always" id="linearGradient" x1="13" y1="193.49992" x2="307"
|
y2="193.49992" gradientUnits="userSpaceOnUse">
|
<stop style="stop-color:#ff00ff;" offset="0" id="stop876" />
|
<stop style="stop-color:#ff0000;" offset="1" id="stop878" />
|
</linearGradient>
|
</defs>
|
<path d="m 40,120.00016 239.99984,-3.2e-4 c 0,0 24.99263,0.79932 25.00016,35.00016 0.008,34.20084 -25.00016,35 -25.00016,35 h -239.99984 c 0,-0.0205 -25,4.01348 -25,38.5 0,34.48652 25,38.5 25,38.5 h 215 c 0,0 20,-0.99604 20,-25 0,-24.00396 -20,-25 -20,-25 h -190 c 0,0 -20,1.71033 -20,25 0,24.00396 20,25 20,25 h 168.57143" />
|
</svg>
|
<div class="form">
|
<!-- <input type="password" style="position: absolute; z-index: -1">-->
|
<label for="username">电子邮件</label>
|
<input type="text" id="username">
|
<label for="password">密码</label>
|
<input type="password" id="password">
|
<input type="submit" id="submit" onclick="login()" value="登陆">
|
</div>
|
</div>
|
</div>
|
</div>
|
<script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
|
<script type="text/javascript" src="../static/js/tools/anime.min.js"></script>
|
<script type="text/javascript" src="../static/js/tools/md5.js"></script>
|
<script type="text/javascript" src="../static/layui/layui.js"></script>
|
<script type="text/javascript" src="../static/js/common.js"></script>
|
<script type="text/javascript">
|
|
$(function () {
|
var oldUserName = localStorage.getItem('oldUserName');
|
var oldPass = localStorage.getItem('oldPass');
|
if(oldUserName){
|
$('#mobile').val(oldUserName);
|
}
|
if(oldPass){
|
$('#password').val(oldPass);
|
}
|
})
|
|
// 验证码开关
|
var codeSwitch = 'Y';
|
$.ajax({
|
url: baseUrl+"/code/switch.action",
|
async: false,
|
success: function (res) {
|
if (res.data === 'N'){
|
codeSwitch = res.data;
|
$('#code-box').css("display", "none");
|
}
|
}
|
});
|
|
// 初始化验证码
|
initCode();
|
$('#codeImg').click(function () {
|
initCode();
|
});
|
function initCode() {
|
var random = Math.random();
|
$('#codeImg').attr("src", baseUrl+"/code.action?sd="+random);
|
setTimeout(function () {
|
$.ajax({
|
url: baseUrl+"/code.do",
|
data: {sd: random},
|
method: 'POST',
|
async: false,
|
success: function (code) {
|
sessionStorage.setItem("code", code);
|
}
|
});
|
}, 100);
|
}
|
|
function login() {
|
var username = $("#username").val();
|
if (username === "") {
|
layer.msg("请输入账号", {offset: '150px'});
|
return;
|
}
|
var password = $("#password").val();
|
if (password === "") {
|
layer.msg("请输入密码", {offset: '150px'});
|
return;
|
}
|
var user = {
|
username: username,
|
password: hex_md5(password)
|
};
|
$.ajax({
|
url: baseUrl+"/login.action",
|
data: user,
|
method: 'POST',
|
success: function (res) {
|
if (res.code === 200){
|
// 记住密码
|
if($('#rememberPwd').is(':checked')){
|
localStorage.setItem('oldUserName',user.username);
|
localStorage.setItem('oldPass',password);
|
} else {
|
localStorage.removeItem('oldUserName');
|
localStorage.removeItem('oldPass');
|
}
|
localStorage.setItem("token", res.data.token);
|
localStorage.setItem("username", res.data.nickname);
|
window.location.href = "index.html";
|
} else {
|
layer.msg(res.msg, {offset: '150px'});
|
}
|
}
|
});
|
}
|
|
layui.use(['form','layer'],function () {
|
var form = layui.form,
|
layer = layui.layer,
|
$ = layui.jquery;
|
|
form.on('submit(login)', function (data) {
|
|
return false;
|
});
|
|
$('body').keydown(function () {
|
if (event.keyCode === 13) {
|
$("#login-button").click();
|
}
|
});
|
|
});
|
</script>
|
<script>
|
var current = null;
|
document.querySelector('#username').addEventListener('focus', function(e) {
|
if (current) current.pause();
|
current = anime({
|
targets: 'path',
|
strokeDashoffset: {
|
value: 0,
|
duration: 700,
|
easing: 'easeOutQuart'
|
},
|
strokeDasharray: {
|
value: '240 1386',
|
duration: 700,
|
easing: 'easeOutQuart'
|
}
|
});
|
});
|
document.querySelector('#password').addEventListener('focus', function(e) {
|
if (current) current.pause();
|
current = anime({
|
targets: 'path',
|
strokeDashoffset: {
|
value: -336,
|
duration: 700,
|
easing: 'easeOutQuart'
|
},
|
strokeDasharray: {
|
value: '240 1386',
|
duration: 700,
|
easing: 'easeOutQuart'
|
}
|
});
|
});
|
document.querySelector('#submit').addEventListener('focus', function(e) {
|
if (current) current.pause();
|
current = anime({
|
targets: 'path',
|
strokeDashoffset: {
|
value: -730,
|
duration: 700,
|
easing: 'easeOutQuart'
|
},
|
strokeDasharray: {
|
value: '530 1386',
|
duration: 700,
|
easing: 'easeOutQuart'
|
}
|
});
|
});
|
|
</script>
|
</body>
|
|
</html>
|