
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel=icon type=image/png href="data:image/png;base64,iVBORw0KGgo=">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>管理后台</title>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <style>

        body {
            padding-top: 50px;
        }

        .sub-header {
            padding-bottom: 10px;
            border-bottom: 1px solid #eee;
        }
        .navbar-fixed-top {
            border: 0;
        }
        .sidebar {
            display: none;
        }
        @media (min-width: 768px) {
            .sidebar {
                position: fixed;
                top: 51px;
                bottom: 0;
                left: 0;
                z-index: 1000;
                display: block;
                padding: 20px;
                overflow-x: hidden;
                overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
                background-color: #f5f5f5;
                border-right: 1px solid #eee;
            }
        }
        .nav-sidebar {
            margin-right: -21px; /* 20px padding + 1px border */
            margin-bottom: 20px;
            margin-left: -20px;
        }
        .nav-sidebar > li > a {
            padding-right: 20px;
            padding-left: 20px;
        }
        .nav-sidebar > .active > a,
        .nav-sidebar > .active > a:hover,
        .nav-sidebar > .active > a:focus {
            color: #fff;
            background-color: #428bca;
        }
        .main {
            padding: 20px;
        }
        @media (min-width: 768px) {
            .main {
                padding-right: 40px;
                padding-left: 40px;
            }
        }
        .main .page-header {
            margin-top: 0;
        }

        .placeholders {
            margin-bottom: 30px;
            text-align: center;
        }
        .placeholders h4 {
            margin-bottom: 0;
        }
        .placeholder {
            margin-bottom: 20px;
        }
        .placeholder img {
            display: inline-block;
            border-radius: 50%;
        }

    </style>
</head>
<body>

<nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="/">管理后台</a>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{session('username')}} <span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="/logout">退出</a></li>
                </ul>
            </li>
        </ul>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-md-offset-2">

                    <div style="margin-top: 40px;" class="panel panel-default">
                        <div class="panel-heading">登录</div>
                        <div class="panel-body">
                            <form class="form-horizontal" role="form" method="POST" action="{{ url('/dologin') }}">
                                {!! csrf_field() !!}

                                <div class="form-group{{ $errors->has('username') ? ' has-error' : '' }}">
                                    <label class="col-md-4 control-label">账号</label>

                                    <div class="col-md-6">
                                        <input type="username" class="form-control" name="username" value="">
                                    </div>
                                </div>

                                <div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
                                    <label class="col-md-4 control-label">密码</label>

                                    <div class="col-md-6">
                                        <input type="password" class="form-control" name="password">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="col-md-6 col-md-offset-4">
                                        <div class="checkbox">
                                            <label>
                                                <input type="checkbox" name="remember"> 记住登陆状态
                                            </label>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="col-md-6 col-md-offset-4">
                                        <button type="submit" class="btn btn-primary">
                                            <i class="fa fa-btn fa-sign-in"></i>登录
                                        </button>

                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>
</body>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>

<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>

    function AlertWindow(obj) {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
            }
        });

        this.startEle       = obj.startEle      || '.js-alert-start';
        this.startAjax      = obj.startAjax     || false;
        this.endAjax        = obj.endAjax       || false;
        this.closeEle       = obj.closeEle      || ".js-modal-close";
        this.saveEle        = obj.saveEle       || ".js-modal-save";
        this.errorEle       = obj.errorEle      || ".js-error-msg";
        this.oStartEle      = $(this.startEle);
        this.formHtml       = obj.formHtml;
        this.saveHtml       =obj.saveHtml;

        this.__init__();
    }
    AlertWindow.prototype.__init__ = function () {

        fromOldHtml = '';
        //打开
        var that = this;
        var editid = '';
        if(that.startAjax){
            that.oStartEle.on('click',function (e) {

                e.preventDefault();
                var data = {};
                if(that.startAjax.data){
                    data[that.startAjax.data.key] = $(this).data(that.startAjax.data.key);
                }
                $.ajax({
                    url:that.startAjax.url,
                    type:that.startAjax.type || 'get',
                    data:data,
                    dataType:'json',
                    success:function (res) {
                        if(res.code == 1){
                            //$(that.startAjax.target).html(res.data)
                            that.formHtml = res.data;
                            var title = $(this).data('title') || '编辑';
                            editid = $(this).data('id');
                            that.show(title);
                        }
                    },
                });
            })

        }else{
            that.oStartEle.on('click',function (e) {
                e.preventDefault();
                var title = $(this).data('title') || '编辑';
                editid = $(this).data('id');
                that.show(title);
            })
        }

        //提交
        console.log(that.saveEle);
        $("#myModal .modal-footer").on('click',that.saveEle,function () {

            var data = $('.js-ajax-from').serializeArray();

            var res =  that.formcheck(data,that.endAjax.requiredata) ;

            if(!( res === true )){
                $('.'+res).addClass('has-error');
                $(that.errorEle).html("不能为空").css({"display":"inline"});

                return false;
            }
            //console.log(that.endAjax);
            //console.log(data);
            var newdata = {};
            for(var k in data){
                newdata[data[k]['name']] = data[k]['value'];
            }
            console.log(editid);
            if(editid){
                newdata['id'] = editid;
            }
            console.log(newdata);
            //return ;
            $.ajax({
                url:that.endAjax.url,
                type:"post",
                data:newdata,
                dataType:'json',
                success:function (response) {
                    //console.log(response)
                    if(response.code){
                        that.hide();
                        setTimeout(function () {
                            var html = '<div class="alert alert-success" role="alert">'+response.msg+'</div>';
                            $('.js-prepend').prepend(html);
                            setTimeout(function () {
                                //window.location.reload();
                            },300)
                        },10)
                    }else {
                        $('.'+res).addClass('has-error');
                        $(that.errorEle).html(response.msg).css({"display":"inline"});

                        return false;
                    }
                },
                fail:function () {
                    $(that.errorEle).html("error").css({"display":"inline"});
                    return false;
                }
            })

        });
        //关闭

        $(that.closeEle).on('click',function () {
            that.hide(that.saveClass);
            /*setTimeout(function () {
             window.location.reload();
             },100)*/
        })

    };
    AlertWindow.prototype.show = function (title) {
        $("#myModal .modal-footer").html(this.saveHtml);
        $('#myModal .js-ajax-from').html(this.formHtml);
        $('body').addClass('modal-open');

        $('#myModal').addClass('in').css({"display":"block"});
        if(title){
            $('#myModalLabel').html(title);
        }
        $(".form_datetime").datetimepicker({format: 'yyyy-mm-dd hh:ii'});

    };

    AlertWindow.prototype.hide = function () {
        $("#myModal .modal-footer").html("");
        $('body').removeClass('modal-open');
        $('#myModal').removeClass('in').css({"display":"none"});
    };

    AlertWindow.prototype.ajax = function (obj) {
        //console.log(obj)
        $.ajax({
            obj
        });
    };
    AlertWindow.prototype.formcheck = function (form,require) {
        //console.log(require);
        if(!require.length)
            return true;

        for(var i = 0;i<require.length;i++){

            if( form[i].name ==  require[i] && form[i].value == '')
                return require[i];
        }
        return true;
    }
    $(function () {
        /*var total = $("#hidden-total").val();
         $("#js-order-page ul").append("<li><a href='javascript:;'>总计"+total+"</a></li>")

         $(".form_datetime").datetimepicker({format: 'yyyy-mm-dd hh:ii'});*/
    })
</script>

</html>


