<!DOCTYPE html>
|
<html>
|
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport"
|
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
<title>后台登录</title>
|
<link rel="stylesheet" type="text/css" href="layui/css/layui.css" />
|
<link rel="stylesheet" type="text/css" href="css/login.css" />
|
</head>
|
|
<body>
|
<div class="m-login-bg">
|
<div class="m-login">
|
<h3>XCP后台系统登录</h3>
|
<div class="m-login-warp">
|
<form class="layui-form">
|
<div class="layui-form-item">
|
<input type="text" name="username" required lay-verify="required" placeholder="用户名"
|
autocomplete="off" class="layui-input">
|
</div>
|
<div class="layui-form-item">
|
<input type="password" name="password" required lay-verify="required" placeholder="密码"
|
autocomplete="off" class="layui-input">
|
</div>
|
<div class="layui-form-item">
|
<div class="layui-inline">
|
<input type="text" name="code" required lay-verify="required" placeholder="验证码"
|
autocomplete="off" class="layui-input">
|
</div>
|
<div class="layui-inline">
|
<img class="verifyImg" onclick="this.src=this.src+'?c='+Math.random();"
|
src="/admin/api/captcha.jpg" />
|
</div>
|
</div>
|
<div class="layui-form-item m-login-btn">
|
<div class="layui-inline">
|
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="login">登录</button>
|
</div>
|
<div class="layui-inline">
|
<button type="reset" class="layui-btn layui-btn-primary">取消</button>
|
</div>
|
</div>
|
</form>
|
</div>
|
|
</div>
|
</div>
|
<script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
|
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
|
<script>
|
layui.use(['form', 'layedit', 'laydate'], function() {
|
var form = layui.form,
|
layer = layui.layer,
|
$ = layui.jquery;
|
|
|
//自定义验证规则
|
form.verify({
|
title: function(value) {
|
if (value.length < 5) {
|
return '标题至少得5个字符啊';
|
}
|
},
|
password: [/(.+){6,12}$/, '密码必须6到12位'],
|
verity: [/(.+){6}$/, '验证码必须是6位'],
|
|
});
|
|
|
//监听提交
|
form.on('submit(login)', function(data) {
|
try {
|
var index = layer.load(1);
|
$.post("/admin/api/login", data.field, function(response) {
|
layer.close(index);
|
if (response.code == 0) {
|
window.location.href = "index.html";
|
} else {
|
layer.msg(response.msg);
|
}
|
}, 'json').fail(function(jqXHR, textStatus, errorThrown) {
|
layer.close(index);
|
layer.msg("网络请求失败");
|
});
|
|
} catch (e) {
|
console.log(e);
|
}
|
|
return false;
|
});
|
|
});
|
</script>
|
</body>
|
|
</html>
|
