log.html 16.1 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="bootstrap-table">
                                <div class="fixed-table-toolbar">
                                    <div class="bs-bars pull-left">
                                        <div id="toolbar" class="btn-group">
                                        </div>
                                    </div>
                                    <div class="columns columns-right btn-group pull-right">
                                        <button class="btn btn-default" type="button" name="refresh" title="搜索" id="log_query">搜索</button>
                                            <ul class="dropdown-menu" role="menu">
                                                <li><label><input type="checkbox" data-field="sp_id" value="0"
                                                                  checked="checked"> 视频ID</label></li>
                                                <li><label><input type="checkbox" data-field="sp_id_brief" value="1"
                                                                  checked="checked"> 视频名称</label></li>
                                                <li><label><input type="checkbox" data-field="type" value="2"
                                                                  checked="checked"> 操作人</label></li>
                                                <li><label><input type="checkbox" data-field="service_time" value="3"
                                                                  checked="checked"> 操作时间</label></li>
                                                <li><label><input type="checkbox" data-field="upload_time" value="4"
                                                                  checked="checked"> 操作类型</label></li>
                                                <li><label><input type="checkbox" data-field="action" value="6"
                                                                  checked="checked"> 备注</label></li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="pull-right search">
<!--                                        <form id="searchForm">-->
                                            <input class="form-control" type="text"  placeholder="搜索" id="keyword" name="keyword" th:value="${param.keyword}">
<!--                                        </form>-->
                                    </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: 50px; " data-field="sp_id"
                                                    tabindex="0">
                                                    <div class="th-inner ">视频ID</div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 120px; " data-field="sp_id_brief"
                                                    tabindex="0">
                                                    <div class="th-inner ">视频名称</div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 200px; " data-field="type"
                                                    tabindex="0">
                                                    <div class="th-inner ">操作人
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 120px; " data-field="upload_time"
                                                    tabindex="0">
                                                    <div class="th-inner ">操作时间
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 120px; " data-field="updated_at"
                                                    tabindex="0">
                                                    <div class="th-inner ">操作类型</div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                                <th style="text-align: center; width: 100px; " data-field="action"
                                                    tabindex="0">
                                                    <div class="th-inner ">备注
                                                    </div>
                                                    <div class="fht-cell"></div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                                <tr th:data-index="${logStat.index}" th:each="log : ${shyLogPageInfo.list}">
                                                    <td style="text-align: center; width: 50px;" th:text="${log.videoId}">视频ID</td>
                                                    <td style="text-align: center; width: 120px;" th:text="${log.videoName}">视频名称</td>
                                                    <td style="text-align: center; width: 200px;" th:text="${log.operator}">操作人</td>
                                                    <td style="text-align: center; width: 120px;" th:text="${#dates.format(log.operationTime, 'yyyy-MM-dd HH:mm:ss')}">2018-11-22 23:08:48</td>
                                                    <td style="text-align: center; width: 120px;" th:text="${log.operationType}">操作类型</td>
                                                    <td style="text-align: center; width: 120px;" th:text="${log.remark}">备注</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="'共 '+${shyLogPageInfo.total}+' 条记录,每页显示'">共 0 条记录</span>
                                        <select class="" id="pageSize" name="pageSize" onchange="selectPageSize()">
                                          <option value="10" th:selected="${shyLogPageInfo.pageSize==10}">10</option>
                                          <option value="20" th:selected="${shyLogPageInfo.pageSize==20}">20</option>
                                          <option value="50" th:selected="${shyLogPageInfo.pageSize==50}">50</option>
                                          <option value="100" th:selected="${shyLogPageInfo.pageSize==100}">100</option>
                                        </select>
                                        <span class="pagination-info" >条记录</span>
                                        </div>
                                        <div class="pull-right pagination">
                                              <ul class="pagination" th:if="${shyLogPageInfo.pages>1}">
                                            <li class="page-pre"><a th:href="'javascript:fanye(1);'">‹‹</a></li>
                                            <li class="page-pre" th:if="${!shyLogPageInfo.isFirstPage}"><a
                                                    th:onclick="'javascript:fanye(\''+${shyLogPageInfo.pageNum-1}+'\');'"></a>
                                            </li>

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

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



<!-- /.modal -->
    <script>
        //翻页函数
        function fanye(page) {
            var param = location.search;
            if (param.indexOf("pageNum=") != -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("pageNum=") < 0) h = h + "&" + split[i];
                }
                h = h.substring(1, h.length);
                window.location.href = "/log/page?" + h + "&pageNum=" + page;
            } else {
                param = param.substring(1, param.length);
                window.location.href = "/log/page?" + param + "&pageNum=" + 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("pageNum=") < 0) h = h + "&" + split[i];
                 }
                 h = h.substring(1, h.length);
                 window.location.href = "/log/page?" + h + "&pageNum=" + 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("pageNum=") < 0) h = h + "&" + split[i];
                 }
                 h = h.substring(1, h.length);
                 window.location.href = "/log/page?" + h + "&pageNum=" + 1 + "&pageSize=" + pageSize;
             }
        }

        //搜索
        $('#log_query').click(function () {
        	var keyword = $("#keyword").val();
        	var pageSize = $("#pageSize").val();
        	window.location.href = "/log/page?keyword=" + keyword + "&pageNum=" + 1 + "&pageSize=" + pageSize;
		});

        //鼠标回车事件
        $(document).keyup(function (event) {
            if (event.keyCode == 13) {
                $("#log_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>