|  |  |  | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | body.login-bg { | 
|---|
|  |  |  | color: #777; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | background-image: linear-gradient(to right, #ff9569 0%, #e92758 100%); | 
|---|
|  |  |  | /*background-image: linear-gradient(-90deg, #29bdd9 0%, #276ace 100%);*/ | 
|---|
|  |  |  | /*background: -webkit-linear-gradient(red, blue); !* Safari 5.1 - 6.0 *!;*/ | 
|---|
|  |  |  | /*background-image: url("../static/image/login_bg.jpg");*/ | 
|---|
|  |  |  | /*background-repeat: no-repeat;*/ | 
|---|
|  |  |  | /*background-size: cover;*/ | 
|---|
|  |  |  | /*background-position: top center;*/ | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | #login-wrapper { | 
|---|
|  |  |  | box-sizing:border-box; | 
|---|
|  |  |  | background: #fff; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | padding: 60px 40px; | 
|---|
|  |  |  | padding: 100px 60px; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-form-item .layui-input { | 
|---|
|  |  |  | height: 30px; | 
|---|
|  |  |  | height: 40px; | 
|---|
|  |  |  | padding-left: 20px; | 
|---|
|  |  |  | font-size: 14px; | 
|---|
|  |  |  | font-size: 16px; | 
|---|
|  |  |  | border: 1px solid #767676; | 
|---|
|  |  |  | color: inherit; | 
|---|
|  |  |  | border-radius: 3px; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | </head> | 
|---|
|  |  |  | <body> | 
|---|
|  |  |  | <body class="login-bg"> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div id="login-wrapper"> | 
|---|
|  |  |  | <header> | 
|---|
|  |  |  | 
|---|
|  |  |  | </header> | 
|---|
|  |  |  | <div class="layui-form layadmin-user-login-body"> | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <input id="mobile" class="layui-input" type="text" name="mobile" lay-verify="mobile" placeholder="账号" autocomplete="off"> | 
|---|
|  |  |  | <input id="username" class="layui-input" type="text" name="username" lay-verify="username" placeholder="账号" autocomplete="off"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <input id="password" class="layui-input" type="password" name="password" lay-verify="password" placeholder="密码" autocomplete="off"> | 
|---|
|  |  |  | 
|---|
|  |  |  | $ = layui.jquery; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | form.on('submit(login)', function (data) { | 
|---|
|  |  |  | var mobile = $("#mobile").val(); | 
|---|
|  |  |  | if (mobile === "") { | 
|---|
|  |  |  | alert("请输入手机号"); | 
|---|
|  |  |  | var username = $("#username").val(); | 
|---|
|  |  |  | if (username === "") { | 
|---|
|  |  |  | layer.msg("请输入账号", {icon: 2}) | 
|---|
|  |  |  | $("#username").focus(); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | var password = $("#password").val(); | 
|---|
|  |  |  | if (password === "") { | 
|---|
|  |  |  | alert("请输入密码"); | 
|---|
|  |  |  | layer.msg("请输入密码", {icon: 2}) | 
|---|
|  |  |  | $("#password").focus(); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var user = { | 
|---|
|  |  |  | mobile: mobile, | 
|---|
|  |  |  | username: username, | 
|---|
|  |  |  | password: hex_md5(password) | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | debugger | 
|---|
|  |  |  | $.ajax({ | 
|---|
|  |  |  | url: baseUrl+"/login.action", | 
|---|
|  |  |  | data: user, | 
|---|
|  |  |  | method: 'POST', | 
|---|
|  |  |  | success: function (res) { | 
|---|
|  |  |  | if (res.code === 200){ | 
|---|
|  |  |  | layer.msg("登录成功", {icon: 1}) | 
|---|
|  |  |  | localStorage.setItem("token", res.data.token); | 
|---|
|  |  |  | localStorage.setItem("username", res.data.username); | 
|---|
|  |  |  | window.location.href = "index.html"; | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | alert(res.msg); | 
|---|
|  |  |  | layer.msg(res.msg, {icon: 2}) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | 
|---|
|  |  |  | $('body').keydown(function () { | 
|---|
|  |  |  | if (event.keyCode === 13) { | 
|---|
|  |  |  | $("#login-button").click(); | 
|---|
|  |  |  | } else if (event.keyCode === 115) { | 
|---|
|  |  |  | $("#login-button").click(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|