<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %> 
<%@ page session="false" %>
<!doctype html>
<html lang="ko">
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/>
	<meta name="Description" content="사이트설명" />
	<meta name="Keywords" content="키워드" />
	
	<%@ include file="/WEB-INF/views/common.jsp" %>
	
	<link rel="stylesheet" type="text/css" href="${contextRoot }/css/common.css" />
	<link rel="stylesheet" type="text/css" href="${contextRoot }/css/main.css" />
	<link rel="stylesheet" type="text/css" href="${contextRoot }/css/popupLayout.css" />
	<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" />
	
	<title>SIGINFO_MAP</title>
</head>
<body>
	<div id="wrap">
		<!-- header -->
		<header id="header">
			<h1>이벤트 이력정보</h1>
		</header>
		<!-- header -->
		<!-- section -->
		<section id="contents" class="c_p">
		<article>
		<div class="condition">
			<ul>
				<li>
					<span class="title">수집일시 : </span> <input class="wd30 left" type="text" id="fromYMD" value="${today}"> 일 
						<select class="select" id="fromHour">
							<c:forEach var="i" begin="1" end="24" step="1">
								<c:choose>
									<c:when test="${i < 10 }"><c:set var="ii" value="0${i }"></c:set></c:when>
									<c:otherwise><c:set var="ii" value="${i }"></c:set></c:otherwise>
								</c:choose>
								<option value="${ii }" <c:if test="${ii == hour }">selected="selected"</c:if>>${ii}</option>
							</c:forEach>
						</select> 시
						<select class="select" id="fromMin">
							<c:forEach var="i" begin="0" end="59" step="1">
								<c:choose>
									<c:when test="${i < 10 }"><c:set var="ii" value="0${i }"></c:set></c:when>
									<c:otherwise><c:set var="ii" value="${i }"></c:set></c:otherwise>
								</c:choose>
								<option value="${ii }" <c:if test="${ii == min }">selected="selected"</c:if>>${ii}</option>
							</c:forEach>
						</select> 분
						~
						<input class="wd30 left" type="text" id="toYMD" value="${today}"> 일 
						<select class="select" id="toHour">
							<c:forEach var="i" begin="1" end="24" step="1">
								<c:choose>
									<c:when test="${i < 10 }"><c:set var="ii" value="0${i }"></c:set></c:when>
									<c:otherwise><c:set var="ii" value="${i }"></c:set></c:otherwise>
								</c:choose>
								<option value="${ii }" <c:if test="${ii == hour }">selected="selected"</c:if>>${ii}</option>
							</c:forEach>
						</select> 시
						<select class="select" id="toMin">
							<c:forEach var="i" begin="0" end="59" step="1">
								<c:choose>
									<c:when test="${i < 10 }"><c:set var="ii" value="0${i }"></c:set></c:when>
									<c:otherwise><c:set var="ii" value="${i }"></c:set></c:otherwise>
								</c:choose>
								<option value="${ii }" <c:if test="${ii == min }">selected="selected"</c:if>>${ii}</option>
							</c:forEach>
						</select> 분
	
						<a class="btn" href="javascript:getEventList()">검색</a>
				</li>
				<li><span class="title">지 역 명 &nbsp;: </span>
					<select class="select" id="regionCd" onchange="selectRegion(this.value)" style="width:91px">
						<option value="">전체</option>
						<c:forEach var="item" items="${regionCd }" >
							<option value="${item.REGION_CD }">${item.REGION_NM }</option>
						</c:forEach>
					</select>
					<span class="title">제어기번호 : </span>
					<select class="select" id="intNo" style="width:165px">
						<option value="">전체</option>
					</select>
					<span class="title">이벤트코드명 : </span>
					<select id="eventCd" class="select" style="width:100px">
						<option value="">전체</option>
						<c:forEach var="item" items="${eventCd }" >
							<option value="${item.SUB_CD }">${item.CD_NM }</option>
						</c:forEach>
						<option value="04,05">통신</option>
						<option value="08,09">시차제</option>
						<option value="10,11">점멸</option>
						<option value="20,21">소등</option>
						<option value="40,41">모순</option>
						<option value="80,81">수동</option>
					</select>
				</li>
			</ul>
		</div>
		<div class="clear"></div>
		</article>
		<article>		
			<span id="eventListCnt"></span>
			<div class="eventListTable" id="bottomMenu">
				<div class="eventListHead">
				<table class="table_type1">
					<colgroup>
						<col width="30%"/>
						<col width="15%"/>
						<col width="15%"/>
						<col width="20%"/>
						<col width="20%"/>
					</colgroup>
					<thead>
						<tr>
							<th>수집 일시</th>
							<th>지역 코드</th>
							<th>지역 명</th>
							<th>제어기 번호</th>
							<th>이벤트코드</th>
						</tr>
					</thead>
				</table>
			</div>
			<div class="eventListBody">
				<table class="table_type1">
					<colgroup>
						<col width="30%"/>
						<col width="15%"/>
						<col width="15%"/>
						<col width="20%"/>
						<col width="20%"/>
					</colgroup>
					<tbody id="eventList"></tbody>
				</table>
			</div>
				<img src="images/loading.gif" alt="로딩바" class="loading" />
			</div>
		</article>
		</section>
	</div>
	
<script src="${contextRoot }/js/common/hashmap.js" type="text/javascript" ></script>
<script src="${contextRoot }/js/common/common-all.js" type="text/javascript" ></script>
<script src="${contextRoot }/js/common/common.js" type="text/javascript" ></script>
<script type="text/javascript">

function selectRegion(regionCd)
{
	var url = 'getEventIntNo.do';
	var param = 'regionCd='+regionCd;

	requestService(url, param, getEventIntNoCallback);
}

function  getEventIntNoCallback(data)
{
	var intHtml = '';
	intHtml += '<option value="">전체</option>';
	if(data.length > 0)
	{
		for(var ii = 0; ii < data.length; ii++)
		{
			intHtml += '<option value="'+data[ii].INT_NO+'">'+data[ii].INT_NO+'_'+data[ii].INT_NM+'</option>';
		}
	}
	$('#intNo').empty().html(intHtml);
}

//getEventList();

//이벤트이력정보 가저오기
function getEventList()
{
	var fromYMD  = $('#fromYMD').val();
	var fromHour = $('#fromHour').val();
	var fromMin  = $('#fromMin').val();
	var toYMD    = $('#toYMD').val();
	var toHour   = $('#toHour').val();
	var toMin    = $('#toMin').val();
	var regionCd = $('#regionCd').val();
	var intNo    = $('#intNo').val();
	var eventCd  = $('#eventCd').val();
	
	var collctDtimeS = fromYMD + ' ' + fromHour + ':' + fromMin;
	var collctDtimeE = toYMD + ' ' + toHour + ':' + toMin;
	
	$('.loading').show();
	
	var url = 'getEventHistory.do';
	var param = 'collctDtimeS='+collctDtimeS+'&collctDtimeE='+collctDtimeE
	          + '&regionCd='+regionCd+'&intNo='+intNo+'&eventCd='+eventCd;

	requestService(url, param, getEventListCallback);
}

function getEventListCallback(data)
{
	var eventHtml = '';
	var collctDtime;
	var regionCd;
	var regionNm;
	var intNo;
	var eventCd;
	
	if(data.length > 0)
	{
		for(var ii = 0; ii < data.length; ii++)
		{
			collctDtime = data[ii].COLLCT_DTIME; 
			regionCd    = data[ii].REGION_CD;
			regionNm    = data[ii].REGION_NM;
			intNo       = data[ii].INT_NO;
			eventCd     = data[ii].EVENT_CD;
			
			eventHtml += '<tr>';
			eventHtml += '<td>'+collctDtime+'</td>';
			eventHtml += '<td>'+regionCd+'</td>';
			eventHtml += '<td>'+regionNm+'</td>';
			eventHtml += '<td>'+intNo+'</td>';
			eventHtml += '<td>'+eventCd+'</td>';
			eventHtml += '</tr>';
		}
	}
	else 
	{
		eventHtml += '<tr><td colspan="5">이력정보가 없습니다.</td></tr>';
	}
	$('#eventListCnt').empty().html('전체 : '+data.length+'개 ');
	$('#eventList').empty().html(eventHtml);
	
	$('.loading').hide();
}

$.datepicker.setDefaults({
    dateFormat: 'yy-mm-dd',
    prevText: '이전 달',
    nextText: '다음 달',
    monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
    monthNamesShort: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
    dayNames: ['일', '월', '화', '수', '목', '금', '토'],
    dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],
    dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
    showMonthAfterYear: true,
    yearSuffix: '년'
});

$("#fromYMD").datepicker({
    changeMonth: true,
    changeYear: true,
    dateFormat: 'yy-mm-dd'
});

$("#toYMD").datepicker({
    changeMonth: true,
    changeYear: true,
    dateFormat: 'yy-mm-dd'
});

$(window).bind("beforeunload", function (e){
	opener.mapZoomBound();
	opener.closeTopMenu('event');
});

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