297 lines
8.8 KiB
HTML
297 lines
8.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
<meta http-equiv="Pragma" content="no-cache">
|
|
<meta http-equiv="Cache-Control" content="no-cache">
|
|
<meta http-equiv="Expires" content="0">
|
|
<title>登录</title>
|
|
<link href="css/login.css" type="text/css" rel="stylesheet">
|
|
<link rel="stylesheet" type="text/css" media="screen" href="layui/css/layui.css">
|
|
</head>
|
|
<body>
|
|
|
|
<div class="login" style="margin-left: 48%;">
|
|
<div class="message">后台管理系统</div>
|
|
<div class="message" style="color: red;width: 500px;margin-left: -10%;">涉密不上网，上网不涉密</div>
|
|
<div id="darkbannerwrap"></div>
|
|
<div id="loginDiv">
|
|
<div id="login-form" >
|
|
<div style="overflow: hidden;width: 100%;">
|
|
<img id="nameImg" src="img/login/我的.png" style="float: left;display: inline-block;margin-top: 3%;margin-right: 2%;">
|
|
<input id="username" name="username" placeholder="手机号" type="text" style="float: left;display: inline-block"
|
|
autocomplete="off">
|
|
<!-- <hr class="hr15">-->
|
|
</div>
|
|
<hr class="hr15">
|
|
<div style="overflow: hidden;width: 100%;">
|
|
<img id="passwordImg" src="img/login/密码.png" style="float: left;display: inline-block;margin-top: 3%;margin-right: 2%;">
|
|
<input id="pwd" name="password" placeholder="密码" type="password" style="float: left;display: inline-block"
|
|
autocomplete="off">
|
|
</div>
|
|
<hr class="hr15">
|
|
<div style="overflow: hidden;width: 100%;">
|
|
<img id="vCodeImg" src="img/login/验证码.png" style="float: left;display: inline-block;margin-top: 3%;margin-right: 2%;">
|
|
<input type="text" class="form-control" name="verifyCode" id="verifyCode" required="required" placeholder="验证码">
|
|
<input id="uuid" type="hidden" name="uuid" />
|
|
<img id="vCode" title="看不清，请点我" onclick="getVerifyCode()" onmouseover="mouseover(this)" style="margin-left: 9.5%" />
|
|
</div>
|
|
<hr class="hr15">
|
|
<button style="width: 92%;height: 37px;margin-left: 8%;" type="submit"
|
|
onclick="login(this);"></button>
|
|
<hr class="hr20">
|
|
<span id="info" style="color: red"></span>
|
|
</div>
|
|
<a style="margin-left: 8%;color: #3A96C6;font-weight: 600;display: none;" onclick="forgetPwd()">忘记密码</a>
|
|
<a style="margin-left: 60%;color: #3A96C6;font-weight: 600;display: none;" id="addAccount">注册账户</a>
|
|
<img id="qrCode" style="display: none;" src="img/login/QRcode2.png"/>
|
|
</div>
|
|
<div id="qrCodeDiv" >
|
|
<div id="qrCodeImg" onclick="killQrCode()"></div>
|
|
<div id="qrCodeTips">请使用实名制APP或微信小程序扫码登陆<br/>点击二维码刷新</div>
|
|
<div id="qrCodeBtn">
|
|
<button id="goBack">返 回</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
<script src="js/libs/jquery-3.7.1.min.js"></script>
|
|
<script type="text/javascript" src="layui/layui.js"></script>
|
|
<script src="js/qrcode.js"></script>
|
|
<script src="js/my/aes.js"></script>
|
|
<script src="js/publicJs.js"></script>
|
|
<script type="text/javascript">
|
|
layui.use('layer', function(){
|
|
var layer = layui.layer;
|
|
getVerifyCode();
|
|
});
|
|
|
|
window.login(function () {
|
|
$("#info").html('');
|
|
})
|
|
if (top != self) {
|
|
parent.location.href = ctxPath + '/login.html';
|
|
}
|
|
var interval;
|
|
var token = localStorage.getItem("token");
|
|
if (token != null && token.trim().length != 0) {
|
|
$.ajax({
|
|
type : 'post',
|
|
url : ctxPath + '/users/current',
|
|
headers: {
|
|
"token": token
|
|
},
|
|
success : function(data) {
|
|
window.location.href=contentPath+"/index.html";
|
|
},
|
|
error : function(xhr, textStatus, errorThrown) {
|
|
var msg = xhr.responseText;
|
|
var response = JSON.parse(msg);
|
|
var code = response.code;
|
|
var message = response.message;
|
|
if (code == 401) {
|
|
localStorage.removeItem("token");
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
$("#qrCode").mouseover(function (e) {
|
|
$(this).attr("src", "img/login/QRcode1.png");
|
|
});
|
|
|
|
$("#qrCode").mouseout(function (e) {
|
|
$(this).attr("src", "img/login/QRcode2.png");
|
|
});
|
|
|
|
$("#qrCode").click(function (e) {
|
|
$("#qrCodeDiv").css("display", "block");
|
|
$("#loginDiv").css("display", "none");
|
|
//生成二维码
|
|
createQrCode();
|
|
interval = window.setInterval(function() {
|
|
codeThread();
|
|
},10000);
|
|
});
|
|
$("#goBack").click(function (e) {
|
|
$("#qrCodeDiv").css("display", "none");
|
|
$("#loginDiv").css("display", "block");
|
|
});
|
|
|
|
//获取验证码
|
|
function getVerifyCode() {
|
|
var url = ctxPath+"/getCode/vCode?" + Math.random();
|
|
$.ajax({
|
|
//请求方式
|
|
type : "GET",
|
|
//请求的媒体类型
|
|
//contentType: "application/json;charset=UTF-8",
|
|
//请求地址
|
|
url : url,
|
|
//请求成功
|
|
success : function(result) {
|
|
console.log(result);
|
|
$("#uuid").val(result.uuid);
|
|
$("#vCode").attr("src","data:image/png;base64," + result.img);
|
|
},
|
|
//请求失败，包含具体的错误信息
|
|
error : function(e){
|
|
console.log(e.status);
|
|
console.log(e.responseText);
|
|
}
|
|
});
|
|
}
|
|
|
|
function mouseover(obj) {
|
|
obj.style.cursor = "pointer";
|
|
}
|
|
|
|
|
|
function login(obj) {
|
|
$(obj).attr("disabled", true);
|
|
var username = $.trim($('#username').val());
|
|
var password = $.trim($('#pwd').val());
|
|
var verifyCode = $.trim($('#verifyCode').val());
|
|
var uuid = $.trim($('#uuid').val());
|
|
if (username == "" || password == "") {
|
|
$("#info").html('用户名或者密码不能为空');
|
|
$(obj).attr("disabled", false);
|
|
} else {
|
|
$.ajax({
|
|
type : 'post',
|
|
url : ctxPath + '/login',
|
|
data : {
|
|
username:encryptCBC(username),
|
|
password:encryptCBC(password),
|
|
verifyCode:verifyCode,
|
|
uuid:uuid
|
|
},
|
|
success : function(data) {
|
|
localStorage.setItem("usernameLogin", username);
|
|
localStorage.setItem("token", data.token);
|
|
localStorage.setItem("roleIdLogin", data.roleId);
|
|
//以前密码复杂度校验
|
|
let pattern = /^(?![0-9]+$)(?![0-9\W]+$)(?![0-9A-Z]+$)(?![0-9a-z]+$)(?![a-z\W]+$)(?![A-Z\W]+$)[0-9A-Za-z\W]{8,16}$/;
|
|
if(!pattern.test(password)) {
|
|
parent.layer.msg('密码过于简单,请尽快修改密码', {icon: 2, time: 3000,area: ['350px', '70px']},function () {
|
|
window.location.href=contentPath+"/index.html";
|
|
});
|
|
}else{
|
|
window.location.href=contentPath+"/index.html";
|
|
}
|
|
},
|
|
error : function(xhr, textStatus, errorThrown) {
|
|
var msg = xhr.responseText;
|
|
var response = JSON.parse(msg);
|
|
$("#info").html(response.message);
|
|
getVerifyCode();
|
|
$(obj).attr("disabled", false);
|
|
}
|
|
});
|
|
|
|
}
|
|
}
|
|
layui.use(['layer', 'form'], function () {
|
|
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
|
var layer = layui.layer;
|
|
|
|
//注册
|
|
$("#addAccount").click(function(){
|
|
//注册
|
|
top.layer.open({
|
|
title: false,
|
|
type: 2,
|
|
content: 'registration.html',
|
|
area: ['60%', '96%'],
|
|
maxmin: false
|
|
});
|
|
})
|
|
});
|
|
|
|
/**
|
|
* 获取当日时间
|
|
*/
|
|
function getNowTime() {
|
|
var nowDate = new Date();
|
|
var year = nowDate.getFullYear();
|
|
var month = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMonth() + 1) :
|
|
nowDate.getMonth() + 1;
|
|
var day = nowDate.getDate() < 10 ? "0" + nowDate.getDate() : nowDate.getDate();
|
|
var h =nowDate.getHours();
|
|
var m=nowDate.getMinutes();
|
|
var s=nowDate.getSeconds();
|
|
var dateStr = year + "-" + month + "-" + day+" "+h+":"+m+":"+s;
|
|
return dateStr;
|
|
}
|
|
|
|
var qrcode=null;
|
|
var uuid = null;
|
|
//生成二维码
|
|
function createQrCode(){
|
|
$("#qrCodeImg").empty();
|
|
uuid = getuuid();
|
|
var nowTime=getNowTime();
|
|
var loginUrl = dataPath + '/register/scanlogin?createTime=' + nowTime.toString() + '&token='+ uuid;
|
|
qrcode = new QRCode("qrCodeImg", {
|
|
text: loginUrl,
|
|
width: 215,
|
|
height: 190,
|
|
colorDark : "#000000",
|
|
colorLight : "#ffffff",
|
|
});
|
|
document.getElementById('qrCodeImg').title="";
|
|
}
|
|
//清除二维码
|
|
function killQrCode(){
|
|
$("#qrCodeImg").empty();
|
|
qrcode.clear();
|
|
createQrCode();
|
|
}
|
|
|
|
function codeThread() {
|
|
$.ajax({
|
|
type: 'POST',
|
|
url: ctxPath + '/register/checkscan',
|
|
data: {uuid: uuid},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
var status = data.resMsg;
|
|
if(status == "success") {
|
|
clearInterval(interval);
|
|
localStorage.setItem("usernameLogin", username);
|
|
localStorage.setItem("token", data.obj.token);
|
|
localStorage.setItem("roleIdLogin", data.obj.roleId);
|
|
location.href = ctxPath + '/index.html';
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function getuuid() {
|
|
var s = [];
|
|
var hexDigits = "0123456789abcdef";
|
|
for (var i = 0; i < 36; i++) {
|
|
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
|
|
}
|
|
s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
|
|
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
|
|
s[8] = s[13] = s[18] = s[23] = "-";
|
|
|
|
var uuid = s.join("");
|
|
return uuid;
|
|
}
|
|
|
|
//忘记密码
|
|
function forgetPwd(){
|
|
top.layer.open({
|
|
title: false,
|
|
type: 2,
|
|
content: 'resetPwd.html',
|
|
area: ['30%', '50%'],
|
|
maxmin: false
|
|
});
|
|
}
|
|
</script>
|
|
</html> |