<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/jsp/common/taglibs.jspf"%>
<%@ page isELIgnored="false" %>
<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<hejin:header title="访问日志管理"></hejin:header>
		
		<!-- 图片上传样式 -->
		<link rel="stylesheet" type="text/css" href="static/css/bootstrap/jquery.fileupload-ui.css">
		<style type="text/css">
			.span {
				position: absolute;
				left: 50%;
				top: 50%;
				margin-top: 5px;
			}
		</style>
	</head>
	<body>
		<!-- 菜单 -->
		<jsp:include page="../../menu.jsp"/>
		<!-- BEGIN 面包屑 -->
		<div class="container-fluid">
			<ol class="breadcrumb"><!-- BEGIN 面包屑 -->
				<li><a href="javascript:void(0);">系统管理</a></li>
				<li><a href="system/logAccess/logAccessIndex.do">访问日志</a></li>
			</ol>
		</div>
		<!-- END 面包屑 -->
		<!-- BEGIN 条件 -->
		<div class="container-fluid">
			<div class="row">
				<div class="col-sm-1">
  					<span class="span">用户名称</span>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
 						<input type="text" class="form-control" name="f_userName" id="f_userName" placeholder="请输入用户名称">
 					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<a class="btn btn-block btn-primary btn-query" id="searchBtn" data-target="#compose-modal"><i class="fa fa-pencil"></i>查询</a>
	 				</div>
				</div>
				<div class="col-sm-1"></div>
			</div>
		</div>
		<!-- END 条件 -->
		<!-- BEGIN Tables -->
		<div class="container-fluid">
			<div class="row"><!-- BEGIN row-fluid -->
				<div class="col-sm-12"><!-- BEGIN col-sm-12 -->
					<div class="box">
                        <div class="box-header">
                        	<h3 class="box-title">访问日志列表</h3>
                        </div><!-- /.box-header -->
						<div class="box-body table-responsive">
                             <table class="table table-bordered table-striped" id="table_log_user">
				            	<thead>
				                	<tr>
				                    	<th>用户名称</th>
				                        <th>资源名称</th>
				                        <th>URL地址</th>
				                        <th>请求参数</th>
				                        <th>IP地址</th>
				                        <th>Host地址</th>
				                        <th>来源</th>
				                       	<th>访问时间</th>
				                    </tr>
				                </thead>
				                <tbody>
				                </tbody>
				             </table>
			             </div>
		             </div>
             	</div><!-- END col-sm-12 -->
            </div><!-- END row-fluid -->
		</div>
		<!-- END Tables -->
		
		<!--common js -->
		<hejin:commonScript></hejin:commonScript>
	    <script type="text/javascript">
		    Date.prototype.format = function(format)
		    {
			     var o = {
			     "M+" : this.getMonth()+1, //month
			     "d+" : this.getDate(),    //day
			     "h+" : this.getHours(),   //hour
			     "m+" : this.getMinutes(), //minute
			     "s+" : this.getSeconds(), //second
			     "q+" : Math.floor((this.getMonth()+3)/3),  //quarter
			     "S" : this.getMilliseconds() //millisecond
			     }
			     if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
			     (this.getFullYear()+"").substr(4 - RegExp.$1.length));
			     for(var k in o)if(new RegExp("("+ k +")").test(format))
			     format = format.replace(RegExp.$1,
			     RegExp.$1.length==1 ? o[k] :
			     ("00"+ o[k]).substr((""+ o[k]).length));
			     return format;
		    }	
	    
		    $(function(){
				// datatable load data
				var tables = $('#table_log_user').platformDataTable({
					"bSort":false,
					//数据源     返回数据必须封装aaData
					"sAjaxSource" : 'system/logAccess/loadLogAccessList.do?'+ new Date().getTime(),
					"aoColumns" : [ //列
					    {"sClass" : "center", "mDataProp" : "userName"},
						{"sClass" : "center", "mDataProp" : "resName"},
						{"sClass" : "center", "mDataProp" : "requestUrl"},
						{"sClass" : "center", "mDataProp" : "requestParam"},
						{"sClass" : "center", "mDataProp" : "accessIp"},
						{"sClass" : "center", "mDataProp" : "accessHost"},
						{"sClass" : "center", "mDataProp" : "accessPlat"},
						{"sClass" : "center",
							 "mDataProp" : "accessTime",
							 "bSearchable" : false,
							 "fnRender" : function(obj) {
								 	var curTime = new Date(obj.aData.accessTime);
									return curTime.format("yyyy-MM-dd hh:mm:ss");
								}
						}
					]
				});
				
				// 查询事件
	            $('#searchBtn').click(function(){
	        		var userName = $('#f_userName').val();

                    if(userName==null || userName.trim()==""){
                        $(".modal-body").html("查询条件不可以为空！");
                        $("#myModal").modal("show");
                        return false;
                    }
	        		
	            	var data=[];//存放json类型的查询条件，可以放多个
	            	data.push({ "name": "userName", "value": userName});
	            	//Ajax重新load控件数据
	            	drawTable(tables,data);
					tables.fnPageChange(0);
	            });
		    });

			function redirect(){
				if($('#page').val() && $('#page').val()>=0){
					var tables = $('#table_log_user').dataTable();
					var oSettings = tables.fnSettings();
					var maxPage = oSettings.fnRecordsTotal() % oSettings._iDisplayLength == 0?
					oSettings.fnRecordsTotal() / oSettings._iDisplayLength :
					Math.floor(oSettings.fnRecordsTotal() / oSettings._iDisplayLength)+ 1;
					if($('#page').val() == 0){
						$('#page').val(1);
					}
					if($('#page').val() > maxPage){
						$('#page').val(maxPage);
					}
					var redirectpage = $('#page').val() - 1;
					tables.fnPageChange(redirectpage);
				}else{
					return;
				}
			}

			function onlyNum(){
				$('#page').val($("#page").val().replace(/\D/g, ''));
			}
    	</script>




		<!-- 模态提示框 -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title" id="myModalLabel">
							温馨提示：
						</h4>
					</div>
					<div class="modal-body">

					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-submit" data-dismiss="modal">确定</button>
						<!-- 					<button type="button" class="btn btn-default btn-cancel" data-dismiss="modal">取消</button> -->
					</div>
				</div>
			</div>
		</div>




	</body>
</html>