users.html 22 KB
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head th:replace="../templates/common/head::head"></head>
<style>
    .fixed-table-toolbar .bs-bars, .fixed-table-toolbar .columns, .fixed-table-toolbar .search{margin-top: 0px;}
    .table{margin-bottom:0;}

</style>
<body class="skin-blue sidebar-mini">

<div class="wrapper">

    <div th:replace="../templates/common/frame::frame"></div>

    <div class="content-wrapper" style="min-height: 788px;">
        <section class="content-header">
            <h1>
                审核云用户管理
            </h1>
            <ol class="breadcrumb">
                <li>首页</li>
                <li>系统管理</li>
                <li class="active">审核云用户管理</li>
            </ol>
        </section>
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box box-info">
                        <div class="box-body">

                                <div class="btn-group margin-bottom " style="padding: 0;width: 100%;float: left;">
                                    <div class="col-md-5" style="padding: 0;width: 20%;">
                                        <label for="sp_id" class="control-label cb-toolbar" style="font-size:15px;top:8px;font-weight:100;">spId:</label>
                                        <div class="col-sm-9" style="padding: 0;">
                                            <input class="form-control" th:value="${Sp_id}" type="text" value="" id="sp_id">
                                        </div>
                                    </div>
                                    <div class="col-md-6" style="padding: 0;width: 25%;" >
                                            <label for="company_brief" class="control-label cb-toolbar" style="font-size:15px;top:8px;font-weight:100;">公司简称:</label>
                                            <div class="col-sm-8" style="padding: 0;">
                                                <input class="form-control" type="text" th:value="${param.company_brief}" id="company_brief">
                                            </div>
                                        </div>
                                          <div class="col-md-6" style="padding: 0;width: 20%;" >
                                            <label for="username" class="control-label cb-toolbar" style="font-size:15px;top:8px;font-weight:100;">用户名:</label>
                                            <div class="col-sm-8" style="padding: 0;">
                                                <input class="form-control" type="text" th:value="${Username}" value="" id="username">
                                            </div>
                                        </div>
                                          <div class="col-md-6" style="padding: 0;width: 20%;" >
                                            <label for="mobile" class="control-label cb-toolbar" style="font-size:15px;top:8px;font-weight:100;">手机号:</label>
                                            <div class="col-sm-7" style="padding: 0;">
                                                <input class="form-control" type="text" th:value="${Mobile}" value="" id="mobile">
                                            </div>
                                        </div>
                                		<div class="col-md-6" style="padding: 0;width: 15%;"> 
                                        	<button class="btn btn-default" type="button" name="refresh" title="搜索" id="users_query">搜索</button>
                               			</div>
                                </div>

                               
                                <div class="fixed-table-container" style="padding-bottom: 0px;">
                                    <div class="fixed-table-body">
                                        <table data-toggle="table" data-pagination="true"
                                               data-search="false" data-show-refresh="true" data-show-toggle="true"
                                               data-show-columns="true" data-toolbar="#toolbar"
                                               class="table table-hover">
                                            <thead>
                                            <tr>
                                                <th style="text-align: center; width: 5%; " data-field="sp_id"
                                                    tabindex="0">
                                                    <div class="th-inner ">spID</div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 12%; " data-field="sp_id_brief"
                                                    tabindex="0">
                                                    <div class="th-inner ">公司简称</div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 8%; " data-field="type"
                                                    tabindex="0">
                                                    <div class="th-inner ">用户名
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 12%; " data-field="type"
                                                    tabindex="0">
                                                    <div class="th-inner ">邮箱
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 10%; " data-field="type"
                                                    tabindex="0">
                                                    <div class="th-inner ">手机号
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 6%; " data-field="type"
                                                    tabindex="0">
                                                    <div class="th-inner ">是否主账号
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 6%; " data-field="type"
                                                    tabindex="0">
                                                    <div class="th-inner ">用户状态
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 12%; " data-field="upload_time"
                                                    tabindex="0">
                                                    <div class="th-inner ">用户信息创建时间
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 12%; " data-field="updated_at"
                                                    tabindex="0">
                                                    <div class="th-inner ">用户信息更新时间</div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 10%; " data-field="action"
                                                    tabindex="0">
                                                    <div class="th-inner ">操作
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                                <tr th:data-index="${usersStat.index}" th:each="users : ${usersPage.list}">
                                                    <td style="text-align: center; width: 5%;" th:text="${users.sp_id}">82</td>
                                                    <td style="text-align: center; width: 12%;" th:text="${users.company_brief}">视讯中国</td>
                                                    <td style="text-align: center; width: 8%;" th:text="${users.username}">用户名</td>
                                                    <td style="text-align: center; width: 12%;" th:text="${users.email}">邮箱</td>
                                                    <td style="text-align: center; width: 10%;" th:text="${users.mobile}">手机号</td>
                                                    <td style="text-align: center; width: 6%;" th:text="${users.master== true?'是':'否'}"></td>
                                                    <td style="text-align: center; width: 6%;" th:if="${users.state==true}">
                                                    	<span class="label label-success">正常</span> </td>
                                                    <td style="text-align: center; width: 6%;" th:if="${users.state==false}">
                                                    <span class="label label-danger">禁用</span></td>
                                                    <td style="text-align: center; width: 12%;" th:text="${#dates.format(users.created_at, 'yyyy-MM-dd HH:mm:ss')}">2018-11-22 23:08:48</td>
                                                    <td style="text-align: center; width: 12%;" th:text="${#dates.format(users.updated_at, 'yyyy-MM-dd HH:mm:ss')}">2016-08-03 14:27:17</td>
                                                    <td style="text-align: center; width: 10%;"><span>&nbsp;</span><a
                                                            class="edit" th:href="'javascript:edit('+${users.id}+',\''+${users.company_brief}+'\',\''+${users.notice_show} +'\')'">
                                                        <button class="btn btn-primary btn-xs">设置</button>
                                                    </a><span> </span><span>&nbsp;</span></td>
                                                </tr>

                                            </tbody>
                                        </table>
                                    </div>

                                    <div class="fixed-table-pagination" style="display: block;">
                                        <div class="pull-left pagination-detail">
                                       	 <span class="pagination-info" th:text="'共 '+${usersPage.total}+' 条记录,每页显示'">共 0 条记录</span>
                                        <select class="" id="pageSize" name="pageSize" onchange="selectPageSize()">
                                          <option value="10" th:selected="${pageSize==10}">10</option>
                                          <option value="20" th:selected="${pageSize==20}">20</option>
                                          <option value="50" th:selected="${pageSize==50}">50</option>
                                          <option value="100" th:selected="${pageSize==100}">100</option>
                                        </select>
                                        <span class="pagination-info" >条记录</span>
                                        </div>
                                        <div class="pull-right pagination">
                                              <ul class="pagination" th:if="${usersPage.pages>1}">
                                            <li class="page-pre"><a th:href="'javascript:fanye(1);'">‹‹</a></li>
                                            <li class="page-pre" th:if="${!usersPage.isFirstPage}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum-1}+'\');'"></a>
                                            </li>

                                            <li class="page-number" th:if="${usersPage.pageNum-3>=1}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum-3}+'\');'"
                                                    th:text="${usersPage.pageNum-3}">2</a></li>
                                            <li class="page-number" th:if="${usersPage.pageNum-2>=1}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum-2}+'\');'"
                                                    th:text="${usersPage.pageNum-2}">2</a></li>
                                            <li class="page-number" th:if="${usersPage.pageNum-1>=1}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum-1}+'\');'"
                                                    th:text="${usersPage.pageNum-1}">2</a></li>
                                            <li class="page-number active"><a href="javaScript:void(0);"
                                                                              th:text="${usersPage.pageNum}">2</a></li>
                                            <li class="page-number" th:if="${usersPage.pageNum+1<=usersPage.pages}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum+1}+'\');'"
                                                    th:text="${usersPage.pageNum+1}">2</a></li>
                                            <li class="page-number" th:if="${usersPage.pageNum+2<=usersPage.pages}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum+2}+'\');'"
                                                    th:text="${usersPage.pageNum+2}">2</a></li>
                                            <li class="page-number" th:if="${usersPage.pageNum+3<=usersPage.pages}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum+3}+'\');'"
                                                    th:text="${usersPage.pageNum+3}">2</a></li>

                                            <li class="page-next" th:if="${!usersPage.isLastPage}"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pageNum+1}+'\');'"></a>
                                            </li>
                                            <li class="page-next"><a
                                                    th:onclick="'javascript:fanye(\''+${usersPage.pages}+'\');'">››</a>
                                            </li>
                                        </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>

<!-- 模态框(Modal) -->
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content" style="margin-top: 30%;">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">编辑审核用户</h4>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <label class="control-label col-sm-2" style="font-size: 15px;">sp简称:</label>
                    <div class="col-sm-10" style="margin-top: -5px;margin-bottom: 20px;">
                        <h5 id="edit_company">视讯中国</h5>
                    </div>
                </div>

                <div class="form-group">
                    <label class="control-label col-sm-2" style="font-size: 15px;">提醒业务:</label>
                    <form action="/users/write" method="post" id="editWrite">
                        <input type="text" name="userId" value="" class="hide" id="edit_id"/>
                        <input type="text" name="redirect_url" value="" class="hide" id="redirect_url"/>
                        <div class="col-sm-10" style="float: left">
                            <div th:each="bu:${notice}" style="padding-right: 30px;" class="write_check">
                                <span th:text="${bu.value}" style="font-size: 15px"></span>
                                <input type="checkbox" name="write_notice" th:value="${bu.key}" th:id="'write_check_'+${bu.key}">
                            </div>
                        </div>
                    </form>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="javascript:$('#editWrite').submit();">提交更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
<!-- /.modal -->
    <script>
        //打开编辑窗口
        function edit(id,company,notice_show){
            $("#edit_company").text(company);
            $("#edit_id").val(id);
            $("#redirect_url").val(location.pathname+location.search);
            $(".write_check input").prop("checked",false);
             if($.trim(notice_show)!=''){
                 var array =  notice_show.split(",")
                 for (var i=0;i<array.length;i++){
                     $("#write_check_"+array[i]).prop("checked",true);
                 }
             }
            $('#editModal').modal('show');
        }
        
        //翻页函数
        function fanye(page) {
            var param = location.search;
            if (param.indexOf("page=") != -1) {
            	var se = param.replace("?", "");//去掉问号,防止问号和要去掉的参数相连
                var split = se.split("&");
                var h = "";
                for (var i = 0; i < split.length; i++) {
                    var s = split[i];
                    if (s.indexOf("page=") < 0) h = h + "&" + split[i];
                }
                h = h.substring(1, h.length);
                window.location.href = "/users/page?" + h + "&page=" + page;
            } else {
                param = param.substring(1, param.length);
                window.location.href = "/users/page?" + param + "&page=" + page;
            }
        }
        
        //选择每页数量触发函数
        function selectPageSize(){
        	var pageSize=$("#pageSize").val();
        	 var param = location.search;
             if (param.indexOf("pageSize=") != -1) {
             	var se = param.replace("?", "");//去掉问号,防止问号和要去掉的参数相连
                 var split = se.split("&");
                 var h = "";
                 for (var i = 0; i < split.length; i++) {
                     var s = split[i];
                     if (s.indexOf("pageSize=") < 0 &&s.indexOf("page=") < 0) h = h + "&" + split[i];
                 }
                 h = h.substring(1, h.length);
                 window.location.href = "/users/page?" + h + "&page=" + 1  + "&pageSize=" + pageSize;
             } else {
            	 var se = param.replace("?", "");//去掉问号,防止问号和要去掉的参数相连
                 var split = se.split("&");
                 var h = "";
                 for (var i = 0; i < split.length; i++) {
                     var s = split[i];
                     if (s.indexOf("page=") < 0) h = h + "&" + split[i];
                 }
                 h = h.substring(1, h.length);
                 window.location.href = "/users/page?" + h + "&page=" + 1 + "&pageSize=" + pageSize;
             }
        }
        
        //搜索
        $('#users_query').click(function () {
        	var company_brief = $("#company_brief").val();
        	var username = $("#username").val();
        	var sp_id = $("#sp_id").val();
        	var mobile = $("#mobile").val();
        	var pageSize = $("#pageSize").val();
        	window.location.href = "/users/page?company_brief=" + company_brief + "&username=" + username+ "&sp_id=" + sp_id+ "&mobile=" + mobile + "&page=" + 1  + "&pageSize=" + pageSize;
		});
        //鼠标回车事件
        $(document).keyup(function(event){
        	  if(event.keyCode ==13){
        	    $("#users_query").trigger("click");
        	  }
        	});

    </script>

    <footer th:replace="../templates/common/foot::foot" ></footer>


    <!-- Add the sidebar's background. This div must be placed
         immediately after the control sidebar -->
    <div class="control-sidebar-bg" style="position: fixed; height: auto;"></div>

</div><!-- ./wrapper -->


<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script type="text/javascript">
    $('div.alert').not('.alert-danger').delay(3000).slideUp(300);
</script>

<!-- AdminLTE App -->
<script src="../../static/js/app.min.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="../../static/js/sidebar.js"></script>


</body>
</html>