钟表维修管理系统技术解析(二) 登陆验证

钟表维修管理系统技术解析(二) 登陆验证

登陆功能，通过输入账号，和密码,加上验证码防止用户频繁刷新登陆;因为密码要进行安全性管理，用MD5加密技术，把密码转换成32位字符，通过账号和处理后的密码对数据库进行查询，是否存在该用户，或者是否输入正确的密码；



2.1（图1）

登陆界面用到的控件有：

控件名称	说明
文本控件（easyui-textbox）	第一要设置每个控件的id，第二设置大小不设置也有默认，第三（data-options）是数据操作:可以设置控件的一些属性和事件
按钮（easyui-linkbutton）
图片显示标签（img）

登陆功能的实现：

第一步：数据库

2.1图(2)

表1：员工表（sys_YuanGong）

列名	数据类型	主键/外键	说明
YuanGongID	int	主键	员工ID
LuRuYuanID	int	外键	录入员ID
YuanGongZhuangTaiID	int	外键	员工状态ID
MenDianID	int	外键	门店ID
ZhiWuID	Int	外键	职务
JueSeID	int	外键	角色ID
YuanGongBianHao	nchar(50)		员工编号
YuanGongXingMing	nchar(50)		员工姓名
XingBie	nchar(50)		性别
JiGuan	nchar(50)		籍贯
XueLi	nchar(50)		学历
ChuShengRiQi	date		出生日期
ShenFenZhengHao	nchar(18)		身份证号
RuZhiRiQi	data		入职日期
RuZhiDiDian	nchar(50)		入职地点
YiDongShouJi	int		移动手机
JiaTingDianHua	nchar(50)		家庭电话
DiXin	decimal(18, 2)		底薪
JiShiFou	bit		技术否
HunFou	bit		婚否
TongXunDiZhi	nchar(50)		通讯地址
BeiZhu	nchar(50)		备注
MiMa	nchar(50)		密码

表2：门店表（sys_MenDian）

列名	数据类型	主外键	说明
MenDianID	int	主键	门店ID
LuRuYuanID	int	外键	录入员ID
ChengShi	nchar(50)		城市
MenDianBianHao	nchar(50)		门店编号
GongZuoZhanMingCheng	nchar(50)		门店名称
LianXiDianHua	nchar(50)		联系电话
ChuanZhenDianHua	nchar(50)		传真号码
YouZhengBianMa	nchar(50)		邮政编码
DianNaoXiTong	nchar(50)		电脑系统
KuanDaiYongHu	nchar(50)		宽带账号
KuanDaiMiMa	nchar(50)		宽带密码
XiangXiDiZhi	nchar(50)		详细地址
BeiZhu	nchar(500)		备注
BaoXiuZhengCi	text		保修政策
JianLiShiJian	date		建立时间
YouXiaoFou	bit		有效否
ZongGongSi	int		总公司（1为true，0为false）

表3：角色表（sys_JueSe）

列名	数据类型	主键/外键	说明
JueSeID	int	主键	角色ID
LuRuYuanID	int	外键	录入员ID
BuMenID	int	外键	部门ID
JueSeMingCheng	nchar(10)		角色名称
YouXiaoFou	Bit		有效否

表4：部门表（sys_BuMen）

列名	数据类型	主键/外键	说明
BuMenID	int	主键	部门ID
LuRuYuanID	int	外键	录入员ID
BuMenMingCheng	Nchar(10)		部门名称ID
BeiZhu	Nchar(10)		备注ID
YouXiaoFou	Bit		有效否

表5：权限表（sys_QuanXian）

列名	数据类型	主键/外键	说明
QuanXianID	int	主键	权限ID
LuRuYuanID	int	外键	录入员ID
QuanXianMingCheng	Nchar(50)		权限名称
YouXiaoFou	bit		有效否

表6：角权表（sys_JueQuan）

列名	数据类型	主键/外键	说明
JueQuanID	int	主键	角权ID
LuRuYuanID	int	外键	录入员ID
JueSeID	int	外键	角色ID
QuanXianID	int	外键	权限ID
YouXiaoFou	Bit		有效否

表7：日志表（sys_UserLoginLog）

列名	数据类型	主键/外键	说明
LoginID	int	主键	日志ID
StaffID	int	外键	员工ID
operationLog	Nchar(50)		操作内容
operationDate	date		操作时间

控件使用方法：

1. 文本框（easyui-textbox）

作用：用于显示，编辑文本
文本框控件截图：



2.1.2 （图3）

创建文本框控件代码：

<input class="phone-input" id="txtUser" style="width:250px;background:#fff;margin-bottom:4%;border:1px solid #ccc;padding:4%;font-size:95%;color:#555;"/>

获取文本控件值的代码：

$("#txtUser").val();

赋值给文本框的代码：

$("#txtUser").textbox('setValue', "");

2、按钮（easyui-linkbutton）
按钮截图



2.1.2 （图4）

创建按钮界面层代码：

<a class="goodButton" onclick="UserLogin()" style="width:276px;height:40px;line-height:40px;">登　　录</a>

jQuery代码定义点击事件的方法：//验证账号和密码

function UserLogin() {
//表单提交方法传值
$.ajax({
type: 'post',
url: '/Main/UserLogin?strValidateCode=' + $("#txtvaliCode").val() + '&' + 'strAccountNumber=' + $("#txtUser").val() + '&' + 'strPassword=' + $("#txtPassword").val(),
success: function (data) {
if (data == "true") {
window.location.href = "/Main/Index";//验证成功登陆到主界面
} else {
MathRandom();
$("#Erro").html(data)
$("#txtvaliCode").val("");
$("#valiCode").attr("src", "/Main/GetValidateCode?RandomNumber=" + Math.random());
}
}
});
}

第二步：控制器(Controllers)

2.1.（图5）

linq语法查询数据

1、登陆验证的函数
/// <summary>
/// 登陆验证
/// </summary>
/// <param name="strValidateCode">验证码</param>
/// <param name="strAccountNumber">账号</param>
/// <param name="strPassword">密码</param>
/// <returns></returns>
public string UserLogin(string strValidateCode, string strAccountNumber, string strPassword)
{
var returnstring = "";
try
{
var MD5Password = SetMD5(strPassword);//通过MD5加密
if (Session["ValidateCode"].ToString() == strValidateCode)//判断输入的验证码是否正确
{
try
{
//通过账号和密码验证是否输入正确的账号和密码
var LoginUser = (from dtUser in myMdl.sys_YuanGong
join dtCompany in myMdl.sys_MenDian on dtUser.MenDianID equals dtCompany.MenDianID
where dtUser.YuanGongBianHao == strAccountNumber && dtUser.MiMa == MD5Password && dtUser.YouXiaoFou == true
select dtUser).Single<Models.sys_YuanGong>();

var intMenDianID = LoginUser.MenDianID; ;
var UserCompany = (from dtUserCompany in myMdl.sys_MenDian
where dtUserCompany.MenDianID == intMenDianID
select dtUserCompany).Single<Models.sys_MenDian>();
Session["YongHuID"] = LoginUser.YuanGongID;//用Session记录用户ID
Session["DengLuRen"] = LoginUser.YuanGongXingMing;//用户名称
Session["RoleID"] = LoginUser.JueSeID;//角色ID
Session["ShopID"] = LoginUser.MenDianID;//门店ID
Session["HeadOfficeIs"] = UserCompany.ZongGongSi;//是否总公司号
//用户票证
FormsAuthenticationTicket ticket = new FormsAuthenticationTicket(
LoginUser.YuanGongID.ToString(),
true,
1000000
);
//缓存
HttpCookie cookie = new HttpCookie(
FormsAuthentication.FormsCookieName,
FormsAuthentication.Encrypt(ticket));
Response.Cookies.Add(cookie);
returnstring = UesrLog("登陆系统", "true", Convert.ToInt32(Session["YongHuID"]));//记录用户登陆日志
}
catch
{
returnstring = "登陆名或密码错误！";
}
}
else
{
returnstring= "验证码错误！";
}
}
catch {
returnstring= "系统出错！请联系管理员！";
}
return returnstring;
}
/// <summary>
/// MD5加密
/// </summary>
/// <param name="strSource">需要加密的字符</param>
/// <returns></returns>
public string SetMD5(string strSource)
{
Return	System.Web.Security.FormsAuthentication.HashPasswordForStoringInConfigFile(strSource, "MD5");
}
/// <summary>
/// 设置登陆日志
/// </summary>
/// <param name="log">操作信息</param>
/// <param name="returnstring">返回值内容</param>
/// <param name="intUesrID">登陆用户ID</param>
/// <returns></returns>
public string UesrLog(string log,string returnstring,int intUesrID)
{
var logstring = "";
Models.sys_UserLoginLog UserLog = new Models.sys_UserLoginLog();
UserLog.StaffID = Convert.ToInt32(intUesrID);//登陆人
UserLog.operationLog = log;//设置日志内容
UserLog.operationDate = DateTime.Now;//设置当前时间
myMdl.sys_UserLoginLog.AddObject(UserLog);
int j = myMdl.SaveChanges();
if (j > 0)//判断是否保存成功
{
logstring = returnstring;
}
return logstring;
}

第三步、视图层（views）

Html代码：

<div style="height:30px"></div>
<input class="phone-input" id="txtUser" style="width:250px;background:#fff;margin-bottom:4%;border:1px solid #ccc;padding:4%;font-size:95%;color:#555;"/><br />
<input type="password" id="txtPassword" style="width:250px;background:#fff;margin-bottom:4%;border:1px solid #ccc;padding:4%;font-size:95%;color:#555;"/><br />
<p>
<input id="txtvaliCode" style="width:150px;height:10px;background:#fff;margin-bottom:1%;border:1px solid #ccc;padding:4%;font-size:95%;color:#555;"/>
<img id="valiCode" style="cursor: pointer;" alt="验证码">
</p>
<a class="goodButton" onclick="UserLogin()" style="width:276px;height:40px;line-height:40px;">登　　录</a>
<br />
<label id="Erro" style=" color:#fff; font-size:15px; font-family:楷体"></label>

jQuery代码：

history.forward();//限制浏览器在登陆界面返回
var Num = "";
$(document).ready(function () {
$("#valiCode").attr("src", "/Main/GetValidateCode?RandomNumber=" + Math.random());//随机生成数字，用于区分验证码
$('#txtUser').keydown(function (e) {
if (e.keyCode == 13) {//键盘回车事件
UserLogin();
}
});
$("#txtPassword").keydown(function (e) {
if (e.keyCode == 13) {
UserLogin();
}
});
$('#txtvaliCode').keydown(function (e) {
if (e.keyCode == 13) {
UserLogin();
}
});

$("#valiCode").bind("click", function () {
MathRandom();
this.src = "/Main/GetValidateCode?RandomNumber=" + Math.random();
});
});
function MathRandom() {
for (var i = 0; i < 6; i++) {
Num += Math.random();
}
}
function UserLogin() {
//表单提交方法传值
$.ajax({
type: 'post',
url: '/Main/UserLogin?strValidateCode=' + $("#txtvaliCode").val() + '&' + 'strAccountNumber=' + $("#txtUser").val() + '&' + 'strPassword=' + $("#txtPassword").val(),
success: function (data) {
if (data == "true") {
window.location.href = "/Main/Index";
} else {
MathRandom();
$("#Erro").html(data)//错误提示
$("#txtvaliCode").val("");//错误时清空文本
$("#valiCode").attr("src", "/Main/GetValidateCode?RandomNumber=" + Math.random());//改变验证码
}
}
});
}

登陆完成进入主界面：



2.1图(6)

仅供学习，禁止用于商业用途