login.html 4.6 KB
<!DOCTYPE html>
<html lang="en" >
<head>
    <meta content="webkit" name="renderer" />
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="robots" content="none" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">

    <meta name="description" content="admin login">
    <title>后台管理系统 - QnbugBMS</title>
    <link rel="stylesheet" href="__STATIC__/css/voyagerapp.css">
    <style>
        body {
            background-image:url('__STATIC__/images/bg.jpg');
            background-color: #FFFFFF;
        }
        body.login .login-sidebar {
            border-top:5px solid #22A7F0;
        }
        @media (max-width: 767px) {
            body.login .login-sidebar {
                border-top:0px !important;
                border-left:5px solid #22A7F0;
            }
        }
        body.login .form-group-default.focused{
            border-color:#22A7F0;
        }
        .login-button, .bar:before, .bar:after{
            background:#22A7F0;
        }
    </style>

    <!--<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet">-->
</head>
<body class="login">
<div class="container-fluid">
    <div class="row">
        <div class="faded-bg animated"></div>
        <div class="hidden-xs col-sm-7 col-md-8">
            <div class="clearfix">
                <div class="col-sm-12 col-md-10 col-md-offset-2">
                    <div class="logo-title-container">
                        <img class="img-responsive pull-left flip logo hidden-xs animated fadeIn" src="__STATIC__/images/logo-icon-light.png" alt="Logo Icon">
                        <div class="copy animated fadeIn">
                            <h1>Qnbug BMS</h1>
                            <p>欢迎使用Qnbug BMS-Bussiness Management System ,后台管理系统</p>
                        </div>
                    </div> <!-- .logo-title-container -->
                </div>
            </div>
        </div>

        <div class="col-xs-12 col-sm-5 col-md-4 login-sidebar">

            <div class="login-container">

                <p>登录系统:</p>

                <form  class="js-ajax-form" action="{:url('public/doLogin')}" method="POST">
                    <div class="form-group form-group-default" id="emailGroup">
                        <label>用户名</label>
                        <div class="controls">
                            <input type="text" name="username" id="email" value="" placeholder="请输入用户名" class="form-control" required>
                        </div>
                    </div>

                    <div class="form-group form-group-default" id="passwordGroup">
                        <label>密码</label>
                        <div class="controls">
                            <input type="password" name="password" placeholder="请输入密码" class="form-control" required>
                        </div>
                    </div>

                    <button class="btn btn-block login-button js-ajax-submit" type="submit" data-loadingmsg="正在登录中...">
                        登录
                    </button>
                </form>

                <div style="clear:both"></div>


            </div> <!-- .login-container -->

        </div> <!-- .login-sidebar -->
    </div> <!-- .row -->
</div> <!-- .container-fluid -->
<script>
    var username = document.querySelector('[name="username"]');
    var password = document.querySelector('[name="password"]');
    username.focus();
    document.getElementById('emailGroup').classList.add("focused");

    // Focus events for email and password fields
    username.addEventListener('focusin', function(e){
        document.getElementById('emailGroup').classList.add("focused");
    });
    username.addEventListener('focusout', function(e){
        document.getElementById('emailGroup').classList.remove("focused");
    });

    password.addEventListener('focusin', function(e){
        document.getElementById('passwordGroup').classList.add("focused");
    });
    password.addEventListener('focusout', function(e){
        document.getElementById('passwordGroup').classList.remove("focused");
    });

</script>
<script type="text/javascript">
    //全局变量
    var GV = {
        ROOT: "__ROOT__/",
        WEB_ROOT: "__WEB_ROOT__/",
        JS_ROOT: "static/js/",
        APP: ''/*当前应用名*/
    };
</script>
<script src="__TMPL__/public/assets/js/jquery-1.10.2.min.js"></script>
<script src="__STATIC__/js/wind.js"></script>
<script src="__STATIC__/js/admin.js"></script>
</body>
</html>