<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : MktmailmanagementDetailForm.html
 * @desc    : MktmailmanagementDetailForm 등록/수정 상세 팝업화면
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021. 02. 05   csh9191     최초 작성
 *******************************************************************************
 -->
<div class="modalPopup" data-width="1200" id="popupMktMail">
	<div class="panelStyle" style="max-height:700px;overflow-y:scroll;">
		<!-- 팝업창 타이틀 -->
		<div class="panelTitle">
			<strong th:text="${'이메일' + (mode == 'N' ? '등록' : '상세')}">이메일</strong>
			<button type="button" class="close" onclick="uifnPopupClose('popupMktMail');"><em class="fa fa-times"></em></button>
		</div>
		<!-- 팝업창 타이틀 -->
		
		<!-- 팝업창 상단부분 시작-->
		<div class="panelContent">
			<form id="mailManagementForm" name="mailManagementForm" action="#" th:action="@{'/marketing/mktMailManagement/save'}" th:method="post">
				<input type="hidden" name="mode" th:value="${mode}"/>
				
				<table class="frmStyle" aria-describedby="">
					<colgroup>
						<col style="width:10%;"/>
						<col/>
					</colgroup>
					<tbody>
						<tr>
							<th>메일번호</th>
							<td class="left"  th:if="${mode  == 'N' }">
								<input type="text" name="mailtSq" maxlength="20" placeholder="자동생성" readonly="readonly"/>
							</td>
							<td class="left"  th:if="${mode  == 'U' }">
								<input type="text" name="mailtSq" maxlength="20" placeholder="자동생성" readonly="readonly"/>
							</td>
							
						</tr>
						<tr>
							<th>메일구분</th>
							<td>
								<label class="rdoBtn"><input type="radio" name="mailtGb" value="M" checked="checked"/>마케팅</label>
								<label class="rdoBtn"><input type="radio" name="mailtGb" value="A"/>자동</label>
							</td>
						</tr>
						<tr>
							<th>헤더</th>
							<td>
								<select name="mailHsq">
									<option value="0">선택하기 ▼</option>
									<option th:if="${mailHsqList}" th:each="oneData, status : ${mailHsqList}" th:value="|${oneData.mailhfSq}|" th:text="|${oneData.mailhfNm}|"></option>
								</select>
							</td>
						</tr>
						<tr>
							<th>푸터</th>
							<td>
								<select name="mailFsq">
										<option value="0">선택하기 ▼</option>
										<option th:if="${mailFsqList}" th:each="oneData, status : ${mailFsqList}" th:value="|${oneData.mailhfSq}|" th:text="|${oneData.mailhfNm}|"></option>
								</select>
							</td>
						</tr>
						<tr>
							<th>타이틀<em class="required" title="필수"></em></th>
							<td><input type="text" name="mailtNm" maxlength="50" required="required" data-valid-name="타이틀" /></td>
						</tr>
						
						<tr>
							<th>HTML / 이미지 설정<em class="required" title="필수"></em></th>
							<td>
								<textarea class="textareaR4" id="mailContent" name="mailContent" data-valid-name="내용"></textarea>
							</td>
						</tr>
					</tbody>
					
				</table>
		<!-- 팝업창 상단부분 끝-->
		
		<!-- 팡업창 하단부분 시작 -->
		
		<div class="panelStyle" style="margin:unset;">
				<!-- TITLE -->
				<div class="panelTitle">
					<h2>상품 전시 설정</h2>
					<span class="panelControl">
						<i class="fa inner-fa-chevron-up"></i>    <!-- 열림/닫힘 화살표 -->
					</span>
				</div>
				<!-- //상품 전시 설정 -->
				<div class="inner-panelContent">
					<div class="panelContent">
					<ul class="panelBar">
						<li class="left">
							<p>최대 5개 까지 상품 전시 구분을 추가하실 수 있습니다.</p>
							<p>상품은 구분자 당 최대 40 개 까지만 등록하실 수 있습니다.</p>
						</li>
						<li class="right">
							<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddGrid">구분추가하기</button>
						</li>
					</ul>
						<!-- 구분 1 -->
						<div class="inner-panelContent" id="btnAddGridNum" style="display:none;">
							<input type="hidden" name="mailtcSq" th:value="${mailtcSq}">
							<div class="panelContent">
								<table class="frmStyle">
									<colgroup>
										<col width="10%"/>
										<col width="90%"/>
									</colgroup>
									<tr>
										<th>상품 구분 1<br>
											<button type="button" class="btn btn-danger btn-lg" id="" onclick="btnDeleteGridNum('');">구분 삭제</button>
										</th>
										<td>
											<div class="">
												<table  class="frmStyle">
													<tr>
														<th class="w100">구분자 명<em class="required" title="필수"></em></th>
														<td>
															<input type="text" name="mailtcNm" maxlength="50"/>
														</td>
													</tr>
													<tr>
														<th>링크</th>
														<td>
															<input type="text" name="mailtcLink"/>
														</td>
													</tr>
													<tr>
														<th>상품 노출 기준
															<div class="iconTooltip">
																<i class="fa fa-info" aria-hidden="true"></i>
																<span class="left aL" style="width:230px;">
																	<em>1열 에 노출될 상품 개수를 뜻합니다.</em>
																</span>
															</div>
														</th>
														<td>
															<label class="rdoBtn"><input type="radio" name="goodsCpr" value="1"/>1개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr" value="2"/>2개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr" value="3" checked/>3개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr" value="4"/>4개</label>
														</td>
													</tr>
												</table>
												<ul class="panelBar">
													<li class="left">
														<button type="button" class="btn btn-danger btn-lg" onclick="fnGoodsDeleteRow('gridOptions_c1');">상품삭제</button>
													</li>
													<li class="right">
														<button type="button" class="btn btn-info btn-lg" onclick="fnOpenGoodsPopup('gridOptions_c1');">상품추가</button>
													</li>													
												</ul>
												<!-- Agrid -->
												<div id="gridSectionGbList1" style="width:100%; height:200px;" class="ag-theme-balham"></div>
											</div>
										</td>
									</tr>
								</table>
							</div>
						</div>
						<!-- 구분 1 -->
						
						<!-- 구분2 -->
						<div class="inner-panelContent" id="btnAddGridNum2" style="display:none;">
							<input type="hidden" name="mailtSq" th:value="${mailtSq}">
							<div class="panelContent">
								<table class="frmStyle">
									<colgroup>
										<col width="10%"/>
										<col width="90%"/>
									</colgroup>
									<tr>
										<th>상품 구분 2<br><br>
											<button type="button" class="btn btn-danger btn-lg" id="" onclick="btnDeleteGridNum2();">구분 삭제</button>
										</th>
										<td>
											<div class="">
												<table  class="frmStyle">
													<tr>
														<th class="w100">구분자 명<em class="required" title="필수"></em></th>
														<td>
															<input type="text" name="mailtcNm2" maxlength="50"/>
														</td>
													</tr>
													<tr>
														<th>링크</th>
														<td>
															<input type="text" name="mailtcLink2"/>
														</td>
													</tr>
													<tr>
														<th>상품 노출 기준
															<div class="iconTooltip">
																<i class="fa fa-info" aria-hidden="true"></i>
																<span class="left aL" style="width:230px;">
																	<em>1열 에 노출될 상품 개수를 뜻합니다.</em>
																</span>
															</div>
														</th>
														<td>
															<label class="rdoBtn"><input type="radio" name="goodsCpr2" value="1"/>1개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr2" value="2"/>2개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr2" value="3" checked/>3개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr2" value="4"/>4개</label>
														</td>
													</tr>
												</table>
												<ul class="panelBar">
													<li class="left">
														<button type="button" class="btn btn-danger btn-lg" onclick="fnGoodsDeleteRow('gridOptions_c2');">상품삭제</button>
													</li>
													<li class="right">
														<button type="button" class="btn btn-info btn-lg" onclick="fnOpenGoodsPopup('gridOptions_c2');">상품추가</button>
													</li>													
												</ul>
												<!-- Agrid -->
												<div id="gridSectionGbList2" style="width:100%; height:200px;" class="ag-theme-balham"></div>
											</div>
										</td>
									</tr>
								</table>
							</div>
						</div>
						<!-- 구분2  -->
						
						<!-- 구분3 -->
						<div class="inner-panelContent" id="btnAddGridNum3" style="display:none;">
							<input type="hidden" name="mailtcSq3" th:value="${mailtcSq}">
							<div class="panelContent">
								<table class="frmStyle">
									<colgroup>
										<col width="10%"/>
										<col width="90%"/>
									</colgroup>
									<tr>
										<th>상품 구분 3<br><br>
											<button type="button" class="btn btn-danger btn-lg" id="" onclick="btnDeleteGridNum3();">구분 삭제</button>
										</th>
										<td>
											<div class="">
												<table  class="frmStyle">
													<tr>
														<th class="w100">구분자 명<em class="required" title="필수"></em></th>
														<td>
															<input type="text" name="mailtcNm3" maxlength="50"/>								
														</td>
													</tr>
													<tr>
														<th>링크</th>
														<td>
															<input type="text" name="mailtcLink3"/>								
														</td>
													</tr>
													<tr>
														<th>상품 노출 기준
															<div class="iconTooltip">
																<i class="fa fa-info" aria-hidden="true"></i>
																<span class="left aL" style="width:230px;">
																	<em>1열 에 노출될 상품 개수를 뜻합니다.</em>
																</span>
															</div>
														</th>
														<td>
															<label class="rdoBtn"><input type="radio" name="goodsCpr3" value="1"/>1개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr3" value="2"/>2개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr3" value="3" checked/>3개</label>						
															<label class="rdoBtn"><input type="radio" name="goodsCpr3" value="4"/>4개</label>
														</td>
													</tr>
												</table>
												<ul class="panelBar">
													<li class="left">
														<button type="button" class="btn btn-danger btn-lg" onclick="fnGoodsDeleteRow('gridOptions_c3');">상품삭제</button>
													</li>
													<li class="right">
														<button type="button" class="btn btn-info btn-lg" onclick="fnOpenGoodsPopup('gridOptions_c3');">상품추가</button>
													</li>													
												</ul>
												<!-- Agrid -->
												<div id="gridSectionGbList3" style="width:100%; height:200px;" class="ag-theme-balham"></div>
											</div>
										</td>
									</tr>
								</table>
							</div>
						</div>
						<!-- 구분3 -->
						
						<!-- 구분4 -->
						<div class="inner-panelContent" id="btnAddGridNum4" style="display:none;">
							<input type="hidden" name="mailtcSq4" th:value="${mailtcSq}">
							<div class="panelContent">
								<table class="frmStyle">
									<colgroup>
										<col width="10%"/>
										<col width="90%"/>
									</colgroup>
									<tr>
										<th>상품 구분 4<br><br>
											<button type="button" class="btn btn-danger btn-lg" id="" onclick="btnDeleteGridNum4();">구분 삭제</button>
										</th>
										<td>
											<div class="">
												<table  class="frmStyle">
													<tr>
														<th class="w100">구분자 명<em class="required" title="필수"></em></th>
														<td>
															<input type="text" name="mailtcNm4" maxlength="50"/>								
														</td>
													</tr>
													<tr>
														<th>링크</th>
														<td>
															<input type="text" name="mailtcLink4"/>								
														</td>
													</tr>
													<tr>
														<th>상품 노출 기준
															<div class="iconTooltip">
																<i class="fa fa-info" aria-hidden="true"></i>
																<span class="left aL" style="width:230px;">
																	<em>1열 에 노출될 상품 개수를 뜻합니다.</em>
																</span>
															</div>
														</th>
														<td>
															<label class="rdoBtn"><input type="radio" name="goodsCpr4" value="1"/>1개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr4" value="2"/>2개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr4" value="3" checked/>3개</label>						
															<label class="rdoBtn"><input type="radio" name="goodsCpr4" value="4"/>4개</label>
														</td>
													</tr>
												</table>
												<ul class="panelBar">
													<li class="left">
														<button type="button" class="btn btn-danger btn-lg" onclick="fnGoodsDeleteRow('gridOptions_c4');">상품삭제</button>
													</li>
													<li class="right">
														<button type="button" class="btn btn-info btn-lg" onclick="fnOpenGoodsPopup('gridOptions_c4');">상품추가</button>
													</li>													
												</ul>
												<!-- Agrid -->
												<div id="gridSectionGbList4" style="width:100%; height:200px;" class="ag-theme-balham"></div>
											</div>
										</td>
									</tr>
								</table>
							</div>
						</div>
						<!-- 구분4 -->
						
						<!-- 구분5 -->
						<div class="inner-panelContent" id="btnAddGridNum5" style="display:none;">
						<input type="hidden" name="mailtcSq5" th:value="${mailtcSq}">
							<div class="panelContent">
								<table class="frmStyle">
									<colgroup>
										<col width="10%"/>
										<col width="90%"/>
									</colgroup>
									<tr>
										<th>상품 구분 5<br><br>
											<button type="button" class="btn btn-danger btn-lg" id="" onclick="btnDeleteGridNum5();">구분 삭제</button>
										</th>
										<td>
											<div class="">
												<table  class="frmStyle">
													<tr>
														<th class="w100">구분자 명<em class="required" title="필수"></em></th>
														<td>
															<input type="text" name="mailtcNm5" maxlength="50"/>								
														</td>
													</tr>
													<tr>
														<th>링크</th>
														<td>
															<input type="text" name="mailtcLink5"/>								
														</td>
													</tr>
													<tr>
														<th>상품 노출 기준
															<div class="iconTooltip">
																<i class="fa fa-info" aria-hidden="true"></i>
																<span class="left aL" style="width:230px;">
																	<em>1열 에 노출될 상품 개수를 뜻합니다.</em>
																</span>
															</div>
														</th>
														<td>
															<label class="rdoBtn"><input type="radio" name="goodsCpr5" value="1"/>1개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr5" value="2"/>2개</label>
															<label class="rdoBtn"><input type="radio" name="goodsCpr5" value="3" checked/>3개</label>						
															<label class="rdoBtn"><input type="radio" name="goodsCpr5" value="4"/>4개</label>
														</td>
													</tr>
												</table>
												<ul class="panelBar">
													<li class="left">
														<button type="button" class="btn btn-danger btn-lg" onclick="fnGoodsDeleteRow('gridOptions_c5');">상품삭제</button>
													</li>
													<li class="right">
														<button type="button" class="btn btn-info btn-lg" onclick="fnOpenGoodsPopup('gridOptions_c5');">상품추가</button>
													</li>													
												</ul>
												<!-- Agrid -->
												<div id="gridSectionGbList5" style="width:100%; height:200px;" class="ag-theme-balham"></div>
											</div>
										</td>
									</tr>
								</table>
							</div>
						</div>
						<!-- 구분5 -->
					
						
					</div> <!-- panelContent -->
				</div> <!-- end of inner-panelContent -->
			</div>
			<!-- 팡업창 하단부분 끝 -->

		<!-- 버튼 배치 영역 -->
		<ul class="panelBar">
			<li class="left"  th:if="${mode  == 'U' }">
				<button type="button" class="btn btn-danger btn-lg" id="btndeleteMktmail">삭제</button>
			</li>
			<li class="right">
				<button type="button" class="btn btn-info btn-lg" id="btnSaveMktMail">저장</button>
			</li>
		</ul>
		<!-- //버튼 배치 영역 -->
				</form>
		</div>
	</div>
</div>

<script type="text/javascript" src="/ux/plugins/summernote/summernote.js?v=2020102902"></script>
<script type="text/javascript" src="/ux/plugins/gaga/gaga.summernote.js?v=20201030"></script>
<script th:inline="javascript">
/*<![CDATA[*/
		let AddgridRow;		
		let mode = [[${mode}]]; 
		let mktmailInfo = [[${mktmailInfo}]];
		let mktmailTCInfo = [[${mktmailTCInfo}]];
		let goodsStatList = gagajf.convertToArray([[${goodsStatList}]]);
		
		//팝업창 삭제버튼
		$('#btndeleteMktmail').on('click', function() {
			mcxDialog.confirm("등록하신 내용을 삭제하시겠습니까?<br>삭제한 내용은 복원하실 수 없습니다.", {
				cancelBtnText: "취소",
				sureBtnText: "확인",
				sureBtnClick: function() {
					
					var deleteData = [];
					var corner = {};
					
					corner.mailtSq = $('#mailManagementForm input[name=mailtSq]').val();
					corner.useYn = 'N';
					deleteData.push(corner);
					
					console.log(deleteData);
					
					var jsonData = JSON.stringify(deleteData);
					
					gagajf.ajaxJsonSubmit('/marketing/mktmailManagement/delete', jsonData, function() {
						uifnPopupClose('popupMktMail');
						$('#btnSearch').trigger('click');
					});
				}
			});
		});
		
		//그리드 그리기
		var columnDefs = [
			{width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
			{headerName: "Product ID", field: "goodsCd" , width: 120, cellClass: 'text-center'},
			{headerName: "브랜드명", field: "brandEnm" , width: 200, cellClass: 'text-center'},
			{headerName: "상품명", field: "goodsNm" , width: 200, cellClass: 'text-center'},
			{headerName: "판매상태", field: "goodsStat" , width: 100, cellClass: 'text-center',
				cellEditorParams: { values: gagaAgGrid.extractValues(goodsStatList) },
				valueFormatter: function (params) { return gagaAgGrid.lookupValue(goodsStatList, params.value); },
				valueParser: function (params) { return gagaAgGrid.lookupKey(goodsStatList, params.newValue); }
			},
			{headerName: "정상가", field: "listPrice" , width: 120, cellClass: 'text-center'},
			{headerName: "판매가", field: "listPrice" , width: 120, cellClass: 'text-center'},
			{headerName: "순번", field: "dispOrd" , width: 120, cellClass: 'text-center',cellEditor: 'numericCellEditor'}
		];
		
		
		// Add on options
		var gridOptions_c1 = gagaAgGrid.getGridOptions(columnDefs);
		var gridOptions_c2 = gagaAgGrid.getGridOptions(columnDefs);
		var gridOptions_c3 = gagaAgGrid.getGridOptions(columnDefs);
		var gridOptions_c4 = gagaAgGrid.getGridOptions(columnDefs);
		var gridOptions_c5 = gagaAgGrid.getGridOptions(columnDefs);
		
		// 표시순번 수정가능
		gridOptions_c1.defaultColDef.editable = true;
		gridOptions_c2.defaultColDef.editable = true;
		gridOptions_c3.defaultColDef.editable = true;
		gridOptions_c4.defaultColDef.editable = true;
		gridOptions_c5.defaultColDef.editable = true;
		//중복선택
		gridOptions_c1.rowSelection = 'multiple';
		gridOptions_c2.rowSelection = 'multiple';
		gridOptions_c3.rowSelection = 'multiple';
		gridOptions_c4.rowSelection = 'multiple';
		gridOptions_c5.rowSelection = 'multiple';
		
		gridOptions_c1.suppressRowClickSelection = true;
		gridOptions_c2.suppressRowClickSelection = true;
		gridOptions_c3.suppressRowClickSelection = true;
		gridOptions_c4.suppressRowClickSelection = true;
		gridOptions_c5.suppressRowClickSelection = true;
		
		///저장
		$('#btnSaveMktMail').on('click', function() {
			
			//타이틀 길이 제한 2자 이상 50자미만
			var check = $('#mailManagementForm input[name=mailtNm]').val();

			if(check.length < 2){
				mcxDialog.alert('타이틀은 2자 이상 50자 미만으로 입력하세요.');
				return false;
			}
			
			let arrayData = gagaAgGrid.getAllRowData(gridOptions_c1)
			let arrayData2 = gagaAgGrid.getAllRowData(gridOptions_c2)
			let arrayData3 = gagaAgGrid.getAllRowData(gridOptions_c3)
			let arrayData4 = gagaAgGrid.getAllRowData(gridOptions_c4)
			let arrayData5 = gagaAgGrid.getAllRowData(gridOptions_c5)
			

			//상품 등록 CHECK
			if(arrayData.length == 0 && $('#btnAddGridNum').css('display') != 'none'){
				mcxDialog.alert('구분자1의 상품을 등록해주세요.');
				return false;
			}
			if(arrayData2.length == 0 && $('#btnAddGridNum2').css('display') != 'none'){
				mcxDialog.alert('구분자2의 상품을 등록해주세요.');
				return false;
			}
			if(arrayData3.length == 0 && $('#btnAddGridNum3').css('display') != 'none'){
				mcxDialog.alert('구분자3의 상품을 등록해주세요.');
				return false;
			}
			if(arrayData4.length == 0 && $('#btnAddGridNum4').css('display') != 'none'){
				mcxDialog.alert('구분자4의 상품을 등록해주세요.');
				return false;
			}
			if(arrayData5.length == 0 && $('#btnAddGridNum5').css('display') != 'none'){
				mcxDialog.alert('구분자5의 상품을 등록해주세요.');
				return false;
			}
			
			let check1 = $('#mailManagementForm input[name=mailtcNm]').val();
			let check2 = $('#mailManagementForm input[name=mailtcNm2]').val();
			let check3 = $('#mailManagementForm input[name=mailtcNm3]').val();
			let check4 = $('#mailManagementForm input[name=mailtcNm4]').val();
			let check5 = $('#mailManagementForm input[name=mailtcNm5]').val();

			let mailTc = {};
			let mailTc2 = {};
			let mailTc3 = {};
			let mailTc4 = {};
			let mailTc5 = {};
			
			if(check1 != null && check1 != '') {
				mailTc.mailtcNm = $('#mailManagementForm input[name=mailtcNm]').val();
				mailTc.mailtcLink = $('#mailManagementForm input[name=mailtcLink]').val();
				mailTc.goodsCpr = $('#mailManagementForm input:radio[name=goodsCpr]:checked').val();
				mailTc.mailtcSq = $('#mailManagementForm input[name=mailtcSq]').val();
			} if(check2 != null && check2 != '') {
				mailTc2.mailtcNm = $('#mailManagementForm input[name=mailtcNm2]').val();
				mailTc2.mailtcLink = $('#mailManagementForm input[name=mailtcLink2]').val();
				mailTc2.goodsCpr = $('#mailManagementForm input:radio[name=goodsCpr2]:checked').val();
				mailTc2.mailtcSq = $('#mailManagementForm input[name=mailtcSq2]').val();

			} if(check3 != null && check3 != '') {
				mailTc3.mailtcNm = $('#mailManagementForm input[name=mailtcNm3]').val();
				mailTc3.mailtcLink = $('#mailManagementForm input[name=mailtcLink3]').val();
				mailTc3.goodsCpr = $('#mailManagementForm input:radio[name=goodsCpr3]:checked').val();
				mailTc3.mailtcSq = $('#mailManagementForm input[name=mailtcSq3]').val();

			} if(check4 != null && check4 != '') {
				mailTc4.mailtcNm = $('#mailManagementForm input[name=mailtcNm4]').val();
				mailTc4.mailtcLink = $('#mailManagementForm input[name=mailtcLink4]').val();
				mailTc4.goodsCpr = $('#mailManagementForm input:radio[name=goodsCpr4]:checked').val();
				mailTc4.mailtcSq = $('#mailManagementForm input[name=mailtcSq4]').val();

				
			} if(check5!= null && check5 != '') {
				mailTc5.mailtcNm = $('#mailManagementForm input[name=mailtcNm5]').val();
				mailTc5.mailtcLink = $('#mailManagementForm input[name=mailtcLink5]').val();
				mailTc5.goodsCpr = $('#mailManagementForm input:radio[name=goodsCpr5]:checked').val();
				mailTc5.mailtcSq = $('#mailManagementForm input[name=mailtcSq5]').val();

			}
		 	
			
			//헤더 선택체크 내용 체크
			if(!gagajf.validation('#mailManagementForm'))
				return false;
			
			if(gagajf.isNull($('#mailContent').val())){
				mcxDialog.alert('내용을 입력해 주세요.');
				return false;
			}
						
			//구분자명 CHECK
			if($('#btnAddGridNum').css('display') != 'none' && check1.length < 2){
				mcxDialog.alert('구분자1명은 2자 이상 50자 미만으로 입력하세요.');
				return false;
			}
			if($('#btnAddGridNum2').css('display') != 'none' && check2.length < 2){
				mcxDialog.alert('구분자2명은 2자 이상 50자 미만으로 입력하세요.');
				return false;
			}
			if($('#btnAddGridNum3').css('display') != 'none' && check3.length < 2){
				mcxDialog.alert('구분자3명은 2자 이상 50자 미만으로 입력하세요.');
				return false;
			}
			if($('#btnAddGridNum4').css('display') != 'none' && check4.length < 2){
				mcxDialog.alert('구분자4명은 2자 이상 50자 미만으로 입력하세요.');
				return false;
			}
			if($('#btnAddGridNum5').css('display') != 'none' && check5.length < 2){
				mcxDialog.alert('구분자5명은 2자 이상 50자 미만으로 입력하세요.');
				return false;
			}
			
			
			mcxDialog.confirm("내용을 등록 하시겠습니까?", {
				cancelBtnText: "취소",
				sureBtnText: "확인",
				sureBtnClick: function() {
					let data = {};
					
					data.mktmailManagementTc = mailTc;
					data.mktmailManagementTc2 = mailTc2;
					data.mktmailManagementTc3 = mailTc3;
					data.mktmailManagementTc4 = mailTc4;
					data.mktmailManagementTc5 = mailTc5;
					
					data.mktmailManagementGoods = arrayData;
					data.mktmailManagementGoods2 = arrayData2;
					data.mktmailManagementGoods3 = arrayData3;
					data.mktmailManagementGoods4 = arrayData4;
					data.mktmailManagementGoods5 = arrayData5;
					
					//업데이트 일 경우 처리
					if($('#mailManagementForm input[name=mailtSq]').val() != null && $('#mailManagementForm input[name=mailtSq]').val() != ''){
						data.mailtSq = mktmailInfo.mailtSq;
					}
					
					data.mktHeader = $('#mailManagementForm select[name=mailHsq]').val();
					data.mktFooter = $('#mailManagementForm select[name=mailFsq]').val();
					data.mailtNm = $('#mailManagementForm input[name=mailtNm]').val();
					data.mailtGb = $('#mailManagementForm input:radio[name=mailtGb]:checked').val();
					data.mailContent = $('#mailManagementForm textarea[name=mailContent]').val();
					
					let jsonData = JSON.stringify(data);
					
					gagajf.ajaxJsonSubmit($('#mailManagementForm').prop('action'), jsonData, function(data){
						uifnPopupClose('popupMktMail');
						$('#btnSearch').trigger('click');
					});
				
				}
			});
		
		});
		
		// 상품 구분 추가 버튼 추가 버튼 표시는 1~5까지 순서대로 표시
		$('#btnAddGrid').on('click', function(){
			if($('#btnAddGridNum').css('display') == 'none'){
				$('#btnAddGridNum').show();
			}else if($('#btnAddGridNum2').css('display') == 'none' && $('#btnAddGridNum').css('display') != 'none'){
				$('#btnAddGridNum2').show();
			}else if($('#btnAddGridNum3').css('display') == 'none' && $('#btnAddGridNum2').css('display') != 'none'){
				$('#btnAddGridNum3').show();
			}else if($('#btnAddGridNum4').css('display') == 'none' && $('#btnAddGridNum3').css('display') != 'none'){
				$('#btnAddGridNum4').show();
			}else if($('#btnAddGridNum5').css('display') == 'none' && $('#btnAddGridNum4').css('display') != 'none'){
				$('#btnAddGridNum5').show();
			}else if($('#btnAddGridNum5').css('display') != 'none'){
				mcxDialog.alertC("구분자는 최대 5개까지 등록가능합니다.", {
					sureBtnText: "확인"
				});
				return false;
			}
		});
		
		// 버튼별 상품추가 팝업
		var fnOpenGoodsPopup = function(param) {
			switch (param){
			case 'gridOptions_c1': 
				AddgridRow = gridOptions_c1;
				break;
			case 'gridOptions_c2' : 
				AddgridRow = gridOptions_c2;
				break;
			case 'gridOptions_c3' : 
				AddgridRow = gridOptions_c3;
				break;
			case 'gridOptions_c4' : 
				AddgridRow = gridOptions_c4;
				break;
			case 'gridOptions_c5' : 
				AddgridRow = gridOptions_c5;
				break;
			}
			cfnOpenGoodsPopup('fnFetchGoods');
		}

		// 상품추가
		var fnFetchGoods = function(goodsData) {
			
			if (goodsData.length < 1) return;
			// 기존상품
			var oldGoodsSetList = gagaAgGrid.getAllRowData(AddgridRow);
			var index = oldGoodsSetList.length+1;
			
			var arrGoodsCd = [];
			$.each(goodsData, function(idx, item) {
				arrGoodsCd.push(item.goodsCd);
			})
			
			var isExist = false;
			var jsonData = JSON.stringify(arrGoodsCd);
			gagajf.ajaxJsonSubmit('/marketing/mktMailManagement/goods/info', jsonData, function(result) {
				$.each(result, function(idx, item) {
					isExist = false;
					AddgridRow.api.forEachNode(function(rowNode, index) {
						//중복상품 여부 확인
						if (item.goodsCd == rowNode.data.goodsCd){
							isExist = true;
						}
					});
					
					//상품 추가 갯수 제한
					if(goodsData.length > 40){
						mcxDialog.alert('상품은 최대 40개까지 추가 가능합니다.');
						return false;
					}
					
					if(!isExist){
						var data = {
							   goodsCd : item.goodsCd
						   ,  brandEnm : item.brandEnm
						   ,   goodsNm : item.goodsNm
						   , goodsStat : item.goodsStat
						   , listPrice : item.listPrice
						   , currPrice : item.currPrice
						   ,   dispOrd : index
	
						};
						//그리드 마지막에 추가해야함
						AddgridRow.api.updateRowData({add: [data], addIndex: idx});
						AddgridRow.api.refreshCells();
						index++;
					}
				});
			});
		}
	
		// 상품 삭제
		var fnGoodsDeleteRow = function(param) {
			switch (param){
			case 'gridOptions_c1': 
				AddgridRow = gridOptions_c1;
				break;
			case 'gridOptions_c2' : 
				AddgridRow = gridOptions_c2;
				break;
			case 'gridOptions_c3' : 
				AddgridRow = gridOptions_c3;
				break;
			case 'gridOptions_c4' : 
				AddgridRow = gridOptions_c4;
				break;
			case 'gridOptions_c5' : 
				AddgridRow = gridOptions_c5;
				break;
			}
			
			var selectedData = gagaAgGrid.selectedRowData(AddgridRow);
			var removedData = gagaAgGrid.removeRowData(AddgridRow);
			
			if (selectedData.length == 0) {
				mcxDialog.alert('선택된 행이 없습니다.');
				return false;
			}
			
			//상세보기에서 삭제처리
			if(mode == 'U') {
				mcxDialog.confirm('해당 상품을 삭제하시겠습니까?', {
					cancelBtnText: "취소",
					sureBtnText: "확인",
					sureBtnClick: function(){
						
						//화면에서 삭제
						gagaAgGrid.removeRowData(AddgridRow, false);
						var deleteData = [];
						$.each(removedData, function(idx, item) {
							deleteData.push(item);
						})
						
						var jsonData = JSON.stringify(deleteData);
						gagajf.ajaxJsonSubmit('marketing/mktmailManagement/goods/delete', jsonData);
					}
				});
			}
		}

		// 상품 구분 폼 삭제
		function btnDeleteGridNum(param){
			if($('#btnAddGridNum').css('display') !='none'){
				//구분자 DB 삭제
				if(mode == "U" && $('#mailManagementForm input[name=mailtcNm]').val() != null && $('#mailManagementForm input[name=mailtcNm]').val() != ''){
					var deleteData = [];
					var corner = {};
						corner.mailtcSq = $('#mailManagementForm input[name=mailtcSq]').val();
						corner.useYn = 'N';
						deleteData.push(corner);
					var jsonData = JSON.stringify(deleteData);
					gagajf.ajaxJsonSubmit('marketing/mktmailManagement/corner/delete', jsonData);
				}
				//상품전시 삭제
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c1);
				if(mode == "U" && selectedData.length != 0){
						//상세보기에서 삭제처리
						var deleteData = [];
						$.each(selectedData, function(idx, item) {
							deleteData.push(item);
						})
						var jsonData = JSON.stringify(deleteData);
						gagajf.ajaxJsonSubmit('marketing/mktmailManagement/goods/delete', jsonData);
				}
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c1);
				selectedData.forEach(function(item, index) {
					gridOptions_c1.api.updateRowData({remove: [item]});
				});
				$('#mailManagementForm input[name=mailtcNm]').val('');
				$('#mailManagementForm input[name=mailtcLink]').val('');
				$('#mailManagementForm input:radio[name="goodsCpr"]:radio[value="3"]').prop('checked', true);
				$('#btnAddGridNum').hide();
			}
		}

		function btnDeleteGridNum2(param){
			if($('#btnAddGridNum2').css('display') !='none'){
				//구분자 DB 삭제
				if(mode == "U" && $('#mailManagementForm input[name=mailtcNm2]').val() != null && $('#mailManagementForm input[name=mailtcNm2]').val() != ''){
					var deleteData = [];
					var corner = {};
						corner.mailtcSq = $('#mailManagementForm input[name=mailtcSq2]').val();
						corner.useYn = 'N';
						deleteData.push(corner);
					var jsonData = JSON.stringify(deleteData);
					gagajf.ajaxJsonSubmit('marketing/mktmailManagement/corner/delete', jsonData);
				}
				//상품전시 삭제
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c2);
				if(mode == "U" && selectedData.length != 0){
						//상세보기에서 삭제처리
						var deleteData = [];
						$.each(selectedData, function(idx, item) {
							deleteData.push(item);
						})
						var jsonData = JSON.stringify(deleteData);
						gagajf.ajaxJsonSubmit('marketing/mktmailManagement/goods/delete', jsonData);
				}
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c2);
				selectedData.forEach(function(item, index) {
					gridOptions_c1.api.updateRowData({remove: [item]});
				});
				$('#mailManagementForm input[name=mailtcNm2]').val('');
				$('#mailManagementForm input[name=mailtcLink2]').val('');
				$('#mailManagementForm input:radio[name="goodsCpr2"]:radio[value="3"]').prop('checked', true);
				$('#btnAddGridNum2').hide();
			}
		}
		
		function btnDeleteGridNum3(param){
			if($('#btnAddGridNum3').css('display') !='none'){
				//구분자 DB 삭제
				if(mode == "U" && $('#mailManagementForm input[name=mailtcNm3]').val() != null && $('#mailManagementForm input[name=mailtcNm3]').val() != ''){
					var deleteData = [];
					var corner = {};
						corner.mailtcSq = $('#mailManagementForm input[name=mailtcSq3]').val();
						corner.useYn = 'N';
						deleteData.push(corner);
					var jsonData = JSON.stringify(deleteData);
					gagajf.ajaxJsonSubmit('marketing/mktmailManagement/corner/delete', jsonData);
				}
				//상품전시 삭제
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c3);
				if(mode == "U" && selectedData.length != 0){
						//상세보기에서 삭제처리
						var deleteData = [];
						$.each(selectedData, function(idx, item) {
							deleteData.push(item);
						})
						var jsonData = JSON.stringify(deleteData);
						gagajf.ajaxJsonSubmit('marketing/mktmailManagement/goods/delete', jsonData);
				}
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c3);
				selectedData.forEach(function(item, index) {
					gridOptions_c1.api.updateRowData({remove: [item]});
				});
				$('#mailManagementForm input[name=mailtcNm3]').val('');
				$('#mailManagementForm input[name=mailtcLink3]').val('');
				$('#mailManagementForm input:radio[name="goodsCpr3"]:radio[value="3"]').prop('checked', true);
				$('#btnAddGridNum3').hide();
			}
		}		
		
		function btnDeleteGridNum4(param){
			if ($('#btnAddGridNum4').css('display') !='none'){
				
				//구분자 DB 삭제
				if(mode == "U" && $('#mailManagementForm input[name=mailtcNm4]').val() != null && $('#mailManagementForm input[name=mailtcNm4]').val() != ''){
					var deleteData = [];
					var corner = {};
						corner.mailtcSq = $('#mailManagementForm input[name=mailtcSq4]').val();
						corner.useYn = 'N';
						deleteData.push(corner);
					var jsonData = JSON.stringify(deleteData);
					gagajf.ajaxJsonSubmit('marketing/mktmailManagement/corner/delete', jsonData);
				}
				//상품전시 삭제
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c4);
				if(mode == "U" && selectedData.length != 0){
						//상세보기에서 삭제처리
						var deleteData = [];
						$.each(selectedData, function(idx, item) {
							deleteData.push(item);
						})
						var jsonData = JSON.stringify(deleteData);
						gagajf.ajaxJsonSubmit('marketing/mktmailManagement/goods/delete', jsonData);
				}
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c4);
				selectedData.forEach(function(item, index) {
					gridOptions_c1.api.updateRowData({remove: [item]});
				});
				$('#mailManagementForm input[name=mailtcNm4]').val('');
				$('#mailManagementForm input[name=mailtcLink4]').val('');
				$('#mailManagementForm input:radio[name="goodsCpr4"]:radio[value="3"]').prop('checked', true);
				$('#btnAddGridNum4').hide();
			}
		}
		function btnDeleteGridNum5(param){
			if ($('#btnAddGridNum5').css('display') !='none'){
				
				//구분자 DB 삭제
				if(mode == "U" && $('#mailManagementForm input[name=mailtcNm5]').val() != null && $('#mailManagementForm input[name=mailtcNm5]').val() != ''){
					var deleteData = [];
					var corner = {};
						corner.mailtcSq = $('#mailManagementForm input[name=mailtcSq5]').val();
						corner.useYn = 'N';
						deleteData.push(corner);
					var jsonData = JSON.stringify(deleteData);
					gagajf.ajaxJsonSubmit('marketing/mktmailManagement/corner/delete', jsonData);
				}
				//상품전시 삭제
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c5);
				if(mode == "U" && selectedData.length != 0){
						//상세보기에서 삭제처리
						var deleteData = [];
						$.each(selectedData, function(idx, item) {
							deleteData.push(item);
						})
						var jsonData = JSON.stringify(deleteData);
						gagajf.ajaxJsonSubmit('marketing/mktmailManagement/goods/delete', jsonData);
				}
				var selectedData = gagaAgGrid.getAllRowData(gridOptions_c5);
				selectedData.forEach(function(item, index) {
					gridOptions_c1.api.updateRowData({remove: [item]});
				});	
				$('#mailManagementForm input[name=mailtcNm5]').val('');
				$('#mailManagementForm input[name=mailtcLink5]').val('');
				$('#mailManagementForm input:radio[name="goodsCpr5"]:radio[value="3"]').prop('checked', true);
				$('#btnAddGridNum5').hide();
			}
		} 

	$(document).ready(function() {
		gagaAgGrid.createGrid("gridSectionGbList1", gridOptions_c1);
		gagaAgGrid.createGrid("gridSectionGbList2", gridOptions_c2);
		gagaAgGrid.createGrid("gridSectionGbList3", gridOptions_c3);
		gagaAgGrid.createGrid("gridSectionGbList4", gridOptions_c4);
		gagaAgGrid.createGrid("gridSectionGbList5", gridOptions_c5);
		
		if (mode == 'U') {
			
			$('#mailManagementForm input[name=mailtSq]').val(mktmailInfo.mailtSq);
			$('#mailManagementForm select[name=mailHsq]').val(mktmailInfo.mailHsq);
			$('#mailManagementForm select[name=mailFsq]').val(mktmailInfo.mailFsq);
			$('#mailManagementForm input[name=mailtNm]').val(mktmailInfo.mailtNm);
			$('#mailManagementForm textarea[name=mailContent]').val(mktmailInfo.mailContent);
			
			if(mktmailInfo.mailtGb == "A"){
				$('#mailManagementForm input:radio[name="mailtGb"]:radio[value="A"]').prop('checked', true);
			}
			
			$.each(mktmailTCInfo, function(idx, item) {
				
				if (idx == 0) {
					$('#mailManagementForm input[name=mailtcNm]').val(item.tc.mailtcNm);						
					$('#mailManagementForm input[name=mailtcSq]').val(item.tc.mailtcSq);
					$('#mailManagementForm input[name=mailtcLink]').val(item.tc.mailtcLink);
					if(mktmailTCInfo[idx].tc.goodsCpr == 1){
						$('#mailManagementForm input:radio[name=goodsCpr]:input[value="1"]').prop('checked', true);
					}else if(mktmailTCInfo[idx].tc.goodsCpr == 2){
						$('#mailManagementForm input:radio[name=goodsCpr]:input[value="2"]').prop('checked', true);
					}else if(mktmailTCInfo[idx].tc.goodsCpr == 3){
						$('#mailManagementForm input:radio[name=goodsCpr]:input[value="3"]').prop('checked', true);
					}else if(mktmailTCInfo[idx].tc.goodsCpr == 4){
						$('#mailManagementForm input:radio[name=goodsCpr]:input[value="4"]').prop('checked', true);
					}
					$('#btnAddGridNum').show();
				} else {
					$('#mailManagementForm input[name=mailtcNm' + (idx + 1) + ']').val(item.tc.mailtcNm);
					$('#mailManagementForm input[name=mailtcLink' + (idx + 1) + ']').val(item.tc.mailtcLink);
					$('#mailManagementForm input[name=mailtcSq' + (idx + 1) + ']').val(item.tc.mailtcSq);
						if(mktmailTCInfo[idx].tc.goodsCpr == 1){
							$('#mailManagementForm input:radio[name=goodsCpr' + (idx + 1) + ']:input[value="1"]').prop('checked', true);
						}else if(mktmailTCInfo[idx].tc.goodsCpr == 2){
							$('#mailManagementForm input:radio[name=goodsCpr' + (idx + 1) + ']:input[value="2"]').prop('checked', true);
						}else if(mktmailTCInfo[idx].tc.goodsCpr == 3){
							$('#mailManagementForm input:radio[name=goodsCpr' + (idx + 1) + ']:input[value="3"]').prop('checked', true);
						}else if(mktmailTCInfo[idx].tc.goodsCpr == 4){
							$('#mailManagementForm input:radio[name=goodsCpr' + (idx + 1) + ']:input[value="4"]').prop('checked', true);
						}
					$('#btnAddGridNum' + (idx + 1)).show();
				}
				
				switch(idx) {
				case 0:
					gridOptions_c1.api.setRowData(item.goodsList);
					break;
				case 1:
					gridOptions_c2.api.setRowData(item.goodsList);
					break;
				case 2:
					gridOptions_c3.api.setRowData(item.goodsList);
					break;
				case 3:
					gridOptions_c4.api.setRowData(item.goodsList);
					break;
				case 4:
					gridOptions_c5.api.setRowData(item.goodsList);
					break;
				}
			});
			
		}//end of mode

		// Create a summernote
		let snOptions = gagaSn.getToolbarOptions();
				
		gagaSn.createSummernote(snOptions, '#mailContent');

	});
/*]]>*/
</script>

</html>
