<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : MailHeaderFooterDetailForm.html
 * @desc    : 메일헤더푸터 등록/수정 상세 팝업
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.02.02   csh9191     최초 작성
 * 1.1  2021.05.13   gagamel     전반적 수정
 *******************************************************************************
 -->
<div class="modalPopup" data-width="1200" id="popupMailHeaderFooter">
	<div class="panelStyle">
		<!-- TITLE -->
		<div class="panelTitle">
			<strong th:text="${'메일헤더/푸터 ' + (mode == 'N' ? '등록' : '상세')}">메일헤더/푸터</strong>
			<button type="button" class="close" onclick="uifnPopupClose('popupMailHeaderFooter');"><em class="fa fa-times"></em></button>
		</div>
		<!-- //TITLE -->
		
		<!-- CONTENT -->
		<div class="panelContent">
			<form id="mailHeaderFooterForm" name="mailHeaderFooterForm" action="#" th:action="@{'/marketing/mail/headerfooter/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>
								<input type="text" name="mailhfSq" maxlength="20" placeholder="자동생성" readonly="readonly" th:value="${mailhfInfo?.mailhfSq}"/>
							</td>
						</tr>
						<tr>
							<th>헤더푸터구분<em class="required" title="필수"></em></th>
							<td>
								<label class="rdoBtn"><input type="radio" name="mailhfGb" value="H" th:checked="${mailhfInfo?.mailhfGb == null or mailhfInfo?.mailhfGb == 'H'}"/>헤더</label>
								<label class="rdoBtn"><input type="radio" name="mailhfGb" value="F" th:checked="${mailhfInfo?.mailhfGb == 'F'}"/>푸터</label>
							</td>
						</tr>
						<tr>
							<th>헤더푸터명<em class="required" title="필수"></em></th>
							<td>
								<input type="text" name="mailhfNm" maxlength="50" required="required" data-valid-name="헤더푸터명" th:value="${mailhfInfo?.mailhfNm}"/>
							</td>
						</tr>
						<tr>
							<th>내용<em class="required" title="필수"></em></th>
							<td>
								<textarea class="textareaR4" id="mailhfContent" name="mailhfContent" data-valid-name="내용" th:text="${mailhfInfo?.mailhfContent}"></textarea>
							</td>
						</tr>
					</tbody>
				</table>
			</form>
		</div>
		<!-- //CONTENT -->

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

<script type="text/javascript" src="/ux/plugins/summernote/summernote.js?v=2020103001"></script>
<script type="text/javascript" src="/ux/plugins/gaga/gaga.summernote.js?v=2021053101"></script>
<script th:inline="javascript">
/*<![CDATA[*/
	// 저장
	$('#btnSaveMailHeaderFooter').on('click', function() {
		// 입력 값 체크
		if (!gagajf.validation('#mailHeaderFooterForm'))
			return false;
		
		if (gagajf.isNull($('#mailhfContent').val())) {
			mcxDialog.alert('내용을 입력해 주세요.');
			return false;
		}
		
		// 헤더푸터명 길이 제한 2자 이상 50자 미만
		var check = $('#mailHeaderFooterForm input[name=mailhfNm]').val();

		if (check.length < 2) {
			mcxDialog.alert('헤더푸터명은 2자 이상 50자 미만으로 입력해 주세요.');
			return false;
		}
		
		mcxDialog.confirm("저장하시겠습니까?", {
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function() {
				gagajf.ajaxFormSubmit($('#mailHeaderFooterForm').prop('action'), '#mailHeaderFooterForm', function() {
					uifnPopupClose('popupMailHeaderFooter');
					$('#btnSearch').trigger('click');
				});
			}
		});
	});
	
	// 삭제
	$('#btnDeleteMailHeaderFooter').on('click', function() {
		mcxDialog.confirm("정말 삭제하시겠습니까? 삭제한 내용은 복원하실 수 없습니다.", {
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function() {
				var actionUrl = '/marketing/mail/headerfooter/delete/' + $('#mailHeaderFooterForm input[name=mailhfSq]').val();
				gagajf.ajaxFormSubmit(actionUrl, '#mailHeaderFooterForm', function() {
					uifnPopupClose('popupMailHeaderFooter');
					$('#btnSearch').trigger('click');
				});
			}
		});
	});

	$(document).ready(function() {
		// Create a summernote
		let snOptions = gagaSn.getToolbarOptions();
		gagaSn.createSummernote(snOptions, '#mailhfContent');
	});
/*]]>*/
</script>

</html>
