|
|
|
<%@ 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 + "/";
|
|
|
|
%>
|
|
|
|
<%@page language="java" contentType="text/html;charset=utf-8"%>
|
|
|
|
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
|
|
|
<div id="breadcrumb">
|
|
|
|
<a href="#" title="Go to Home" class="tip-bottom"><i
|
|
|
|
class="icon-home"></i> Home</a> <a href="#" class="current">ZK监控</a>
|
|
|
|
class="icon-home"></i> HOME</a> <a href="#" class="current">Zookeeper服务</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="container-fluid">
|
|
|
|
<div class="widget-box">
|
|
|
|
<div class="widget-title">
|
|
|
|
<h5>ZK监控</h5>
|
|
|
|
<h5>
|
|
|
|
Zookeeper服务 DashBoard<a
|
|
|
|
</h5>
|
|
|
|
</div>
|
|
|
|
<div class="widget-content nopadding">
|
|
|
|
<div class="widget-title" style="height: 53px;">
|
|
|
|
<div>
|
|
|
|
<div class="form-inline" role="form" id="zkQueryDiv"
|
|
|
|
style=" margin-top: 12px;margin-left: 25px;float: left;">
|
|
|
|
<div class="input-group" style="float: left;">
|
|
|
|
<span class="input-group-addon">ip：</span>
|
|
|
|
<input type="text" id="ip" name="ip" class="form-control" placeholder=""/>
|
|
|
|
</div>
|
|
|
|
<div class="input-group" style="float: left;margin-left: 25px;">
|
|
|
|
<span class="input-group-addon">时间：</span>
|
|
|
|
<input type="text" id="time" name="time" class="form-control" placeholder=""/>
|
|
|
|
</div>
|
|
|
|
<div class="input-group" style="float: left;margin-left: 25px;">
|
|
|
|
<span class="input-group-addon">是否在活动：</span>
|
|
|
|
<select id="isLive" name="isLive" class="form-control">
|
|
|
|
<option value="">全部</option>
|
|
|
|
<option value="0">否</option>
|
|
|
|
<option value="1">是</option>
|
|
|
|
</select>
|
|
|
|
<div class="widget-content">
|
|
|
|
<div class="row api_info_container">
|
|
|
|
<div class="api_info_item col-xs-10 ">
|
|
|
|
<div class="panel panel-default">
|
|
|
|
<div class="item_java_api_title panel-heading" style="text-align: center">AWS-Zookeeper集群(最近时间：<span id="zkAwsTime"></span>)</div>
|
|
|
|
<div class="panel-body" style="height: 180px; padding-top: 60px;text-align: center;" id="zkAwsDiv">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<button id="searchZkInfo" class="btn btn-primary" style="margin-left: 25px;">搜索</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="zkInfoTable">
|
|
|
|
<div class="api_info_item col-xs-10 ">
|
|
|
|
<div class="panel panel-default">
|
|
|
|
<div class="item_java_api_title panel-heading" style="text-align: center">QCloud-Zookeeper集群(最近时间：<span id="zkQCloudTime"></span>)</div>
|
|
|
|
<div class="panel-body" style="height: 180px; padding-top: 80px;text-align: center;" id="zkQCloudDiv">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
$(function(){
|
|
|
|
$("#zkInfoTable").table({
|
|
|
|
columnAutoWidth: false,
|
|
|
|
url: contextPath + "zkMonitor/getZkMonitorRecords",
|
|
|
|
striped: true,
|
|
|
|
title: "ZK监控列表",
|
|
|
|
dataType: "json",
|
|
|
|
pagination: true,
|
|
|
|
pageSize: 10,
|
|
|
|
loadFilter: function (data) {
|
|
|
|
return defaultLoadFilter(data);
|
|
|
|
},
|
|
|
|
columns: [{
|
|
|
|
title: "IP",
|
|
|
|
field: "hostIp",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
return rowData[1];
|
|
|
|
}
|
|
|
|
},{
|
|
|
|
title: "时间",
|
|
|
|
field: "redcordTime",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
return rowData[0];
|
|
|
|
}
|
|
|
|
},{
|
|
|
|
title: "是否活动",
|
|
|
|
field: "isLive",
|
|
|
|
formatter : function(value, rowData, rowIndex) {
|
|
|
|
if (rowData[2] == 1) {
|
|
|
|
return "是";
|
|
|
|
} else {
|
|
|
|
return "否";
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}]
|
|
|
|
});
|
|
|
|
});
|
|
|
|
<script type="text/javascript">
|
|
|
|
$(function () {
|
|
|
|
|
|
|
|
$.ajax({
|
|
|
|
url: contextPath + "/zkMonitor/getZkMonitorRecords",
|
|
|
|
type: 'get',
|
|
|
|
async: false,
|
|
|
|
dataType: "json",
|
|
|
|
success: function (data) {
|
|
|
|
var time="";
|
|
|
|
var awsHtml = '';
|
|
|
|
if(data.data.aws != null){
|
|
|
|
$.each(data.data.aws, function (n, value) {
|
|
|
|
time=value.redcordTime;
|
|
|
|
if(value.isLive==0){
|
|
|
|
awsHtml+='<button class="btn_java_api btn btn-lg btn-default btn-danger">'+value.hostIp+' <span class="badge">失败</span></button>';
|
|
|
|
}else if(value.isLive==1){
|
|
|
|
awsHtml+='<button class="btn_java_api btn btn-lg btn-default btn-success">'+value.hostIp+' <span class="badge">好</span></button>';
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
var qcloudHtml="";
|
|
|
|
if(data.data.qcloud != null){
|
|
|
|
$.each(data.data.qcloud, function (n, value) {
|
|
|
|
if(value.isLive==0){
|
|
|
|
qcloudHtml+='<button class="btn_java_api btn btn-lg btn-default btn-danger">'+value.hostIp+' <span class="badge">失败</span></button>';
|
|
|
|
}else if(value.isLive==1){
|
|
|
|
qcloudHtml+='<button class="btn_java_api btn btn-lg btn-default btn-success">'+value.hostIp+' <span class="badge">好</span></button>';
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
$("#zkAwsTime").html(time);
|
|
|
|
$("#zkQCloudTime").html(time);
|
|
|
|
$("#zkAwsDiv").html(awsHtml);
|
|
|
|
$("#zkQCloudDiv").html(qcloudHtml);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
//设置默认时间
|
|
|
|
$("#zkQueryDiv #time").datetimepicker({
|
|
|
|
format : 'YYYY-MM-DD HH:mm:ss'
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#searchZkInfo").click(function(){
|
|
|
|
$("#zkInfoTable").table("load",{
|
|
|
|
hostIp:$("#zkQueryDiv #ip").val(),
|
|
|
|
redcordTime:$("#zkQueryDiv #time").val(),
|
|
|
|
isLive:$("#zkQueryDiv #isLive").val()
|
|
|
|
});
|
|
|
|
});
|
|
|
|
</script> |
|
|
\ No newline at end of file |
...
|
...
|
|
