<!DOCTYPE html>
|
<html lang="zh">
|
<head>
|
<meta charset="UTF-8">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<title>自动仓储 - 管理系统</title>
|
<link href="https://fonts.googleapis.com/css?family=Barlow:400,500,700|Playfair+Display" rel="stylesheet">
|
<link rel="stylesheet" type="text/css" href="../static/css/base.css" />
|
<link rel="stylesheet" type="text/css" href="../static/css/demo1.css" />
|
<link rel="icon" type="image/x-icon" href="../static/image/log.png" />
|
<link rel="stylesheet" href="../static/layui/css/layui.css" media="all">
|
<script type="text/javascript" src="../static/layui/layui.js"></script>
|
<script type="text/javascript" src="../static/js/common.js"></script>
|
<script>document.documentElement.className="js";var supportsCssVars=function(){var e,t=document.createElement("style");return t.innerHTML="root: { --tmp-var: bold; }",document.head.appendChild(t),e=!!(window.CSS&&window.CSS.supports&&window.CSS.supports("font-weight","var(--tmp-var)")),t.parentNode.removeChild(t),e};supportsCssVars()||alert("Please view this demo in a modern browser that supports CSS Variables.");</script>
|
<style>
|
html{
|
height: 100%;
|
}
|
|
#login-wrapper {
|
/*color: #fff;*/
|
box-sizing:border-box;
|
/*background: #576669;*/
|
background: #fff;
|
position: absolute;
|
top: 45%;
|
left: 50%;
|
margin-top: -210px;
|
margin-left: -220px;
|
width: 440px;
|
min-height: 420px;
|
padding: 50px;
|
text-align: center;
|
border-radius: 5px;
|
|
transform-origin: 50% 50%;
|
animation: loading 1s 0s forwards;
|
transform: rotateX(0deg);
|
}
|
|
#login-wrapper h2 {
|
letter-spacing: 3px;
|
font-size: 26px;
|
margin-bottom: 30px;
|
}
|
|
.layadmin-user-login-body .layui-form-item {
|
margin-bottom: 20px;
|
position: relative;
|
}
|
.layadmin-user-login-body .layui-form-item .layui-input {
|
height: 42px;
|
padding-left: 40px;
|
font-size: 16px;
|
border: 1px solid #c8cccf;
|
color: inherit;
|
}
|
.login-submit {
|
margin-top: 30px;
|
}
|
.layadmin-user-login-icon {
|
position: absolute;
|
left: 1px;
|
top: 1px;
|
width: 38px;
|
line-height: 40px;
|
text-align: center;
|
color: #B2B2B2;
|
font-size: 18px;
|
}
|
.layui-btn-normal {
|
background-color: #0767aa;
|
font-size: 20px;
|
border-radius: 4px;
|
height: 52px;
|
}
|
.layui-form-checked[lay-skin=primary] i {
|
border-color: #0767aa!important;
|
background-color: #0767aa;
|
color: #fff;
|
}
|
.layui-form-checkbox[lay-skin=primary]:hover i {
|
border-color: #0767aa;
|
color: #fff;
|
}
|
#code-box {
|
position: relative;
|
height: 42px;
|
}
|
#code-label {
|
z-index: 999;
|
}
|
#code {
|
position: absolute;
|
left: 0;
|
top: 0;
|
display: inline-block;
|
width: 60%;
|
}
|
#codeImg {
|
border: 1px solid rgba(0,0,0,0.1);
|
position: absolute;
|
right: 5%;
|
top: 0;
|
width: 30%;
|
height: 90%;
|
}
|
|
/* 登录 */
|
#login-modal {
|
position: fixed;
|
top: 0;
|
right: 0;
|
width: 20%;
|
height: 100%;
|
background-color: #000;
|
z-index: 1;
|
/*display: none;*/
|
}
|
.animationTop {
|
-webkit-animation: animationTop 0.4s;
|
animation: animationTop 0.4s;
|
}
|
#closeBtn {
|
font-size: large;
|
float: right;
|
background-color: black;
|
color: white;
|
border: none;
|
padding: 10px 15px;
|
outline: none;
|
cursor: pointer;
|
}
|
#closeBtn:hover {
|
background-color: #e8e8e8;
|
color: black;
|
}
|
@-webkit-keyframes animationTop {
|
from {
|
right: -500px;
|
opacity: 0;
|
}
|
to {
|
top: 0;
|
opacity: 1;
|
}
|
}
|
@keyframes animationTop {
|
from {
|
right: -500px;
|
opacity: 0;
|
}
|
to {
|
top: 0;
|
opacity: 1;
|
}
|
}
|
|
.login-input {
|
margin-left: 30px;
|
margin-bottom: 10px;
|
}
|
.login-input h2 {
|
font-size: 18px;
|
color: var(--color-subtitle);
|
letter-spacing: 0;
|
text-indent: 0.0em;
|
font-weight: initial;
|
margin-bottom: 5px;
|
}
|
.login-input input {
|
padding: 10px 0;
|
width: 250px;
|
height: 20px;
|
border-top-width: 0;
|
border-left-width: 0;
|
border-right-width: 0;
|
border-bottom-width: 1px;
|
background-color: #000;
|
color: #d0d0d0;
|
font-size: 20px
|
}
|
#login-btn {
|
margin-top: 20px;
|
cursor: pointer;
|
font-size: 1.25em;
|
background: var(--color-subtitle-bg);
|
color: var(--color-subtitle);
|
padding: 0.45em 0.5em;
|
line-height: 1;
|
letter-spacing: 0.1em;
|
text-indent: 0.5em;
|
font-weight: bold;
|
text-transform: uppercase;
|
width: 100px;
|
margin-left: 30px;
|
}
|
|
</style>
|
</head>
|
<body class="demo-1">
|
<!-- 电站详情 -->
|
<div class="animationTop" id="login-modal">
|
<!-- <button id="closeBtn">关闭</button>-->
|
<div style="position: absolute; top: 30%;left: 10%; transform-origin: 50% 50%;">
|
<div class="login-input">
|
<h2>账号</h2>
|
<input id="mobile" type="text" name="mobile" lay-verify="mobile" onkeyup="value=value.replace(/[\u4e00-\u9fa5]/ig,'')">
|
</div>
|
<div class="login-input">
|
<h2>密码</h2>
|
<input id="password" class="" type="password" name="password" lay-verify="password">
|
</div>
|
<!-- <input id="code" class="" type="text" name="password" lay-verify="code" placeholder="验证码">-->
|
<!-- <img id="codeImg" title="看不清？点击换一张。">-->
|
<!-- <input id="rememberPwd" style="vertical-align: middle" type="checkbox" lay-skin='primary' lay-filter="remPwd" title="记住密码" checked="checked">-->
|
<!-- <button id="login-button" class="layui-btn layui-btn-fluid layui-btn-normal" lay-submit="" lay-filter="login">登 录</button>-->
|
<h4 class="login-input" id="login-btn" onclick="login()">login</h4>
|
</div>
|
</div>
|
<main>
|
<div class="content">
|
<canvas class="scene scene--full" id="scene"></canvas>
|
<script type="x-shader/x-vertex" id="wrapVertexShader">
|
attribute float size;
|
attribute vec3 color;
|
varying vec3 vColor;
|
void main() {
|
vColor = color;
|
vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
|
gl_PointSize = size * ( 350.0 / - mvPosition.z );
|
gl_Position = projectionMatrix * mvPosition;
|
}
|
</script>
|
<script type="x-shader/x-fragment" id="wrapFragmentShader">
|
varying vec3 vColor;
|
uniform sampler2D texture;
|
void main(){
|
vec4 textureColor = texture2D( texture, gl_PointCoord );
|
if ( textureColor.a < 0.3 ) discard;
|
vec4 color = vec4(vColor.xyz, 1.0) * textureColor;
|
gl_FragColor = color;
|
}
|
</script>
|
<div class="content__inner">
|
<h2 class="content__title">ASRS WMS</h2>
|
<h2 class="content__subtitle">中扬立库</h2>
|
</div>
|
|
</div>
|
</main>
|
<script src="../static/js/login/demo.js"></script>
|
<script src="../static/js/login/three.min.js"></script>
|
<script src="../static/js/login/TweenMax.min.js"></script>
|
<script src="../static/js/login/demo1.js"></script>
|
</body>
|
<script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
|
<script type="text/javascript" src="../static/js/tools/md5.js"></script>
|
<script type="text/javascript">
|
// 遮罩
|
function toLogin() {
|
$('#login-modal').show();
|
}
|
$('#closeBtn').click(function () {
|
$('#login-modal').hide();
|
})
|
$(function () {
|
var oldUserName = localStorage.getItem('oldUserName');
|
var oldPass = localStorage.getItem('oldPass');
|
if(oldUserName){
|
$('#username').val(oldUserName);
|
}
|
if(oldPass){
|
$('#password').val(oldPass);
|
}
|
})
|
|
$(function () {
|
var oldUserName = localStorage.getItem('oldUserName');
|
var oldPass = localStorage.getItem('oldPass');
|
if(oldUserName){
|
$('#mobile').val(oldUserName);
|
}
|
if(oldPass){
|
$('#password').val(oldPass);
|
}
|
})
|
|
// 验证码开关
|
var codeSwitch = 'Y';
|
$.ajax({
|
url: baseUrl+"/code/switch.action",
|
async: false,
|
success: function (res) {
|
if (res.data === 'N'){
|
codeSwitch = res.data;
|
$('#code-box').css("display", "none");
|
}
|
}
|
});
|
|
// 初始化验证码
|
initCode();
|
$('#codeImg').click(function () {
|
initCode();
|
});
|
function initCode() {
|
var random = Math.random();
|
$('#codeImg').attr("src", baseUrl+"/code.action?sd="+random);
|
setTimeout(function () {
|
$.ajax({
|
url: baseUrl+"/code.do",
|
data: {sd: random},
|
method: 'POST',
|
async: false,
|
success: function (code) {
|
sessionStorage.setItem("code", code);
|
}
|
});
|
}, 100);
|
}
|
|
function login(){
|
var mobile = $("#mobile").val();
|
if (mobile === "") {
|
alert("请输入手机号");
|
return;
|
}
|
var password = $("#password").val();
|
if (password === "") {
|
alert("请输入密码");
|
return;
|
}
|
var code = $("#code").val();
|
if (code === "" && codeSwitch === 'Y') {
|
alert("请输入验证码");
|
return;
|
}
|
if (codeSwitch==='Y'){
|
if (sessionStorage.getItem("code").toUpperCase() !== code.toUpperCase()) {
|
alert("验证码错误");
|
return;
|
}
|
}
|
|
var user = {
|
mobile: mobile,
|
password: hex_md5(password)
|
};
|
$.ajax({
|
url: baseUrl+"/login.action",
|
data: user,
|
method: 'POST',
|
success: function (res) {
|
if (res.code === 200){
|
// 记住密码
|
if($('#rememberPwd').is(':checked')){
|
localStorage.setItem('oldUserName',user.mobile);
|
localStorage.setItem('oldPass',password);
|
} else {
|
localStorage.removeItem('oldUserName');
|
localStorage.removeItem('oldPass');
|
}
|
localStorage.setItem("token", res.data.token);
|
localStorage.setItem("username", res.data.username);
|
window.location.href = "index.html";
|
} else {
|
layer.msg(res.msg, {offset: '150px'});
|
}
|
}
|
});
|
}
|
|
$('body').keydown(function () {
|
if (event.keyCode === 13) {
|
$("#login-button").click();
|
}
|
});
|
|
|
</script>
|
</html>
|
