<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta charset="utf-8">
	<title>爬虫控制台</title>
	<meta name="generator" content="Bootply" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link href="/css/bootstrap.min.css" rel="stylesheet">
	<!--[if lt IE 9]>
	<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->
	<link href="/css/styles.css" rel="stylesheet">
	<script src="/js/jquery.js"></script>
	<script src="/js/bootstrap.min.js"></script>
</head>
<body>
{{include "head.html"}}
<!-- Main -->
<div class="container-fluid">
	<!-- upper section -->
	<div class="row">
		<div class="col-sm-3">
			<!-- left -->
			<h3><i class="glyphicon glyphicon-briefcase"></i> 工具栏</h3>
			<hr>
			<div class="panel panel-default">
				<div class="panel-heading"><b><h4>爬虫概览</h4></b></div>
				<div class="panel-body">
					<div class="col-sm-6" style="padding:5px"><span>爬虫总数：{{.T.spTotal}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>运行总数：{{.T.spRunTotal}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>今请求数：{{.T.todayRequest}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>今下载量：{{.T.todayDownTotal}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>昨请求数：{{.T.yestoDayRequest}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>昨下载量：{{.T.yesdayDownTotal}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>错误总量：{{.T.errTotal}}</span></div>
					<div class="col-sm-6" style="padding:5px"><span>list：{{.T.listnum}}</span></div>
				</div>
			</div>
		</div>	
		
		<div class="col-sm-9">
			<!-- column 2 -->	
			<h3><i class="glyphicon glyphicon-dashboard"></i> 控制台</h3>       
			<hr>
			<div class="row">
				<div class="col-md-12" style="min-height:680px">
					<div class="input-append form-group" style="padding:3px">
						<div class="col-sm-4">
							<input type="text" id="qcode" name="qcode" value="" class="form-control" placeholder="请输入查找的爬虫代码|名称">
						</div>
						<div class="col-sm-2 form-group">
					     	<select id="state" class="form-control"> 
						        <option value="all">全部</option> 
								<option value="run">运行</option> 
						        <option value="stop">停止</option> 
						        <option value="pass">暂停</option>
								<option value="abnormal">异常</option> 
								<option value="norequest">无请求</option> 
					     	</select>
						</div>
						<div class="col-sm-1" style="padding-left:0px;padding-right:0px;">
							<button class="btn btn-default" onclick="search(0)">搜索</button>
						</div>
						
					</div>
					<br/>
					<table class="table table-hover table-striped" style="margin-top:12px;" id="spiderlist">
						<thead>
							<tr class="active">
								<th align="center" class="u-status" style="width:20%">名称(代码)</th>
								<th align="center" class="u-status" style="width:8%">状态</th>
								<th align="center" class="u-status" style="width:12%">负责人</th>
								<th align="center" class="u-status" style="width:15%">昨下载/请求量</th>
								<th align="center" class="u-status" style="width:15%">今下载/请求量</th>
								<th align="center" class="u-status" style="width:10%">错误量</th>
								<th align="center" class="u-status" style="width:10%">末时间</th>
								<th align="center" class="u-status" style="width:10%">末量</th>
							</tr>
						</thead>
						<tbody id="tbody">
							{{range $k,$v:=.T.spiders}}
							<tr> 
								<td><a href="{{$v.targetChannelUrl}}" target="_blank" title="最后心跳：{{$v.lastHeartbeat}}">{{$v.name}}({{$v.code}})</a></td>
								<td align="center">
									{{if $v.stop}} 已停止 {{else if $v.pass}} 已暂停 {{else}} 运行中{{end}}/{{$v.lstate}}
								</td>
								<td align="center">{{$v.userName}}</td>
								{{if and (le $v.yesterdayDownNum $v.uplimit) (ge $v.yesterdayDownNum $v.lowlimit) }} 
									<td align="center">{{$v.yesterdayDownNum}}/{{$v.yestoDayRequest}}</td> 
								{{else}}
									<td style="color:red" align="center">{{$v.yesterdayDownNum}}/{{$v.yestoDayRequest}}</td>
								{{end}}
								<td align="center">{{$v.todayDownNum}}/{{$v.todayRequest}}</td>
								<td align="center">
									<a href="/front/viewErrIndex/{{$v.code}}.html" title="未下载数：{{$v.noDownloadNum}}">{{$v.errnum}}</a><br/>
									<a title="清零" href="javascript:void(0)" onclick='toDo("clearErr","{{$v.code}}")'>清零</a></td>
								<td align="center"><span title="{{$v.lastTime}}">{{$v.lastTimeShort}}</span></td>
								<td align="center">{{$v.lastDownNum}}</td>
							</tr>		
							{{end}}
						</tbody>
					</table>
				</div>	
				<div>
					<table align="center"><tr>
						<td style="padding:10px"><button class="btn btn-default" onclick="search(0)">首页</button></td>
						<td style="padding:10px"><button class="btn btn-default" onclick="search(-1)">上一页</button></td>
						<td style="padding:10px"><button class="btn btn-default" onclick="search(1)">下一页</button></td>
						<td style="padding:10px"><button class="btn btn-default" onclick="search(2)">尾页</button></td>
					</tr></table>
				</div>
			</div>
		</div>
	</div>
</div>
{{include "bottom.html"}}
<script>
var currPage={{.T.currPage}}
function toDo(type,code){
	qcode=$("#qcode").val();
	state=$("#state").val();
	$.ajax({
		url:"/front/"+type,
		method:"post",
		data:{code:code,qcode:qcode,currPage:currPage,state:state},
		success:function(res){
			setBody(res)
			if(res["info"]){
				alert(res["info"])
			}
		},
		error:function(){
			alert("服务器无响应");
		}
	});
}
 
function search(pre){
	if(pre==1){
		currPage=currPage+1
	}else if(pre<0){
		currPage=currPage-1
	}else if(pre==2){
		currPage={{.T.totalPage}}
	}else{
		currPage=1
	}
	qcode=$("#qcode").val();
	state=$("#state").val();
 
	$.ajax({
		url:"/front/searchJob",
		method:"post",
		data:{qcode:qcode,currPage:currPage,state:state},
		success:function(res){
			$("#qcode").val(res["qcode"])
			setBody(res)
		}
	});
}

function setBody(res){
	var tbody="";
	currPage=res["currPage"];
	$.each(res["spiders"],function(n,v) {
        var td1= "<td><a href='"+v.targetChannelUrl+"' target='_blank' title='最后心跳："+v.lastHeartbeat+"'>" + v.name +"("+v.code+")</a></td>"; 
		var td2="",td3="",td4="",td5="",td6="",td7=""; 
		if (v.stop==true) {
			td2="<td align='center'>已停止/"+v.lstate+"</td>"; 
		}else{
			if(v.pass==true){
				td2="<td align='center'>已暂停/"+v.lstate+"</td>"; 
			}else{
				td2="<td align='center'>运行中/"+v.lstate+"</td>"; 
			}
		}
		td4=td4+"<td align='center'>"+v.userName+"</td>"
		if(v.yesterdayDownNum<=v.uplimit&&v.yesterdayDownNum>=v.lowlimit){
			td4=td4+"<td align='center'>"+v.yesterdayDownNum+"/"+v.yestoDayRequest+"</td>"
		}else{
			td4=td4+"<td align='center' style='color:red'>"+v.yesterdayDownNum+"/"+v.yestoDayRequest+"</td>"
		}
		td4=td4+"<td align='center'>"+v.todayDownNum+"/"+v.todayRequest+"</td>"
		td5="<td align='center'><a href='/front/viewErrIndex/"+v.code+".html' title='未下载数："+v.noDownloadNum+"'>"+v.errnum+"</a><br/>"
		+"<a title='清零' href='javascript:void(0)' onclick='toDo(\"clearErr\",\""+v.code+"\")'>清零</a></td>"      
		td6="<td align='center'><span title='"+v.lastTime+"'>"+v.lastTimeShort+"</span></td>"
		td7="<td align='center'>"+v.lastDownNum+"</td>"   
		tbody=tbody+"<tr>"+td1+td2+td3+td4+td5+td6+td7+"</tr>"
	}); 
	$("#tbody").html(tbody);  
}

</script>
</body>
</html>