|
|
@@ -0,0 +1,117 @@
|
|
|
+{{template "header.tmpl" .}}
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+{{template "navbar.tmpl" .}}
|
|
|
+
|
|
|
+<div class="container-fluid">
|
|
|
+ <h4 class="text-center">Redis监控日志列表</h4>
|
|
|
+ <hr />
|
|
|
+ <form class="form-inline" id="filterform" style="margin-bottom:10px;">
|
|
|
+ <div class="form-group" style="margin-right:20px;">
|
|
|
+ <label>Redis实例：</label>
|
|
|
+ <select class="form-control" name="redis_id" autocomplete="off">
|
|
|
+ <option value="0">所有</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="form-group">
|
|
|
+ <label>排序方式：</label>
|
|
|
+ <select class="form-control" name="order" autocomplete="off">
|
|
|
+ <option value="ASC">正序</option>
|
|
|
+ <option value="DESC" selected="selected">倒序</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ <table class="table table-bordered table-striped">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th>ID</th>
|
|
|
+ <th>Redis ID</th>
|
|
|
+ <th>Redis地址</th>
|
|
|
+ <th>Redis备注</th>
|
|
|
+ <th>检测时间</th>
|
|
|
+ <th>服务状态</th>
|
|
|
+ <th>连续异常次数</th>
|
|
|
+ <th>已用内存</th>
|
|
|
+ <th>分配内存</th>
|
|
|
+ <th>系统内存</th>
|
|
|
+ <th>客户连接数</th>
|
|
|
+ <th>QPS</th>
|
|
|
+ <th>淘汰KEY数量</th>
|
|
|
+ <th>新增淘汰KEY数量</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="list"></tbody>
|
|
|
+ </table>
|
|
|
+ <div id="pager" class="text-center"></div>
|
|
|
+</div>
|
|
|
+
|
|
|
+<script type="text/javascript">
|
|
|
+var $SESS = {{.Sess}};
|
|
|
+
|
|
|
+$(function(){
|
|
|
+ var PAGE_SIZE = 20;
|
|
|
+ var form = $('#filterform').get(0);
|
|
|
+
|
|
|
+ function init() {
|
|
|
+ $.get('/syscfg/redis_list', {}, function(resp) {
|
|
|
+ if (resp && resp.errno == 0) {
|
|
|
+ var selector = $(form.redis_id);
|
|
|
+ for (var i=0; i<resp.data.length; i++) {
|
|
|
+ var item = resp.data[i];
|
|
|
+ selector.append($(`<option value="${item.Id}">#${item.Id}[${item.Address}] ${item.Remark}</opton>`));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 'json');
|
|
|
+ }
|
|
|
+
|
|
|
+ function load(p) {
|
|
|
+ $.get('/log/monitor_list', {
|
|
|
+ 'size': PAGE_SIZE,
|
|
|
+ 'page': p || 1,
|
|
|
+ 'redis_id': form.redis_id.value,
|
|
|
+ 'order': form.order.value
|
|
|
+ }, function(resp){
|
|
|
+ if (resp && resp.errno == 0) {
|
|
|
+ var html = '';
|
|
|
+ for (var i=0; i<resp.data.List.length; i++) {
|
|
|
+ html += '<tr>';
|
|
|
+ html += ' <td>' + resp.data.List[i].Id + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].RedisId + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].RedisAddress + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].RedisRemark + '</td>';
|
|
|
+ html += ' <td>' + time2str(resp.data.List[i].LogTime) + '</td>';
|
|
|
+ html += ' <td' + (resp.data.List[i].QueryStatus ? '' : ' class="danger"') + '>' + (resp.data.List[i].QueryStatus ? '正常' : '异常') + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].FailedCount + '</td>';
|
|
|
+ html += ' <td>' + size2str(resp.data.List[i].UsedMemory) + '</td>';
|
|
|
+ html += ' <td>' + size2str(resp.data.List[i].MaxMemory) + '</td>';
|
|
|
+ html += ' <td>' + size2str(resp.data.List[i].SystemMemory) + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].Connection + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].QPS + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].EvictedKeys + '</td>';
|
|
|
+ html += ' <td>' + resp.data.List[i].EviIncreased + '</td>';
|
|
|
+ html += '</tr>';
|
|
|
+ }
|
|
|
+ $('#list').html(html);
|
|
|
+ pager({
|
|
|
+ 'id': 'pager',
|
|
|
+ 'total': resp.data.Count,
|
|
|
+ 'page_size': PAGE_SIZE,
|
|
|
+ 'page_num': p,
|
|
|
+ 'callback': load
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }, 'json');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ $('select', form).change(function(){
|
|
|
+ load(1);
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ init();
|
|
|
+ load(1);
|
|
|
+});
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
