<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>登录界面</title>
<link rel="stylesheet" href="layui/css/layui.css">
<script src="js/jquery-3.3.1.js"></script>
<script src="layui/layui.js"></script>
<style type="text/css">
.layui-layout-login {
width: 350px;
height: 300px;
margin: 10% auto 0 auto;
box-shadow: 2px 1px 10px 10px #eeeeee;
border-radius: 8px;
z-index: 10;
}
</style>
</head>
<body>
<div class="text" style="font-size:50px;font-weight:bold;margin-top:55px;height:10px;text-align:center;">河北金力集团公文流转系统</div>
<form class="layui-form layui-layout layui-layout-login" >
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>用户登录</legend>
</fieldset>
<div class="layui-form-item">
<label class="layui-form-label">账号</label>
<div class="layui-input-inline">
<input id ="account" type="text" name="account" required lay-verify="required" placeholder="请输入账号"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-inline">
<input id="password" type="password" name="password" required lay-verify="required" placeholder="请输入密码"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">角色</label>
<div class="layui-input-inline">
<select id ="type" name="type" lay-verify="required" lay-search="">
<option value="1-系统管理员">系统管理员</option>
<option value="2-厂长">厂长</option>
<option value="3-副厂长-销售部">副厂长-销售部</option>
<option value="4-副厂长-财务部">副厂长-财务部</option>
<option value="5-副厂长-生产部">副厂长-生产部</option>
<option value="6-办公室部长">办公室部长</option>
<option value="7-销售部部长">销售部部长</option>
<option value="8-财务部部长">财务部部长</option>
<option value="9-生产部部长">生产部部长</option>
</select>
</div>
</div>
<br><br><br>
<div class="layui-form-item">
<div class="layui-input-block">
<div class="layui-btn-group">
<button type="button" class="layui-btn" lay-submit lay-filter="formDemo"onclick="fun()" >立即登录</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</div>
</form>
<script>
function fun1() {
//使用$.ajax()发送异步请求
var username = $("#account").val()
var password = $("#password").val();
var type = $("#type").val();
$.ajax({
url: "LoginServlet",
type: "GET",
data: {"account": username, "password": password, "type": type},
success: function (data) {
if (data == 1)
{
alert("登录成功");
window.location.replace("root.jsp");}
else
{ alert("用户名或密码错误或该用户被暂停使用");
window.location.replace("login.jsp");
}
},//响应成功后的回调函数
error: function () {
alert("出错啦...")
},//表示如果请求响应出现错误，会执行的回调函数
dataType: "text"//设置接受到的响应数据的格式
});
}
function fun() {
var username = $("#account").val()
var password = $("#password").val();
if (username !=""&&password !="") {
fun1();
}
}
</script>
</body>
</html>
