码迷,mamicode.com
首页 > 其他好文 > 详细

result-charts

时间:2016-07-05 17:14:55      阅读:346      评论:0      收藏:0      [点我收藏+]

标签:

<%@ 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 class="col-lg-6" id="topn">
                        <button class="btn-pm btn-top15" id="echart-15" >Top15</button>
                        <button class="btn-pm btn-top20" id="echart-20">Top20</button>
                        &nbsp;&nbsp; <input id="topNum" type="text"
                            class="btn-pm btn-topN" placeholder="Top(N)"
                            style="width: 60px;" maxlength="2">
                    </div>
                    <div id="container" style="min-width: 700px; min-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 pmResults}">
                                    <c:forEach items="${pmResults}" var="result" varStatus="res">
                                        <tr class="center">
                                            <td class=‘center‘ style="width: 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 class="center">${result.TOTAL_TIME}分钟</td>
                                            <td 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 legendData=[];
    var series="";
    var ser="";
    var legend="";
    var option={};
    function opSeries(){
        option ={
                chart: {
                    type: ‘bar‘
                },  
                title: {
                         text: ‘性能数据采集到入库关键节点处理效率报表‘
                     },
                  xAxis: {  
                      categories: legendData  
                  },  
                  yAxis: { 
                         title: {
                             text: ‘关键节点处理时间 (分钟)‘
                         } 
                  },
                  plotOptions: {
                      line: {
                          dataLabels: {
                              enabled: true
                          },
                          enableMouseTracking: false
                      }
                  },
                  plotLines: [{
                      value: 0,
                      width: 1,
                      color: ‘#808080‘
                  }],
              tooltip: {
                  valueSuffix: ‘分钟‘
              },
                  series: [{name:"",value:[]}
                           ]
          }
    }
    
  $(function () {
      var taskId = ${pd.taskId};
      $.ajax({
          type: "post",
          async: false, //同步执行
          url: "task/result_charts",
          data:{taskId:taskId},
          dataType: "json", //返回数据形式为json
          success: function (pmResults) {
            opSeries(); 
            for(j=0;pmResults[0].categorys.length > j;j++){
                legendData.push(pmResults[0].categorys[j]);
            }
            for(k=0;pmResults[0].series.length > k;k++){
                option.series[k] = pmResults[0].series[k];
            } 
          },
          error: function (errorMsg) {
          }
      }); 
      $("#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>

 

result-charts

标签:

原文地址:http://www.cnblogs.com/onetwo/p/5644101.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!