<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : MdListForm.html
 * @desc    : 담당MD 팝업 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2020.11.04   sasa004     최초 작성
 *******************************************************************************
 -->
<div class="modalPopup" data-width="340" id="popupMdList">
	<div class="panelStyle">
		<!-- TITLE -->
		<div class="panelTitle">
			<strong>담당MD 목록</strong>
			<button type="button" class="close" onclick="uifnPopupClose('popupMdList');"><em class="fa fa-times"></em></button>
		</div>
		<!-- //TITLE -->
		
		<!-- 검색 조건 -->
		<div class="panelContent">
			<form id="searchMdListForm" name="searchMdListForm" action="#" th:action="@{'/business/md/list'}" onsubmit="$('#btnSearchMdList').trigger('click'); return false;">
				<table class="frmStyle" aria-describedby="검색조건">
					<colgroup>
						<col style="width:15%;"/>
						<col/>
					</colgroup>
					<tbody>
						<tr>
							<th>담당MD명</th>
							<td>
								<input type="text" name="mdNm" th:value="${params.mdNm}" maxlength="20" onkeypress="if (event.keyCode == 13) { $('#btnSearchMdList').trigger('click'); }"/>
							</td>
						</tr>
					</tbody>
				</table>
				
				<ul class="panelBar">
					<li class="center">
						<button type="button" class="btn btn-base btn-lg" id="btnSearchMdList">조회</button>
					</li>
				</ul>
			</form>
		</div>
		<!-- //검색 조건 -->
		
		<!-- 리스트 영역 -->
		<div class="panelContent">
			<div id="gridMdList" 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="btnConfirmMd">확인</button>
			</li>
		</ul>
	</div>

<script th:inline="javascript">
/*<![CDATA[*/
	let columnDefsMdList = [
		{width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
		{headerName: "담당MD번호", field: "mdNo", width: 120, cellClass: 'text-center'},
		{headerName: "담당MD명", field: "mdNm", width: 120, cellClass: 'text-center'}
	];

	let gridOptionsMdList = gagaAgGrid.getGridOptions(columnDefsMdList);

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

	// 조회
	$('#btnSearchMdList').on('click', function() {
		// Fetch data
		gagaAgGrid.fetch($('#searchMdListForm').prop('action'), gridOptionsMdList, '#searchMdListForm');
	});
	
	// 확인
	$('#btnConfirmMd').on('click', function() {
		var selectedData = gagaAgGrid.selectedRowData(gridOptionsMdList);
		
		if (selectedData.length == 0) {
			mcxDialog.alert('선택된 담당MD가 없습니다.');
			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('popupMdList');
		}
	});
	
	$(document).ready(function() {
		// Create a agGrid
		gagaAgGrid.createGrid('gridMdList', gridOptionsMdList);
		
		$('#btnSearchMdList').trigger('click');
	});
/*]]>*/
</script>

</div>

</html>
