<!DOCTYPE>
|
<html>
|
<head>
|
<title>管道基础大数据平台服务-登录</title>
|
<meta charset="utf-8" />
|
<meta http-equiv="pragma" content="no-cache" />
|
<meta http-equiv="cache-control" content="no-cache" />
|
<meta http-equiv="expires" content="0" />
|
<link href="../favicon.ico" rel="icon" type="image/x-icon" />
|
<link href="../css/style.css" rel="stylesheet" />
|
<script src="../js/jquery.min.js"></script>
|
<script src="../js/jquery.cookie.min.js"></script>
|
<script src="../js/zxcvbn.js"></script>
|
<script src="../js/rsa.min.js"></script>
|
</head>
|
<body style="background-color: #0059cf; overflow-y: hidden !important;">
|
<form method="post" id="fm1" class="fm-v clearfix" action="/sign/login">
|
<div class="loginheader" style='display: none;'>
|
<span class="loginname">单点登录</span>
|
<img class="devline" src="../images/login/loginline.png" /><span class="lognameE">Log in</span>
|
</div>
|
<div id="topBg" style="background-color: #1a65c9; height: 30%; display: none;"></div>
|
<div id='div_middle' class="loginmain">
|
<div id='div_loginTitle' class="logintitle" style="display: none;"></div>
|
<div id="topBgColor" style="background-color: #1a65c9; height: 19%; display: none;"></div>
|
<div id='div_loginBox' class="logintable">
|
<div id="loginBox_Title" style="height: 60px; line-height: 60px;">
|
<span style="color: #fff; font-size: 50px; font-family: initial; font-weight: 700;">用户登录</span>
|
</div>
|
<!-- 用户名 -->
|
<div class="loginid" style='width: 400px; margin-right: 50px; margin-top: 45px; border-bottom: 1px solid #fff;'>
|
<label for="username"></label>
|
<input class="required" id="username" placeholder="请输入用户名" size="20" tabindex="1"
|
type="text" accesskey="n" autocomplete="off" name="username" value="" />
|
</div>
|
<!-- 密码 -->
|
<section>
|
<div class="loginpwd" style='width: 400px; margin-right: 20px; margin-top: 30px; border-bottom: 1px solid #fff;'>
|
<label for="password"></label>
|
<input class="required" placeholder="请输入密码" type="password" id="password" size="20" tabindex="2"
|
accesskey="p" autocomplete="off" name="password" value="" /><span id="capslock-on" style="display: none;">
|
<i class="fa fa-exclamation-circle"></i>
|
<span>CAPSLOCK key is turned on!</span>
|
</span>
|
</div>
|
</section>
|
<section class="row check">
|
</section>
|
<!-- 验证码 -->
|
<section>
|
<div class="loginvalifield" style="width: 400px; margin-right: 20px; margin-top: 30px; border-bottom: 1px solid #fff;">
|
<div class="loginvalicode">
|
<label for="inputCode"></label>
|
<input id="inputCode" placeholder="请输入验证码" name="inputCode" class="required" tabindex="3" accesskey="v" type="text" value="" size="35" autocomplete="off" maxlength="6">
|
</div>
|
<span class="code" id="checkCode" onclick="createCode()"></span>
|
</div>
|
</section>
|
<section>
|
<div id="eMsg" style="color: red; height: 40px; line-height: 40px; font-size: 15px; margin-bottom: -20px; margin-left: 45px;"></div>
|
</section>
|
<!-- 登录按钮 -->
|
<section>
|
<input class="loginbtn" style="margin-top: 25px;" name="submit" accesskey="l" value="" tabindex="5" type="button" onclick="sysLogin();">
|
</section>
|
</div>
|
</div>
|
<div id='div_foot' style="display: none;">
|
<span>技术支持：国家海洋信息中心</span>
|
</div>
|
</form>
|
<script>
|
var code;
|
function createCode() {
|
code = "";
|
var codeLength = 4; //验证码的长度
|
var checkCode = document.getElementById("checkCode");
|
/* var codeChars = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,
|
'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z',
|
'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'); */
|
var codeChars = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9);
|
for (var i = 0; i < codeLength; i++) {
|
var charNum = Math.floor(Math.random() * 10);
|
code += codeChars[charNum];
|
}
|
if (checkCode) {
|
checkCode.className = "code";
|
checkCode.innerHTML = code;
|
}
|
}
|
|
var leftoffset = 474;
|
|
// 禁止在iframe打开
|
function noIframe() {
|
if (top.location != self.location) {
|
window.top.location = self.location.href.split("?")[0];
|
}
|
}
|
|
function autoResize() {
|
var div_obj = document.getElementById("div_middle");
|
//宽度自适应
|
var fullWidth = document.body.offsetWidth;
|
var div_loginBox = document.getElementById("div_loginBox");
|
var boxWidth = div_loginBox.offsetWidth;
|
var myWidth = div_obj.offsetWidth;
|
//if (fullWidth > 1920) { fullWidth = 1920; }
|
|
var winWidht = window.innerWidth;
|
var winHeight = window.innerHeight - 100;
|
var bgHeight = 1080;
|
winWidht += 150;
|
if (winWidht >= 1920) {
|
$("#div_middle").css("background", "url(../images/NewGJXJlogin/1920/2bg.jpg) no-repeat").css("background-position", "center bottom").css("height", "800px");
|
$("#div_middle").css("height", "980px");
|
$(".logintable").css("margin-top", "170px");
|
div_loginBox.style.left = ((fullWidth - 410) / 2 + 474) + "px";
|
bgHeight = 980; //1080
|
} else if (winWidht >= 1600) {
|
$("#div_middle").css("background", "url(../images/NewGJXJlogin/1600/2bg.jpg) no-repeat").css("background-position", "center bottom").css("height", "800px");
|
$("#loginBox_Title span").css("font-size", "40px");
|
$(".loginid").css("margin-top", "35px").css("height", "45px").css("width", "350px").css("background", "url(../images/NewGJXJlogin/1600/user.png) no-repeat").css("background-position", "3% 40%");
|
$(".loginid input").css("width", "306px").css("margin-left", "45px").css("font-size", "18px");
|
$(".loginpwd").css("margin-top", "20px").css("height", "45px").css("width", "350px").css("background", "url(../images/NewGJXJlogin/1600/password.png) no-repeat").css("background-position", "3% 40%");
|
$(".loginpwd input").css("width", "306px").css("margin-left", "45px").css("font-size", "18px");
|
$(".loginvalicode").css("height", "45px").css("width", "270px").css("background", "url(../images/NewGJXJlogin/1600/code.png) no-repeat").css("background-position", "4.5% 40%");
|
$(".loginvalicode input").css("width", "215px").css("margin-left", "49px").css("font-size", "18px");
|
$(".loginvalifield").css("margin-top", "20px").css("width", "350px").css("height", "45px");
|
$("#inputCode").css("margin-left", "46px");
|
$(".logintable").css("margin-top", "113px").css("width", "350px").css("height", "470px");
|
//$(".logintable").css("margin-top", "210px").css("width", "350px").css("height", "470px");
|
$("#carLink div").css("background", "url(../images/NewGJXJlogin/1600/add.png) no-repeat").css("background-position", "3% 40%");
|
$("#carLink a").css("margin-left", "50px").css("font-size", "16px");
|
$(".loginbtn").css("margin-top", "25px");
|
leftoffset = 404;
|
bgHeight = 800; //900
|
div_loginBox.style.left = ((fullWidth - 360) / 2 + leftoffset) + "px";
|
} else if (winWidht >= 1440) {
|
$("#div_middle").css("background", "url(../images/NewGJXJlogin/1440/2bg.jpg) no-repeat").css("background-position", "center bottom").css("height", "810px");
|
$("#loginBox_Title").css("height", "50px").css("line-height", "50px");
|
$("#loginBox_Title span").css("font-size", "36px");
|
$(".loginid").css("margin-top", "20px").css("height", "45px").css("width", "320px").css("background", "url(../images/NewGJXJlogin/1440/user.png) no-repeat").css("background-position", "3% 40%");
|
$(".loginid input").css("width", "276px").css("margin-left", "45px").css("font-size", "16px");
|
$(".loginpwd").css("margin-top", "20px").css("height", "45px").css("width", "320px").css("background", "url(../images/NewGJXJlogin/1440/password.png) no-repeat").css("background-position", "3% 40%");
|
$(".loginpwd input").css("width", "276px").css("margin-left", "45px").css("font-size", "16px");
|
$(".loginvalicode").css("height", "45px").css("width", "240px").css("background", "url(../images/NewGJXJlogin/1440/code.png) no-repeat").css("background-position", "4.5% 40%");
|
$(".loginvalicode input").css("width", "185px").css("margin-left", "49px").css("font-size", "16px");
|
$(".loginvalifield").css("margin-top", "20px").css("width", "320px").css("height", "45px");
|
$(".logintable").css("margin-top", "201px").css("width", "320px").css("height", "420px");
|
$("#carLink div").css("background", "url(../images/NewGJXJlogin/1440/add.png) no-repeat").css("background-position", "3.5% 40%").css("margin-top", "25px").css("height", "30px").css("line-height", "30px");
|
$("#carLink a").css("margin-left", "50px").css("font-size", "16px");
|
$(".loginbtn").css("margin-top", "25px").css("height", "50px");
|
leftoffset = 357;
|
bgHeight = 810;
|
div_loginBox.style.left = ((fullWidth - 320) / 2 + leftoffset) + "px";
|
} else if (winWidht >= 1366) {
|
$("#div_middle").css("background", "url(../images/NewGJXJlogin/1366/2bg.jpg) no-repeat").css("background-position", "center bottom").css("height", "668px");
|
$("#loginBox_Title").css("height", "50px").css("line-height", "50px");
|
$("#loginBox_Title span").css("font-size", "32px");
|
$(".loginid").css("margin-top", "35px").css("height", "40px").css("width", "300px").css("background", "url(../images/NewGJXJlogin/1366/user.png) no-repeat").css("background-position", "3% 50%");
|
$(".loginid input").css("width", "256px").css("margin-left", "45px").css("font-size", "14px");
|
$(".loginpwd").css("margin-top", "20px").css("height", "40px").css("width", "300px").css("background", "url(../images/NewGJXJlogin/1366/password.png) no-repeat").css("background-position", "3% 50%");
|
$(".loginpwd input").css("width", "256px").css("margin-left", "45px").css("font-size", "14px");
|
$(".loginvalicode").css("height", "40px").css("width", "220px").css("background", "url(../images/NewGJXJlogin/1366/code.png) no-repeat").css("background-position", "4.5% 50%");
|
$(".loginvalicode input").css("width", "165px").css("margin-left", "46px").css("font-size", "14px");
|
$(".loginvalifield").css("margin-top", "20px").css("width", "300px").css("height", "40px");
|
$(".logintable").css("margin-top", "83px").css("width", "300px").css("height", "390px");
|
//$(".logintable").css("margin-top", "135px").css("width", "300px").css("height", "390px");
|
$("#carLink div").css("background", "url(../images/NewGJXJlogin/1366/add.png) no-repeat").css("background-position", "3.5% 50%").css("margin-top", "25px").css("height", "30px").css("line-height", "30px");
|
$("#carLink a").css("margin-left", "50px").css("font-size", "14px");
|
$(".loginbtn").css("margin-top", "10px").css("height", "56px");
|
leftoffset = 338;
|
bgHeight = 668; //731
|
div_loginBox.style.left = ((fullWidth - 300) / 2 + leftoffset) + "px";
|
} else {
|
//fullWidth = 1280;
|
$("#div_middle").css("background", "url(../images/NewGJXJlogin/1280/2bg.jpg) no-repeat").css("background-position", "center bottom").css("height", "620px");
|
$("#loginBox_Title").css("height", "50px").css("line-height", "50px");
|
$("#loginBox_Title span").css("font-size", "32px");
|
$(".loginid").css("margin-top", "27px").css("height", "40px").css("width", "280px").css("background", "url(../images/NewGJXJlogin/1280/user.png) no-repeat").css("background-position", "3% 50%");
|
$(".loginid input").css("width", "236px").css("margin-left", "45px").css("font-size", "14px");
|
$(".loginpwd").css("margin-top", "20px").css("height", "40px").css("width", "280px").css("background", "url(../images/NewGJXJlogin/1280/password.png) no-repeat").css("background-position", "3% 50%");
|
$(".loginpwd input").css("width", "236px").css("margin-left", "45px").css("font-size", "14px");
|
$(".loginvalicode").css("height", "40px").css("width", "200px").css("background", "url(../images/NewGJXJlogin/1280/code.png) no-repeat").css("background-position", "4.5% 50%");
|
$(".loginvalicode input").css("width", "145px").css("margin-left", "46px").css("font-size", "14px");
|
$(".loginvalifield").css("margin-top", "20px").css("width", "280px").css("height", "40px");
|
$(".logintable").css("margin-top", "70px").css("width", "280px").css("height", "380px");
|
$("#carLink div").css("background", "url(../images/NewGJXJlogin/1280/add.png) no-repeat").css("background-position", "3.5% 50%").css("margin-top", "25px").css("height", "30px").css("line-height", "30px");
|
$("#carLink a").css("margin-left", "50px").css("font-size", "14px");
|
$(".loginbtn").css("margin-top", "0px").css("height", "50px");
|
leftoffset = 314;
|
bgHeight = 620;
|
div_loginBox.style.left = ((fullWidth - 280) / 2 + leftoffset) + "px";
|
$("body").css("overflow", "hidden");
|
}
|
div_obj.style.width = fullWidth + "px";
|
if (winHeight > bgHeight) {
|
div_obj.style.height = winHeight + "px";
|
var marginTop = parseFloat($(".logintable").css("margin-top").replace("px")) + (winHeight - bgHeight);
|
$(".logintable").css("margin-top", marginTop + "px");
|
}
|
//高度自适应
|
var fullHeight = document.body.offsetHeight;
|
var myHeight = div_obj.offsetHeight;
|
if (fullHeight > myHeight) {
|
//div_obj.style.marginTop = ((fullHeight - myHeight) / 2) + "px";
|
}
|
var div_loginTitle = document.getElementById("div_loginTitle");
|
var titleWidth = div_loginTitle.offsetWidth;
|
div_loginTitle.style.left = (fullWidth - titleWidth) / 2 + "px";
|
}
|
|
window.onload = function () {
|
noIframe();
|
createCode();
|
autoResize();
|
getPublicKey();
|
$(window).on("resize", autoResize);
|
document.getElementById('username').focus();
|
}
|
</script>
|
<script>
|
function getPublicKey() {
|
$.get("getPublicKey", function (rs) {
|
if (rs && rs.code == 200) {
|
window.encrypt = new JSEncrypt();
|
encrypt.setPublicKey(rs.result);
|
}
|
});
|
}
|
|
function sysValidate() {
|
// 验证用户名与密码
|
var theUsername = document.getElementById("username").value;
|
if (theUsername.length <= 0) {
|
$("#eMsg").html("提示：请输入用户名！");
|
$("#username").focus();
|
return false;
|
}
|
var thePassword = document.getElementById("password").value;
|
if (thePassword.length <= 0) {
|
$("#eMsg").html("提示：请输入密码！");
|
$("#password").focus();
|
return false;
|
}
|
if (!isValid(thePassword)) {
|
$("#eMsg").html("提示：密码为8-20位包含字母、数字和特殊字符！");
|
$("#password").focus();
|
return false;
|
}
|
|
// 验证验证码
|
var inputCode = document.getElementById("inputCode").value;
|
if (inputCode.length <= 0) {
|
$("#eMsg").html("提示：请输入验证码！");
|
$("#inputCode").focus();
|
return false;
|
}
|
if (inputCode.toUpperCase() != code.toUpperCase()) {
|
$("#eMsg").html("提示：验证码输入有误！");
|
$("#inputCode").val("").focus();
|
createCode();
|
return false;
|
}
|
|
return true;
|
}
|
|
window.isBusy = false;
|
|
function sysLogin() {
|
if (isBusy || !sysValidate()) {
|
return;
|
}
|
|
isBusy = true;
|
var username = $.trim($("#username").val());
|
var password = $("#password").val();
|
var service = getQueryStr("service");
|
|
var data = {
|
"uid": encrypt.encrypt(username),
|
"pwd": encrypt.encrypt(password)
|
};
|
|
$.ajax({
|
url: "login",
|
type: "POST",
|
data: JSON.stringify(data),
|
dataType: "json", // html、json、jsonp、script、text
|
contentType: "application/json", // "application/json", "application/x-www-form-urlencoded",
|
success: function (rs) {
|
isBusy = false;
|
|
if (!rs || rs.code != 200) {
|
createCode();
|
var msg = rs && rs.msg ? rs.msg : "登录失败！";
|
$("#eMsg").html(msg);
|
return;
|
}
|
|
var service = getQueryStr("service");
|
if (service) {
|
service += (service.indexOf("?") > -1 ? "&" : "?") + "token=" + rs.result.token;
|
location.href = service;
|
return;
|
}
|
|
location.href = location.href.replace("/sign/toLogin", "/sign/toIndex");
|
},
|
error: function (e) {
|
isBusy = false;
|
console.error(e);
|
alert("登录出错，请联系管理员！");
|
}
|
});
|
}
|
|
function ajax(url, type, data, dataType, contentType, fn, efn) {
|
$.ajax({
|
url: url,
|
type: type,
|
data: data,
|
dataType: dataType || "json", // html、json、jsonp、script、text
|
contentType: contentType || "application/json", // "application/x-www-form-urlencoded"
|
success: function (data) {
|
fn(data);
|
},
|
error: function (e) {
|
console.error(e);
|
fn();
|
}
|
});
|
}
|
|
// 获取URL参数
|
function getQueryStr(name) {
|
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
|
var r = window.location.search.substr(1).match(reg);
|
if (r != null) {
|
return decodeURI(r[2]);
|
}
|
return null;
|
}
|
|
document.onkeydown = function (e) {
|
var ev = window.event || e;
|
var code = ev.keyCode || ev.which || ev.charCode;
|
if (code == 13) {
|
sysLogin();
|
}
|
}
|
|
// 密码是否合规
|
function isValid(pwd) {
|
if (pwd) {
|
var regex = new RegExp('^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W!@#$%^&*`~()\\-_+=,.?;<>]+$)(?![a-z0-9]+$)(?![a-z\W!@#$%^&*`~()\\-_+=,.?;<>]+$)(?![0-9\W!@#$%^&*`~()\\-_+=,.?;<>]+$)[a-zA-Z0-9\W!@#$%^&*`~()\\-_+=,.?;<>]{8,20}$');
|
return regex.test(pwd)
|
}
|
return false;
|
}
|
</script>
|
</body>
|
</html>
|
