<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE html> <html lang="zh"> <head> <base href="<%=basePath%>"> <!-- jsp文件头和头部 --> <%@ include file="../admin/top.jsp"%> </head> <body> <div class="container-fluid" id="main-container"> <div id="page-content" class="clearfix"> <div class="row-fluid"> <div class="row-fluid"> <div id="container" style="min- 700px; height: 500px"></div> <div id="main" style=" 100%; height: 500px"></div> <!-- 报表 --> <table id="table_report" class="table table-striped table-bordered table-hover center"> <thead> <tr class="center"> <th>序号</th> <th>网元</th> <th>采集粒度</th> <th>收到消息(receive)</th> <th>获取数据(process 2)</th> <th>转换数据(process 3)</th> <th>存储数据(process 5)</th> <th>入库完成(process 7)</th> <th>总时间</th> <th class="center">错误信息</th> </tr> </thead> <tbody> <!-- 开始循环 --> <c:choose> <c:when test="${not empty resultList}"> <c:forEach items="${resultList}" var="result" varStatus="res"> <tr class="center"> <td class='center' style=" 30px;">${res.index+1}</td> <td class="center"><a href="task/pm_detail.do?pm_id=${PM_RESULT_ID} }">${result.NEID}</a></td> <td class="center">${result.TIME_SPAN}</td> <td class="center"><a style="cursor: pointer;" target="mainFrame" onclick="result(${result.PM_RESULT_ID},${res.index+1},'task/pm_detail.do?step=1')">${result.RECEIVE_REPORT_MSG_TIME}</a></td> <td class="center"><a style="cursor: pointer;" target="mainFrame" onclick="result(${result.PM_RESULT_ID},${res.index+1},'task/pm_detail.do?step=2')">${result.PROCESS_GET_FILE_TIME}</a></td> <td class="center"><a style="cursor: pointer;" target="mainFrame" onclick="result(${result.PM_RESULT_ID},${res.index+1},'task/pm_detail.do?step=3')">${result.PROCESS_PARSE_TIME}</a></td> <td class="center"><a style="cursor: pointer;" target="mainFrame" onclick="result(${result.PM_RESULT_ID},${res.index+1},'task/pm_detail.do?step=5')">${result.PROCESS_STORE_TIME}</a></td> <td class="center"><a style="cursor: pointer;" target="mainFrame" onclick="result(${result.PM_RESULT_ID},${res.index+1},'task/pm_detail.do?step=7')">${result.PROCESS_FINISH_TIME}</a></td> <td style=" 60px;" class="center">${result.TOTAL_TIME}</td> <td style=" 60px;" class="center"><a style="cursor: pointer;" target="mainFrame" onclick="result(${result.PM_RESULT_ID},${res.index+1},'task/pm_reslut_log.do?')">查看日志</a></td> </tr> </c:forEach> </c:when> <c:otherwise> <tr class="main_info"> <td colspan="100" class="center">没有相关数据</td> </tr> </c:otherwise> </c:choose> </tbody> </table> </form> </div> <!-- PAGE CONTENT ENDS HERE --> </div> <!--/row--> </div> <!--/#page-content--> </div> <!--/.fluid-container#main-container--> <!-- 引入 --> <script type="text/javascript">window.jQuery || document.write("<script src='static/js/jquery-1.9.1.min.js'>x3C/script>");</script> <script src="static/js/bootstrap.min.js"></script> <script src="static/js/ace-elements.min.js"></script> <script src="static/js/ace.min.js"></script> <!-- 引入 --> <script type="text/javascript"> { $(top.hangge()); //检索 function search(){ top.jzts(); $("#Form").submit(); } //删除 function del(taskId){ if(confirm("确定要删除?")){ top.jzts(); var url = '<%=basePath%>task/delete.do?taskId='+taskId; $.get(url,function(data){ /* nextPage(${page.currentPage}); */ }); } } </script> <script type="text/javascript"> //全选 (是/否) function selectAll(){ var checklist = document.getElementsByName ("ids"); if(document.getElementById("zcheckbox").checked){ for(var i=0;i<checklist.length;i++){ checklist[i].checked = 1; } }else{ for(var j=0;j<checklist.length;j++){ checklist[j].checked = 0; } } } //批量操作 function makeAll(msg){ if(confirm(msg)){ var str = ''; for(var i=0;i < document.getElementsByName('ids').length;i++) { if(document.getElementsByName('ids')[i].checked){ if(str=='') str += document.getElementsByName('ids')[i].value; else str += ',' + document.getElementsByName('ids')[i].value; } } if(str==''){ alert("您没有选择任何内容!"); return; }else{ if(msg == '确定要删除选中的数据吗?'){ top.jzts(); $.ajax({ type: "POST", url: '<%=basePath%>task/deleteAll.do?tm='+new Date().getTime(), data: {DATA_IDS:str}, dataType:'json', //beforeSend: validateData, cache: false, success: function(data){ $.each(data.list, function(i, list){ /* nextPage(${page.currentPage}); */ }); } }); } } } //导出excel function toExcel(){ window.location.href='<%=basePath%>task/excel.do'; } //查看报表 function result(id,number,url){ top.mainFrame.tabAddHandler(id,"节点详细-"+number,url); if(url != "druid/index.html"){ jzts(); } } </script> <script type="text/javascript"> var myChart; myChart = echarts.init(document.getElementById('main')); var legendDate=""; var series=""; var ser=""; var legend=""; var option={}; $.ajax({ type: "post", async: false, //同步执行 url: "", dataType: "json", //返回数据形式为json success: function (result) { }, error: function (errorMsg) { legendDate = ["2014","2015","2016"]; series = [ { "name":"2014", "type":"bar", "data":[51, 2, 43],"len":"中国"} ,{ "name":"2015", "type":"bar", "data":[55, 36, 4] ,"len":"美国"},{ "name":"2016", "type":"bar", "data":[5, 20, 40],"len":"英国"}]; ser = [ { "name":"2014", "type":"bar", "data":[51, 2, 43]} ,{ "name":"2015", "type":"bar", "data":[55, 36, 4]},{ "name":"2016", "type":"bar", "data":[5, 20, 40]}]; legend = ["中国","美国","德国"]; optionSeries(); for(i=0;series.length>i;i++){ option.series[i]=series[i]; } } }); function optionSeries(){ option = { title: { text: '性能数据采集入库效率趋势图' }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, legend: { data: legendDate }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'value', boundaryGap: [0, 0.01] }, yAxis: { type: 'category', data: legend }, series: [ ] }; } //通过Ajax获取数据 myChart.setOption(option); </script> <script type="text/javascript"> var legendDate=""; var series=""; var ser=""; var legend=""; var option={}; function opSeries(){ option ={ title: { text: '性能数据采集到入库关键节点处理效率报表' }, xAxis: { title: { text: '网元采集粒度' }, categories: legendDate }, yAxis: { title: { text: '关键节点处理时间 (分钟)' }, plotLines: [{ value: 0, 1, color: '#808080' }] }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'middle', borderWidth: 0 }, tooltip: { valueSuffix: ' 分钟' }, plotOptions: { bar: { dataLabels: { enabled: true } } }, credits: { enabled: false }, series: [] } } $(function () { $.ajax({ type: "post", async: false, //同步执行 url: "", dataType: "json", //返回数据形式为json success: function (result) { }, error: function (errorMsg) { legendDate = ["2014","2015","2016"]; series = [ { "name":"2014", "type":"bar", "data":[51, 2, 43],"len":"中国"} ,{ "name":"2015", "type":"bar", "data":[55, 36, 4] ,"len":"美国"},{ "name":"2016", "type":"bar", "data":[5, 20, 40],"len":"英国"}]; ser = [ { "name":"2014", "type":"bar", "data":[51, 2, 43]} ,{ "name":"2015", "type":"bar", "data":[55, 36, 4]},{ "name":"2016", "type":"bar", "data":[5, 20, 40]}]; legend = ["中国","美国","德国"]; //showChart(); opSeries(); for(i=0;series.length>i;i++){ console.log("highchart循环内i的值:"+i); option.series[i]=series[i]; console.log("option2.series["+i+"]--------"+"series["+i+"]:"+series[i]); } } }); $("#container").highcharts(option); }); </script> <style type="text/css"> li { list-style-type: none; } </style> <ul class="navigationTabs"> <li><a></a></li> <li></li> </ul> </body> </html>