ops / monitor-ui · Commits

Go to a project

Authored by lingmin
Commit 07c0b9f24ec5fd99929157c6e617303529bd1e11 1 parent 1d36600b

update

Inline Side-by-side
Showing 5 changed files with 462 additions and 380 deletions
... ... @@ -154,5 +154,6 @@ public class HttpUriContants {
//java监控信息
public static final String JAVA_MONITOR_GET = "/newJavaApiInfo/queryByServiceType";
public static final String JAVA_GRAPH_GET = "/newJavaApiInfo/getJavaApiGraph";
public static final String JAVA_IP_LIST = "/newJavaApiInfo/getIPList";
}
... ...
... ... @@ -63,4 +63,15 @@ public class JavaMonitorCtrl {
return rep;
}
@RequestMapping("/queryIpList")
@ResponseBody
public BaseResponse queryIpList(JavaApiMonitorReq req) {
//校验参数
if(StringUtils.isEmpty(req.getServiceName())){
req.setServiceName("gateway");
}
BaseResponse rep = httpClient.defaultPost(HttpUriContants.JAVA_IP_LIST, req, BaseResponse.class);
return rep;
}
}
... ...
... ... @@ -5,14 +5,23 @@
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
String serviceType = request.getParameter("serviceType");
String serviceName = request.getParameter("serviceName");
String startTime = request.getParameter("startTime");
String endTime = request.getParameter("endTime");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<jsp:include page="/jsp/common/include.jsp" flush="true" />
<jsp:include page="/jsp/common/include.jsp" flush="true"/>
<script>
var contextPath = '<%=basePath %>';
var serviceType = "<%=serviceType %>";
var serviceName = "<%=serviceName%>";
var startTime = "<%=startTime%>>";
var endTime = "<%=endTime%>>"
var homeUrl = contextPath + "jsp/javaMonitor/javaMonitor.jsp";
</script>
<title>YOHO!运维</title>
</head>
... ... @@ -25,7 +34,8 @@
<div id="content">
<div id="breadcrumb">
<a href="#" title="Go to Home" class="tip-bottom"><i
class="icon-home"></i> Java服务</a> <a href="#" class="current">服务监控</a><a href="#" class="current">API详情</a>
class="icon-home"></i> Java服务</a> <a href='<%=basePath %>jsp/javaMonitor/javaMonitor.jsp' class="current">服务监控</a><a href="#"
class="current">API详情</a>
</div>
<div class="container-fluid">
<div class="widget-box">
... ... @@ -34,43 +44,37 @@
</div>
<div class="widget-content nopadding">
<div class="widget-title" style="height: 53px;">
<div class="form-inline" role="form" id="inBoxQueryDiv"
style=" margin-top: 12px;margin-left: 25px;float: left;">
<div class="input-group" style="float: left;">
<span class="input-group-addon">服务名：</span>
<select id="searchApiName" name="searchApiName" class="form-control" disabled>
</select>
</div>
<div class="input-group" style="margin-left: 10px">
<span class="input-group-addon">IP：</span>
<select id="iPName" name="iPName" class="form-control" onchange="getOnchange()">
</select>
</div>
<div class="form-inline" role="form" id="inBoxQueryDiv"
style=" margin-top: 12px;margin-left: 25px;float: left;">
<div class="input-group" style="float: left;">
<span class="input-group-addon">服务名：</span>
<input type="text" id="serviceType" name="serviceType" class="form-control" disabled>
</input>
</div>
<div class="input-group" style="margin-left: 10px">
<span class="input-group-addon">IP：</span>
<select id="iPName" name="iPName" class="form-control" style="width: 200px">
</select>
</div>
</div>
</div>
<div id="infoTableDiv">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">
<a href="#ipPart" aria-controls="ipPart" role="tab" data-toggle="tab">IP</a>
</li>
<li role="presentation">
<a href="#timesPart" aria-controls="timesPart" role="tab" data-toggle="tab">异常次数</a>
</li>
<li role="presentation">
<a href="#costPart" aria-controls="costPart" role="tab" data-toggle="tab">平均耗时</a>
</li>
</ul>
<div class="tab-content" style="padding-top:10px">
<div role="tabpanel" class="tab-pane fade in active" id="ipPart">
<div id="ipInfoTable"></div>
</div>
<div role="tabpanel" class="tab-pane fade" id="timesPart">
<div id="infoTable"></div>
</div>
<div role="tabpanel" class="tab-pane fade" id="costPart">
<div id="infoTable1"></div>
</div>
<div class="tab-content" style="padding-top:10px">
<div role="tabpanel" class="tab-pane fade in active" id="timesPart">
<div id="infoTable"></div>
</div>
<div role="tabpanel" class="tab-pane fade" id="costPart">
<div id="infoTable1"></div>
</div>
</div>
</div>
</div>
</div>
... ... @@ -81,6 +85,7 @@
<script>
$("#li_monitor").addClass("active open");
$("#li_javaMonitor").addClass("active");
$("#serviceType").val(serviceName);
</script>
<script>
var java_api_type = [];
... ... @@ -97,252 +102,119 @@
});
});
//类型选择事件
function getOnchange(){
$("#ipInfoTable").table("load", {
function getOnchange() {
$("#infoTable").table("load", {
serviceType: $("#searchApiName").val(),
serviceName: $("#searchApiName").select("getText")
});
drawLine(1,"平均耗时-曲线图",$("#searchApiName").select("getText"));
drawLine(2,"异常次数-曲线图",$("#searchApiName").select("getText"));
});
}
$(function () {
$("#searchApiName").select({
valueField: "typeId",
textField: "typeName",
className: "form-control",
url: contextPath + "/type/queryJavaApiType",
loadFilter: function (data) {
return defaultLoadFilter(data);
var getJavaAppType = function () {
$.ajax({
url: contextPath + "/javaMonitor/queryIpList",
type: 'post',
data : {
serviceType:serviceType
},
onLoadSuccess:function(data){
if(data.length>0){
$("#ipInfoTable").table("load", {
serviceType: data[0].typeId,
serviceName: data[0].typeName,
timeInterval:$("#timeInterval").val()
});
}
dataType:'json',
success: function (data) {
var selObj = $("#iPName");
selObj.append("<option value=0>" + "all" + "</option>");
$.each(data.data, function (idx, val) {
selObj.append("<option value='" + val + "'>" + val + "</option>");
});
}
});
};
$("#iPName").select({
valueField: "moId",
textField: "moHostIp",
className: "form-control",
url: contextPath + "/javaApi/details",
queryParams : {
id : $("#searchApiName").val()
},
loadFilter: function (data) {
return defaultLoadFilter(data);
},
onLoadSuccess:function(data){
// if(data.length>0){
// $("#ipInfoTable").table("load", {
// serviceType: data[0].typeId,
// serviceName: data[0].typeName
// });
// }
}
});
$(function () {
getJavaAppType();
$("#ipInfoTable").table({
$("#infoTable").table({
columnAutoWidth: false,
url: contextPath + "/javaMonitor/query",
striped: true,
title: "java服务监控信息列表",
dataType: "json",
sortable: true, //是否启用排序
sortOrder:"desc",
sortOrder: "desc",
loadFilter: function (data) {
return defaultLoadFilter(data);
},
onLoadSuccess: function (data) {
//同步加载根据异常次数排序的tab页列表
var errorObj = new Array();
for(var i = 0;i<data.length;i++){
for (var i = 0; i < data.length; i++) {
errorObj.push(data[i]);
}
//按异常次数从大到小排序
errorObj.sort(function(a,b){
return b.errorCount-a.errorCount;
});
$("#infoTable").table("loadLoaclData", errorObj);
//同步加载根据平均耗时排序的tab页列表
var costObj = new Array();
for(var j = 0;j<data.length;j++){
costObj.push(data[j]);
}
//按平均耗时从大到小排序ss
costObj.sort(function(a,b){
return b.avgCost-a.avgCost;
errorObj.sort(function (a, b) {
return b.errorCount - a.errorCount;
});
$("#infoTable1").table("loadLoaclData", costObj);
$("#infoTable1").table("loadLoaclData", errorObj);
},
columns: [{
title: "IP",
title: "接口名",
field: "ip",
width: "10%",
sortable:true
}, {
title: "网络归属",
field: "type",
width: "10%"
}, {
title: "总请求次数",
field: "totalCount",
width: "10%",
sortable:true
}, {
title: "请求异常次数",
field: "errorCount",
width: "10%",
sortable:true,
formatter : function(value, rowData, rowIndex) {
sortable: true,
formatter: function (value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.errorCount).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if(rowData.errorInfo != null){
for(var i = 0;i<rowData.errorInfo.length;i++){
content= content +rowData.errorInfo[i]+"<br><br>";
}
}
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html(rowData.ip).appendTo(div);
editBtn.click(function () {
var dialog = $("<div>").appendTo($("body"));
dialog.dialog({
backdrop : "static",
title : "异常详情",
content : content,
height : "60%",
width : "50%",
buttons : [{
text : "关闭",
className : "btn-danger",
onclick : function() {
backdrop: "static",
title: "API详情",
href: contextPath + "jsp/javaMonitor/javaIpInfoList.jsp",
height: "80%",
width: "60%",
buttons: [{
text: "关闭",
className: "btn-info",
onclick: function () {
$(dialog).dialog("hide");
}
}]
});
});
return div;
}
},{
title: "平均耗时(ms)",
field: "avgCost",
width: "10%",
sortable:true,
formatter : function(value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.avgCost).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if(rowData.errorInfo != null){
for(var i = 0;i<rowData.errorInfo.length;i++){
content= content +rowData.errorInfo[i]+"<br><br>";
}
}
// editBtn.click(function () {
// var dialog = $("<div>").appendTo($("body"));
// dialog.dialog({
// backdrop : "static",
// title : "异常详情",
// content : content,
// height : "60%",
// width : "50%",
// buttons : [{
// text : "关闭",
// className : "btn-danger",
// onclick : function() {
// $(dialog).dialog("hide");
// }
// }]
// });
// });
return div;
}
}, {
title: "CPU使用率",
field: "cpuRate",
width: "10%"
},{
title: "内存使用率",
field: "memoryRate",
width: "10%"
}, {
title: "IO使用率",
field: "ioRate",
width: "10%"
}, {
title: "带宽（IN/OUT）",
field: "bandwidth",
width: "10%"
}]
});
$("#infoTable").table({
columnAutoWidth: false,
striped: true,
title: "java服务监控信息列表",
dataType: "json",
sortable: true, //是否启用排序
sortOrder:"desc",
// loadFilter: function (data) {
// return defaultLoadFilter(data);
// },
onLoadSuccess: function (data) {
},
columns: [{
title: "IP",
field: "ip",
width: "10%",
sortable:true
}, {
title: "网络归属",
field: "type",
width: "10%"
}, {
title: "总请求次数",
field: "totalCount",
width: "10%",
sortable:true
sortable: true
}, {
title: "请求异常次数",
field: "errorCount",
width: "10%",
sortable:true,
formatter : function(value, rowData, rowIndex) {
sortable: true,
formatter: function (value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.errorCount).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if(rowData.errorInfo != null){
for(var i = 0;i<rowData.errorInfo.length;i++){
content= content +rowData.errorInfo[i]+"<br><br>";
if (rowData.errorInfo != null) {
for (var i = 0; i < rowData.errorInfo.length; i++) {
content = content + rowData.errorInfo[i] + "<br><br>";
}
}
editBtn.click(function () {
var dialog = $("<div>").appendTo($("body"));
dialog.dialog({
backdrop : "static",
title : "异常详情",
content : content,
height : "60%",
width : "50%",
buttons : [{
text : "关闭",
className : "btn-danger",
onclick : function() {
backdrop: "static",
title: "异常详情",
content: content,
height: "60%",
width: "50%",
buttons: [{
text: "关闭",
className: "btn-danger",
onclick: function () {
$(dialog).dialog("hide");
}
}]
... ... @@ -350,27 +222,27 @@
});
return div;
}
},{
}, {
title: "平均耗时(ms)",
field: "avgCost",
width: "10%",
sortable:true,
formatter : function(value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.avgCost).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if(rowData.errorInfo != null){
for(var i = 0;i<rowData.errorInfo.length;i++){
content= content +rowData.errorInfo[i]+"<br><br>";
}
}
sortable: true,
// formatter : function(value, rowData, rowIndex) {
// var div = $("<div>");
// var textView = $("<span>").html(rowData.avgCost).appendTo(div);
// div.append("<br>");
// var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
// var content = "";
// if(rowData.timeoutInfo != null){
// for(var i = 0;i<rowData.timeoutInfo.length;i++){
// content= content +rowData.timeoutInfo[i]+"<br><br>";
// }
// }
// editBtn.click(function () {
// var dialog = $("<div>").appendTo($("body"));
// dialog.dialog({
// backdrop : "static",
// title : "异常详情",
// title : "超时详情",
// content : content,
// height : "60%",
// width : "50%",
... ... @@ -383,33 +255,8 @@
// }]
// });
// });
return div;
}
}, {
title: "CPU使用率",
field: "cpuRate",
width: "10%"
},{
title: "内存使用率",
field: "memoryRate",
// formatter: function (value, rowData, rowIndex) {
// if (rowData.apiToggle == 0)
// return "N";
// else
// return "Y";
// },
width: "10%"
}, {
title: "IO使用率",
field: "ioRate",
width: "10%"
}, {
title: "带宽（IN/OUT）",
field: "bandwidth",
width: "15%"
// return div;
// }
}]
});
... ... @@ -420,49 +267,44 @@
title: "java服务监控信息列表",
dataType: "json",
sortable: true, //是否启用排序
sortOrder:"desc",
sortOrder: "desc",
columns: [{
title: "IP",
field: "ip",
width: "10%",
sortable:true
sortable: true
}, {
title: "网络归属",
field: "type",
width: "10%"
}, {
title: "总请求次数",
field: "totalCount",
width: "10%",
sortable:true
}, {
title: "请求异常次数",
field: "errorCount",
width: "10%",
sortable:true,
formatter : function(value, rowData, rowIndex) {
sortable: true,
formatter: function (value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.errorCount).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if(rowData.errorInfo != null){
for(var i = 0;i<rowData.errorInfo.length;i++){
content= content +rowData.errorInfo[i]+"<br><br>";
if (rowData.errorInfo != null) {
for (var i = 0; i < rowData.errorInfo.length; i++) {
content = content + rowData.errorInfo[i] + "<br><br>";
}
}
editBtn.click(function () {
var dialog = $("<div>").appendTo($("body"));
dialog.dialog({
backdrop : "static",
title : "异常详情",
content : content,
height : "60%",
width : "50%",
buttons : [{
text : "关闭",
className : "btn-danger",
onclick : function() {
backdrop: "static",
title: "异常详情",
content: content,
height: "60%",
width: "50%",
buttons: [{
text: "关闭",
className: "btn-danger",
onclick: function () {
$(dialog).dialog("hide");
}
}]
... ... @@ -470,27 +312,27 @@
});
return div;
}
},{
}, {
title: "平均耗时(ms)",
field: "avgCost",
width: "10%",
sortable:true,
formatter : function(value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.avgCost).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if(rowData.errorInfo != null){
for(var i = 0;i<rowData.errorInfo.length;i++){
content= content +rowData.errorInfo[i]+"<br><br>";
}
}
sortable: true
// formatter : function(value, rowData, rowIndex) {
// var div = $("<div>");
// var textView = $("<span>").html(rowData.avgCost).appendTo(div);
// div.append("<br>");
// var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
// var content = "";
// if(rowData.timeoutInfo != null){
// for(var i = 0;i<rowData.timeoutInfo.length;i++){
// content= content +rowData.timeoutInfo[i]+"<br><br>";
// }
// }
// editBtn.click(function () {
// var dialog = $("<div>").appendTo($("body"));
// dialog.dialog({
// backdrop : "static",
// title : "异常详情",
// title : "超时详情",
// content : content,
// height : "60%",
// width : "50%",
... ... @@ -503,33 +345,8 @@
// }]
// });
// });
return div;
}
}, {
title: "CPU使用率",
field: "cpuRate",
width: "10%"
},{
title: "内存使用率",
field: "memoryRate",
// formatter: function (value, rowData, rowIndex) {
// if (rowData.apiToggle == 0)
// return "N";
// else
// return "Y";
// },
width: "10%"
}, {
title: "IO使用率",
field: "ioRate",
width: "10%"
}, {
title: "带宽（IN/OUT）",
field: "bandwidth",
width: "15%"
// return div;
// }
}]
});
... ...
<%@page language="java" contentType="text/html;charset=utf-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
String serviceType = request.getParameter("serviceType");
String serviceName = request.getParameter("serviceName");
String startTime = request.getParameter("startTime");
String endTime = request.getParameter("endTime");
String apiName = request.getParameter("apiName");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<jsp:include page="/jsp/common/include.jsp" flush="true"/>
<script>
var contextPath = '<%=basePath %>';
var serviceType = "<%=serviceType %>";
var serviceName = "<%=serviceName%>";
var startTime = "<%=startTime%>>";
var endTime = "<%=endTime%>>";
var apiName = "<%=apiName%>>";
</script>
</head>
<body>
<!-- 右侧具体内容 -->
<form class="form-horizontal" id="javaIpInfoForm" name="javaIpInfoForm">
<div class="form-group">
<div class="col-sm-5" >
<span class="input-group-addon">服务名：</span>
<input type="text" id="serviceType" name="serviceType" class="form-control" disabled>
</input>
</div>
<div class="col-sm-5" >
<span class="input-group-addon">接口名：</span>
<input type="text" id="apiName" name="apiName" class="form-control" disabled>
</select>
</div>
</div>
<div class="form-group">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">
<a href="#timesPartIpInfo" aria-controls="timesPartIpInfo" role="tab" data-toggle="tab">异常次数</a>
</li>
<li role="presentation">
<a href="#costPartIpInfo" aria-controls="costPartIpInfo" role="tab" data-toggle="tab">平均耗时</a>
</li>
</ul>
<div class="tab-content" style="padding-top:10px">
<div role="tabpanel" class="tab-pane fade in active" id="timesPartIpInfo">
<div id="ipInfoTable"></div>
</div>
<div role="ipInfoTable2" class="tab-pane fade" id="costPartIpInfo">
<div id="infoTable1"></div>
</div>
</div>
</div>
</form>
</body>
<script>
$("#serviceType").val(serviceName);
$("#apiName").val(apiName);
</script>
<script>
$(function () {
$("#javaIpInfoForm #ipInfoTable").table({
columnAutoWidth: false,
url: contextPath + "/javaMonitor/query",
striped: true,
title: "java服务监控信息列表",
dataType: "json",
sortable: true, //是否启用排序
sortOrder: "desc",
loadFilter: function (data) {
return defaultLoadFilter(data);
},
onLoadSuccess: function (data) {
//同步加载根据异常次数排序的tab页列表
var errorObj = new Array();
for (var i = 0; i < data.length; i++) {
errorObj.push(data[i]);
}
//按异常次数从大到小排序
errorObj.sort(function (a, b) {
return b.errorCount - a.errorCount;
});
$("#javaIpInfoForm #ipInfoTable2").table("loadLoaclData", errorObj);
},
columns: [{
title: "IP",
field: "ip",
width: "10%",
sortable: true
}, {
title: "总请求次数",
field: "totalCount",
width: "10%",
sortable: true
}, {
title: "请求异常次数",
field: "errorCount",
width: "10%",
sortable: true,
formatter: function (value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.errorCount).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if (rowData.errorInfo != null) {
for (var i = 0; i < rowData.errorInfo.length; i++) {
content = content + rowData.errorInfo[i] + "<br><br>";
}
}
editBtn.click(function () {
var dialog = $("<div>").appendTo($("body"));
dialog.dialog({
backdrop: "static",
title: "异常详情",
content: content,
height: "60%",
width: "50%",
buttons: [{
text: "关闭",
className: "btn-danger",
onclick: function () {
$(dialog).dialog("hide");
}
}]
});
});
return div;
}
}, {
title: "平均耗时(ms)",
field: "avgCost",
width: "10%",
sortable: true
// formatter : function(value, rowData, rowIndex) {
// var div = $("<div>");
// var textView = $("<span>").html(rowData.avgCost).appendTo(div);
// div.append("<br>");
// var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
// var content = "";
// if(rowData.timeoutInfo != null){
// for(var i = 0;i<rowData.timeoutInfo.length;i++){
// content= content +rowData.timeoutInfo[i]+"<br><br>";
// }
// }
// editBtn.click(function () {
// var dialog = $("<div>").appendTo($("body"));
// dialog.dialog({
// backdrop : "static",
// title : "超时详情",
// content : content,
// height : "60%",
// width : "50%",
// buttons : [{
// text : "关闭",
// className : "btn-danger",
// onclick : function() {
// $(dialog).dialog("hide");
// }
// }]
// });
// });
// return div;
// }
}]
});
//加载表格
$("#javaIpInfoForm #ipInfoTable2").table({
columnAutoWidth: false,
striped: true,
title: "java服务监控信息列表",
dataType: "json",
sortable: true, //是否启用排序
sortOrder: "desc",
columns: [{
title: "IP",
field: "ip",
width: "10%",
sortable: true
},{
title: "请求异常次数",
field: "errorCount",
width: "10%",
sortable: true,
formatter: function (value, rowData, rowIndex) {
var div = $("<div>");
var textView = $("<span>").html(rowData.errorCount).appendTo(div);
div.append("<br>");
var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
var content = "";
if (rowData.errorInfo != null) {
for (var i = 0; i < rowData.errorInfo.length; i++) {
content = content + rowData.errorInfo[i] + "<br><br>";
}
}
editBtn.click(function () {
var dialog = $("<div>").appendTo($("body"));
dialog.dialog({
backdrop: "static",
title: "异常详情",
content: content,
height: "60%",
width: "50%",
buttons: [{
text: "关闭",
className: "btn-danger",
onclick: function () {
$(dialog).dialog("hide");
}
}]
});
});
return div;
}
}, {
title: "平均耗时(ms)",
field: "avgCost",
width: "10%",
sortable: true
// formatter : function(value, rowData, rowIndex) {
// var div = $("<div>");
// var textView = $("<span>").html(rowData.avgCost).appendTo(div);
// div.append("<br>");
// var editBtn = $("<button>").addClass("btn btn-xs btn-success").html("详情").appendTo(div);
// var content = "";
// if(rowData.timeoutInfo != null){
// for(var i = 0;i<rowData.timeoutInfo.length;i++){
// content= content +rowData.timeoutInfo[i]+"<br><br>";
// }
// }
// editBtn.click(function () {
// var dialog = $("<div>").appendTo($("body"));
// dialog.dialog({
// backdrop : "static",
// title : "超时详情",
// content : content,
// height : "60%",
// width : "50%",
// buttons : [{
// text : "关闭",
// className : "btn-danger",
// onclick : function() {
// $(dialog).dialog("hide");
// }
// }]
// });
// });
// return div;
// }
}]
});
});
</script>
... ...
... ... @@ -223,12 +223,21 @@
//获取曲线数据
function getLineDate(lineType){
paramObj.serviceType = 0;
paramObj.serviceName = "";
if($("#searchApiName").val() != null){
paramObj.serviceType = $("#searchApiName").val();
}
if($("#searchApiName").select("getText") != null){
paramObj.serviceName = $("#searchApiName").select("getText");
}
$.ajax({
url: contextPath + "/javaMonitor/getGraphData",
type: 'post',
data:{
serviceType : $("#searchApiName").val(),
serviceName : $("#searchApiName").select("getText"),
serviceType : paramObj.serviceType,
serviceName : paramObj.serviceName,
graphType : lineType
},
dataType:'json',
... ... @@ -263,15 +272,6 @@
url: contextPath + "/type/queryJavaApiType",
loadFilter: function (data) {
return defaultLoadFilter(data);
},
onLoadSuccess:function(data){
if(data.length>0){
$("#ipInfoTable").table("load", {
serviceType: data[0].typeId,
serviceName: data[0].typeName,
timeInterval:$("#timeInterval").val()
});
}
}
});
... ... @@ -291,28 +291,30 @@
},
onLoadSuccess: function (data) {
//记录第一条ip
paramObj.ipName = data[0].ip;
//同步加载根据异常次数排序的tab页列表
var errorObj = new Array();
for(var i = 0;i<data.length;i++){
errorObj.push(data[i]);
}
//按异常次数从大到小排序
errorObj.sort(function(a,b){
return b.errorCount-a.errorCount;
});
$("#infoTable").table("loadLoaclData", errorObj);
if(data.length > 0){
paramObj.ipName = data[0].ip;
//同步加载根据异常次数排序的tab页列表
var errorObj = new Array();
for(var i = 0;i<data.length;i++){
errorObj.push(data[i]);
}
//按异常次数从大到小排序
errorObj.sort(function(a,b){
return b.errorCount-a.errorCount;
});
$("#infoTable").table("loadLoaclData", errorObj);
//同步加载根据平均耗时排序的tab页列表
var costObj = new Array();
for(var j = 0;j<data.length;j++){
costObj.push(data[j]);
//同步加载根据平均耗时排序的tab页列表
var costObj = new Array();
for(var j = 0;j<data.length;j++){
costObj.push(data[j]);
}
//按平均耗时从大到小排序ss
costObj.sort(function(a,b){
return b.avgCost-a.avgCost;
});
$("#infoTable1").table("loadLoaclData", costObj);
}
//按平均耗时从大到小排序ss
costObj.sort(function(a,b){
return b.avgCost-a.avgCost;
});
$("#infoTable1").table("loadLoaclData", costObj);
},
columns: [{
title: "IP",
... ... @@ -350,8 +352,8 @@
backdrop : "static",
title : "异常详情",
content : content,
height : "60%",
width : "50%",
height : "80%",
width : "60%",
buttons : [{
text : "关闭",
className : "btn-danger",
... ... @@ -385,8 +387,8 @@
backdrop : "static",
title : "超时详情",
content : content,
height : "60%",
width : "50%",
height : "80%",
width : "60%",
buttons : [{
text : "关闭",
className : "btn-danger",
... ... @@ -407,12 +409,7 @@
field: "memoryRate",
width: "10%"
}, {
title: "IO使用率",
field: "ioRate",
width: "10%"
}, {
},{
title: "带宽（IN/OUT）",
field: "bandwidth",
width: "10%"
... ... @@ -468,8 +465,8 @@
backdrop : "static",
title : "异常详情",
content : content,
height : "60%",
width : "50%",
height : "80%",
width : "60%",
buttons : [{
text : "关闭",
className : "btn-danger",
... ... @@ -503,8 +500,8 @@
backdrop : "static",
title : "超时详情",
content : content,
height : "60%",
width : "50%",
height : "80%",
width : "60%",
buttons : [{
text : "关闭",
className : "btn-danger",
... ... @@ -531,12 +528,7 @@
// },
width: "10%"
}, {
title: "IO使用率",
field: "ioRate",
width: "10%"
}, {
},{
title: "带宽（IN/OUT）",
field: "bandwidth",
width: "15%"
... ... @@ -588,8 +580,8 @@
backdrop : "static",
title : "异常详情",
content : content,
height : "60%",
width : "50%",
height : "80%",
width : "60%",
buttons : [{
text : "关闭",
className : "btn-danger",
... ... @@ -623,8 +615,8 @@
backdrop : "static",
title : "超时详情",
content : content,
height : "60%",
width : "50%",
height : "80%",
width : "60%",
buttons : [{
text : "关闭",
className : "btn-danger",
... ... @@ -651,12 +643,7 @@
// },
width: "10%"
}, {
title: "IO使用率",
field: "ioRate",
width: "10%"
}, {
},{
title: "带宽（IN/OUT）",
field: "bandwidth",
width: "15%"
... ... @@ -678,7 +665,8 @@
// paramObj.markingPushFlag = '1';
var url = contextPath + "/javaMonitor/toJavaApiInfoList";
var serviceType = $("#searchApiName").val();
url += "?serviceType=" + serviceType;
var serviceName = $("#searchApiName").select("getText");
url += "?serviceType=" + serviceType+"&serviceName="+serviceName+"&startTime="+paramObj.startTime+"&endTime="+paramObj.endTime;
window.location.href = url;
});
... ...