blame | 历史 | 补丁 | 提交 | 提交对比 | ignore whitespace
#
luxiaotao1123
2021-03-02 a120f5a232d162d8e3891e5551c9e97fd1820422 
 src/main/webapp/views/login.html


@@ -1,146 +1,196 @@


<!DOCTYPE html>


<html lang="en">


<head>


    <meta charset="UTF-8">


    <title>别样肉客</title>


    <script>if (window !== top) top.location.replace(location.href);</script>


    <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, maximum-scale=1">


    <link rel="icon" type="image/x-icon" href="../static/image/log.png" />


    <title>用户登录</title>


    <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>


    <link rel="stylesheet" href="../static/css/admin.css?v=318">


    <!--[if lt IE 9]>


    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>


    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>


    <![endif]-->


    <style>


        html{


            height: 100%;


        }


        body.login-bg {


            color: #777;


            height: 100%;


            background-image: url("../static/image/bg-imgage.jpg");


            /*background-image: url("../static/image/login_bg.jpg");*/


        body {


            background-image: url("../static/image/bg-login.jpg");


            background-repeat: no-repeat;


            background-size: cover;


            background-position: top center;


            min-height: 100vh;


        }




        #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);


        body:before {


            content: "";


            background-color: rgba(0, 0, 0, .2);


            position: fixed;


            top: 0;


            left: 0;


            right: 0;


            bottom: 0;


        }




        #login-wrapper h2 {


            letter-spacing: 3px;


            font-size: 26px;


            margin-bottom: 30px;


        }




        .layadmin-user-login-body .layui-form-item {


            margin-bottom: 20px;


        .login-wrapper {


            max-width: 420px;


            padding: 20px;


            margin: 0 auto;


            position: relative;


            box-sizing: border-box;


            z-index: 2;


        }


        .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;




        .login-wrapper > .layui-form {


            padding: 25px 30px;


            background-color: #fff;


            box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.19);


            box-sizing: border-box;


            border-radius: 4px;


            height: 52px;


        }


        .layui-form-checked[lay-skin=primary] i {


            border-color: #0767aa!important;


            background-color: #0767aa;


            color: #fff;




        .login-wrapper > .layui-form > h2 {


            color: #333;


            font-size: 18px;


            text-align: center;


            margin-bottom: 25px;


        }


        .layui-form-checkbox[lay-skin=primary]:hover i {


            border-color: #0767aa;


            color: #fff;


        }


        #code-box {




        .login-wrapper > .layui-form > .layui-form-item {


            margin-bottom: 25px;


            position: relative;


            height: 42px;


        }


        #code-label {


            z-index: 999;




        .login-wrapper > .layui-form > .layui-form-item:last-child {


            margin-bottom: 0;


        }


        #code {




        .login-wrapper > .layui-form > .layui-form-item > .layui-input {


            height: 46px;


            line-height: 46px;


            border-radius: 2px !important;


        }




        .login-wrapper .layui-input-icon-group > .layui-input {


            padding-left: 46px;


        }




        .login-wrapper .layui-input-icon-group > .layui-icon {


            width: 46px;


            height: 46px;


            line-height: 46px;


            font-size: 20px;


            color: #909399;


            position: absolute;


            left: 0;


            top: 0;


            display: inline-block;


            width: 60%;


            text-align: center;


        }


        #codeImg {


            border: 1px solid rgba(0,0,0,0.1);




        .login-wrapper > .layui-form > .layui-form-item.login-captcha-group {


            padding-right: 135px;


        }




        .login-wrapper > .layui-form > .layui-form-item.login-captcha-group > .login-captcha {


            height: 46px;


            width: 120px;


            cursor: pointer;


            box-sizing: border-box;


            border: 1px solid #e6e6e6;


            border-radius: 2px !important;


            position: absolute;


            right: 5%;


            right: 0;


            top: 0;


            width: 30%;


            height: 90%;


        }




        .login-wrapper > .layui-form > .layui-form-item > .layui-form-checkbox {


            margin: 0 !important;


            padding-left: 25px;


        }




        .login-wrapper > .layui-form > .layui-form-item > .layui-form-checkbox > .layui-icon {


            width: 15px !important;


            height: 15px !important;


        }




        .login-wrapper > .layui-form .layui-btn-fluid {


            height: 48px;


            line-height: 48px;


            font-size: 16px;


            border-radius: 2px !important;


        }




        .login-wrapper > .layui-form > .layui-form-item.login-oauth-group > a > .layui-icon {


            font-size: 26px;


        }




        .login-copyright {


            color: #eee;


            padding-bottom: 20px;


            text-align: center;


            position: relative;


            z-index: 1;


        }




        @media screen and (min-height: 550px) {


            .login-wrapper {


                margin: -250px auto 0;


                position: absolute;


                top: 50%;


                left: 0;


                right: 0;


                width: 100%;


            }




            .login-copyright {


                position: absolute;


                bottom: 0;


                right: 0;


                left: 0;


            }


        }




        .layui-btn {


            background-color: #5FB878;


            border-color: #5FB878;


        }




        .layui-link {


            color: #5FB878 !important;


        }


    </style>


</head>


<body class="login-bg">




<div id="login-wrapper">


    <header>


        <h2>系统登录</h2>


    </header>


    <div class="layui-form layadmin-user-login-body">


        <div class="layui-form-item">


            <label class="layui-icon layui-icon-username layadmin-user-login-icon"></label>


            <input id="username" class="layui-input" type="text" name="username" lay-verify="username" placeholder="账号">


<body>


<div class="login-wrapper layui-anim layui-anim-scale layui-hide">


    <form class="layui-form">


        <h2>用户登录</h2>


        <div class="layui-form-item layui-input-icon-group">


            <i class="layui-icon layui-icon-username"></i>


            <input class="layui-input" id="username" name="username" placeholder="请输入登录账号" autocomplete="off"


                   lay-verType="tips" lay-verify="required" required/>


        </div>


        <div class="layui-form-item">


            <label class="layui-icon layui-icon-password layadmin-user-login-icon"></label>


            <input id="password" class="layui-input" type="password" name="password" lay-verify="password" placeholder="密码">


        <div class="layui-form-item layui-input-icon-group">


            <i class="layui-icon layui-icon-password"></i>


            <input class="layui-input" id="password" name="password" placeholder="请输入登录密码" type="password"


                   lay-verType="tips" lay-verify="required" required/>


        </div>


        <div id="code-box" class="layui-form-item" style="">


            <label id="code-label" class="layui-icon layui-icon-vercode layadmin-user-login-icon"></label>


        <div id="code-box" class="layui-form-item layui-input-icon-group login-captcha-group">


            <i class="layui-icon layui-icon-auz"></i>


            <input id="code" class="layui-input" type="text" name="password" lay-verify="code" placeholder="验证码">


            <img id="codeImg" title="看不清？点击换一张。">


            <img class="login-captcha" id="codeImg" title="看不清？点击换一张。">


        </div>


        <div class="layui-form-item" style="text-align: left;padding-left: 3px;">


            <input id="rememberPwd" style="vertical-align: middle" type="checkbox" lay-skin='primary' lay-filter="remPwd" title="记住密码" checked="checked">


        <div class="layui-form-item">


            <input type="checkbox" name="remember" title="记住密码" lay-skin="primary" checked>


        </div>


    </div>


    <div class="layui-form-item login-submit">


        <button id="login-button" class="layui-btn layui-btn-fluid layui-btn-normal" lay-submit="" lay-filter="login">登 录</button>


    </div>


        <div class="layui-form-item">


            <button class="layui-btn layui-btn-fluid" lay-filter="login" lay-submit>登录</button>


        </div>


    </form>


</div>


<div class="login-copyright">copyright © 2020 浙江中扬 all rights reserved.</div>




</body>


<script type="text/javascript" src="../static/layui/layui.js"></script>


<script type="text/javascript" src="../static/js/common.js"></script>


<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">


@@ -190,16 +240,22 @@


        }, 100);


    }




    layui.use(['form','layer'],function () {


        var form = layui.form,


            layer = layui.layer,


            $ = layui.jquery;


    layui.config({


        base: baseUrl + "/static/layui/lay/modules/"


    }).extend({


        notice: 'notice/notice',


    }).use(['form','layer', 'notice'],function () {


        var $ = layui.jquery;


        var layer = layui.layer;


        var form = layui.form;


        var notice = layui.notice;


        $('.login-wrapper').removeClass('layui-hide');




        form.on('submit(login)', function (data) {


            var username = $("#username").val();


            if (username === "") {


                layer.msg("请输入账号", {offset: '150px'});


                return;


                return false;


            }


            var password = $("#password").val();


            // if (password === "") {


@@ -208,12 +264,12 @@


            // }


            var code = $("#code").val();


            if (code === "" && codeSwitch === 'Y') {


                layer.msg("请输入验证码", {offset: '150px'});


                return;


                notice.msg('请输入验证码', {icon: 2});


                return false;


            }


            if (sessionStorage.getItem("code").toUpperCase() !== code.toUpperCase()&&codeSwitch==='Y'){


                layer.msg("验证码错误", {offset: '150px'});


                return;


                notice.msg('验证码错误', {icon: 2});


                return false;


            }




            var user = {


@@ -238,7 +294,7 @@


                        localStorage.setItem("nickname", res.data.nickname);


                        window.location.href = "index.html";


                    } else {


                        layer.msg(res.msg, {offset: '150px'});


                        notice.msg(res.msg, {icon: 2});


                    }


                }


            });