ops / monitor-ui · Commits

Go to a project

Authored by qinchao
Commit 947af6fe0b6564dab465f2d9bf82f52c2541d364 1 parent 4d7d290c

运维系统研发-Zookeeper注册服务查询

Inline Side-by-side
Showing 5 changed files with 221 additions and 2 deletions
... ... @@ -64,6 +64,11 @@ public class HttpUriContants {
public static final String EDIT_ZK_ROOT = "/zkMonitor/editZkMonitorRoot";
/***
* ZK 服务监控查询
****/
public static final String GET_ZK_SVC_LIST = "/zkSvcLookup/getAllSvc";
/***
* redis监控信息查询
****/
public static final String GET_REDIS_INFO = "/redisMonitor/getRedisInfo";
... ...
package com.ui.ctrl;
import com.ui.contants.HttpUriContants;
import com.ui.http.HttpRestClient;
import com.ui.model.BaseResponse;
import com.ui.model.req.ZkTreeReq;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;
/**
* Created by craig.qin on 2017/7/3.
*/
@Controller
@RequestMapping("/zkSvcLookup")
public class ZkSvcLookupCtrl {
Logger log = LoggerFactory.getLogger(ZkSvcLookupCtrl.class);
@Autowired
private HttpRestClient httpClient;
@RequestMapping("/tozkSvcLookupList")
public ModelAndView tozkSvcLookupList() {
return new ModelAndView("zkSvcLookup/zkSvcLookupList");
}
/**
* 获取zk下的所有注册的服务（服务名，子服务个数，注册服务的ip）
* @param req
* @return
*/
@RequestMapping("/getAllSvc")
@ResponseBody
public BaseResponse getRootSvc(ZkTreeReq req){
log.info("getRootSvc with req is {}",req);
BaseResponse response=httpClient.defaultPost(HttpUriContants.GET_ZK_SVC_LIST, req, BaseResponse.class);
return response;
}
}
... ...
... ... @@ -236,7 +236,7 @@
</div>
</div>
</body>
<script src="<%=basePath %>script/common/genarate_left_panel.js?v=20170628"></script>
<script src="<%=basePath %>script/common/genarate_left_panel.js?v=20170703"></script>
<script type="text/javascript">
$("#li_dashboard").addClass("active");
</script>
... ...
<%@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 + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="<%=basePath %>css/bootstrap.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/bootstrap-datetimepicker.css"/>
<link href="<%=basePath %>js/bootstrap-plugin/css/bootstrap.table.css" rel="stylesheet" media="screen"/>
<link rel="stylesheet" href="<%=basePath %>css/bootstrap-responsive.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/fullcalendar.css"/>
<link rel="stylesheet" href="<%=basePath %>css/unicorn.main.css"/>
<link rel="stylesheet" href="<%=basePath %>css/unicorn.grey.css"/>
<link rel="stylesheet" href="<%=basePath %>css/jquery-ui.css"/>
<link rel="stylesheet" href="<%=basePath %>css/uniform.css"/>
<link rel="stylesheet" href="<%=basePath %>css/select2.css"/>
<link rel="stylesheet" href="<%=basePath %>js/jstree/themes/proton/style.css"/>
<link rel="stylesheet" href="<%=basePath %>css/select2.css"/>
<link rel="stylesheet" href="<%=basePath %>css/yoho.css"/>
<script src="<%=basePath %>js/excanvas.min.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jquery-1.12.0.min.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jquery-ui.custom.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>/js/bootstrap.min.js"></script>
<script src="<%=basePath %>/js/unicorn.js"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/moment-with-locales.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/bootstrap-datetimepicker.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/global.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.pagination.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.table.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.dialog.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.panel.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.alerts.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.accordion.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.breadcrumb.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.validate.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/layer/layer.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.select.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jstree/jstree.js"></script>
<script src="<%=basePath %>js/jquery.toaster.js"></script>
<link href="<%=basePath %>css/jquery.tagsinput.css" rel="stylesheet"/>
<script src="<%=basePath %>js/jquery.tagsinput.min.js" type="text/javascript"></script>
<script>
var contextPath = '<%=basePath %>';
</script>
<title>YOHO!运维</title>
</head>
<body>
<!-- 头部 -->
<div id="head">
</div>
<!-- 右侧具体内容 -->
<div id="content">
<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>
</div>
<div class="container-fluid">
<div class="widget-box">
<div class="widget-title">
<h5>ZK服务列表</h5>
</div>
<div class="widget-content nopadding">
<div class="widget-title" style="height: 53px;">
<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">ZK中心：</span>
<select class="form-control" id="unitItem"></select>
</div>
<button class="btn btn-primary" style="margin-left: 18px;" onclick="query()">搜索</button>
</div>
</div>
</div>
<div id="detailTable">
</div>
</div>
</div>
</div>
</div>
</body>
<script>
$(function () {
$.ajax({
url: contextPath +"/type/zkTree",
dataType: "json",
success: function (respString) {
var resp=JSON.parse(respString);
if(resp.code == 200){
$.each(resp.data, function (n, val) {
if(val.typeIsLeaf){
console.log(val);
$("#unitItem").append("<option value="+val.typeName+">" + val.typeName + "</option>");
}
});
}else{
alert("查询ZK中心报错");
return;
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("error");
}
});
});
function query(){
var zkcenter=$.trim($("#unitItem option:selected").val());
if(zkcenter==null||zkcenter==''){
alert("参数错误,请选择zk");
return;
}
//加载表格
$("#detailTable").table({
columnAutoWidth: true,
url: contextPath +"/zkSvcLookup/getAllSvc?ip="+zkcenter,
striped: true,
dataType: "json",
pagination: false,
loadFilter: function (data) {
return defaultLoadFilter(data);
},
columns:[{
title: "名称",
field: "zkName"
}, {
title: "服务数量",
field: "creteSvcSize"
}, {
title: "地址",
field:"bindIp"
}]
});
}
</script>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script type="text/javascript">
$("#li_monitor").addClass("active open");
$("#li_zkSvcLookup").addClass("active");
</script>
</html>
\ No newline at end of file
... ...
... ... @@ -11,11 +11,12 @@ innerHTML += "<div id='sidebar'><ul>";
innerHTML += "<li id='li_dashboard'><a id='li_dashboard_a' href=''><i class='icon icon-th'></i> <span>Dashboard</span></a></li>";
/*监控*/
innerHTML += "<li class='submenu' id='li_monitor'><a id='li_monitor_a' href='#'><i class='icon icon-th-list'></i> <span>监控</span><span class='label'>9</span></a><ul>";
innerHTML += "<li class='submenu' id='li_monitor'><a id='li_monitor_a' href='#'><i class='icon icon-th-list'></i> <span>监控</span><span class='label'>10</span></a><ul>";
innerHTML += "<li id='li_javaMonitor'><a id='li_javaMonitor_a' href=''><i class='icon icon-th'></i> <span>JAVA服务监控</span></a></li>";
innerHTML += "<li id='li_javaApiMonitor'><a id='li_javaApiMonitor_a' href=''><i class='icon icon-th'></i> <span>JAVA API监控</span></a></li>";
innerHTML += "<li id='li_javaApi'><a id='li_javaApi_a' href=''><i class='icon icon-th'></i> <span>JAVA服务信息</span></a></li>";
innerHTML += "<li id='li_zkInfo'><a id='li_zkInfo_a' href=''><i class='icon icon-th'></i> <span>ZK监控</span></a></li>";
innerHTML += "<li id='li_zkSvcLookup'><a id='li_zkSvcLookup_a' href=''><i class='icon icon-th'></i> <span>ZK服务信息</span></a></li>";
innerHTML += "<li id='li_rabbitview'><a id='li_rabbitview_a' href=''><i class='icon icon-th'></i> <span>Rabbitmq监控</span></a></li>";
/*innerHTML += "<li id='li_redisInfo'><a id='li_redisInfo_a' href=''><i class='icon icon-th'></i> <span>Redis监控</span></a></li>";*/
innerHTML += "<li id='li_newRedisMonitor'><a id='li_newRedisMonitor_a' href=''><i class='icon icon-th'></i> <span>Redis监控</span></a></li>";
... ... @@ -123,6 +124,7 @@ document.getElementById("li_javaMonitor_a").setAttribute("href", path + "/javaMo
document.getElementById("li_javaApiMonitor_a").setAttribute("href", path + "/javaApiMonitor/toJavaApiMonitor");
document.getElementById("li_javaApi_a").setAttribute("href", path + "/javaApi/toJavaApi");
document.getElementById("li_zkInfo_a").setAttribute("href", path + "/zkMonitor/tozkMonitor");
document.getElementById("li_zkSvcLookup_a").setAttribute("href", path + "/zkSvcLookup/tozkSvcLookupList");
document.getElementById("li_rabbitview_a").setAttribute("href", path + "/rabbitmq/toRabbitmq");
document.getElementById("li_projectRelease_a").setAttribute("href", path + "/project/toProject");
document.getElementById("li_phpRelease_a").setAttribute("href", path + "/phpBuild/toProject");
... ...