{layout name="public/layout_main"}

<section class="wrapper">
    <h3><i class="fa fa-angle-right"></i> 管理员管理</h3>
    <hr>
    <div class="row margin-bottom">
        <div class="col-md-12">
            <form class="form-inline" method="GET">
                <div class="form-group">
                    <label class="sr-only" for="keyword">关键词</label>
                    <input type="text" class="form-control" name="word" id="keyword" placeholder="关键词" value="<?php echo input('get.word');?>">
                </div>
                <button type="submit" class="btn btn-primary">搜索</button>
            </form>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="table-responsive">
                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>用户名</th>
                            <th>是否登录</th>
                            <th>时间</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach($admins as $u => $user):?>
                            <tr id="tr_<?php echo $user->id;?>">
                                <td><?php echo $user->id;?></td>
                                <td>
                                    <a href="javascript:void(0);" class="btn-detail" oid="<?php echo $user->id;?>">
                                        <?php echo $user->username;?>
                                    </a>
                                </td>
                                <td><?php echo $user->is_login;?></td>
                                <td><?php echo $user->created_at;?></td>
                                <td>
                                    <button oid="<?php echo $user->id;?>" type="button" class="btn btn-primary btn-xs btn-update-admin" data-toggle="tooltip" data-placement="top" data-original-title="编辑">
                                        <i class="fa fa-pencil"></i>
                                    </button>
                                </td>
                            </tr>
                        <?php endforeach;?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            {$admins->render()}
        </div>
    </div>
</section>

{literal}
<script id="user" type="text/html">
<div class="row margin-0">
    <div class="col-md-12">
        <h3 class="text-center">{{user.name}}</h3>
    </div>
</div>
<hr/>
<div class="row margin-horizontal-0">
    <div class="col-md-3 padding-right-0 text-right">
        <span>昵称: </span>
    </div>
    <div class="col-md-9 padding-left-xs">
        <p class="text-left">
            <span class="text-primary">{{user.name}}</span>
        </p>
    </div>
</div>
<div class="row margin-horizontal-0">
    <div class="col-md-3 padding-right-0 text-right">
        <span>登录状态: </span>
    </div>
    <div class="col-md-9 padding-left-xs">
        <p class="text-left">
            <span class="text-primary">{{user.is_login}}</span>
        </p>
    </div>
</div>
<div class="row margin-horizontal-0">
    <div class="col-md-3 padding-right-0 text-right">
        <span>创建时间: </span>
    </div>
    <div class="col-md-9 padding-left-xs">
        <p class="text-left">
            <span class="text-primary">{{user.created_at}}</span>
        </p>
    </div>
</div>
</script>
{/literal}


<div class="modal fade" id="update-modal" tabindex="-1" role="dialog" aria-labelledby="updateModal" data-backdrop="static">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="copyModal">编辑资料</h4>
            </div>
            <div class="modal-body">
                <div class="form-group margin-right">
                    <label for="robot">帐号</label>
                    <input class="form-control" name="name" id="admin-name">
                    </input>
                </div>
                <div class="form-group margin-right" id="groups-sel2">
                    <label for="group">密码</label>
                    <input class="form-control" name="password" id="admin-password">
                    </input>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary btn-save">保存</button>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
$(function () {
    $('[data-toggle="tooltip"]').tooltip();

    // 右侧详情
    $('.btn-detail').unbind('click').bind('click', function (event) {
        event.stopPropagation();
        event.preventDefault();
        document.getElementById('right-detail-content').innerHTML = "";
        var url = "/admin/Admin/read";
        var oid = $(this).attr('oid');
        showRightDetail(function () {
            $.get(url + "/id/" + oid, function (res) {
                var res = JSON.parse(res);
                console.log(res);
                if (res.error) {
                    new PNotify({
                        title: '提示',
                        text: res.msg,
                        'type': 'error'
                    });
                } else {
                    var html = template('user', res.data);
                    document.getElementById('right-detail-content').innerHTML = html;
                }
            });
        });
    });

    $(".btn-update-admin").click(function(){
        event.preventDefault();
        var _this = $(this);
        var oid = $(this).attr("oid");

        var _modal = $('#update-modal').modal('show');

        var name = $("#tr_"+oid).find("td:eq(1)").text().trim();
        _modal.find("#admin-name").val(name);
        
        _modal.find('.btn-save').unbind('click').bind('click', function () {
            var _that = $(this);
            var name = $.trim(_modal.find('#admin-name').val());
            var password = _modal.find('#admin-password').val();

            if (name == '') {
                new PNotify({
                    title: '提示',
                    text: '请填写必要信息'
                });
                return;
            };
            var $btn = _that.button('loading');
            var url = "/admin/Admin/update?id="+oid;
            $.ajax({
                    url: url,
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        name: name,
                        password: password
                    },
                    cache: false,
                })
                .done(function (res) {
                    var res = JSON.parse(res);
                    if (res.error) {
                        new PNotify({
                            title: '提示',
                            text: res.msg
                        });
                    } else {
                        window.location.reload();
                    }
                })
                .fail(function (res) {
                    new PNotify({
                        title: '提示',
                        text: '网络请求失败'
                    });
                })
                .always(function () {
                    _modal.modal('hide');
                    $btn.button('reset');
                });
        });
    });
});
</script>