style24
/
style24.admin


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664
							<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : PopupListForm.html
 * @desc    : 팝업관리 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.3.3     bin2107     최초 작성
 *******************************************************************************
 -->
	<div id="main">
		<!-- 메인타이틀 영역 -->
		<div class="main-title">
		</div>
		<!-- //메인타이틀 영역 -->
		
		<!-- 메뉴 설명 -->
		<div class="infoBox menu-desc">
		</div>
		<!-- //메뉴 설명 -->
		
		<!-- 검색조건 영역 -->
		<form id="searchForm" name="searchForm" action="#" th:action="@{'/display/popup/list'}" onsubmit="$('#btnSearch').trigger('click'); return false;">
			<div class="panelStyle">
				<table class="frmStyle">
					<colgroup>
						<col style="width:10%;"/>
						<col style="width:15%;"/>
						<col style="width:10%;"/>
						<col style="width:15%;"/>
						<col style="width:10%;"/>
						<col style="width:40%;"/>
					</colgroup>
					<tr>
						<th>사이트</th>
						<td>
							<select name="siteCd">
								<option th:if="${siteCdList}" th:each="oneData, status : ${siteCdList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
							</select>
						</td>
						<th>전시화면</th>
						<td>
							<select name="frontGb">
								<option value="A">전체</option>
								<option value="P">PC</option>
								<option value="M">모바일</option>
							</select>
						</td>
						<th>전시기간</th>
						<td colspan="5" id="sellTerms">
							<span class="nowrap">
								<input name="dispStdt" id="schStDate" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출기간 시작일" />
								<select id="schStTimeHour" required="required" data-valid-name="노출기간 시작시간">
									<th:block th:each="num, index  : ${#numbers.sequence(0,23)}">
									<option  th:value="${#numbers.formatInteger(num,2)}" th:text="|${#numbers.formatInteger(num,2)}시|" >시간</option>
									</th:block>
								</select>
								<select id="schStTimeMin" required="required" data-valid-name="노출기간 시작시간">
									<th:block th:each="num: ${#numbers.sequence(0,59)}">
									<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}분|" >분</option>
									</th:block>
								</select>
								<input name="dispStTime" id="schStTime" type="hidden" data-valid-name="노출기간 시작시간" value='000000' />
								~
								<input name="dispEddt" id="schEdDate" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출기간 종료일" />
								<select id="schEdTimeHour" required="required" data-valid-name="노출기간 종료시간">
									<th:block th:each="num: ${#numbers.sequence(0,23)}">
									<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}시|" th:selected="${#numbers.formatInteger(num,2)}==23 ? 'true'">시간</option>
									</th:block>
								</select>
								<select id="schEdTimeMin" required="required" data-valid-name="노출기간 종료시간">
									<th:block th:each="num: ${#numbers.sequence(0,59)}">
									<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}분|" th:selected="${#numbers.formatInteger(num,2)}==59 ? 'true'">분</option>
									</th:block>
								</select>
								<input name="dispEdTime" id="schEdTime" type="hidden" data-valid-name="노출기간 종료시간" value='235959' />
							</span>
						</td>
					</tr>
				</table>
				<ul class="panelBar">
					<li class="center">
						<button type="button" class="btn btn-default btn-lg" id="btnInit">초기화</button>
						<button type="button" class="btn btn-base btn-lg" id="btnSearch">조회</button>
					</li>
				</ul>
			</div>
		<!-- 검색조건 영역 -->

		<!-- 리스트 영역 -->
		<div class="panelStyle">
			<!-- 상단영역 START -->
			<ul class="panelBar">
				<li>
					<span style="padding:5.5px 15px; background:#e9ecfb !important; border-top:1px solid #ddd; border-bottom:0.5px solid #dae0fd; font-weight: bold;">미리보기위치</span>
					<select name="viewPage" id="viewPageView" onchange="fnChangeViewPage('View')" >
						<option th:if="${viewPageList}" th:each="oneData, status : ${viewPageList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
					</select>
					<select name="cateNo" id="cateNoView" class='off' data-valid-name="대카테고리">
						<option value="">[선택]</option>
						<option th:if="${cateNoList}" th:each="oneData, status : ${cateNoList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
					</select>
					<input type="text" class="off w80" name="brandCd" id="brandCdView" placeholder="브랜드그룹번호" required="required" data-valid-name="브랜드"/>
					<button type="button" class="off btn btn-base btn-lg" id="searchBrandGroupView" onclick="fnBrandGroupSearch('View')">브랜드 조회</button>
					<input type="text" class="off w80" name="planSq" id="planSqView" placeholder="기획전번호" required="required" data-valid-name="기획전번호"/>
					<button type="button" class="off btn btn-base btn-lg" id="btnSearchPlanView" onclick="fnPlanSearch('View')">기획전 조회</button>
					<span class="nowrap">
						<input name="viewDate" id="viewDate" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="미리보기일자" />
						<select id="viewTimeHour" name="viewTimeHour" required="required" data-valid-name="미리보기 시간">
							<option value="" >시간</option>
							<th:block th:each="num, index  : ${#numbers.sequence(0,24)}">
								<option  th:value="${#numbers.formatInteger(num,2)}" th:text="|${#numbers.formatInteger(num,2)}시|" th:selected="${num == 9}">시간</option>
							</th:block>
						</select>
						<select id="viewTimeMin" name="viewTimeMin" required="required" data-valid-name="미리보기 시간">
							<option value="" >분</option>
							<th:block th:each="num: ${#numbers.sequence(0,59)}">
								<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}분|" th:selected="${num == 0}">분</option>
							</th:block>
						</select>
						<input name="viewTime" id="viewTime" type="hidden" data-valid-name="미리보기 시간" />
					</span>
					<span>
						<button type="button" class="btn btn-info btn-lg" id="btnView">미리보기</button>
					</span>
				</li>
				<li class="right">
					<span class="btnRight">
						<button type="button" class="btn btn-success btn-lg" id="btnReg">적용</button>
					</span>
					<span class="btnRight">
						<button type="button" class="btn btn-danger btn-lg" id="btnDel">삭제</button>
					</span>
					검색결과 : <strong><span id="gridRowTotalCount">0</span> 건</strong>&nbsp;
					쪽번호 <span id="pgNo">0</span>/ <strong id="endPgNo">0</strong>&nbsp;&nbsp;
					<select id="pageSize" name="pageSize">
						<option value="50" selected="selected">50개씩 보기</option>
						<option value="100">100개씩 보기</option>
						<option value="500">500개씩 보기</option>
						<option value="1000">1000개씩 보기</option>
					</select>
					<input type="hidden" name="pageNo" id="pageNo" value ="1"/>
				</li>
			</ul>
			<!-- 상단영역 END -->
			<div id="gridList" style="width: 100%; height: 470px" class="ag-theme-balham"></div>

			<ul class="panelBar">
				<li class="center">
					<div class="tablePaging" id="popupListPagination"></div>
				</li>
			</ul>
		</div>
		<!-- //리스트 영역 -->
		</form>
		
		<!-- 등록/수정 -->
		<div class="panelStyle">
			<form id="detailForm" name="detailForm" action="#" th:action="@{'/display/popup/save'}">
				<input type="hidden" name="popupGb" value="W"/>	<!--팝업종류-->
				<table class="frmStyle">
					<colgroup>
						<col style="width:10%;"/>
						<col style="width:15%;"/>
						<col style="width:10%;"/>
						<col style="width:15%;"/>
						<col style="width:10%;"/>
						<col style="width:15%;"/>
						<col/>
					</colgroup>
					<tr>
						<th>팝업일련번호</th>
						<td>
							<input type="text" class="w90" name="popupSq" placeholder="자동생성" data-valid-name="팝업일련번호" disabled/>
						</td>
						<th>사이트코드<i class="required" title="필수"></i></th>
						<td class="infoTxt">
							<select name="siteCd">
								<option th:if="${siteCdList}" th:each="oneData, status : ${siteCdList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
							</select>
						</td>
						<th>전시위치<i class="required" title="필수"></i></th>
						<td colspan="3">
							<select name="viewPage" id="viewPage" onchange="fnChangeViewPage('')" data-valid-name="전시위치">
								<option th:if="${viewPageList}" th:each="oneData, status : ${viewPageList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
							</select>
							<select name="cateNo" id="cateNo" class='off' data-valid-name="대카테고리">
								<option value="">[선택]</option>
								<option th:if="${cateNoList}" th:each="oneData, status : ${cateNoList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
							</select>
							<input type="text" class="off w80" name="brandCd" id="brandCd" placeholder="브랜드그룹번호" data-valid-name="브랜드그룹번호"/>
							<button type="button" class="off btn btn-base btn-lg" id="searchBrandGroup"  onclick="fnBrandGroupSearch('')">브랜드 조회</button>
							<input type="text" class="off w80" name="planSq" id="planSq" placeholder="기획전번호" data-valid-name="기획전번호"/>
							<button type="button" class="off btn btn-base btn-lg" id="btnSearchPlan"  onclick="fnPlanSearch('')">기획전 조회</button>
						</td>
					</tr>
					<tr>
						<th>PC/모바일 구분<i class="required" title="필수"></i></th>
						<td>
							<select name="frontGb" id="frontGb">
								<option value="A">[A] 전체</option>
								<option value="P">[P] PC</option>
								<option value="M">[M] 모바일</option>
							</select>
						</td>
						<!--<th>팝업종류<i class="required" title="필수"></i></th>
						<td>
							<select name="popupGb" id="popupGb">
								<option value="W">윈도우</option>
								<option value="L">고정레이어</option>
								<option value="M">이동레이어</option>
							</select>
						</td>-->
						<th>미노출일수<i class="required" title="필수"></i></th>
						<td>
							<input type="text" class="w90" name="unexpDays" id="unexpDays" required="required" data-valid-type=numeric data-valid-name="미노출일수" value="1"/>
						</td>
						<th>우선순위<i class="required" title="필수"></i></th>
						<td colspan="3">
							<input type="text" class="w90" name="dispOrd" id="dispOrd" required="required" data-valid-type=numeric data-valid-name="우선순위"/>
						</td>
					</tr>
					<tr>
						<th>노출시작일시<i class="required" title="필수"></i></th>
						<td colspan="3">
							<input name="dispStdt" id="stDate" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출시작일자" />
							<select id="stTimeHour" required="required" data-valid-name="노출기간 시작시간">
								<th:block th:each="num, index  : ${#numbers.sequence(0,23)}">
									<option  th:value="${#numbers.formatInteger(num,2)}" th:text="|${#numbers.formatInteger(num,2)}시|" >시간</option>
								</th:block>
							</select>
							<select id="stTimeMin" required="required" data-valid-name="노출기간 시작시간">
								<th:block th:each="num: ${#numbers.sequence(0,59)}">
									<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}분|" >분</option>
								</th:block>
							</select>
							<input name="dispStTime" id="stTime" type="hidden" data-valid-name="노출기간 시작시간" value='000000' />
						</td>
						<th>노출종료일시<i class="required" title="필수"></i></th>
						<td colspan="3">
							<input name="dispEddt" id="edDate" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출종료일자" />
							<select id="edTimeHour" required="required" data-valid-name="노출기간 종료시간">
								<th:block th:each="num: ${#numbers.sequence(0,23)}">
									<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}시|" th:selected="${#numbers.formatInteger(num,2)}==23 ? 'true'">시</option>
								</th:block>
							</select>
							<select id="edTimeMin" required="required" data-valid-name="노출기간 종료시간">
								<th:block th:each="num: ${#numbers.sequence(0,59)}">
									<option  th:value="${#numbers.formatInteger(num,2)}"  th:text="|${#numbers.formatInteger(num,2)}분|" th:selected="${#numbers.formatInteger(num,2)}==59 ? 'true'">분</option>
								</th:block>
							</select>
							<input name="dispEdTime" id="edTime" type="hidden" data-valid-name="노출기간 종료시간" value='235959' />
						</td>
					</tr>
					<tr>
						<th>이미지<i class="star"></i></th>
						<td colspan="7">
							<div id="ImageArea">
								이미지파일 : <span class="uFile w300">
												<input id="file_1" name="file" type="file" class="uFileInput w300"  data-valid-name="이미지파일" onchange="fnFileUpload(this);"/>
												<label for="file_1" class="uFileLabel">파일선택</label>
												<input type="hidden" name="orgFileNm"/>
												<input type="hidden" name="sysFileNm"/>
												<input type="hidden" name="newSysFileNm"/>
											</span>
								&nbsp;&nbsp;&nbsp;&nbsp;LINK : <input type="text" class="w400" name="linkUrl"  maxlength="300" required="required" data-valid-name="LINK" value="#"/>
								<span class="memAdd off" id="imgFileNm1"></span>
								<div id="ImageAddArea">
								</div>
							</div>
						</td>
					</tr>
				</table>
			</form>
			
			<!-- 버튼 배치 영역 -->
			<ul class="panelBar">
				<li class="center">
					<button type="button" class="btn btn-info btn-lg" id="btnNew">신규</button>
					<button type="button" class="btn btn-success btn-lg" id="btnSave">저장</button>
				</li>
			</ul>
			<!-- //버튼 배치 영역 -->
		</div>
		<!-- 등록/수정 -->
	</div>

<script type="text/javascript" src="/ux/plugins/gaga/gaga.paging.js?v=2019072202"></script>
<script th:inline="javascript">
/*<![CDATA[*/
	var siteCdList = [[${siteCdList}]];
	var viewPageList = [[${viewPageList}]];
	var cateNoList = [[${cateNoList}]];

	var imgDivLen = 1;	//이미지 추가 액션수관리

	let columnDefs = [
		{width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
		{headerName: "팝업일련번호", field: "popupSq", width: 150, cellClass: 'text-center'
			,cellRenderer: function(params) {
				return '<a href="javascript:void(0);">' + params.value + '</a>';
			}
		},
		{headerName: "적용여부", field: "displayYn", width: 150, cellClass: 'text-center'},
		{headerName: "전시위치", field: "viewPage", width: 150, cellClass: 'text-center'
			,valueFormatter: function (params) { return !gagajf.isNull(params.value) ? "["+params.value+"] "+params.data.viewPageNm : '';}
		},
		{headerName: "카테고리", field: "cateNo", width: 150, cellClass: 'text-center'},
		{headerName: "브랜드", field: "brandCd", width: 150, cellClass: 'text-center'},
		{headerName: "기획전번호", field: "planSq", width: 150, cellClass: 'text-center'},
		{headerName: "PC/모바일", field: "frontGb", width: 150, cellClass: 'text-center'
			,valueFormatter: function(params) {
				if (params.data.frontGb == 'A') {
					return '전체';
				}else if(params.data.frontGb == 'P'){
					return 'PC';
				}else{
					return '모바일';
				}
			}
		},
		{headerName: "우선순위", field: "dispOrd", width: 150, cellClass: 'text-center'},
		{headerName: "전시시작일", field: "dispStdt", width: 150, cellClass: 'text-center'},
		{headerName: "전시시작시간", field: "dispStTime", width: 150, cellClass: 'text-center'},
		{headerName: "전시종료일", field: "dispEddt", width: 150, cellClass: 'text-center'},
		{headerName: "전시종료시간", field: "dispEdTime", width: 150, cellClass: 'text-center'},
		{headerName: "등록자", field: "regNm", width: 150, cellClass: 'text-center'},
		{headerName: "등록일시", field: "regDt", width: 150, cellClass: 'text-center'}
	];

	let gridOptions = gagaAgGrid.getGridOptions(columnDefs);
	gridOptions.rowSelection = "multiple";

	// ROW Click
	gridOptions.onCellClicked = function(event) {
		var popupSq = event.data.popupSq;
		if (event.colDef.field == "popupSq"){
			$("#btnNew").click();
			var formId = '#detailForm';
			$(formId + " input[name=popupSq]").val(event.data.popupSq);
			$(formId + " select[name=siteCd]").val(event.data.siteCd);
			$(formId + " select[name=viewPage]").val(event.data.viewPage);
			fnChangeViewPage('');
			$(formId + " select[name=cateNo]").val(event.data.cateNo).attr("selected", true);
			$(formId + " input[name=brandCd]").val(event.data.brandCd);
			$(formId + " input[name=planSq]").val(event.data.planSq);
			$(formId + " select[name=frontGb]").val(event.data.frontGb);
			$(formId + " select[name=popupGb]").val(event.data.popupGb);
			$(formId + " input[name=unexpDays]").val(event.data.unexpDays);
			$(formId + " input[name=dispOrd]").val(event.data.dispOrd);
			var dispStdt = event.data.dispStdt.replace(/[^0-9]/g, '');
			$(formId + " input[name=dispStdt]").val(dispStdt.substr(0,4)+"-"+dispStdt.substr(4,2)+"-"+dispStdt.substr(6,2));
			var dispStTime = event.data.dispStTime.replace(/[^0-9]/g, '');
			$("#stTime").val(dispStTime);
			$("#stTimeHour").val(dispStTime.substr(0,2));
			$("#stTimeMin").val(dispStTime.substr(2,2));
			var dispEddt = event.data.dispEddt.replace(/[^0-9]/g, '');
			$(formId + " input[name=dispEddt]").val(dispEddt.substr(0,4)+"-"+dispEddt.substr(4,2)+"-"+dispEddt.substr(6,2));
			var dispEdTime = event.data.dispEdTime.replace(/[^0-9]/g, '');
			$("#edTime").val(dispEdTime);
			$("#edTimeHour").val(dispEdTime.substr(0,2));
			$("#edTimeMin").val(dispEdTime.substr(2,2));

			$(formId + " input[name=orgFileNm]").eq(0).val(event.data.imgUrl1);
			$(formId + " input[name=sysFileNm]").eq(0).val(event.data.imgUrl1);
			$(formId + " input[name=linkUrl]").eq(0).val(event.data.linkUrl1);
			$(formId + " #imgFileNm1").html(event.data.imgUrl1);
			$(formId + " #imgFileNm1").removeClass('off').addClass('on');
			$(".uFileLabel").text('');
		}
	}

	/**
	 * 조회
	 */
	$('#btnSearch').on('click', function (){
		$("#searchForm input[name=dispStTime]").val($('#searchForm #schStTimeHour').val()+$('#searchForm #schStTimeMin').val()+'00');
		$("#searchForm input[name=dispEdTime]").val($('#searchForm #schEdTimeHour').val()+$('#searchForm #schEdTimeMin').val()+'59');
		fnSearch();
	});

	var fnSearch = function(){
		gagaPaging.init('searchForm', fnSearchCallBack, 'popupListPagination', $('#searchForm').find('#pageSize').val());
		gagaPaging.load(1);
	};

	var fnSearchCallBack = function(result){
		$('#searchForm').find('#gridRowTotalCount').html(result.pageing.pageable.totalCount.addComma());
		$('#searchForm').find('#pageNo').val(result.pageing.pageable.pageNo.addComma());
		$('#searchForm').find('#pgNo').html(result.pageing.pageable.pageNo.addComma());
		$('#searchForm').find('#endPgNo').html(result.pageing.pageable.totalPage.addComma());
		gridOptions.api.setRowData(result.popupList);
		gagaPaging.createPagination(result.pageing.pageable);
	}

	// 미리보기위치 선택
	var fnChangeViewPage = function(sub){
		if($("#viewPage"+sub).val()=="G037_30"){
			$("#cateNo"+sub).removeClass("off").addClass("on");
			$("#brandCd"+sub).removeClass("on").addClass("off");
			$("#searchBrandGroup"+sub).removeClass("on").addClass("off");
			$("#planSq"+sub).removeClass("on").addClass("off");
			$("#btnSearchPlan"+sub).removeClass("on").addClass("off");
		}else if($("#viewPage"+sub).val()=="G037_31"){
			$("#cateNo"+sub).removeClass("on").addClass("off");
			$("#brandCd"+sub).removeClass("off").addClass("on");
			$("#searchBrandGroup"+sub).removeClass("off").addClass("on");
			$("#planSq"+sub).removeClass("on").addClass("off");
			$("#btnSearchPlan"+sub).removeClass("on").addClass("off");
		}else if($("#viewPage"+sub).val()=="G037_40"){
			$("#cateNo"+sub).removeClass("on").addClass("off");
			$("#brandCd"+sub).removeClass("on").addClass("off");
			$("#searchBrandGroup"+sub).removeClass("on").addClass("off");
			$("#planSq"+sub).removeClass("off").addClass("on");
			$("#btnSearchPlan"+sub).removeClass("off").addClass("on");
		}else{
			$("#cateNo"+sub).removeClass("on").addClass("off");
			$("#brandCd"+sub).removeClass("on").addClass("off");
			$("#searchBrandGroup"+sub).removeClass("on").addClass("off");
			$("#planSq"+sub).removeClass("on").addClass("off");
			$("#btnSearchPlan"+sub).removeClass("on").addClass("off");
		}
		$("#cateNo"+sub).val('');
		$("#brandCd"+sub).val('');
		$("#planSq"+sub).val('');
	};

	// 검색조건 초기화
	$('#btnInit').on('click', function() {
		$("#searchForm")[0].reset();
		gagajf.setDate('schStDate', 'schEdDate', 't');
	});

	// 신규 버튼 클릭
	$("#btnNew").on("click", function(){
		$("#detailForm")[0].reset();
		$("#ImageAddArea").empty();
		$("#linkUrl").val('#');
		$('#detailForm input[name=imgUrl]').val('');
		$('#detailForm input[name=imgUrl]').closest('div').find('label').text('파일선택');
		$('#detailForm #imgFileNm1').html('');
		$('#detailForm input[name=orgImgFileNm]').val('');
		$('#detailForm input[name=newImgFileNm]').val('');
		$("#cateNo").removeClass("on").addClass("off");
		$("#searchBrandGroup").removeClass("on").addClass("off");
		$('#detailForm input[name=brandCd]').removeClass("on").addClass("off");
		$("#btnSearchPlan").removeClass("on").addClass("off");
		$('#detailForm input[name=planSq]').removeClass("on").addClass("off");
		$(".uFileLabel").text('');
		imgDivLen = 1;
	});

	// 데이터 validation 체크
	function dataValidation(){
		// 날짜체크
		var fromDate = $('#detailForm input[name=dispStdt]').val().replace(/[^0-9]/g, '')+$('#detailForm #stTimeHour').val()+$('#detailForm #stTimeMin').val();
		var toDate = $('#detailForm input[name=dispEddt]').val().replace(/[^0-9]/g, '')+$('#detailForm #edTimeHour').val()+$('#detailForm #edTimeMin').val();
		if(fromDate > toDate){
			mcxDialog.alert('노출 시작일자는 종료일자 보다 클 수 없습니다.');
			return false;
		}

		//전시위치 체크(30,31,40)
		var selectViewPage = $('#detailForm select[name=viewPage]').val();

		if(selectViewPage=='G037_30'){
			if(gagajf.isNull($('#detailForm select[name=cateNo]').val())){
				mcxDialog.alert('카테고리를 선택해 주세요.');
				return false;
			}
		}else if(selectViewPage=='G037_31'){
			if(gagajf.isNull($('#detailForm input[name=brandCd]').val())){
				mcxDialog.alert('브랜드 코드를 입력해 주세요.');
				return false;
			}
		}else if(selectViewPage=='G037_40'){
			if(gagajf.isNull($('#detailForm input[name=planSq]').val())){
				mcxDialog.alert('기획전 번호를 입력해 주세요.');
				return false;
			}
		}

		var orgFileNm = $('#detailForm #imgFileNm1').html();
		var imgFileNm = $('#detailForm input[name=newSysFileNm]').val();
		if(gagajf.isNull(orgFileNm)){
			if(gagajf.isNull(imgFileNm)){
				mcxDialog.alert('이미지파일을 선택해 주세요.');
				return false;
			}
		}

		return true;
	}

	// 이미지 첨부
	var fnFileUpload = function (obj){
		var file = obj.files[0];
		file.name = 'test';
		if (typeof(file) == 'undefined'){
			return;
		}
		gagajf.ajaxFileUpload('/common/file/upload?subDir=/display/popup'
				, file
				, function(result) {
					$(obj).closest('div').find('input:hidden[name=sysFileNm]').val(result.oldFileName);
					$(obj).closest('div').find('input:hidden[name=newSysFileNm]').val(result.newFileName);
				}
		);
	};

	/**
	 * 저장
	 */
	$("#btnSave").on('click',function(){
		// 필수값 validation 체크
		if (!gagajf.validation('#detailForm')) {
			return false;
		}

		// 데이터 validation 체크
		if(!dataValidation()){
			return false;
		}

		// 이미지 파일 체크
		var imgUrl = '';
		var orgFileNm = $('#detailForm input[name=orgFileNm]').val();
		var sysFileNm = $('#detailForm input[name=sysFileNm]').val();
		var newSysFileNm = $('#detailForm input[name=newSysFileNm]').val();

		var fromDate = $('#detailForm input[name=dispStdt]').val().replace(/[^0-9]/g, '')+$('#detailForm #stTimeHour').val()+$('#detailForm #stTimeMin').val()+'00';
		var toDate = $('#detailForm input[name=dispEddt]').val().replace(/[^0-9]/g, '')+$('#detailForm #edTimeHour').val()+$('#detailForm #edTimeMin').val()+'59';

		var data = {
			popupSq : $('#detailForm input[name=popupSq]').val()
			,siteCd : $('#detailForm select[name=siteCd]').val()
			,viewPage : $('#detailForm select[name=viewPage]').val()
			,cateNo : $('#detailForm select[name=cateNo]').val()
			,brandCd : $('#detailForm input[name=brandCd]').val()
			,planSq : $('#detailForm input[name=planSq]').val()
			,frontGb : $('#detailForm select[name=frontGb]').val()
			,unexpDays : $('#detailForm input[name=unexpDays]').val()
			,dispOrd : $('#detailForm input[name=dispOrd]').val()
			,dispStdt : fromDate
			,dispEddt : toDate
			,orgFileNm : orgFileNm
			,sysFileNm : sysFileNm
			,newSysFileNm : newSysFileNm
			,linkUrl1 : $('#detailForm input[name=linkUrl]').val()
			,useYn : 'Y'
		};

		var jsonData = JSON.stringify(data);

		gagajf.ajaxJsonSubmit($('#detailForm').prop('action'), jsonData, fnPopupSaveCollback);
	});

	var fnPopupSaveCollback = function (result){
		$("#btnNew").click();
		$('#btnSearch').trigger('click');
	}

	// 브랜드 조회
	var formNm = "";
	var fnBrandGroupSearch = function(sub){
		if(!gagajf.isNull(sub)){
			formNm = "searchForm";
		}else{
			formNm = "detailForm";
		}
		cfnOpenBrandGroupListPopup("callBackBrandGroup", "S", "S");
	}

	var callBackBrandGroup = function(result){
		$("#"+formNm+" input[name=brandCd]").val(result[0].brandGroupNo);
	}

	// 기획전 조회
	var planFormNm = "";
	var fnPlanSearch = function (sub){
		if(!gagajf.isNull(sub)){
			planFormNm = "searchForm";
		}else{
			planFormNm = "detailForm";
		}
		cfnOpenPlanPopup("callBackPlan");
	}

	var callBackPlan = function (result){
		$("#"+planFormNm+" input[name=planSq]").val(result[0].planSq);
	}

	/**
	 * 삭제
	 */
	$("#btnDel").on('click',function(){
		var selectRowData = gagaAgGrid.selectedRowData(gridOptions);
		if (selectRowData.length > 0) {
			mcxDialog.confirm('삭제하시겠습니까?', {
				cancelBtnText: "취소",
				sureBtnText: "확인",
				sureBtnClick: function(){
					var selectDataArr = [];
					$.each(selectRowData, function(idx, item) {
						selectDataArr.push(item.popupSq);
					});

					var data = {
						selectDataArr : selectDataArr
					};

					var jsonData = JSON.stringify(data);
					gagajf.ajaxJsonSubmit('/display/popup/delete', jsonData, fnPopupSaveCollback);
				}
			});
		}else{
			mcxDialog.alert('선택된 행이 없습니다.');
			return;
		}
	});

	/**
	 * 적용
	 */
	$("#btnReg").on('click',function(){
		var selectRowData = gagaAgGrid.selectedRowData(gridOptions);
		if (selectRowData.length > 0) {
			mcxDialog.confirm('적용하시겠습니까?', {
				cancelBtnText: "취소",
				sureBtnText: "확인",
				sureBtnClick: function(){
					var selectDataArr = [];
					$.each(selectRowData, function(idx, item) {
						selectDataArr.push(item.popupSq);
					});

					var data = {
						selectDataArr : selectDataArr
					};

					var jsonData = JSON.stringify(data);
					gagajf.ajaxJsonSubmit('/display/popupfront/save', jsonData, fnPopupSaveCollback);
				}
			});
		}else{
			mcxDialog.alert('프론트에 적용할 행을 선택해주세요.');
			return;
		}
	});
	
	$(document).ready(function() {
		// Create a agGrid
		gagaAgGrid.createGrid('gridList', gridOptions);
	});
/*]]>*/
</script>

</html>