$(function(){
	$("#datetimeStart").datetimebox("setValue",$.getTodayStart(0,"00:00:00"));
	$("#datetimeEnd").datetimebox("setValue",$.getTodayEnd("23:59:59"));
	var height=($("body").height()-$(".play-header").height()-$(".tabs-header").height()-40)+"px";
	$(".tableGridWrap").css("height",height);
	tableGridList();
	initBtn();
	initTableGrid();
});

$.extend($.fn.datagrid.methods,
		{
	renderMonitorData:function(n, g, h){
		 var m = n.parent(".datagrid-view:eq(0)"),
         c;
         var k = m.prev("div").append("<table cellspacing=0 cellpadding=0 style='display:inline-block;height:26px;float:right;'><tbody><tr/></tbody></table>").children("table:eq(1)").find("tbody tr");
         var b = m.parent().height();
         var o = m.parent().width();
         if (!m.next("div.imgcontainer").html()) {
             c = $("<div class='imgcontainer' style='overflow-y:auto; width:99%;height:" + (b - 70) + "px;'></div>");
             m.after(c)
         } else {
             c = m.next("div.imgcontainer")
         }
         if (!g) {
             return
         }
         var f = 0,
         l = [],
         e,
         d,
         j = this;
         for (; (g.data[f]); f++) {
             g.data[f].oprStatusColor = 'style="color:' + (g.data[f].oprStatus == 0 ? "blue;": "red;") + '"';
            if(g.data[f].videolabelstatusname==null){
            	l.push('<div class="view-item" style="width:220px;position:relative;">'
            			+' <div class="showAlarmType" style="top: -15px;right: 4px;width: 67px; color: white;z-index: 10; height: 40px;background: #1612263b;font-size: 14px;font-weight: bolder;position:absolute;text-align: center; line-height: 40px;display:none;">'+g.data[f].videolabelstatusname+'</div>' 
            			+ '<img onclick="detailVideoQuality('+g.data[f].id+');"  src="' + (g.data[f].picturepath) + '" onerror="javascript:$.loadErrorPic(this);" style="width:218px;"/><div style="width:218px;">' + "<p>相机名称:&nbsp;" + (g.data[f].channelname || "无") + "</p>" + "<p style='line-height:20px;'>抓拍时间:&nbsp;" + (g.data[f].runtime || "") + "</p>" + "<p style='line-height:20px;'>告警类型:&nbsp;<span " + g.data[f].oprStatusColor + ">" + (g.data[f].videostatusname || "") + "</span></p>" + labelstatusRender(g.data[f].id,g.data[f].videolabelstatusname) + "</div></div>")
            }else{
            	l.push('<div class="view-item" style="width:220px;position:relative;">'
            			+' <div class="showAlarmType" style="top: -15px;right: 4px;width: 67px; color: white;z-index: 10; height: 40px;background: #1612263b;font-size: 14px;font-weight: bolder;position:absolute;text-align: center; line-height: 40px;">'+g.data[f].videolabelstatusname+'</div>' 
            			+ '<img onclick="detailVideoQuality('+g.data[f].id+');" src="' + (g.data[f].picturepath) + '" onerror="javascript:$.loadErrorPic(this);" style="width:218px;"/><div style="width:218px;">' + "<p>相机名称:&nbsp;" + (g.data[f].channelname || "无") + "</p>" + "<p style='line-height:20px;'>抓拍时间:&nbsp;" + (g.data[f].runtime || "") + "</p>" + "<p style='line-height:20px;'>告警类型:&nbsp;<span " + g.data[f].oprStatusColor + ">" + (g.data[f].videostatusname || "") + "</span></p>" + labelstatusRender(g.data[f].id,g.data[f].videolabelstatusname) + "</div></div>")
            }
         }
         c.html('<div class="img-box">' + l.join("") + "</div>")
     }
});

function initTableGrid(){
	$('#easyui-tabs').tabs({
		height:"auto",
		fit:true,
		onSelect:function(title,index){
			if(index==0){
				tableGridList();
			}else{
				tableGridGraph();
			}
		}
	});
	tableGridList();
}

function tableGridList(){
	$('#tableGridList').datagrid({
		pagination:true,
		striped:true,
		rownumbers:true,
		data:[
		      {id:1,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:2,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:3,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:4,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:5,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:6,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"},
		      {id:7,name:"窗口高架_01",date:"2018-11-08 20:51:41",eventType:"交通事故"}
		],
		columns:[[
		          {field:'id',title:'序号'},
		          {field:'name',title:'相机名称'},
		          {field:'date',title:"发生时间"},
		          {field:'eventType',title:"事件类型"}
		      ]]
	});
}
function tableGridGraph(){
	$('#tableGridGraph').datagrid({
		bodyCls:'pic-datagrid',
		url : 'ywvideotaskrunresultAction!listYwvideotaskrunresultByPage.do',
		onLoadSuccess:function(data){
			console.log("data",data);
			if(data){
				data.data=data.rows;
				data.totalSize=data.total;
				$('#tableGridGraph').datagrid("renderMonitorData",data);
			}
		},
		rownumbers:true,
	});
}
//初始化按钮事件
function initBtn(){
	$("[name='countDate']").change(function(){
		var val=$(this).val();
		if(val==5){
			//$("#controlDate").css("display","inline-block");
		}else{
			$("#controlDate").css("display","none");
		}
		$("#countDate span").removeClass("btn-success")
		$(this).next().addClass("btn-success");
	});
	
	$("[name='countType']").change(function(){
		var val=$(this).val();
		$("#countType span").removeClass("btn-success")
		$(this).next().addClass("btn-success");
		if(val==2){
			isAlarmType=false;
/*			$("#countCycle").show();
			$("#alarmType").hide();
			$("#alarmTrend").show();*/
		//	initAlarmTrend();
		}else{
			isAlarmType=true;
/*			$("#countCycle").hide();
			$("#alarmTrend").hide();
			$("#alarmType").show();*/
			initAlarmType();
		}
	});
	
	$("[name='countCycle']").change(function(){
		$("#countCycle span").removeClass("btn-success")
		$(this).next().addClass("btn-success");
	});
}


//查询
function searchAlarm(){
	if(isAlarmType){
		initAlarmType();
	}else{
		initAlarmTrend();
	}
}

//查询条件
function getQueryParams(){
	var sParam = {};
	sParam.countDate = $('input:radio[name="countDate"]:checked').val();   //统计时间
	sParam.datetimeStart = $('#datetimeStart').datetimebox("getValue");			   // 开始时间
	sParam.datetimeEnd = $('#datetimeEnd').datetimebox("getValue");			   //结束时间
	sParam.countType = $('input:radio[name="countType"]:checked').val();       	//分析维度
	sParam.countCycle = $('input:radio[name="countCycle"]:checked').val();	 //趋势周期
	return sParam;
}

function labelstatusRender(id,name){
	var $p = ""
	$.ajax({
		url:" xtclAction!query_Xtcl_task.do",
		type:"post",
		dataType:"JSON",
		async:false,
		data : {"csdl":"ywvideolabelstatus"},
		success:function(res){
			if(res){
				$p += '<p>';
				for(i in res){
					var $a = "";
					if(name=="重点关注" && res[i].csdm=="2"){
						$a = "<a href=\"javascript:void(0);\" id=\""+id+"\"  tag=\""+id+"\" class=\"ahref\" onclick=\"oprStatus(this,'-1');\" >取消关注</a>&nbsp;&nbsp;&nbsp;";
					}else{
						$a = "<a href=\"javascript:void(0);\" id=\""+id+"\"  tag=\""+id+"\" class=\"ahref\" onclick=\"oprStatus(this,'"+res[i].csdm+"');\" >"+res[i].csmc+"</a>&nbsp;&nbsp;&nbsp;";
					}
					$p +=$a;
				}
				$p += "</p>";
			}
		}
	});
	return $p;
}
