123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357 |
- <style type="text/css">
- .queryform_item{float:left;width: 20%}
- .queryform_label{float:left;width: 7rem;text-align: right;}
- .queryform_inputblock{float:left;margin:1rem !important;width:13.5rem;}
- </style>
- <script type="text/javascript" src="/static/js/log.js"></script>
- <div class="children-content">
- <blockquote class="layui-elem-quote" style="padding:10px;line-height:25px;">
- 系统管理 / 日志报表
- </blockquote>
- <div style="position:relative;width:100%;">
- <div class="layui-panel" id="log_query_panel" style="height:15rem;line-height: 4.5rem;">
- <form class="layui-form layui-form-pane" action="">
- <div class="queryform_item">
- <span class="queryform_label">操作结果:</span>
- <div class="layui-input-block queryform_inputblock">
- <select id="combox_success">
- <option value="">全部</option>
- <option value="1">成功</option>
- <option value="0">失败</option>
- </select>
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">审计分类:</span>
- <div class="layui-input-block queryform_inputblock">
- <select id="combox_audittype">
- <option value="">全部</option>
- </select>
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">操作分类:</span>
- <div class="layui-input-block queryform_inputblock">
- <select id="combox_opttype">
- <option value="">全部</option>
- </select>
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">事件类型:</span>
- <div class="layui-input-block queryform_inputblock">
- <select id="combox_eventtype">
- <option value="">全部</option>
- </select>
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">事件等级:</span>
- <div class="layui-input-block queryform_inputblock">
- <select id="combox_eventlevel">
- <option value="">全部</option>
- </select>
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">开始日期:</span>
- <div class="layui-input-inline queryform_inputblock">
- <input type="text" readonly="" id="text_startdate" style="text-align:center;padding:0;" autocomplete="off" class="layui-input"/>
- </div>
- </div>
- <div style="float:left;width: 20%">
- <span class="queryform_label">结束日期:</span>
- <div class="layui-input-inline queryform_inputblock">
- <input type="text" readonly="" id="text_enddate" style="text-align:center;padding:0;" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">操作人:</span>
- <div class="layui-input-inline queryform_inputblock">
- <input type="text" maxlength="10" id="text_staff" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">操作IP:</span>
- <div class="layui-input-inline queryform_inputblock">
- <input type="text" maxlength="10" id="text_ip" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="queryform_item">
- <span class="queryform_label">日志内容:</span>
- <div class="layui-input-inline queryform_inputblock">
- <input type="text" maxlength="50" id="text_description" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div style="float:left;width: 100%">
- <button id="btnSearch" type="button" class="layui-btn layui-btn-normal" style="margin-left:40px;height:32px;line-height:32px;" onclick="QueryData();">查询</button>
- <button id="btnSearch" type="button" class="layui-btn layui-btn-normal" style="margin-left:40px;height:32px;line-height:32px;" onclick="QueryReset();">重置</button>
- </div>
- </form>
- </div>
- </div>
- <div id="echarts_pie" style="width: 38%;height: 40rem;float: left;margin-top: 2%;padding:1%"></div>
- <div id="echarts_line" style="width: 57%; height: 40rem; float: left; user-select: none;margin-top: 2%;padding: 1%;background-color: #f4f0f0;"></div>
- </div>
- <script type="text/html" id="options_tpl">
- <option value="">请选择</option>
- {{each data}}
- <option value="{{$value.code}}">{{$value.name}}</option>
- {{/each}}
- </script>
- <script type="text/javascript">
- var TypeColor = "#134BEA";
- $(document).ready(function () {
- $.getJSON("/api/getGlobalCode",{"pcode":"log_opttype","pagesize":1000},function(jsondata){
- if(jsondata.code!=0){
- layui.msg(jsondata.msg);
- return;
- }
- var optionslst=template('options_tpl',jsondata);
- $("#combox_opttype").html(optionslst);
- layui.form.render("select");
- })
- $.getJSON("/api/getGlobalCode",{"pcode":"log_audittype","pagesize":1000},function(jsondata){
- if(jsondata.code!=0){
- layui.msg(jsondata.msg);
- return;
- }
- var optionslst=template('options_tpl',jsondata);
- $("#combox_audittype").html(optionslst);
- layui.form.render("select");
- })
- $.getJSON("/api/getGlobalCode",{"pcode":"log_optresult","pagesize":1000},function(jsondata){
- if(jsondata.code!=0){
- layui.msg(jsondata.msg);
- return;
- }
- var optionslst=template('options_tpl',jsondata);
- $("#combox_success").html(optionslst);
- layui.form.render("select");
- })
- $.getJSON("/api/getGlobalCode",{"pcode":"log_eventtype","pagesize":1000},function(jsondata){
- if(jsondata.code!=0){
- layui.msg(jsondata.msg);
- return;
- }
- var optionslst=template('options_tpl',jsondata);
- $("#combox_eventtype").html(optionslst);
- layui.form.render("select");
- })
- $.getJSON("/api/getGlobalCode",{"pcode":"log_eventlevel","pagesize":1000},function(jsondata){
- if(jsondata.code!=0){
- layui.msg(jsondata.msg);
- return;
- }
- var optionslst=template('options_tpl',jsondata);
- $("#combox_eventlevel").html(optionslst);
- layui.form.render("select");
- })
- $('#text_startdate,#text_enddate').val(Global.GetCurrentDate());
- layui.use(['form', 'layedit', 'laydate'], function () {
- var laydate = layui.laydate;
- laydate.render({
- elem: '#text_startdate,#text_enddate'
- });
- });
- QueryData();
- });
- function QueryReset(){
- $("#log_query_panel").find("input,select").each(function() {
- $(this).val("");
- });
- QueryData();
- }
- function QueryData(){
- var parameter = {"stattype":"logtype"};
- $("#log_query_panel").find("input,select").each(function() {
- var id = $.trim($(this).attr("id")),
- v = $(this).val();
- if (id != "") {
- id = id.replace("text_", "").replace("combox_", "");
- parameter[id] = v;
- }
- });
- $.getJSON(Global.AccessUrl + "/api/log/datastat",parameter,function(jsondata){
- if(jsondata.code!=0){
- layer.msg(jsondata.msg);
- return;
- }
- ShowLine(jsondata.data);
- ShowPie(jsondata.data);
- });
- }
- function ShowPie(piedata){
- var chartDom = document.getElementById("echarts_pie");
- echarts.init(chartDom).dispose();
- if(piedata==null){
- return;
- }
- for (var i = 0; i < piedata.length; i++) {
- piedata[i]["name"] = piedata[i].logtypename;
- piedata[i]["value"]=piedata[i].num;
- }
- var myChart = echarts.init(chartDom);
- var option={
- tooltip: {
- trigger: "item",
- formatter: "{b}:{d}%",
- },
- grid: {
- bottom: "bottom",
- left:"5%"
- },
- legend: {
- orient: "vertical",
- left: "left",
- top: "4%",
- textStyle: {
- color: "#48C3FF",
- fontSize: 12,
- },
- itemGap: 7,
- itemWidth: 10,
- itemHeight: 5,
- height: 300,
- },
- color: [
- "#1389FF",
- "#48C3FF",
- "#68F0D6",
- "#FFDA73",
- "#F39A33",
- "#FF7373",
- "#DA30EE",
- "#827DFF",
- ],
- series: [
- {
- name: "",
- type: "pie",
- radius: ["40%", "70%"],
- center: ["60%", "50%"],
- data: piedata,
- emphasis: {
- itemStyle: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: "rgba(0, 0, 0, 0.5)",
- },
- },
- label: {
- show: true,
- },
- },
- ],
- }
- myChart.setOption(option);
- }
- function ShowLine(linedata){
- var chartDom = document.getElementById("echarts_line");
- echarts.init(chartDom).dispose();
- if(linedata==null){
- return;
- }
- var XData=[],YData=[];
- for (var i = 0; i < linedata.length; i++) {
- XData.push(linedata[i]["logtypename"]);
- YData.push(linedata[i]["num"]);
- }
-
- var myChart = echarts.init(chartDom);
- var option = {
- grid: {
- top: '5%',
- left: '5%',
- right: '5%',
- bottom: '10%',
- },
- xAxis: [{
- type: 'category',
- boundaryGap: true, //柱子是否不从0开始
- axisLine: { //坐标轴轴线相关设置。数学上的x轴
- show: true,
- lineStyle: {
- color: '#000'
- },
- },
- axisLabel: { //坐标轴刻度标签的相关设置
- interval: 0, //显示全部标签
- rotate: -30,
- textStyle: {
- color: '#000',
- padding: 0,
- fontSize: 12
- }
- },
- splitLine: {
- show: false
- },
- axisTick: {
- show: false,
- },
- data: XData
- }],
- yAxis: [{
- name: "条",
- nameTextStyle: {
- color: "#000",
- fontSize: 10 ,
- padding: 0
- },
- min: 0,
- splitLine: {
- show: true,
- lineStyle: {
- type: "dashed",
- color: '#000'
- }
- },
- axisLine: {
- show: false,
- lineStyle: {
- color: "#F3F5FA"
- }
- },
- axisLabel: {
- show: true,
- textStyle: {
- color: '#000',
- fontSize: 10 ,
- padding: 0
- }
- },
- axisTick: {
- show: false,
- },
- }],
- series: [{
- type: 'line',
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: TypeColor,
- }
- },
- itemStyle: {
- color: TypeColor,
- //borderColor: TypeColor,
- //borderWidth: 2,
- barBorderRadius: [10, 10, 0, 0]
- },
- tooltip: {
- show: false
- },
- data: YData
- }]
- };
- option && myChart.setOption(option);
- }
- </script>
|