ops / monitor-ui · Commits

Go to a project

Authored by zhengyouwei
Commit 2446fa72be7e7e0dde95401f9fcb36b7827c08d0 2 parents 839ed292 900eff54

Merge branch 'master' of http://git.yoho.cn/ops/monitor-ui

Inline Side-by-side
Showing 3 changed files with 195 additions and 2 deletions
  1 +package com.ui.ctrl;
  2 +
  3 +import com.ui.http.HttpRestClient;
  4 +import com.ui.model.BaseResponse;
  5 +import org.springframework.beans.factory.annotation.Autowired;
  6 +import org.springframework.web.bind.annotation.RequestMapping;
  7 +import org.springframework.web.bind.annotation.RequestParam;
  8 +import org.springframework.web.bind.annotation.RestController;
  9 +import org.springframework.web.servlet.ModelAndView;
  10 +
  11 +import java.util.*;
  12 +
  13 +/**
  14 + * Created by yoho on 2016/9/21.
  15 + */
  16 +@RestController
  17 +@RequestMapping(value = "memcachedMonitor")
  18 +public class MemcachedMonitorCtrl {
  19 +
  20 + @Autowired
  21 + HttpRestClient httpRestClient;
  22 +
  23 + @RequestMapping("/toMemcached")
  24 + public ModelAndView toRedisInfo() {
  25 + return new ModelAndView("memcached/memcachedMonitor");
  26 + }
  27 +
  28 +
  29 + /**
  30 + * 查询所有的twemproxy 与 独立 redis的信息
  31 + *
  32 + * @return
  33 + */
  34 + @RequestMapping(value = "/allMemcached")
  35 + public BaseResponse queryAllTwemproxy() {
  36 + BaseResponse baseResponse = httpRestClient.defaultGet("/memcachedMonitor/allMemcached", BaseResponse.class);
  37 + return baseResponse;
  38 + }
  39 +
  40 +}
  1 +<%--
  2 + Created by IntelliJ IDEA.
  3 + User: yoho
  4 + Date: 2016/9/21
  5 + Time: 10:42
  6 + To change this template use File | Settings | File Templates.
  7 +--%>
  8 +<%@ page import="org.aspectj.weaver.ast.Var" %>
  9 +<%@ page language="java" contentType="text/html; charset=UTF-8"
  10 + pageEncoding="UTF-8" %>
  11 +<%
  12 + String path = request.getContextPath();
  13 + String basePath = request.getScheme() + "://"
  14 + + request.getServerName() + ":" + request.getServerPort()
  15 + + path + "/";
  16 +%>
  17 +<html>
  18 +<head>
  19 + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  20 + <link rel="stylesheet" href="<%=basePath %>css/bootstrap.min.css"/>
  21 + <link rel="stylesheet" href="<%=basePath %>css/unicorn.main.css"/>
  22 + <link rel="stylesheet" href="<%=basePath %>css/unicorn.grey.css"/>
  23 + <link rel="stylesheet" href="<%=basePath %>css/jquery-ui.css"/>
  24 + <link rel="stylesheet" href="<%=basePath %>css/bootstrap-responsive.min.css"/>
  25 + <link rel="stylesheet" href="<%=basePath %>css/uniform.css"/>
  26 + <link rel="stylesheet" href="<%=basePath %>css/select2.css"/>
  27 + <script src="<%=basePath %>js/excanvas.min.js" charset="UTF-8" type="text/javascript"></script>
  28 + <script src="<%=basePath %>js/jquery-1.12.0.min.js" charset="UTF-8" type="text/javascript"></script>
  29 + <script src="<%=basePath %>js/jquery-ui.custom.js" charset="UTF-8" type="text/javascript"></script>
  30 + <script src="<%=basePath %>/js/bootstrap.min.js"></script>
  31 + <script src="<%=basePath %>/js/unicorn.js"></script>
  32 + <script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/moment-with-locales.js" charset="UTF-8"
  33 + type="text/javascript"></script>
  34 + <script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/bootstrap-datetimepicker.js" charset="UTF-8"
  35 + type="text/javascript"></script>
  36 + <script src="<%=basePath %>js/global.js" charset="UTF-8" type="text/javascript"></script>
  37 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.pagination.js" charset="UTF-8"
  38 + type="text/javascript"></script>
  39 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.table.js" charset="UTF-8" type="text/javascript"></script>
  40 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.dialog.js" charset="UTF-8" type="text/javascript"></script>
  41 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
  42 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.panel.js" charset="UTF-8" type="text/javascript"></script>
  43 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.alerts.js" charset="UTF-8" type="text/javascript"></script>
  44 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.accordion.js" charset="UTF-8"
  45 + type="text/javascript"></script>
  46 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.breadcrumb.js" charset="UTF-8"
  47 + type="text/javascript"></script>
  48 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.validate.js" charset="UTF-8"
  49 + type="text/javascript"></script>
  50 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
  51 + <script src="<%=basePath %>js/layer/layer.js" charset="UTF-8" type="text/javascript"></script>
  52 + <script src="<%=basePath %>js/bootstrap-plugin/bootstrap.select.js" charset="UTF-8" type="text/javascript"></script>
  53 + <script src="<%=basePath %>js/jstree/jstree.min.js"></script>
  54 + <script src="<%=basePath %>js/jquery.toaster.js"></script>
  55 + <script>
  56 + var contextPath = '<%=basePath %>';
  57 + </script>
  58 + <title>YOHO!运维</title>
  59 +</head>
  60 +<body>
  61 +<!-- 头部 -->
  62 +<div id="head">
  63 +</div>
  64 +
  65 +<!-- 右侧具体内容 -->
  66 +<div id="content">
  67 +
  68 + <div id="breadcrumb">
  69 + <a href="#" title="Go to Home" class="tip-bottom"><i
  70 + class="icon-home"></i> Home</a> <a href="#" class="current">Memcached</a>
  71 + </div>
  72 +
  73 + <div class="container-fluid">
  74 + <div class="widget-box">
  75 + <div class="widget-title">
  76 + <h5>Memcached状态预览 <font color="red">(最近2分钟)</font></h5>
  77 + </div>
  78 + </div>
  79 +
  80 + <div class="container-fluid">
  81 +
  82 + <div id="tMemTable">
  83 +
  84 + </div>
  85 + </div>
  86 + </div>
  87 +
  88 +</div>
  89 +</body>
  90 +<script src="<%=basePath %>js/pagination.js"></script>
  91 +<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
  92 +<script>
  93 + $("#li_monitor").addClass("active open");
  94 + $("#li_newRedisMonitor").addClass("active");
  95 +</script>
  96 +
  97 +<script type="text/javascript">
  98 + $(function () {
  99 + $("#tMemTable").table({
  100 + url: contextPath + "memcachedMonitor/allMemcached",
  101 + striped: true,
  102 + panelClass: "panel-success",
  103 + loadFilter: function (data) {
  104 + console.log(data.data)
  105 + return defaultLoadFilter(data);
  106 + },
  107 + columns: [
  108 + {
  109 + title: "业务分类",
  110 + width:"200px",
  111 +// field: "name"
  112 + formatter: function (value, rowData, rowIndex) {
  113 + return rowData.name.substring(0,17);
  114 + }
  115 + },
  116 + {
  117 + title: "地址",
  118 + width: "200px",
  119 + field: "url"
  120 + }, {
  121 + title: "当前连接数",
  122 + field: "curConnections"
  123 + }, {
  124 + title: "启动时长",
  125 + field: "upTime"
  126 + }, {
  127 + title: "get频率(次/秒)",
  128 + field: 'cmdGet'
  129 + }, {
  130 + title: "set频率(次/秒)",
  131 + field: "cmdSet"
  132 + }, {
  133 + title: "get命中率",
  134 + width: "100px",
  135 + field: "hitRate"
  136 + }, {
  137 + title: "使用内存",
  138 + field: "useMemory"
  139 + }, {
  140 + title: "最大内存",
  141 + field: "maxMemory"
  142 + }, {
  143 + title: "当前数量",
  144 + field: "curItems"
  145 + }],
  146 + /* data: data*/
  147 + });
  148 +
  149 + });
  150 +
  151 +</script>
  152 +</html>
@@ -16,7 +16,8 @@ innerHTML += "<li id='li_javaApi'><a id='li_javaApi_a' href=''><i class='icon ic @@ -16,7 +16,8 @@ innerHTML += "<li id='li_javaApi'><a id='li_javaApi_a' href=''><i class='icon ic
16 innerHTML += "<li id='li_zkInfo'><a id='li_zkInfo_a' href=''><i class='icon icon-th'></i> <span>ZK监控</span></a></li>"; 16 innerHTML += "<li id='li_zkInfo'><a id='li_zkInfo_a' href=''><i class='icon icon-th'></i> <span>ZK监控</span></a></li>";
17 innerHTML += "<li id='li_rabbitview'><a id='li_rabbitview_a' href=''><i class='icon icon-th'></i> <span>Rabbitmq监控</span></a></li>"; 17 innerHTML += "<li id='li_rabbitview'><a id='li_rabbitview_a' href=''><i class='icon icon-th'></i> <span>Rabbitmq监控</span></a></li>";
18 /*innerHTML += "<li id='li_redisInfo'><a id='li_redisInfo_a' href=''><i class='icon icon-th'></i> <span>Redis监控</span></a></li>";*/ 18 /*innerHTML += "<li id='li_redisInfo'><a id='li_redisInfo_a' href=''><i class='icon icon-th'></i> <span>Redis监控</span></a></li>";*/
19 -innerHTML += "<li id='li_newRedisMonitor'><a id='li_newRedisMonitor_a' href=''><i class='icon icon-th'></i> <span>Redis监控(new)</span></a></li>"; 19 +innerHTML += "<li id='li_newRedisMonitor'><a id='li_newRedisMonitor_a' href=''><i class='icon icon-th'></i> <span>Redis监控</span></a></li>";
  20 +innerHTML += "<li id='li_newRedisMonitor'><a id='li_memcachedMonitor_a' href=''><i class='icon icon-th'></i> <span>Memcached监控</span></a></li>";
20 innerHTML += "<li id='li_nginxview'><a id='li_nginxview_a' href=''><i class='icon icon-th'></i> <span>Nginx监控</span></a></li>"; 21 innerHTML += "<li id='li_nginxview'><a id='li_nginxview_a' href=''><i class='icon icon-th'></i> <span>Nginx监控</span></a></li>";
21 innerHTML += "<li id='li_dns_monitor'><a id='li_dns_monitor_a' href=''><i class='icon icon-th'></i> <span>DNS反劫持监控</span></a></li>"; 22 innerHTML += "<li id='li_dns_monitor'><a id='li_dns_monitor_a' href=''><i class='icon icon-th'></i> <span>DNS反劫持监控</span></a></li>";
22 innerHTML += "</ul></li>"; 23 innerHTML += "</ul></li>";
@@ -115,7 +116,7 @@ document.getElementById("li_works_a").setAttribute("href", path + "/workSystem/t @@ -115,7 +116,7 @@ document.getElementById("li_works_a").setAttribute("href", path + "/workSystem/t
115 document.getElementById("li_aws_ebs_a").setAttribute("href", path + "/aws/toEbsManager"); 116 document.getElementById("li_aws_ebs_a").setAttribute("href", path + "/aws/toEbsManager");
116 document.getElementById("li_om_new_a").setAttribute("href", path + "/project/toNewOm"); 117 document.getElementById("li_om_new_a").setAttribute("href", path + "/project/toNewOm");
117 document.getElementById("li_newRedisMonitor_a").setAttribute("href", path + "/redisMonitor/toNewRedis"); 118 document.getElementById("li_newRedisMonitor_a").setAttribute("href", path + "/redisMonitor/toNewRedis");
118 - 119 +document.getElementById("li_memcachedMonitor_a").setAttribute("href", path + "/memcachedMonitor/toMemcached");
119 120
120 121
121 function getUrlBasePath() { 122 function getUrlBasePath() {