You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
287 lines
8.1 KiB
287 lines
8.1 KiB
<%@page import="org.wdk.module.auth.mount.bean.BaseSessionUser"%>
|
|
<%@page import="org.wdk.WDK"%>
|
|
<%@page import="org.wdk.module.auth.source.bean.TokenBean"%>
|
|
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
|
|
<%
|
|
String path = request.getContextPath();
|
|
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
|
|
BaseSessionUser su = WDK.getSessionUser(request, response);
|
|
if(null==su){
|
|
su = new BaseSessionUser();
|
|
}
|
|
String WDK_ROOT = WDKCore.WDK_ROOT;
|
|
String RSS_ROOT = WDK_ROOT +"/"+WDKConstant.Theme+"/"+WDKCore.THEME;
|
|
String commonURL = "/"+RSS_ROOT+"/module/public/common.jsp";
|
|
%>
|
|
<!DOCTYPE html>
|
|
<%@page import="org.wdk.WDKConstant"%>
|
|
<%@page import="org.wdk.WDKCore"%>
|
|
<html>
|
|
|
|
<head>
|
|
<base href="<%=basePath%>" target="_self">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<jsp:include page='<%=commonURL %>'></jsp:include>
|
|
<script type="text/javascript" src="<%=RSS_ROOT%>/core/js/wdk.js"></script>
|
|
<title>访问量实时监控</title>
|
|
<style type="text/css">
|
|
html
|
|
{
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
body
|
|
{
|
|
background: #000;
|
|
color: #C0C0C0;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
font-family: Lucida Console;
|
|
height: 100%;
|
|
margin: 0 0 0 5px;
|
|
}
|
|
#divContent
|
|
{
|
|
position:fixed;
|
|
left:0px;
|
|
top:0px;
|
|
right:0px;
|
|
bottom:0px;
|
|
overflow:auto;
|
|
white-space: nowrap;
|
|
}
|
|
#cont
|
|
{
|
|
height: 100%;
|
|
width: 100%;
|
|
|
|
}
|
|
#txtTimeout
|
|
{
|
|
width: 40px;
|
|
}
|
|
button
|
|
{
|
|
margin-left: 10px;
|
|
}
|
|
</style>
|
|
<script type="text/javascript" src="<%=WDK_ROOT%>/core/js/lib/highcharts.3.0.7/highcharts.src.js"></script>
|
|
<script type="text/javascript" src="<%=WDK_ROOT%>/core/js/lib/highcharts.3.0.7/highcharts-more.src.js"></script>
|
|
<script type="text/javascript" src="<%=WDK_ROOT%>/core/js/lib/highcharts.3.0.7/themes/grid.js"></script>
|
|
<script type="text/javascript">
|
|
<% if(null==su){%>
|
|
$.timeout();
|
|
//alert("登录超时，请重新登录!");
|
|
//$.getRoot().document.location.href = $.base()+"/console.jsp";
|
|
<%}%>
|
|
|
|
|
|
|
|
|
|
var chart_panel;
|
|
var _gridcode = 'wdk.module.monitor.visitgrid';
|
|
var _gridid = null;
|
|
var _grid_ok = false;
|
|
window.onload = function(){
|
|
Highcharts.setOptions({
|
|
global: {
|
|
useUTC: false
|
|
}
|
|
});
|
|
|
|
_gridid = $.grid({
|
|
containerid:'layout_grid',
|
|
gridcode:_gridcode,
|
|
//url:'wdk?action=wdk.public&method=monitor_visit_load&ajaxparam='+new Date().getTime(),
|
|
fit: true,//自动大小
|
|
showContextMenu:false,
|
|
onLoadSuccess:function(){_grid_ok = true;}
|
|
});
|
|
initPanel();
|
|
monitor_load();
|
|
};
|
|
|
|
|
|
//加载授权信息
|
|
function monitor_load(){
|
|
$.cuajax({
|
|
url:'wdk?action=wdk.public&method=monitor_visit_load&ajaxparam='+new Date().getTime(),
|
|
method:"post",
|
|
timeout:WDK_Timeout,
|
|
data:{},
|
|
success:function(result) {
|
|
var jres = $.str2json(result);
|
|
if("1"==jres.code){
|
|
grid_redraw(jres);
|
|
panel_redraw(jres);
|
|
}
|
|
setTimeout('monitor_load()',2000);
|
|
},
|
|
error:function(result){
|
|
alert('网络错误！result='+result);
|
|
}
|
|
});
|
|
}
|
|
function grid_redraw(jres){
|
|
if(_gridid){
|
|
$('#'+_gridid).datagrid('loadData',jres.grid);
|
|
}else{
|
|
alert('err');
|
|
}
|
|
}
|
|
function panel_redraw(jres){
|
|
|
|
if(chart_panel){
|
|
var x = (new Date()).getTime();
|
|
var y0 = parseInt(jres.totalsize);
|
|
var y1 = parseInt(jres.wrongrequest);
|
|
var y2 = parseInt(jres.avervisit);
|
|
chart_panel.series[0].addPoint([x,y0],true,true);
|
|
chart_panel.series[1].addPoint([x,y1],true,true);
|
|
chart_panel.series[2].addPoint([x,y2],true,true);
|
|
chart_panel.redraw();
|
|
}
|
|
}
|
|
|
|
function initPanel(){
|
|
$('#layout_panel').highcharts({
|
|
chart: {
|
|
type: 'spline',
|
|
animation: Highcharts.svg, // don't animate in old IE
|
|
marginRight: 80,
|
|
events: {
|
|
load: function() {
|
|
chart_panel = this;
|
|
}
|
|
}
|
|
},
|
|
title: {
|
|
text: '对外服务监控'
|
|
},
|
|
xAxis: {
|
|
type: 'datetime',
|
|
tickPixelInterval: 100
|
|
},
|
|
/* yAxis: {
|
|
min: 0, //从0开始
|
|
allowDecimals:false, //只显示整数
|
|
title: {
|
|
text: '并发量'
|
|
},
|
|
plotLines: [{
|
|
value: 0,
|
|
width: 1,
|
|
color: '#808080'
|
|
}]
|
|
},
|
|
*/
|
|
yAxis: [
|
|
{
|
|
min: 0, //从0开始
|
|
allowDecimals:false, //是否允许显示小数
|
|
title: {
|
|
text: '每秒请求数',
|
|
style: {
|
|
color: '#3E576F'
|
|
}
|
|
}
|
|
},
|
|
{
|
|
min: 0, //从0开始
|
|
allowDecimals:true, //是否允许显示小数
|
|
title: {
|
|
text: '平均响应时间(单位：秒)',
|
|
style: {
|
|
color: '#00AA00'
|
|
}
|
|
},
|
|
opposite:true
|
|
}
|
|
],
|
|
|
|
tooltip: {
|
|
formatter: function() {
|
|
//return '<b>'+this.series.name+'当前并发数：'+this.y+'</b>';
|
|
/* return '<b>'+ this.series.name +'</b><br/>'+
|
|
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+
|
|
Highcharts.numberFormat(this.y, 2);*/
|
|
return '<b>' + this.series.name + '</b><br/>' +
|
|
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
|
|
Highcharts.numberFormat(this.y, 2);
|
|
}
|
|
},
|
|
legend: {
|
|
enabled: true
|
|
},
|
|
exporting: {
|
|
enabled: false
|
|
},
|
|
series: [{
|
|
name: '总请求数',
|
|
data: (function() {
|
|
// generate an array of random data
|
|
var data = [],
|
|
time = (new Date()).getTime(),
|
|
i;
|
|
|
|
for (i = -10; i <= 0; i++) {
|
|
data.push({
|
|
x: time + i * 5000,
|
|
y: 0
|
|
});
|
|
}
|
|
return data;
|
|
})()
|
|
},{
|
|
name: '错误请求数',
|
|
data: (function() {
|
|
// generate an array of random data
|
|
var data = [],
|
|
time = (new Date()).getTime(),
|
|
i;
|
|
|
|
for (i = -10; i <= 0; i++) {
|
|
data.push({
|
|
x: time + i * 5000,
|
|
y: 0
|
|
});
|
|
}
|
|
return data;
|
|
})()
|
|
},{
|
|
name: '平均响应时间',
|
|
yAxis:1,
|
|
data: (function() {
|
|
// generate an array of random data
|
|
var data = [],
|
|
time = (new Date()).getTime(),
|
|
i;
|
|
|
|
for (i = -10; i <= 0; i++) {
|
|
data.push({
|
|
x: time + i * 5000,
|
|
y: 0
|
|
});
|
|
}
|
|
return data;
|
|
})()
|
|
}]
|
|
});
|
|
}
|
|
</script>
|
|
|
|
</head>
|
|
<!--<body style="padding:0px;margin:0px;overflow: auto;" >-->
|
|
<!-- <div id="panel4" style="position:fixed;left:50%;top:50%;right:0px;bottom:0px;width:50%;height:50%;background-color:#22332a">444</div>-->
|
|
<!--</body>-->
|
|
|
|
<body class="easyui-layout" data-options="fit:true" style="padding:0px;margin:0px;background-color:#FFFFFF;">
|
|
<div id="layout_panel" data-options="region:'center',border:false,collapsed:false" style="overflow:hidden;border:1px solid #ddd;" >
|
|
|
|
</div>
|
|
<div id="layout_grid" data-options="region:'south',border:false,collapsed:false" style="width:100%;height:200px;overflow:hidden;border:1px solid #ddd;text-align:left;" >
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html>
|