@{
    ViewData["TitleController"] = "系统管理";
    ViewData["TitleAction"] = "角色管理";
    ViewData["TitleActionDescription"] = "用户角色权限管理";
    ViewData["Title"] = "角色管理";
}

@section header{
    <link href="~/lib/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/lib/zTree.v3/css/zTreeStyle/zTreeStyle.min.css">
}

<style>
    .ztree * {
        color: black;
        font-size: 14px;
    }
</style>

    <div class="row">
        <div class="col-md-11">
            <div class="box box-primary">
                <div class="box-header">
                    <div class="row">
                    <div class="col-md-1" style="padding-left: 5px">
                            <div class="btn-group">
                                <button class="btn btn-block btn-primary" onclick="modelCreateRole()">
                                    <i class="fa fa-plus"></i> 新增
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="box-body">
                    <table id="role_table" class="table table-condensed"></table>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_permissions" tabindex="-1" role="dialog" aria-labelledby="modal_permissions_label"
        data-backdrop="static">
        <div class="modal-dialog" role="document" style="width:80%">
            <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">权限模块</h4>
                </div>
                <div class="modal-body">
                    <form id="form" role="form" action="" class="form-horizontal">
                        <input id="Id" name="Id" value="" type="hidden" />
                        <div class="form-group">
                            <label for="Name2" class="col-sm-2 control-label">角色名称</label>
                            <div class="col-sm-10">
                                <input id="Name2" type="text" name="Name2" disabled="disabled" data-msg-required="必须填写角色名称" placeholder="例:一级用户"
                                   class="form-control" data-rule-required="true" value="" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">角色权限</label>
                            <div class="col-sm-10">
                                <div style="width:100%; height:100%; overflow:auto;">
                                    <ul id="permissions" class="ztree"></ul>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" data-loading-text="正在处理..." onclick="savePermissions()" class="btn btn-primary">保存</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_role_add" tabindex="-1" role="dialog" aria-labelledby="modal_role_add_label"
        ata-backdrop="static">
        <div class="modal-dialog" role="document" style="width:80%">
            <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">添加 / 修改 角色名称</h4>
                </div>
                <div class="modal-body">
                    <form id="form" role="form" action="" class="form-horizontal">
                        <input id="Id" name="Id" value="" type="hidden" />
                        <div class="form-group">
                            <label for="Name" class="col-sm-2 control-label">角色名称</label>
                            <div class="col-sm-10">
                                <input id="Name" type="text" name="Name" data-msg-required="必须填写角色名称" placeholder="例:一级用户"
                                   class="form-control" data-rule-required="true" value="" />
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" data-loading-text="正在处理..." onclick="saveRole()" class="btn btn-primary">保存</button>
                </div>
            </div>
        </div>
    </div>


    @section footer{
    <script src="~/lib/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="~/lib/bootstrap-table/locale/bootstrap-table-zh-cn.min.js"></script>
    <script src="~/lib/zTree.v3/js/jquery.ztree.core.min.js"></script>
    <script src="~/lib/ztree.v3/js/jquery.ztree.excheck.min.js"></script>
    <script src="~/js/admin/role.js"></script>
    }