<!DOCTYPE html>
<html lang="ko"
	  xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : PointGrantPopupForm.html
 * @desc    : 포인트부여 팝업 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2021 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.01.27   jsshin     최초 작성
 *******************************************************************************
 -->
<div class="modalPopup" data-width="640">
	<div class="panelStyle">
		<!-- TITLE -->
		<div class="panelTitle">
			<strong>포인트부여</strong>
			<button type="button" class="close" onclick="uifnPopupClose('popupPointGrantForm')"><em class="fa fa-times"></em></button>
		</div>
		<!-- //TITLE -->
		<!-- CONTENT -->
		<div class="panelContent">
			<div class="panelStyle">
				<form id="pointGrantForm" name="pointGrantForm">
					<input type="hidden" name="custNo">
					<table class="frmStyle">
						<colgroup>
							<col style="width:10%"/>
							<col style="width:40%"/>
							<col style="width:10%"/>
							<col style="width:40%"/>
						</colgroup>
						<tbody>
						<tr >
							<th>사이트</th>
							<td>
								<select name="siteCd" data-valid-name="사이트" required="required">
									<option th:if="${siteCdList}" th:each="oneData, status : ${siteCdList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] '+ oneData.cdNm}"></option>
								</select>
							</td>
						</tr>
						<tr>
							<th>포인트변경사유<em class="required" title="필수"></em></th>
							<td>
								<select name="occurGb" data-valid-name="포인트변경사유" required="required">
									<option value="">선택하세요</option>
									<option th:if="${occurGbList}" th:each="oneData, status : ${occurGbList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] '+ oneData.cdNm}"></option>
								</select>
							</td>
						</tr>
						<tr>
							<th>증감구분<em class="required" title="필수"></em></th>
							<td>
								<select id="signGb" name="signGb" data-valid-name="증감구분" required="required">
									<option value="">선택하세요</option>
									<option value="+">증가</option>
									<option value="-">감소</option>
								</select>
							</td>
						</tr>
						<tr id="expire">
							<th >만료일자</th>
							<td>
								<input type="text" name="expBeDt" th:value="${expBeDt}" class="schDate w100"/>
							</td>
						</tr>
						<tr>
							<th>적립포인트</th>
							<td>
								<input type="text" name="pntAmt" min="1" data-valid-name="적립포인트" data-valid-type="integer" maxlength="6" required="required"/>
							</td>
						</tr>
						<tr>
							<th>상세사유</th>
							<td colspan="3">
								<textarea name="occurDtlDesc" class="textareaR4" style="resize: none;" data-valid-name="상세사유" required="required"></textarea>
							</td>
						</tr>
						</tbody>
					</table>
				</form>
			</div>
			<ul class="panelBar">
				<li class="right">
					<button type="button" id="btnSavePoint" class="btn btn-success btn-lg">포인트부여</button>
				</li>
			</ul>
		</div>
		<!-- //CONTENT -->
	</div>
</div>
<script th:inline="javascript">
	/*<![CDATA[*/
	const END_TIME = '23:59:59';
	const elementCustNo = [[${elementCustNo}]];
	const pntAssignAmt = [[${pntAssignAmt}]];

	$('#signGb').on('change',function () {
		let signGb = $(this).val();
		if (signGb === '+') {
			$('#expire').show();
		} else {
			$('#expire').hide();
		}
	});

	// 포인트 부여
	$('#btnSavePoint').on('click', function () {
		if(!gagajf.validation('#pointGrantForm'))
			return;

		gagajf.removeCommaAtNumberFormattedInput('#pointGrantForm');
		let grantPoint = $("#pointGrantForm").serializeObject();

		if (gagajf.isNull(grantPoint.custNo)) {
			mcxDialog.alert("회원 아이디가 존재하지 않습니다. 관리자에게 문의바랍니다.");
			return;
		}

		if (grantPoint.signGb === '+') {
			if (pntAssignAmt === 0) {
				mcxDialog.alert("지급가능한 포인트가 없습니다.");
				return;
			} else if (grantPoint.pntAmt > pntAssignAmt) {
				mcxDialog.alert("지급가능한 포인트를 초과하였습니다.");
				return;
			}
			let today = new Date().format("YYYY-MM-DD");
			if (grantPoint.expBeDt < today) {
				mcxDialog.alert("만료일자는 오늘일자 보다 크거나 같아야 합니다.");
				return;
			}
		}

		// (+ + 1) -> 1, (- + 1) -> -1
		let pntAmt = grantPoint.pntAmt * (grantPoint.signGb + 1)
		grantPoint.pntAmt = pntAmt;
		grantPoint.expBeDt = grantPoint.expBeDt+' '+END_TIME;

		mcxDialog.confirm("포인트를 부여하시겠습니까?", {
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function() {
				let jsonData = JSON.stringify(grantPoint);
				//console.log('jsonData', jsonData);
				gagajf.ajaxJsonSubmit('/marketing/point/save',jsonData , fnSavePointCallBack);
			}
		});
	});

	var fnSavePointCallBack = function () {
		uifnPopupClose('popupPointGrantForm');
		fnSearchPoint();
	};

	var fnInitDataSet = function () {
		let custNo = $(elementCustNo).val();
		if(!gagajf.isNull(custNo)) {
			$('#pointGrantForm input[name=custNo]').val(custNo);
		}
	};

	$(document).ready(function() {
		fnInitDataSet();
	});
	/*]]>*/
</script>
</html>
