<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="baseUrl" value="${pageContext.request.contextPath}"></c:set>
<html lang="en-US">
<head>
<head>
<title>ACDP Dashboard</title>
<script type="text/javascript" src="${baseUrl}/resources/js/jquery/jquery-1.9.0.js"></script>
<script type="text/javascript">
var j = jQuery.noConflict(true);
</script>
<link rel="stylesheet" type="text/css" href="${baseUrl}/resources/css/focusStyles.css" />
<script type="text/javascript" src="${baseUrl}/resources/js/report.script.js"></script>
<script type="text/javascript" src="${baseUrl}/resources/js/focus.assist.js"></script>
<script type="text/javascript" src="${baseUrl}/resources/js/jquery.focus.js"></script>
<script type="text/javascript" src="${baseUrl}/resources/js/ichart.1.2.min.js"></script>
<script type="text/javascript">
function readDashboard() {
var stageWidth = screen.width * 25 / 28;
var stageHeight = screen.height * 17 / 21;
$(".b").width(screen.width * 25 / 84);
$(".focusWrap").css({"width": stageWidth, "height": stageHeight});
$(".focusCon").width(stageWidth);
//vertical center
$("#page").css({"width": stageWidth, "margin-top": -(stageHeight) / 2, "margin-left": -(stageWidth) / 2});
$(".focusL").height(screen.height - 250);
$(".focusM").css({"width": stageWidth, "height": stageHeight});
$(".ulFCon li img").css({"width": stageWidth, "height": stageHeight});
$(".ulFCon li").height(stageHeight);
$("#j_Focus").Focus();
$(".projectName").css({"height": screen.height * 17 / 126, "color": "#3e576f", "margin-top": screen.height * 17 / 252 - 5});
}
$(document).ready(function(){
readDashboard();
// Set the refresh time
var interval = setInterval("getNewDashboardData()", 60000);
initDashboard();
});
function initDashboard() {
var allReportData = ${allData};
for(var proName in allReportData) {
var testData;
var testLabels;
var analysisData;
var deployData;
var deployLabels;
for(var paramData in allReportData[proName]) {
if(paramData == "testReport") {
testData = allReportData[proName][paramData];
} else if (paramData == "testLabels") {
testLabels = allReportData[proName][paramData];
} else if (paramData == "analysisReport") {
analysisData = allReportData[proName][paramData];
} else if (paramData == "deployReport") {
deployData = allReportData[proName][paramData];
} else if (paramData == "deployLabels") {
deployLabels = allReportData[proName][paramData];
}
//alert(allReportData[proName][paramData]);
}
showiChart2D(proName+"c1","Code Analysis","Ok",analysisData);
showColumnStacked2D(proName+"c2","Test Result","Ok",testLabels,testData);
showArea2D(proName+"c3","Job Status","subtitle","footText",deployLabels,deployData);
}
}
function getNewDashboardData() {
alert("start post");
j.post("refreshTheDashboard.shtml",function(result) {
if(result.code==1000){
var proIdArray = new Array();
var proNameArray = new Array();
// Deal with the project names.
var theProjectsObj = JSON.parse(result.data["projectNames"]);
for (var proName in theProjectsObj) {
proNameArray.push(theProjectsObj[proName]);
proIdArray.push(theProjectsObj[proName].replace(/\s/g, "").replace(/-/g,""));
}
var projectHtml = "";
projectHtml += "<ul class=\"ulFCon\" id=\"j_FocusCon\">";
var proNameLength = proNameArray.length;
for(var i = 0; i < proNameLength; i++){
var tempItem = proIdArray[i];
var tempItem1 = tempItem + "c1";
var tempItem2 = tempItem + "c2";
var tempItem3 = tempItem + "c3";
projectHtml = projectHtml + "<li>" +
"<div class=\"projectName\">" + proNameArray[i] + "</div>" +
"<div class=\"b\">" + "<div id=\""+tempItem1+"\">" + "</div></div>" +
"<div class=\"b\">" + "<div id=\""+tempItem2+"\">" + "</div></div>" +
"<div class=\"b\">" + "<div id=\""+tempItem3+"\">" + "</div></div>" +
"</li>";
}
projectHtml = projectHtml + "</ul>";
console.log("projectHtml:" + projectHtml);
$(".focusM").html(projectHtml);
readDashboard();
// ==============================I am separator===============================
/*var array = new Array();
$(".ulFCon").find(".b").each(function(){
array.push($(this).attr("id"));
});
var length = array.length;
for(var i = 0; i < length; i++) {
array[i] = array[i].replace(/\s/g, "").replace(/-/g,"");
}*/
// ===============================I am separator===============================
// Deal with the report.
var allReportDataObj = JSON.parse(result.data["allData"]);
for(var proName in allReportDataObj) {
var testData;
var testLabels;
var analysisData;
var deployData;
var deployLabels;
for(var paramData in allReportDataObj[proName]) {
if(paramData == "testReport") {
testData = allReportDataObj[proName][paramData];
} else if (paramData == "testLabels") {
testLabels = allReportDataObj[proName][paramData];
} else if (paramData == "analysisReport") {
analysisData = allReportDataObj[proName][paramData];
} else if (paramData == "deployReport") {
deployData = allReportDataObj[proName][paramData];
} else if (paramData == "deployLabels") {
deployLabels = allReportDataObj[proName][paramData];
}
//alert(allReportData[proName][paramData]);
}
showiChart2D(proName+"c1","Code Analysis","Ok",analysisData);
showColumnStacked2D(proName+"c2","Test Result","Ok",testLabels,testData);
showArea2D(proName+"c3","Job Status","subtitle","footText",deployLabels,deployData);
}
}
},"json");
}
</script>
<style type="text/css">
.b{ margin:0; padding:0; height:500px; float:left;}
.b div{ margin:0 2px; padding:0; height:500px;}
.projectName {
text-align: center;
background-color: #FFFFFF;
font-size: 28px;
font-weight: 500;
margin-bottom: 10px;
/*border-bottom: 1px solid #e1e1eb; margin-top: 30px; margin-bottom: 15px;*/
}
/*.projectName h2 {font-size: 28px; font-weight: 500; height: 50px; line-height: 50px; margin-bottom: 10px;}*/
</style>
</head>
<body id="introduction">
<div id="page">
<div id="container" class="content clearfix">
<div class="focusCon" id="j_Focus">
<!-- --------------middle begin------------ -->
<div class="focusM">
<ul class="ulFCon" id="j_FocusCon">
<c:forEach items="${projectNames}" var="projectName">
<li>
<div class="projectName">${projectName}</div>
<div class="b" id="${projectName.replaceAll(" ","").replaceAll("-", "")}c1"></div>
<div class="b" id="${projectName.replaceAll(" ","").replaceAll("-", "")}c2"></div>
<div class="b" id="${projectName.replaceAll(" ","").replaceAll("-", "")}c3"></div>
</li>
</c:forEach>
</ul>
</div>
<!-- ---------------middle end-------------- -->
</div>
</div>
</div>
</body>
</html>
Spring MVC异步刷新Web端代码
最新推荐文章于 2020-07-06 13:40:14 发布