<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html >
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>告警</title>
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${ctx}/css/plugin/bootstrap/bootstrap.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/bootstrap/dataTables.bootstrap.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/datatables/buttons.dataTables.min.css">
<link rel="stylesheet" href="${ctx}/css/basic.css">
<style type="text/css">
	#query{
		float:right;
		margin:2px 17px -6px 0px;
		background-color:#006565;
	}
</style>
</head>
<body>
	<div role="alert" style="background-color: #d9edf7">
            <table id="example"
		           class="table table-striped table-bordered dataTable no-footer"
		           cellspacing="0" width="100%" role="grid"
		           aria-describedby="example_info">
		        <thead>
		        <tr role="row">
		            <th class="text-center">事件ID</th>
		            <th class="text-center">操作时间</th>
		            <th class="text-center">详细事件</th>
		            <th class="text-center">事件描述</th>
		            <th class="text-center">事件类型</th>
		            <th class="text-center">操作IP</th>
		            <th class="text-center">等级</th>
		        </thead>
		    </table>
	</div>
	<script src="${ctx}/js/plugin/jquery.min.js"></script>
	<script src="${ctx}/js/plugin/bootstrap/jquery.dataTables.min.js"></script>
	<script src="${ctx}/js/plugin/bootstrap/dataTables.bootstrap.min.js"></script>
	<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.min.js"></script>
	<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.zh-CN.js"></script>
	<script src="${ctx}/js/plugin/bootstrap-table/bootstrap-table.js"></script>
	<script src="${ctx}/js/plugin/bootstrap-table/locales/bootstrap-table-zh-CN.js"></script>
	<script src="${ctx}/js/plugin/bootstrap-table/bootstrap-table.js"></script>
	<script src="${ctx}/js/plugin/layui/layer.js"></script>
	<script src="${ctx}/js/plugin/datatables/dataTables.buttons.min.js"></script>
	<script src="${ctx}/js/plugin/datatables/buttons.html5.min.js"></script>
	<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
	<script src="${ctx}/jspJS/utils/loading.js"></script>
	<script type="text/javascript">
	$(document).ready(function () {
		var type = 1;
		$.ajax({
			type : "POST",
	        url: "/pqs9900/log/getWarnInfo",
	        data: {
	        	type : type
	        },
			success : function(data) {
				initTable(data.body);
			}
		});
	});
	var table=null;

	/**
	 * @param data
	 * @returns
	 * 初始化表格
	 */
	 function initTable(data) {
		   var  oTable = $('#example').DataTable({
		        destroy: true,
		        "aaSorting": [[5, "desc"]],
		        data: data,
		        "columnDefs" : [ {
			        "targets": 0,
			        "visible": false,
			        "searchable": false
			    }],
		        dom: 'rt',
		        scrollY: '160px',
		        lengthMenu: [12],
		        language: {
		            url: '/pqs9900/json/chine.json'
		        }
		    });
		}
	</script>
</body>
</html>