Files
novel-plus/novel-admin/src/main/resources/templates/login.html
2025-07-12 18:05:06 +08:00

129 lines
5.8 KiB
Java
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>后台管理-登录</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/layuimini/lib/layui-v2.5.4/css/layui.css" media="all">
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
html, body {width: 100%;height: 100%;overflow: hidden}
body {background: #009688;}
body:after {content:'';background-repeat:no-repeat;background-size:cover;-webkit-filter:blur(3px);-moz-filter:blur(3px);-o-filter:blur(3px);-ms-filter:blur(3px);filter:blur(3px);position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;}
.layui-container {width: 100%;height: 100%;overflow: hidden}
.admin-login-background {width:360px;height:300px;position:absolute;left:50%;top:40%;margin-left:-180px;margin-top:-100px;}
.logo-title {text-align:center;letter-spacing:2px;padding:14px 0;}
.logo-title h1 {color:#009688;font-size:25px;font-weight:bold;}
.login-form {background-color:#fff;border:1px solid #fff;border-radius:3px;padding:14px 20px;box-shadow:0 0 8px #eeeeee;}
.login-form .layui-form-item {position:relative;}
.login-form .layui-form-item label {position:absolute;left:1px;top:1px;width:38px;line-height:36px;text-align:center;color:#d2d2d2;}
.login-form .layui-form-item input {padding-left:36px;}
.captcha {width:60%;display:inline-block;}
.captcha-img {display:inline-block;width:34%;float:right;}
.captcha-img img {height:34px;border:1px solid #e6e6e6;height:36px;width:100%;}
</style>
</head>
<body>
<div class="layui-container">
<div class="admin-login-background">
<div class="layui-form login-form">
<form id="signupForm" class="layui-form" action="">
<div class="layui-form-item logo-title">
<h1>小说精品屋后台登录</h1>
</div>
<div class="layui-form-item">
<label class="layui-icon layui-icon-username" for="username"></label>
<input type="text" name="username" placeholder="用户名或者邮箱" autocomplete="off" class="layui-input" >
</div>
<div class="layui-form-item">
<label class="layui-icon layui-icon-password" for="password"></label>
<input type="password" name="password" placeholder="密码" autocomplete="off" class="layui-input" >
</div>
<div class="layui-form-item">
<label class="layui-icon layui-icon-vercode" for="captcha"></label>
<input type="text" name="verify" id="verify" placeholder="图形验证码" autocomplete="off" class="layui-input verification captcha">
<div class="captcha-img">
<a href="javascript:void(0);" rel="external nofollow" title="点击更换验证码">
<img id="imgVerify" src="" alt="更换验证码" onclick="getVerify(this);">
</a>
</div>
</div>
<!-- <div class="layui-form-item">
<input type="checkbox" name="rememberMe" value="true" lay-skin="primary" title="记住密码">
</div>-->
<div class="layui-form-item">
<button id="login" class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="login">登 录</button>
</div>
</form>
</div>
</div>
</div>
<script src="/layuimini/lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="/layuimini/lib/layui-v2.5.4/layui.js" charset="utf-8"></script>
<script src="/layuimini/lib/jq-module/jquery.particleground.min.js" charset="utf-8"></script>
<script type="text/javascript">
$("#imgVerify").click()
layui.use(['form'], function () {
var form = layui.form,
layer = layui.layer;
// 登录过期的时候跳出ifram框架
if (top.location != self.location) top.location = self.location;
// 粒子线条背景
$(document).ready(function(){
$('.layui-container').particleground({
dotColor:'#5cbdaa',
lineColor:'#5cbdaa'
});
});
// 进行登录操作
form.on('submit(login)', function (data) {
data = data.field;
if (data.username == '') {
layer.msg('用户名不能为空');
return false;
}
if (data.password == '') {
layer.msg('密码不能为空');
return false;
}
if (data.verify == '') {
layer.msg('验证码不能为空');
return false;
}
$.ajax({
type: "POST",
url: "/login",
data: $('#signupForm').serialize(),
success: function (r) {
if (r.code == 0) {
parent.location.href = '/index';
} else {
layer.msg(r.msg);
}
},
});
return false;
});
});
//获取验证码
function getVerify(obj) {
obj.src = "/getVerify?" + Math.random();
console.log(obj)
}
</script>
</body>
</html>