提交 52a9c6db 编写于 作者: Y yong.you

add the metric full screen

上级 3555f3b0
......@@ -24,6 +24,10 @@ $(document).ready(function() {
var refresh = ${payload.refresh};
var frequency = ${payload.frequency};
var fullscreen = ${payload.fullScreen};
if(fullscreen){
$('#fullScreen').addClass('btn-danger');
}
if(refresh){
$('#refresh${payload.frequency}').addClass('btn-danger');
setInterval(function(){
......
......@@ -7,12 +7,46 @@
<jsp:useBean id="payload" type="com.dianping.cat.report.page.metric.Payload" scope="request"/>
<jsp:useBean id="model" type="com.dianping.cat.report.page.metric.Model" scope="request"/>
<a:body>
<res:bean id="res" />
<res:useCss value='${res.css.local.table_css}' target="head-css" />
<res:useJs value="${res.js.local['svgchart.latest.min.js']}" target="head-js"/>
<res:useJs value="${res.js.local['baseGraph.js']}" target="head-js"/>
<c:choose>
<c:when test="${payload.fullScreen}">
<res:useCss value='${res.css.local.body_css}' target="head-css" />
<res:useCss value="${res.css.local['bootstrap.css']}" target="head-css" />
<res:useJs value="${res.js.local['jquery-1.7.1.js']}" target="head-js" />
<res:useJs value="${res.js.local['bootstrap.min.js']}" target="head-js" />
<%@ include file="detail.jsp" %>
</c:when>
<c:otherwise>
<a:body>
<div class="report">
<table class="header">
<tr>
<td class="title">&nbsp;&nbsp;From ${w:format(model.startTime,'yyyy-MM-dd HH:mm:ss')} to ${w:format(model.endTime,'yyyy-MM-dd HH:mm:ss')}</td>
<td class="nav">
<c:forEach var="nav" items="${model.navs}">
&nbsp;[ <a href="${model.baseUri}?date=${model.date}&domain=${model.domain}&step=${nav.hours}&product=${payload.product}&test=${payload.test}&${navUrlPrefix}">${nav.title}</a> ]&nbsp;
</c:forEach>
&nbsp;[ <a href="${model.baseUri}?${navUrlPrefix}&product=${payload.product}">now</a> ]&nbsp;
</td>
</tr>
</table>
</br>
<%@ include file="detail.jsp" %>
<table class="footer">
<tr>
<td>[ end ]</td>
</tr>
</table>
</div>
</a:body>
</c:otherwise>
</c:choose>
<script type="text/javascript">
$(document).ready(function() {
<c:forEach var="item" items="${model.lineCharts}" varStatus="status">
......@@ -21,67 +55,24 @@
</c:forEach>
});
</script>
<div class="report">
<table class="header">
<tr>
<td class="title">&nbsp;&nbsp;From ${w:format(model.startTime,'yyyy-MM-dd HH:mm:ss')} to ${w:format(model.endTime,'yyyy-MM-dd HH:mm:ss')}</td>
<td class="nav">
<c:forEach var="nav" items="${model.navs}">
&nbsp;[ <a href="${model.baseUri}?date=${model.date}&domain=${model.domain}&step=${nav.hours}&product=${payload.product}&test=${payload.test}&${navUrlPrefix}">${nav.title}</a> ]&nbsp;
</c:forEach>
&nbsp;[ <a href="${model.baseUri}?${navUrlPrefix}&product=${payload.product}">now</a> ]&nbsp;
</td>
</tr>
</table>
</br>
<div class="container-fluid">
<%@ include file="metricOpNav.jsp" %>
<div class="row-fluid">
<div class="span2">
<div class="well sidebar-nav">
<ul class="nav nav-list">
<li class='nav-header active' id="${item.id}"><a href="?op=dashboard&date=${model.date}&domain=${model.domain}"><strong>业务大盘</strong></a></li>
<c:forEach var="item" items="${model.productLines}" varStatus="status">
<li class='nav-header' id="${item.id}"><a href="?date=${model.date}&domain=${model.domain}&product=${item.id}"><strong>${item.title}</strong></a></li>
</c:forEach>
<li >&nbsp;</li>
</ul>
</div><!--/.well -->
</div><!--/span-->
<div class="span10">
<h3 class='text-red'>说明:图中纵轴数据为10分钟数据之和</h3>
<c:forEach var="item" items="${model.lineCharts}" varStatus="status">
<div style="float:left;">
<h5 class="text-center text-error">${item.title}</h5>
<div id="${item.title}" class="metricGraph"></div>
</div>
</c:forEach>
</div>
<table class="footer">
<tr>
<td>[ end ]</td>
</tr>
</table>
</div>
</a:body>
<style type="text/css">
.row-fluid .span2{
width:10%;
}
.row-fluid .span10{
width:87%;
}
.well {
padding: 10px 10px 10px 19p;
}
.nav-list li a{
padding:2px 15px;
}
.nav li +.nav-header{
margin-top:2px;
}
.nav-header{
padding:5px 3px;
}
.row-fluid .span2{
width:10%;
}
.row-fluid .span10{
width:87%;
}
.well {
padding: 10px 10px 10px 19p;
}
.nav-list li a{
padding:2px 15px;
}
.nav li +.nav-header{
margin-top:2px;
}
.nav-header{
padding:5px 3px;
}
</style>
<%@ page contentType="text/html; charset=utf-8" %>
<%@ include file="metricOpNav.jsp" %>
<div class="row-fluid">
<div class="span2">
<div class="well sidebar-nav">
<ul class="nav nav-list">
<li class='nav-header active' id="${item.id}"><a href="?op=dashboard&date=${model.date}&domain=${model.domain}"><strong>业务大盘</strong></a></li>
<c:forEach var="item" items="${model.productLines}" varStatus="status">
<li class='nav-header' id="${item.id}"><a href="?date=${model.date}&domain=${model.domain}&product=${item.id}"><strong>${item.title}</strong></a></li>
</c:forEach>
<li >&nbsp;</li>
</ul>
</div><!--/.well -->
</div><!--/span-->
<div class="span10">
<h3 class='text-red'>说明:图中纵轴数据为10分钟数据之和</h3>
<c:forEach var="item" items="${model.lineCharts}" varStatus="status">
<div style="float:left;">
<h5 class="text-center text-error">${item.title}</h5>
<div id="${item.title}" class="metricGraph"></div>
</div>
</c:forEach>
</div></div>
\ No newline at end of file
......@@ -21,6 +21,10 @@
$(document).ready(function() {
var refresh = ${payload.refresh};
var frequency = ${payload.frequency};
var fullscreen = ${payload.fullScreen};
if(fullscreen){
$('#fullScreen').addClass('btn-danger');
}
if(refresh){
$('#refresh${payload.frequency}').addClass('btn-danger');
setInterval(function(){
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册