<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>风格定制-Bootstrap样例1</title>
    <!-- Bootstrap css -->
    <link href="https://magicbox.bk.tencent.com/static_api/v3/assets/bootstrap-3.3.4/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://magicbox.bk.tencent.com/static_api/v3/assets/fontawesome/css/font-awesome.css" rel="stylesheet">
    <!-- 当前项目样式文件 -->
    <link href="../../static/css/sb-admin.css" rel="stylesheet">
    <link href="../../static/css/sb-bk-theme.css" rel="stylesheet">
    <!--蓝鲸平台APP 公用的样式文件 -->

    <link href="https://magicbox.bk.tencent.com/static_api/v3/bk/css/bk.css" rel="stylesheet">
    <!-- 以下两个插件用于在IE8以及以下版本浏览器支持HTML5元素和媒体查询，如果不需要用可以移除 -->
    <!--[if lt IE 9]>
    <script src="https://magicbox.bk.tencent.com/static_api/v3/assets/js/html5shiv.min.js"></script>
    <script src="https://magicbox.bk.tencent.com/static_api/v3/assets/js/respond.min.js"></script>
    <![endif]-->
</head>

<body>

    <div id="wrapper">
        <!-- Navigation -->
        <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="index.html">
                    <i class="fa fa-leaf f20 mr5"></i>
                    后台管理系统
                </a>
            </div>
            <!-- Top Menu Items -->
            <ul class="nav navbar-right top-nav">
                <li class="dropdown">
                    <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-envelope"></i> <b class="caret"></b></a>
                    <ul class="dropdown-menu message-dropdown">
                        <li class="message-preview">
                            <a href="javascript:;">
                                <div class="media">
                                    <span class="pull-left">
                                        <img class="media-object" src="../../static/img/50x50.png" alt="">
                                    </span>
                                    <div class="media-body">
                                        <h5 class="media-heading"><strong>qcloud</strong>
                                        </h5>
                                        <p class="small text-muted">Yesterday at 4:32 PM</p>
                                        <p>当前有一条未读的短消息...</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="message-preview">
                            <a href="javascript:;">
                                <div class="media">
                                    <span class="pull-left">
                                        <img class="media-object" src="../../static/img/50x50.png" alt="">
                                    </span>
                                    <div class="media-body">
                                        <h5 class="media-heading"><strong>qcloud</strong>
                                        </h5>
                                        <p class="small text-muted">Yesterday at 4:32 PM</p>
                                        <p>当前有一条未读的短消息...</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="message-preview">
                            <a href="javascript:;">
                                <div class="media">
                                    <span class="pull-left">
                                        <img class="media-object" src="../../static/img/50x50.png" alt="">
                                    </span>
                                    <div class="media-body">
                                        <h5 class="media-heading"><strong>qcloud</strong>
                                        </h5>
                                        <p class="small text-muted">Yesterday at 4:32 PM</p>
                                        <p>当前有一条未读的短消息...</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="message-footer">
                            <a href="javascript:;">查看所有消息</a>
                        </li>
                    </ul>
                </li>
                <li class="dropdown">
                    <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-bell"></i> <b class="caret"></b></a>
                    <ul class="dropdown-menu alert-dropdown">
                        <li>
                            <a href="javascript:;"><span class="label label-default">&nbsp;&nbsp;提醒内容&nbsp;&nbsp;</span></a>
                        </li>
                        <li>
                            <a href="javascript:;"><span class="label label-primary">&nbsp;&nbsp;提醒内容&nbsp;&nbsp;</span></a>
                        </li>
                        <li>
                            <a href="javascript:;"><span class="label label-success">&nbsp;&nbsp;提醒内容&nbsp;&nbsp;</span></a>
                        </li>
                        <li>
                            <a href="javascript:;"><span class="label label-info">&nbsp;&nbsp;提醒内容&nbsp;&nbsp;</span></a>
                        </li>
                        <li>
                            <a href="javascript:;"><span class="label label-warning">&nbsp;&nbsp;提醒内容&nbsp;&nbsp;</span></a>
                        </li>
                        <li>
                            <a href="javascript:;"><span class="label label-danger">&nbsp;&nbsp;提醒内容&nbsp;&nbsp;</span></a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="javascript:;" class='text-center'>查看所有提醒</a>
                        </li>
                    </ul>
                </li>
                <li class="dropdown">
                    <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user"></i> admin <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li>
                            <a href="javascript:;"><i class="fa fa-fw fa-user"></i> 用户</a>
                        </li>
                        <li>
                            <a href="javascript:;"><i class="fa fa-fw fa-envelope"></i> 消息盒</a>
                        </li>
                        <li>
                            <a href="javascript:;"><i class="fa fa-fw fa-gear"></i> 设置</a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="javascript:;"><i class="fa fa-fw fa-power-off"></i> 退出</a>
                        </li>
                    </ul>
                </li>
            </ul>
            <!-- Sidebar Menu Items - These collapse to the responsive navigation menu on small screens -->
            <div class="collapse navbar-collapse navbar-ex1-collapse">
                <ul class="nav navbar-nav side-nav">
                    <li class="active">
                        <a href="index.html"><i class="fa fa-fw fa-dashboard"></i> 首页</a>
                    </li>
                    <li>
                        <a href="tables.html"><i class="fa fa-fw fa-table"></i> 表格</a>
                    </li>
                    <li>
                        <a href="forms.html"><i class="fa fa-fw fa-edit"></i> 表单</a>
                    </li>
                    <li>
                        <a href="bootstrap-elements.html"><i class="fa fa-fw fa-desktop"></i> 排版</a>
                    </li>
                    <li>
                        <a href="bootstrap-grid.html"><i class="fa fa-fw fa-wrench"></i> Bootstrap 布局</a>
                    </li>
                    <li>
                        <a href="javascript:;" data-toggle="collapse" data-target="#demo"><i class="fa fa-fw fa-arrows-v"></i> 下拉菜单 <i class="fa fa-fw fa-caret-down"></i></a>
                        <ul id="demo" class="collapse">
                            <li>
                                <a href="javascript:;">子菜单1 </a>
                            </li>
                            <li>
                                <a href="javascript:;">子菜单2</a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </nav>

        <div id="page-wrapper">

            <div class="container-fluid">

                <!-- Page Heading -->
                <div class="row page-header-box">
                    <div class="col-lg-12">
                        <h1 class="page-header">
                            用户管理
                        </h1>
                    </div>
                </div>

                <div class="panel panel-default">
                    <div class="panel-heading">
                        用户列表
                    </div>
                    <div>
                        <div class="king-wrapper">
                            <form class="form-inline king-search-form king-no-bg mt15 mb15 pull-left">
                                <div class="form-group">
                                    <label>用户账号：</label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" placeholder="请输入用户账号">
                                        <span class="input-group-addon"><i class="glyphicon glyphicon-time fa fa-calendar-o"></i></span>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label>用户名：</label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" placeholder="请输入用户账号">
                                        <span class="input-group-addon"><i class="glyphicon glyphicon-time fa fa-calendar-o"></i></span>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label>状态：</label>
                                    <div class="input-group">
                                        <select class="form-control">
                                            <option value="1">待审核</option>
                                            <option value="2">全部</option>
                                        </select>
                                    </div>
                                </div>

                                <button type="submit" class="king-btn king-info">搜索</button>
                            </form>
                            <a type="button" id="transferID" class="king-btn king-success pull-right mt15 ml15">
                                <i class="fa fa-gavel mr5"></i>审核
                            </a>
                            <a href="user_add.html" class="king-btn king-info pull-right mt15 ml15"> 
                                <i class="fa fa-user-plus mr5"></i>新增用户
                            </a>
                        </div>

                        <table class="table table-out-bordered table-hover">
                            <thead>
                                <tr>
                                    <th style="width: 10px">
                                        <input type="checkbox" class="del-all-cb">
                                    </th>
                                    <th style="width:50px;">序号</th>
                                    <th>用户账号</th>
                                    <th>角色</th>
                                    <th>用户名</th>
                                    <th>性别</th>
                                    <th>邮箱</th>
                                    <th>手机号</th>
                                    <th>地区</th>
                                    <th>注册时间</th>
                                    <th>状态</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-warning fb">待审核</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-success fb">审核通过</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-warning fb">待审核</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-success fb">审核通过</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-success fb">审核通过</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-success fb">审核通过</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="del-cb">
                                    </td>
                                    <td>1</td>
                                    <td>admin</td>
                                    <td>系统管理员</td>
                                    <td>admin</td>
                                    <td>男</td>
                                    <td>123344@gamil.com</td>
                                    <td>13502569874</td>
                                    <td>广东省-广州市</td>
                                    <td>2015-06-07 21:45</td>
                                    <td><span class="text-warning fb">待审核</span></td>
                                    <td>
                                        <a href="#" class="mr15">编辑</a>
                                        <a href="#">已审核</a>
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="12">
                                        <div class="pagination-info pull-left">共4条记录，当前第1/1页，每页20条记录</div>
                                        <div class="pull-right king-page-box">

                                            <ul class="pagination pagination-small pull-right">
                                                <li page-index="1" class="disabled"><a>«</a></li>
                                                <li page-index="1" class="active"><a>1</a></li>
                                                <li page-index="1"><a href="javascript:;">2</a></li>
                                                <li page-index="1"><a href="javascript:;">3</a></li>
                                                <li page-index="1"><a href="javascript:;">4</a></li>
                                                <li page-index="1"><a href="javascript:;">»</a></li>
                                            </ul>
                                        </div>
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>

                </div>

            </div>
            <!-- /.container-fluid -->

        </div>
        <!-- /#page-wrapper -->

    </div>
    <!-- /#wrapper -->

    <!-- 如果要使用Bootstrap的js插件，必须先调入jQuery -->
    <script src="https://magicbox.bk.tencent.com/static_api/v3/assets/js/jquery-1.10.2.min.js"></script>
    <!-- 包括所有bootstrap的js插件或者可以根据需要使用的js插件调用　-->
    <script src="https://magicbox.bk.tencent.com/static_api/v3/assets/bootstrap-3.3.4/js/bootstrap.min.js"></script>

</body>

</html>