@{
ViewBag.Title = "员工登录";
Layout = null;
}
<!DOCTYPE html>
<html lang="en" class="page-fill">
<head>
<meta charset="UTF-8">
<title>员工登录</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
@*<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon" />*@
<link rel="stylesheet" href="/css/oksub.css" />
</head>
<body class="page-fill">
<div class="page-fill" id="login">
<form class="layui-form">
@*<div class="login_face" ><img src="/images/logo.png" style="display:none;" /></div>*@
<div class="layui-form-item input-item" style="margin-top:30px;">
<label for="username">用户名</label>
<input type="text" lay-verify="required" name="username" placeholder="请输入账号" autocomplete="off" id="username" class="layui-input">
</div>
<div class="layui-form-item input-item">
<label for="password">密码</label>
<input type="password" lay-verify="required|PassWord" name="PassWord" placeholder="请输入密码" autocomplete="off" id="password" class="layui-input">
</div>
<div class="layui-form-item">
<button class="layui-btn layui-block" lay-filter="login" lay-submit="">登录</button>
</div>
</form>
</div>
<!--js逻辑-->
<script src="/lib/layui/layui.js"></script>
<script>
layui.use(["form", "okGVerify", "okUtils", "okLayer"], function () {
let form = layui.form;
let $ = layui.jquery;
let okGVerify = layui.okGVerify;
let okUtils = layui.okUtils;
let okLayer = layui.okLayer;
/**
* 数据校验
*/
form.verify({
password: [/^[\S]{6}$/, "密码必须6，且不能出现空格"],
captcha: function (val) {
if (verifyCode.validate(val) != "true") {
return verifyCode.validate(val)
}
}
});
/**
* 表单提交
*/
form.on("submit(login)", function (data) {
okUtils.ajax("/Home/Login", "post", data.field, true).done(function (response) {
okLayer.greenTickMsg(response.msg, function () {
window.location = "/home/index";
})
}).fail(function (error) {
console.log(error)
});
return false;
});
/**
* 表单input组件单击时
*/
$("#login .input-item .layui-input").click(function (e) {
e.stopPropagation();
$(this).addClass("layui-input-focus").find(".layui-input").focus();
});
/**
* 表单input组件获取焦点时
*/
$("#login .layui-form-item .layui-input").focus(function () {
$(this).parent().addClass("layui-input-focus");
});
/**
* 表单input组件失去焦点时
*/
$("#login .layui-form-item .layui-input").blur(function () {
$(this).parent().removeClass("layui-input-focus");
if ($(this).val() != "") {
$(this).parent().addClass("layui-input-active");
} else {
$(this).parent().removeClass("layui-input-active");
}
})
});</script>
</body>
</html>
后端代码：
/// <summary>
/// 登录验证
/// </summary>
/// <param name="_user"></param>
/// <returns></returns>
[HttpPost]
public string Login(SysUser _user)
{
YuanGongDb dbcontext = new YuanGongDb();
var username = _user.username;
var password = _user.PassWord;
ResponseData res = new ResponseData();//返回的数据格式code,msg
var userdata = dbcontext.SysUser.Where(o => o.username == username && o.PassWord == password).FirstOrDefault();
if (userdata != null)
{
Session["UID"] = userdata.id;
Session["RID"] = userdata.RID;
Session["Realname"] = userdata.Realname;
res.code = 0;
res.msg = "登录成功了";
var data = JsonConvert.SerializeObject(res);
return data;
}
else
{
res.code = 1;
res.msg = "用户名或密码错误";
var data = JsonConvert.SerializeObject(res);
return data;
}
}