ops / monitor-ui · Commits

Go to a project

Authored by linlong
Commit b8a0950b42689adda85c2d7dc2fd3e775ef13fd2 1 parent a58941b2

memcached监控

Inline Side-by-side
Showing 3 changed files with 195 additions and 2 deletions
package com.ui.ctrl;
import com.ui.http.HttpRestClient;
import com.ui.model.BaseResponse;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;
import java.util.*;
/**
* Created by yoho on 2016/9/21.
*/
@RestController
@RequestMapping(value = "memcachedMonitor")
public class MemcachedMonitorCtrl {
@Autowired
HttpRestClient httpRestClient;
@RequestMapping("/toMemcached")
public ModelAndView toRedisInfo() {
return new ModelAndView("memcached/memcachedMonitor");
}
/**
* 查询所有的twemproxy 与 独立 redis的信息
*
* @return
*/
@RequestMapping(value = "/allMemcached")
public BaseResponse queryAllTwemproxy() {
BaseResponse baseResponse = httpRestClient.defaultGet("/memcachedMonitor/allMemcached", BaseResponse.class);
return baseResponse;
}
}
... ...
<%--
Created by IntelliJ IDEA.
User: yoho
Date: 2016/9/21
Time: 10:42
To change this template use File | Settings | File Templates.
--%>
<%@ page import="org.aspectj.weaver.ast.Var" %>
<%@ 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 + "/";
%>
<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/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/bootstrap-responsive.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/uniform.css"/>
<link rel="stylesheet" href="<%=basePath %>css/select2.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.min.js"></script>
<script src="<%=basePath %>js/jquery.toaster.js"></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">Memcached</a>
</div>
<div class="container-fluid">
<div class="widget-box">
<div class="widget-title">
<h5>Memcached状态预览 <font color="red">(最近2分钟)</font></h5>
</div>
</div>
<div class="container-fluid">
<div id="tMemTable">
</div>
</div>
</div>
</div>
</body>
<script src="<%=basePath %>js/pagination.js"></script>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script>
$("#li_monitor").addClass("active open");
$("#li_newRedisMonitor").addClass("active");
</script>
<script type="text/javascript">
$(function () {
$("#tMemTable").table({
url: contextPath + "memcachedMonitor/allMemcached",
striped: true,
panelClass: "panel-success",
loadFilter: function (data) {
console.log(data.data)
return defaultLoadFilter(data);
},
columns: [
{
title: "业务分类",
width:"200px",
// field: "name"
formatter: function (value, rowData, rowIndex) {
return rowData.name.substring(0,17);
}
},
{
title: "地址",
width: "200px",
field: "url"
}, {
title: "当前连接数",
field: "curConnections"
}, {
title: "启动时长",
field: "upTime"
}, {
title: "get频率(次/秒)",
field: 'cmdGet'
}, {
title: "set频率(次/秒)",
field: "cmdSet"
}, {
title: "get命中率",
width: "100px",
field: "hitRate"
}, {
title: "使用内存",
field: "useMemory"
}, {
title: "最大内存",
field: "maxMemory"
}, {
title: "当前数量",
field: "curItems"
}],
/* data: data*/
});
});
</script>
</html>
... ...
... ... @@ -16,7 +16,8 @@ innerHTML += "<li id='li_javaApi'><a id='li_javaApi_a' href=''><i class='icon ic
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_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监控(new)</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>";
innerHTML += "<li id='li_newRedisMonitor'><a id='li_memcachedMonitor_a' href=''><i class='icon icon-th'></i> <span>Memcached监控</span></a></li>";
innerHTML += "<li id='li_nginxview'><a id='li_nginxview_a' href=''><i class='icon icon-th'></i> <span>Nginx监控</span></a></li>";
innerHTML += "<li id='li_dns_monitor'><a id='li_dns_monitor_a' href=''><i class='icon icon-th'></i> <span>DNS反劫持监控</span></a></li>";
innerHTML += "</ul></li>";
... ... @@ -115,7 +116,7 @@ document.getElementById("li_works_a").setAttribute("href", path + "/workSystem/t
document.getElementById("li_aws_ebs_a").setAttribute("href", path + "/aws/toEbsManager");
document.getElementById("li_om_new_a").setAttribute("href", path + "/project/toNewOm");
document.getElementById("li_newRedisMonitor_a").setAttribute("href", path + "/redisMonitor/toNewRedis");
document.getElementById("li_memcachedMonitor_a").setAttribute("href", path + "/memcachedMonitor/toMemcached");
function getUrlBasePath() {
... ...