<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AdminManage.aspx.cs" Inherits="SmartLogonServer.AdminManage" %>

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <!--必须的css引用-->
    <link href="Content/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <link href="Content/bootstrap-table/bootstrap-table.min.css"  rel="stylesheet" />
    <link href="Content/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet" />

    <link href="Content/toastr/toastr.min.css"  rel="stylesheet" />

</head>
<body>
    <div class="panel-body" style="padding-bottom:0px;">
      
        
        <% if(ShowButton()) {%>
        <div id="toolbar" class="btn-group">
            <div class="col-md-4">
            <button id="btn_add" type="button" class="btn btn-success">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
                </div>

        </div>
        <%} %>
        <table id="tb_admin"></table>
        </div>


    <!--新增或者编辑的弹出框-->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <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="myModalLabel">增加管理员</h4>
                </div>
                
                <div class="modal-body">

                    <div class="row" style="padding:10px;">
                        <label class="control-label col-xs-2">用户名</label>
                        <div class="col-xs-10">
                            <input type="text" name="edtAdminUserName" class="form-control" placeholder="用户名"/>
                        </div>
                    </div>


                        
                        <div class="row" style="padding:10px;">
                        <label class="control-label col-xs-2">密码</label>
                        <div class="col-xs-10">
                           <input type="password" name="edtPwd" class="form-control" placeholder="管理员密码"/>
                        </div>
                        </div>

                </div>
                <div class="modal-footer">
                                      
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭</button>
                    <button type="button" id="sava-newadmin-btn" class="btn btn-primary"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>保存</button>
                </div>
                
            </div>
        </div>
    </div>



        <!--必须的js文件-->
        <script src="Content/jquery-1.9.1.min.js"></script>
        <script src="Content/bootstrap/js/bootstrap.min.js"></script>
        <script src="Content/bootstrap-table/bootstrap-table.min.js"></script>
        <script src="Content/bootstrap3-editable/js/bootstrap-editable.js"></script>

        <script src="Content/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>

        <script src="Content/toastr/toastr.min.js"></script>
        <script src="Content/sweetalert/sweetalert.min.js"></script>

        <script type="text/javascript">

            //$(function () {
                //表格的初始化
                $('#tb_admin').bootstrapTable({
                    url: "adminmanage.ashx",                         //直接从本地数据初始化表格
                    method: 'get',                      //请求方式（*）
                    //datatype: "json",
                    //contentType: "application/x-www-form-urlencoded",
                    toolbar: '#toolbar',                //工具按钮用哪个容器
                    idField: 'UserName',
                    uniqueId: 'UserName',
                    striped: true,                      //是否显示行间隔色
                    cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                    pagination: true,                   //是否显示分页（*）
                    sortable: false,                     //是否启用排序
                    sortOrder: "asc",                   //排序方式
                    queryParams: function (params) {
                        var pages = {
                            limit: params.pageSize, // 每页显示数量
                            offset: params.pageNumber, // SQL语句起始索引

                        }
       
                        return JSON.stringify(pages);
                    },                                  //传递参数（*）
                    queryParamsType: "",
                    sidePagination: "client",           //分页方式：client客户端分页，server服务端分页（*）
                    pageNumber: 1,                      //初始化加载第一页，默认第一页
                    pageSize: 25,                       //每页的记录行数（*）
                    pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
                    search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                    strictSearch: true,
                    showColumns: true,                  //是否显示所有的列

                    showRefresh: true,                  //是否显示刷新按钮
                    minimumCountColumns: 2,             //最少允许的列数
                    height: 800,
                    selectItemName: 'parentItem',
                    fixedColumns: true,
                    fixedNumber: 6,
                    showToggle: false,          //是否显示详细视图和列表视图的切换按钮
                    cardView: false,          //是否显示详细视图
                    showExport: true, //是否显示导出按钮
                    exportDataType: "all",
                    exportTypes: ['excel'], //导出文件类型
                    //注册加载子表的事件。注意下这里的三个参数！
                    onExpandRow: function (index, row, $detail) {
                        InitSubTable(index, row, $detail);
                    },
                    columns: [{
                        checkbox: false,
                        width: 20
                    }, {
                        field: 'UserName',
                        title: '用户名',
                        width: 100

                    }, {
                        field: 'UserRegisterTime',
                        title: '注册时间',
                        width: 200

                    }, {
                        title: '操作',
                        width: 200,
                        formatter: function (value, row, index) {//这里的三个参数：value表示当前行当前列的值；row表示当前行的数据；index表示当前行的索引（从0开始）。
                            var html=""
                           // <% if(ShowButton()){%>
                            html = '<button type="button" onclick="editModel(\'' + row.UserName + '\')" class="btn btn-primary"><span class="glyphicon glyphicon-pencil" aria- hidden="true" ></span >编&nbsp;&nbsp;辑</button >&nbsp;&nbsp;' +
                  
                                       '<button type="button" onclick="deleteModel(\'' + row.UserName + '\')" class="btn btn-danger"><span class="glyphicon glyphicon-remove" aria- hidden="true" ></span >删&nbsp;&nbsp;除</button >';
                           // <%}%>
                            return html;
                        }
                    }],
                    onEditableSave: function (field, row, oldValue, $el) {
                       
                    }
                });

     
                //新增事件
                $("#btn_add").on('click', function () {
                    $('#tb_admin').bootstrapTable("resetView");
                    //弹出模态框
                    $("#myModal").modal();
                    //给弹出框里面的各个文本框赋值
                    $("#myModal input").val("");
                    $("#myModal input[name='edtAdminUserName']").prop("readonly", false);

                });

              

           
                //编辑事件
                var editModel = function (id) {
                    //根据当前行的id获取当前的行数据
                    
                    var row = $("#tb_admin").bootstrapTable('getRowByUniqueId', id);
                    //弹出模态框
                    $("#myModal").modal();
                    //给弹出框里面的各个文本框赋值
        
                    $("#myModal input[name='edtAdminUserName']").prop("readonly", true);
                    $("#myModal input[name='edtAdminUserName']").val(row.UserName);
                    $("#myModal input[name='edtPwd']").val('');

                }


                //删除事件
                var deleteModel = function (id) {
                    swal({
                        title: "删除管理员",
                        text: "是否删除登录名为" + id + "的管理员?",
                        icon: "warning",
                        // buttons: true,
                        dangerMode: true,
                        buttons:{
                            cancel: '取消',
                            confirm: {
                                text: '删除',
                                value: 'confirm'
                            }
                        }
                    })
                        .then((value) => {
                            if (value==='confirm') {

                            $.ajax({
                        type: "post",
                    url: "adminEdit.ashx",
                    data: {
                        'Edit': "delete",
                        'admin': id
     
                    },
                    dataType: 'JSON',
                    success: function (data, status) {
                        if (status == "success") {
                            if (data.result == true) {
                                $("#tb_admin").bootstrapTable("refresh", {
                                    silent: true //静态刷新
                                });
                                toastr.success('操作成功');
                            }
                            else {
                                toastr.error('操作失败');
                            }
                        }
                    },
                    error: function () {
                        toastr.error('操作失败');
                    },
                    complete: function () {

                    }

                });//ajax
            }
            });//then


            }

            
            $("#sava-newadmin-btn").click(function () {
                $('#myModal').modal('hide');
                
                $.ajax({
                    type: "post",
                    url: "adminEdit.ashx",
                    data: {
                        'Edit': $("#myModal input[name='edtAdminUserName']").prop("readonly"),
                        'admin': $("#myModal input[name='edtAdminUserName']").val(),
                        'pwd': $("#myModal input[name='edtPwd']").val()
                    },
                    dataType: 'JSON',
                    success: function (data, status) {
                        if (status == "success") {
                            if (data.result == true) {
                                toastr.success('成功');
                                $("#tb_admin").bootstrapTable("refresh", {
                                    silent: true //静态刷新
                                });
                                toastr.success('操作成功');
                            }
                            else {
                                toastr.error('操作失败');
                            }
                        }
                    },
                    error: function () {
                        toastr.error('操作失败');
                    },
                    complete: function () {

                    }

                });
            });

           // });

            toastr.options.positionClass = 'toast-top-center';
        </script>
</body>
</html>
