<!DOCTYPE html>
<html lang="ko"
	  xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : ExtmallSearchForm.html
 * @desc    : 제휴몰 리스트 팝업
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2020.12.28   xodud1202   최초 작성
 *******************************************************************************
 -->
<div class="modalPopup" data-width="500" id="popupExtmallList">
	<div class="panelStyle">
		<!-- TITLE -->
		<div class="panelTitle">
			<strong>공급업체 목록</strong>
			<button type="button" class="close" onclick="uifnPopupClose('popupExtmallList');"><em class="fa fa-times"></em></button>
		</div>
		<!-- //TITLE -->

		<!-- 검색 조건 -->
		<div class="panelContent">
			<form id="searchExtmallListForm" class="searchExtmallListForm" name="searchExtmallListForm" action="#" th:action="@{'/ocm/extmall/list'}" onsubmit="$('#btnSearchExtmallList').trigger('click'); return false;">
				<table class="frmStyle" aria-describedby="검색조건">
					<colgroup>
						<col style="width:15%;"/>
						<col/>
					</colgroup>
					<tbody>
					<tr>
						<th>제휴몰 명</th>
						<td>
							<input type="text" name="searchTxt" th:value="${params.searchTxt}" maxlength="20" onkeypress="if (event.keyCode == 13) { $('#btnSearchExtmallList').trigger('click'); }"/>
						</td>
					</tr>
					</tbody>
				</table>
				<ul class="panelBar">
					<li class="center">
						<button type="button" class="btn btn-base btn-lg" id="btnSearchExtmallList">조회</button>
					</li>
				</ul>
			</form>
		</div>
		<!-- //검색 조건 -->

		<!-- 리스트 영역 -->
		<div class="panelContent">
			<div id="gridComapanyPopupList" style="width: 100%; height: 470px" class="ag-theme-balham"></div>
		</div>
		<!-- //리스트 영역 -->

		<!-- 버튼 배치 영역 -->
		<ul class="panelBar">
			<li class="right">
				<button type="button" class="btn btn-info btn-lg" id="btnConfirmExtmall">확인</button>
			</li>
		</ul>
	</div>

	<script th:inline="javascript">
		/*<![CDATA[*/
		let extmallGbList = gagajf.convertToArray([[${extmallGbList}]]);		// 상품 상태 리스트
		let columnExtmallPopupDefList = [
			{width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
			{headerName: "제휴몰구분", field: "vendorId" , width: 120, cellClass: 'text-center',
				cellEditorParams: { values: gagaAgGrid.extractValues(extmallGbList) },
				valueFormatter: function (params) { return gagaAgGrid.lookupValue(extmallGbList, params.value); },
				valueParser: function (params) { return gagaAgGrid.lookupKey(extmallGbList, params.newValue); }
			},
			{headerName: "제휴몰ID", field: "extmallId", width: 150, cellClass: 'text-center'},
			{headerName: "제휴몰명", field: "extmallNm", width: 150, cellClass: 'text-center'}
		];

		let gridOptionsExtmallPopupList = gagaAgGrid.getGridOptions(columnExtmallPopupDefList);
		gridOptionsExtmallPopupList.rowSelection = "multiple";

		// Row double click
		gridOptionsExtmallPopupList.onRowDoubleClicked = function(event) {
			$('#btnConfirmExtmall').trigger('click');
		}

		// 조회
		$('#btnSearchExtmallList').on('click', function() {
			// Fetch data
			gagaAgGrid.fetch($('#searchExtmallListForm').prop('action'), gridOptionsExtmallPopupList, '#searchExtmallListForm');
			gridOptions.api.setRowData(result.morebetterList);
		});

		// 확인
		$('#btnConfirmExtmall').on('click', function() {
			var selectedData = gagaAgGrid.selectedRowData(gridOptionsExtmallPopupList);

			if (selectedData.length == 0) {
				mcxDialog.alert('선택된 공급업체가 없습니다.');
				return false;
			}

			var callbackFn = [[${params.callbackFn}]];

			var jsonData = JSON.stringify(selectedData);

			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('popupExtmallList');
			}
		});

		$(document).ready(function() {
			// Create a agGrid
			gagaAgGrid.createGrid('gridComapanyPopupList', gridOptionsExtmallPopupList);
		});
		/*]]>*/
	</script>

</div>

</html>
