<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="utf-8">
        <title>
            登入到 Doghouse 后台
        </title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <link rel="stylesheet" href="../layuiadmin/layui/css/layui.css" media="all">
        <link rel="stylesheet" href="../layuiadmin/style/login.css" media="all">
    </head>
    
    <body style="background-color: #f2f2f2">
        <div class="layadmin-user-login layadmin-user-display-show" id="LAY-user-login"
        style="display: none;">
            <div class="layadmin-user-login-main">
                <div class="layadmin-user-login-box layadmin-user-login-header">
                    <h2>
                        Doghouse
                    </h2>
                    <p>
                        A private-use blog system built by Doghole
                    </p>
                </div>
                <div class="layadmin-user-login-box layadmin-user-login-body layui-form">
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-username"
                        for="LAY-user-login-username">
                        </label>
                        <input type="text" name="username" id="LAY-user-login-username" lay-verify="required"
                        placeholder="Username" class="layui-input">
                    </div>
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-password"
                        for="LAY-user-login-password">
                        </label>
                        <input type="password" name="password" id="LAY-user-login-password" lay-verify="required"
                        placeholder="Password" class="layui-input">
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <div class="layui-col-xs7">
                                <label class="layadmin-user-login-icon layui-icon layui-icon-vercode"
                                for="LAY-user-login-vercode">
                                </label>
                                <input type="text" name="captcha" id="LAY-user-login-vercode" lay-verify="required"
                                placeholder="Captcha" class="layui-input">
                            </div>
                            <div class="layui-col-xs5">
                                <div style="margin-left: 10px;">
                                    <img src="/captcha/get" class="layadmin-user-login-codeimg" id="LAY-user-get-vercode">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item" style="margin-bottom: 20px;">
                        <input type="checkbox" name="remember" lay-skin="primary" title="Remember me">
                    </div>
                    <div class="layui-form-item">
                        <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="LAY-user-login-submit">
                            Submit
                        </button>
                    </div>
                </div>
            </div>
            <div class="layui-trans layadmin-user-login-footer">
                &copy;2016-[[${#temporals.format(T(java.time.LocalDate).now(),'yyyy')}]]
                <a href="/" target="_blank">
                    Doghole
                </a>
                All Rights Reserved.
            </div>
        </div>
        <script src="../layuiadmin/layui/layui.js"></script>
        <script th:src="@{/blog/plugins/jquery/1.12.4/jquery-1.12.4.min.js}"></script>
        <script th:src="@{/blog/plugins/js-sha3/sha3.min.js}"></script>
        <script>
            var l = layui,
            c = '#LAY-user-get-vercode',
            d = 'click',
            m = layer.msg,
            p = location.href;
            l.config({
                base: '../layuiadmin/'
            }).extend({
                index: 'lib/index'
            }).use(['index'],
            function() {
                var setter = l.setter,
                admin = l.admin,
                form = l.form;
                $('body').on('keydown', function(e) {
                    if (e.keyCode == 13) {
                        $('[lay-submit]').click()
                    }
                });
                form.render();
                form.on('submit(LAY-user-login-submit)', function(obj) {
                    obj.field.password = sha3_224(obj.field.password);
                    $.ajax({
                        url: p,
                        data: obj.field,
                        type: 'post',
                        success: function(ret) {
                            m('登入成功', {
                                offset: '15px',
                                icon: 1,
                                time: 1000
                                }, 
                                function() {
                                    location.href = ret.data
                                }
                            )
                        },
                        error: function(x) {
                        	var r = x.responseJSON;
                            m(r&&r.data||'服务器错误', {
                                offset: '15px',
                                icon: 2,
                                time: 2000
                            },
                            function() {
                                $(c)[d]();
                                $('#LAY-user-login-vercode').val('');
                            });
                        }
                    })
                })
            });
            //更换图形验证码
            $('body').on(d, c, function(){
                this.src = '/captcha/get?t='+ Math.random()
            });
        </script>
    </body>

</html>