<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>审计统计</title>
    <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>
        .tr {
            text-align: center;
        }

        .td {
            height: 37px;
            line-height: 37px
        }

        #vdlist_filter {
            display: none;
        }

        body {
            max-height: 500px;
        }

        .table > thead > tr > th,
        .table > tbody > tr > th,
        .table > tfoot > tr > th,
        .table > thead > tr > td,
        .table > tbody > tr > td,
        .table > tfoot > tr > td {
            padding: 7px 0;
            line-height: 1.42857143;
            vertical-align: top;
            border-top: 1px solid #ddd;
        }

        @media screen and (min-width: 1200px) and (max-width: 1400px) {
            .table > thead > tr > th,
            .table > tbody > tr > th,
            .table > tfoot > tr > th,
            .table > thead > tr > td,
            .table > tbody > tr > td,
            .table > tfoot > tr > td {
                padding: 4px;
                line-height: 1.42857143;
                vertical-align: top;
                border-top: 1px solid #ddd;
            }

            body {
                min-width: 1620px;
                max-height: 500px;
            }
        }
    </style>
</head>
<body class="pd15 bg-white">
<div class="container-fluid">
    <div class="form-inline">
        <div class="row">
            <form class="form-inline ml15 header">
                <%@include file="../../include/time.jsp" %>
                <label class="form-group">用户名</label> <select
                    id="username" class="form-control">
            	</select>
                <label class="form-group">事件类型</label> <select
                    id="typeSelect" class="form-control">
            	</select> 
            	<label class="form-group">操作类型</label> <select
                    id="detailedSelect" class="form-control">
            	</select>
                <button id="query" type="button" title="查询" class="btn themeBGColor">
                    <i class="glyphicon glyphicon-search"></i>
                </button>
            </form>
        </div>
    </div>
</div>
<div>
    <table id="example"
           class="table table-striped table-bordered dataTable no-footer width100">
        <thead>
        <tr role="row">
            <th class="text-center">操作人员</th>
            <th class="text-center">事件类型</th>
            <th class="text-center">事件总数</th>
        </thead>
    </table>
</div>
<script src="${ctx}/js/plugin/jquery/jquery.min.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap.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}/js/basic.js"></script>
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
<script src="${ctx}/jspJS/utils/timeControl.js"></script>
<script src="${ctx}/jspJS/utils/loading.js"></script>
<script>
var options = $("#typeSelect option:selected").val();
var option = $("#detailedSelect option:selected").val();
var username = $("#username option:selected").val();
var endTime = getEndTime();
var startTime = getStartTime("年份", endTime);
var obj = document.getElementById('detailedSelect');
obj.options.add(new Option("全部", "")); // 全部
$(document).ready(function () {
    getUsername();
    geteventtype();
    load(username,options, option, startTime, endTime);
})

function getUsername(){
	$.ajax({
        type: 'POST',
        dataType: "json",
        cache: false,
        url: '/pqs9900/log/getUsername',
        data: {},
        error: function () {},
        success: function (data) {
            // 插入信息到combox中
            var obj = document.getElementById('username');
            obj.options.add(new Option("全部", "")); // 全部
            for (var i = 0; i < data.length; i++) {
                obj.options.add(new Option(data[i], data[i]));
            }
        }
    });
}

function geteventtype() {
    $.ajax({
        type: 'POST',
        dataType: "json",
        cache: false,
        url: '/pqs9900/type/getLog',
        error: function () {},
        success: function (data) {
            // 插入信息到combox中
            type = data;
            var obj1 = document.getElementById('typeSelect');
            obj1.options.add(new Option("全部", "")); // 全部

            var aoData = new Array();
        	var tmptype = "";
            
            for (var i = 0; i < data.length; i++) {
                obj1.options.add(new Option(data[i].dicTypeName, data[i].dicTypeIndex));

                var list = new Object();
                if(i == data.length-1){
                	tmptype += data[i].dicTypeIndex;
                }else{
                	tmptype += data[i].dicTypeIndex + ",";
                }
                list.type = tmptype;
            }
            aoData.push(list);
            getIndex(aoData);
        }
    });
}

function load(username,options, option, startTime, endTime) {
    var i;
    $.ajax({
        type: "POST",
        url: "/pqs9900/log/getSjtj",
        data: {
        	username : username,
            type: options,
            name: option,
            startTime: startTime,
            endTime: endTime
        },
        beforeSend: function () {
            i = ityzl_SHOW_LOAD_LAYER();
        },
        success: function (data) {
            //没有权限的请求
            if (data == 300) {
                location.href = '/pqs9900/auth/unauthorized';
                //没有登陆的请求
            } else if (data == 301) {
                location.href = '/pqs9900';
            } else {

                initTable(data.body);
            }
            //***********关闭loading
            ityzl_CLOSE_LOAD_LAYER(i);
        }
    });
}

function initTable(data) {
    $('#vdlist').dataTable().fnClearTable();
    oTable = $("#example").DataTable();
    oTable.clear().draw();
     oTable = $('#example').DataTable({
        destroy: true,
        "aaSorting": [[2, "asc"]],
        data: data,
         columns: [
             {"width": "33%"},
             {"width": "33%"},
             {"width": "33%"}
         ],
        lengthMenu: [10],
        language: {
            url: '/pqs9900/json/chine.json'
        },
         "createdRow": function (row, data, index) {
             if(data[2].length>8){
                 var realValue = data[2];
                 var s = data[2].substr(0, 8) + '...'
                 $('td', row).eq(2).prevObject[2].innerHTML = "<span title='" + realValue + "'>" + s + "</span>";
             }
         },
        'fnDrawCallback': function (oTable) {
            $("#example_paginate").append("<div style='float:right;padding-top:4px;padding-left:10px'>到第 <input type='text' id='changePage' class='input-text' style='width:50px;height:28px;'> 页  <button class='btn btn-primary' id='dataTable-btn'>确定</button></div>");
            var table = $("#example").dataTable();
            $('#dataTable-btn').click(function (e) {
                if ($("#changePage").val() && $("#changePage").val() > 0) {
                    var redirectpage = $("#changePage").val() - 1;
                } else {
                    var redirectpage = 0;
                }
                table.fnPageChange(redirectpage);
            });
        }
    });
    new $.fn.dataTable.Buttons(oTable, {
        buttons: [
            {
                extend: 'csv',//导出格式
                title: '日志统计列表',//导出csv名称
                exportOptions: {
                    columns: [0,1,2],//导出需要的列
                    format: {
                        body: function (data) {//对导出内容的筛选 data 表格内容 rid 行索引 cid 列索引
                            return data;
                        }
                    }
                }
            }
        ]
    });
    modifyCss(oTable);
}

$("body").on("click",".buttons-csv",function () {
	expcsv();
})

function expcsv(){
	var message = "导出日志统计列表";
	$.ajax({
        type: 'POST',
        dataType: "text",
        data:{
        	message:message
        },
        cache: false,
        url: '/pqs9900/log/expcsv',
        error: function () {},
        success: function (data) {
        	
        }
	})
}

function modifyCss(table) {
    table.buttons().container().css("display", "inline-block");
    table.buttons().container().css("float", "right");
    table.buttons().container().css("right", "4px");
    table.buttons().container().find("a").prepend("<i class='glyphicon glyphicon-share'></i>");
    table.buttons().container().appendTo('.header');
}

var type;
var detailed;
var dicTypeIndex;
var oTable;
var inter;
function getIndex(index) {
    $.ajax({
        type: 'POST',
        dataType: "json",
        cache: false,
        url: '/pqs9900/dic/selAllType',
        data: {
            typeId: JSON.stringify(index)
        },
        error: function () {},
        success: function (data) {
            // 插入信息到combox中
            for (var i = 0; i < data.length; i++) {
                obj.options.add(new Option(data[i].dicName, data[i].dicIndex));
            }
        }
    });
}

$("#query").click(function () {
    var options = $("#typeSelect option:selected").val();
    var option = $("#detailedSelect option:selected").val();
    var username = $("#username option:selected").val();
    var startTime = $("#startTime").val();
    var endTime = $("#endTime").val();
    var datatable = $('#example').DataTable();
    load(username,options, option, startTime, endTime);
})

$("#typeSelect").change(
        function () {
            var options = $("#typeSelect option:selected");
            var aoData = new Array();
        	var tmptype = "";
            if(options.val() == ""){
            	$("#typeSelect option").each(function(){
            		tmptype += $(this).val() + ",";
            	})
                tmptype = tmptype.substring(0, tmptype.lastIndexOf(','));
            }else{
                tmptype += options.val();
            }
            var list = new Object();
            list.type = tmptype;
            aoData.push(list);
            $("#detailedSelect").find("option").remove();
            $.ajax({
                type: 'POST',
                dataType: "json",
                cache: false,
                url: '/pqs9900/dic/selAllType',
                data: {
                    typeId: JSON.stringify(aoData)
                },
                error: function () {},
                success: function (data) {
                    detailed = data;
                    var obj = document.getElementById('detailedSelect');
                    obj.options.add(new Option("全部", "")); // 全部
                    // 插入信息到combox中
                    if(data.length == 0){
                        geteventtype();
                    }else {
                        for (var i = 0; i < data.length; i++) {
                            obj.options.add(new Option(data[i].dicName, data[i].dicIndex));
                        }
                    }
                }
            });
        });
</script>
</body>
</html>