{{template "header.tmpl" .}}
</head>
<body>
{{template "navbar.tmpl" .}}

<div class="container-fluid">
	<h4 class="text-center">Redis实时状态查看&nbsp;<small>[<a href="#" id="btn_refresh">刷新</a>]</small></h4>
	<hr />
	<table class="table table-bordered table-striped">
		<thead>
			<tr>
				<th>ID</th>
				<th>服务地址</th>
				<th>备注</th>
				<th>版本号</th>
				<th>进程ID</th>
				<th>上线时长</th>
				<th>CPU(USR/SYS)</th>
				<th>OPS/QPS</th>
				<th>系统内存</th>
				<th>分配内存</th>
				<th>已用内存</th>
				<th>淘汰策略</th>
				<th>回写规则</th>
				<th>过期数</th>
				<th>丢弃数</th>
				<th>当前连接</th>
				<th>阻塞连接</th>
				<th>拒绝连接</th>
				<th>取命中</th>
				<th>取未命中</th>
				<th>DB0使用</th>
				<th>详情</th>
			</tr>
		</thead>
		<tbody id="list"></tbody>
	</table>
</div>

<script type="text/javascript">
var $SESS = {{.Sess}};
$(function(){
	function load_stats() {
		$('#list').empty();
		$.get("/index/stats", {}, function(resp){
			if (resp && resp.errno == 0) {
				var html = '';
				for (var i=0; i<resp.data.length; i++) {
					var item = resp.data[i];
					if (item.Error == '') {
						if (typeof item.Data.db0 == 'undefined') {
							item.Data.db0 = '-';
						}
						var qps = parseInt(item.Data.instantaneous_ops_per_sec), qps_flag = '';
						if (qps > 30000) {
							qps_flag = 'danger';
						} else if (qps > 10000) {
							qps_flag = 'warning';
						}
						var maxmemory = parseInt(item.Data.maxmemory), maxmemory_flag = '';
						if (maxmemory == 0) {
							maxmemory_flag = 'danger';
						}
						var used_memory_pc = (maxmemory > 0 ? parseInt(item.Data.used_memory) / maxmemory : 0), used_memory_flag = '';
						if (used_memory_pc > 0.9) {
							maxmemory_flag = 'danger';
						} else if (used_memory_pc > 0.8) {
							maxmemory_flag = 'warning';
						}
						var evicted_keys_flag = parseInt(item.Data.evicted_keys) > 0 ? 'warning' : '';
						var connected_clients_flag = parseInt(item.Data.connected_clients) > 1000 ? 'warning' : '';
						var blocked_clients_flag = parseInt(item.Data.blocked_clients) > 0 ? 'warning' : '';
						var used_cpu_user = parseInt(item.Data.used_cpu_user);
						var used_cpu_sys = parseInt(item.Data.used_cpu_sys);
						html += `<tr>
							<td>${item.Id}</td>
							<td>${item.Address}</td>
							<td>${item.Remark}</td>
							<td>${item.Data.redis_version}</td>
							<td>${item.Data.process_id}</td>
							<td>${item.Data.uptime_in_days}天</td>
							<td>${used_cpu_user}<i class="text-primary">s</i>/${used_cpu_sys}<i class="text-primary">s</i></td>
							<td class="${qps_flag}">${item.Data.instantaneous_ops_per_sec}</td>
							<td>${item.Data.total_system_memory_human}</td>
							<td class="${maxmemory_flag}">${item.Data.maxmemory_human}</td>
							<td class="${used_memory_flag}'">${item.Data.used_memory_human}</td>
							<td>${item.Data.maxmemory_policy}</td>
							<td>${item.Data.save}</td>
							<td>${item.Data.expired_keys}</td>
							<td class="${evicted_keys_flag}">${item.Data.evicted_keys}</td>
							<td class="${connected_clients_flag}">${item.Data.connected_clients}</td>
							<td class="${blocked_clients_flag}">${item.Data.blocked_clients}</td>
							<td>${item.Data.rejected_connections}</td>
							<td>${item.Data.keyspace_hits}</td>
							<td>${item.Data.keyspace_misses}</td>
							<td>${item.Data.db0}</td>
							<td><a href="#" data-value="${item.Id}">查看</a></td>
						</tr>`;
					} else {
						html += `<tr>
							<td>${item.Id}</td>
							<td>${item.Address}</td>
							<td>${item.Remark}</td>
							<td colspan="21" class="danger">${item.Error}</td>
						</tr>`;
					}
				}
				$('#list').html(html);
				$('#list a').click(function(){
					var id = $(this).attr('data-value');
					$.get('/index/info', {'id': id}, function(resp){
						if (resp && resp.data) {
							var html = '<table class="table table-bordered table-striped">';
							html += '<thead><th>Key</th><th>值</th></tr></thead><tbody>';
							for(var k in resp.data.Data) {
								html += '<tr>';
								html += '<td>' + k + '</td>';
								html += '<td>' + resp.data.Data[k] + '</td>';
								html += '</tr>';
							}
							html += '</tbody></table>';
							$.alert({
								'title': 'Redis [' + resp.data.Address + '] 状态详情',
								'content': html,
								'size': 'modal-lg'
							});
						}
					}, 'json');
					return false;
				});
			}
		}, 'json');
	}

	$('#btn_refresh').click(function(){
		load_stats();
		return false;
	});

	load_stats();
});
</script>
</body>
</html>