<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : AfChannelPopupForm.html
 * @desc    : 제휴채널조회 팝업 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.03.04   sowon       최초 작성
 *******************************************************************************
 -->
<div class="modalPopup" data-width="350" id="popupAfChannel">
	<div class="panelStyle">
		<!-- TITLE -->
		<div class="panelTitle">
			<strong>제휴채널 조회</strong>
			<button type="button" class="close" onclick="uifnPopupClose('popupAfChannel');"><em class="fa fa-times"></em></button>
		</div>
		<!-- //TITLE -->
		
		<!-- 검색 조건 -->
		<div class="panelContent" >
				<form id="searchForm" name="searchForm" action="#" th:action="@{'/business/aflink/list'}" onsubmit="$('#btnAfSearch').trigger('click'); return false;">
					<table class="frmStyle" aria-describedby="검색조건">
						<colgroup>
							<col style="width:10%;"/>
							<col/>
						</colgroup>
						<tr>
							<th>상위제휴채널</th>
							<td>
								<select name="afChannel">
									<option value="">[전체]</option>
									<option th:if="${afChannelList}" th:each="oneData, status : ${afChannelList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
								</select>
							</td>
						</tr>
					</table>
					
					<ul class="panelBar">
						<li class="center">
							<button type="button" class="btn btn-base btn-lg" id="btnAfSearch">조회</button>
							<button type="button" class="btn btn-gray btn-lg" onclick="$('#searchForm')[0].reset();">초기화</button>
						</li>
					</ul>
				</form>
		<!-- //검색 조건 -->
		
		<!-- 리스트 영역 -->
			<div id="gridAfList" style="width: 100%; height: 570px;" class="ag-theme-balham"></div>
			<!-- 버튼 배치 영역 -->
			<ul class="panelBar">
				<li class="right">
					<button type="button" class="btn btn-info btn-lg" id="btnConfirmAfChannel">확인</button>
				</li>
			</ul>

		</div>
	</div>
</div>
<script th:inline="javascript">
/*<![CDATA[*/
	let afChannelList = gagajf.convertToArray([[${afChannelList}]]);
	let useYnList = { "Y":"Yes", "N":"No" };
	
	let columnDefs = [
		{width: 40, minWidth: 40, cellClass: 'text-right', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
		{headerName: "제휴채널코드", field: "afLinkCd", width: 100, cellClass: 'text-center'},
		{
			headerName: "제휴채널명", field: "afLinkNm", width: 180,
			cellRenderer: function(params) {
				return '<a href="javascript:void(0);">' + params.value + '</a>';
			}
		},
		{
			headerName: "상위제휴채널", field: "afChannel", width: 120, cellClass: 'text-center',
			valueGetter: function (params) { return gagaAgGrid.lookupValue(afChannelList, params.data.afChannel); }
		}
	];
	
	let gridOptions = gagaAgGrid.getGridOptions(columnDefs);
	
	// 다중 선택
	gridOptions.rowSelection = 'multiple';
	
	// 검색
	$('#btnAfSearch').on('click', function() {
		var actionUrl = $('#searchForm').prop('action') + '?' + $('#searchForm').serialize();

		// Fetch data
		gagaAgGrid.fetch(actionUrl, gridOptions, '#searchForm');
	});
	
	
	// 적용 버튼 클릭 시
	$('#btnConfirmAfChannel').on('click', function() {
		
		var selectedData = gagaAgGrid.selectedRowData(gridOptions);
		
		if (selectedData.length < 1) {
			mcxDialog.alert('선택 된 제휴채널이 없습니다.');
			return
		}
	
		var callbackFn = [[${params.callBackFun}]];
		
		var jsonData = JSON.stringify(selectedData);

		console.log("jsonData:" + jsonData);
		console.log("callbackFn:" + callbackFn);
		if ( typeof callbackFn != 'undefined' && callbackFn) {

			if (typeof callbackFn == 'function') {
				callbackFn(jsonData);
			} else {
				if (callbackFn) {
					if ( callbackFn.indexOf("(") == -1 ) eval( callbackFn +"(" + jsonData+")");
					else eval( callbackFn(jsonData) );
				}
			}
			uifnPopupClose('popupAfChannel');
		}  
	});
	
	
	$(document).ready(function() {
		// Create a agGrid
		gagaAgGrid.createGrid('gridAfList', gridOptions);
	});
	/*]]>*/

</script>



</html>
