{{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">
				<option value="ASC">正序</option>
				<option value="DESC" selected="selected" autocomplete="off">倒序</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>
			</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/autoprocess_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].ProcessTime) + '</td>';
					html += '	<td>' + size2str(resp.data.List[i].MaxMemoryBefore) + '</td>';
					html += '	<td>' + size2str(resp.data.List[i].MaxMemoryAfter) + '</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>