<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : CouponPopupForm.html
 * @desc    : 쿠폰 등록 팝업 화면
 *============================================================================
 * ISTYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2020.12.23   xyzp1539       최초 작성
 *******************************************************************************
 -->
 
<!-- 즉시할인쿠폰 -->
<table class="frmStyle G230_10">
	<colgroup>
		<col style="width:165px;">
		<col style="width:45%;">
		<col style="width:165px;">
		<col>
	</colgroup>
	<tbody>
		<tr>
			<th>쿠폰명<em class="required" title="필수"></em></th>
			<td>
				<input type="text" name="cpnNm" required="required" data-valid-name="쿠폰명">
			</td>
			<th>사이트<em class="required" title="필수"></em></th>
			<td>
				<select name="siteCd" required="required" data-valid-name="사이트">
					<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>쿠폰설명</th>
			<td colspan="3">
				<input type="text" name="cpnDesc" data-valid-name="쿠폰설명">
			</td>
		</tr>
		<tr>
			<th>할인방식<em class="required" title="필수"></em></th>
			<td>
				<input type="hidden" name="dcWay" required="required" data-valid-name="할인방식">
				<label class="rdoBtn" th:if="${dcWayList}" th:each="oneData, status : ${dcWayList}"> 
					<input type="radio" name="rdoDcWay"  th:text="${oneData.cdNm}" th:value="${oneData.cd}"/>
				</label>
			</td>
			<th>할인값(PC)<em class="required" title="필수"></em></th>
			<td>
				<input type="text" class="w200" name="dcPval" value="0" required="required" data-valid-name="할인값(PC)" style="text-align: right" onkeyup="fnDcValOnkeyUp(this);inputNumberFormat(this);"><span class="dcPvalSpan">원</span>
				<button type="button" class="btn btn-default btn-lg" id="applySameValueBtn">동일적용</button>
			</td>
		</tr>
		<tr>
			<th>할인값(모바일웹)<em class="required" title="필수"></em></th>
			<td>
				<input type="text" class="w200" name="dcMval" value="0" required="required" data-valid-name="할인값(모바일웹)" style="text-align: right" onkeyup="fnDcValOnkeyUp(this);inputNumberFormat(this);"><span class="dcMvalSpan">원</span>
			</td>
			<th>할인값(모바일앱)<em class="required" title="필수"></em></th>
			<td>
				<input type="text" class="w200" name="dcAval" value="0" required="required" data-valid-name="할인값(모바일앱)" style="text-align: right" onkeyup="fnDcValOnkeyUp(this);inputNumberFormat(this);"><span class="dcAvalSpan">원</span>
			</td>
		</tr>
		<tr>
			<th>최대할인금액<em class="required" title="필수"></em></th>
			<td colspan="3">
				<input type="text" class="w200" name="maxDcAmt" value="0" required="required" data-valid-name="최대할인금액" style="text-align: right;" onkeyup="inputNumberFormat(this);" th:value="${cpnDetail.maxDcAmt}">
				<span class="maxDcAmtSpan">원</span>
			</td>
		</tr>
		<tr>
			<th class="availDateTr">유효기간시작일시<em class="required" title="필수"></em></th>
			<td class="availDateTr">
				<input type="hidden" name="availStdt" id="availStdt" data-valid-name="유효기간시작일시">
				<input type="text" class="schDate w100" name="availStDay" id="availStDay" maxlength="10" th:value="${#calendars.format(#calendars.createNow(), 'yyyy-MM-dd')}"/>
				<select name="availStHH" id="availStHH">
					<option th:if="${hhList}" th:each="oneData , status : ${hhList}" th:text="${oneData.cdNm}" th:value="${oneData.cd}"></option>
				</select>
				<select name="availStMM">
					<option th:if="${mmList}" th:each="oneData , status : ${mmList}" th:text="${oneData.cdNm}" th:value="${oneData.cd}"></option>
				</select>
			<th class="availDateTr">유효기간종료일시<em class="required" title="필수"></em></th>
			<td class="availDateTr">
				<input type="hidden" name="availEddt" id="availEddt" data-valid-name="유효기간종료일시">
				<input type="text" class="schDate w100" name="availEdDay" id="availEdDay" maxlength="10" th:value="${#calendars.format(#calendars.createNow(), 'yyyy-MM-dd')}"/>
				<select name="availEdHH" onclick="fnChangeEdHH(this);">
					<option th:if="${hhList}" th:each="oneData , status : ${hhList}" th:text="${oneData.cdNm}" th:value="${oneData.cd}"></option>
					<option th:text="24시" th:value="24" selected></option>
				</select>
				<select name="availEdMM">
					<option th:if="${mmList}" th:each="oneData , status : ${mmList}" th:text="${oneData.cdNm}" th:value="${oneData.cd}"></option>
				</select>
			</td>
		</tr>
	</tbody>
</table>
<!-- //즉시할인쿠폰 -->

<script th:inline="javascript">
var cpnDetail 				= [[${cpnDetail}]];

// 할인방식 할인율 일때, 할인값 체크
var fnDcValOnkeyUp = function (obj){
	var inputName 	= $(obj).attr("name");
	var rdoDcWay 	= $('#CouponForm input:radio[name="rdoDcWay"]:checked').val();
	var dcVal 		= $("#CouponForm input[name="+inputName+"]").val();
	if (rdoDcWay == "G240_11") {
		if(dcVal > 100){
			mcxDialog.alert('할인율은 100을 넘을수 없습니다.');
			$("#CouponForm input[name="+inputName+"]").val('');
			$("#CouponForm input[name="+inputName+"]").focus();
			return;
		}
	}
}

// 종료시간 클릭시
var fnChangeEdHH = function (obj){
	var selectId = $(obj).attr("name");
	var changeId = "";
	
	if (selectId == "downEdHH") {
		changeId = "downEdMM";
	} else if(selectId == "availEdHH") {
		changeId = "availEdMM";
	} else if(selectId == "buyEdHH") {
		changeId = "buyEdMM";
	} else {
		changeId = "custJoinEdMM";
	}
	
	if (obj.value == 24) {
		$("#CouponForm select[name="+changeId+"] option").hide();
		$("#CouponForm select[name="+changeId+"] option:first").show().prop("selected", true);
	} else {
		$("#CouponForm select[name="+changeId+"] option").show();
	}
};

//2021.08.17 초기화설정 변경
$(document).ready(function() {
	if (cpnDetail != null && cpnDetail.cpnId != null) {
		
		// 기본정보 세팅
		$("#CouponForm input[name=cpnNm]").val(cpnDetail.cpnNm);
		$("#CouponForm input[name=cpnDesc]").val(cpnDetail.cpnDesc);
		$("#CouponForm input:radio[name='rdoDcWay']:radio[value=" + cpnDetail.dcWay + "]").prop('checked', true);
		$("#CouponForm input:radio[name='rdoApplyScope']:radio[value=" + cpnDetail.applyScope + "]").prop('checked', true);
		$("#CouponForm input[name=dcPval]").val(cpnDetail.dcPval.addComma());
		$("#CouponForm input[name=dcMval]").val(cpnDetail.dcMval.addComma());
		$("#CouponForm input[name=dcAval]").val(cpnDetail.dcAval.addComma());
		$("#CouponForm input[name=maxDcAmt]").val(cpnDetail.maxDcAmt.addComma());
		
		// 금액할인
		if (cpnDetail.dcWay == 'G240_10') {
			strAmtType = "원";
			$("#CouponForm input[name=maxDcAmt]").attr("disabled", true);
		}
		// 율할인
		else {
			strAmtType = "%";
			$("#CouponForm input[name=maxDcAmt]").attr("disabled", false);
		}
		
		$('.dcPvalSpan').text(strAmtType);
		$('.dcMvalSpan').text(strAmtType);
		$('.dcAvalSpan').text(strAmtType);
		
		$("#CouponForm #siteCd").val(cpnDetail.siteCd).prop("selected", true);
		
		// 유효기간이 날짜인경우 날짜 세팅
		if (cpnDetail.pdGb == "P") {
			splitDate("start"	, cpnDetail.availStdt, "avail");
			splitDate("end"		, cpnDetail.availEddt, "avail");
			
			issueCnt = 0;
			if (issueCnt > 0) {
				$("#CouponForm #availStDay").attr('readonly', true);
				$("#CouponForm #availStDay").attr('disabled', true);
				$("#CouponForm #availStHH").attr('readonly', true);
				$("#CouponForm #availStHH").attr('disabled', true);
				$("#CouponForm #availStMM").attr('readonly', true);
				$("#CouponForm #availStMM").attr('disabled', true);
				$("#CouponForm #availEdDay").attr('readonly', true);
				$("#CouponForm #availEdDay").attr('disabled', true);
				$("#CouponForm #availEdHH").attr('readonly', true);
				$("#CouponForm #availEdHH").attr('disabled', true);
				$("#CouponForm #availEdMM").attr('readonly', true);
				$("#CouponForm #availEdMM").attr('disabled', true);
			}
		} else {
			$("#CouponForm #availDays").val(cpnDetail.availDays);
			$('#CouponForm #availEdHH option:last').attr("selected", "selected");
			$('#CouponForm #availEdMM option:last').attr("selected", "selected");

		}
		
		// 비활성화처리 대기상태가아닐때 동작
		if (cpnDetail.cpnStat != 'G232_10' || issueCnt > 0) {
			$("#CouponForm input[name=cpnNm]").attr("disabled", true);
			$("#CouponForm input[name=cpnDesc]").attr("disabled", true);
			$("#CouponForm input:radio[name='rdoDcWay']").attr("disabled", true);
			$("#CouponForm input:radio[name='rdoApplyScope']").attr("disabled", true);
			$("#CouponForm input[name=dcPval]").attr("disabled", true);
			$("#CouponForm input[name=dcMval]").attr("disabled", true);
			$("#CouponForm input[name=dcAval]").attr("disabled", true);
			$("#CouponForm input[name=maxDcAmt]").attr("disabled", true);

			$("#CouponForm select[name=siteCd]").attr("disabled", true);
			
			$("#CouponForm input[name=availStDay]").attr('readonly', true);
			$("#CouponForm input[name=availStDay]").attr('disabled', true);
			$("#CouponForm select[name=availStHH]").attr('readonly', true);
			$("#CouponForm select[name=availStHH]").attr('disabled', true);
			$("#CouponForm select[name=availStMM]").attr('readonly', true);
			$("#CouponForm select[name=availStMM]").attr('disabled', true);
			$("#CouponForm input[name=availEdDay]").attr('readonly', true);
			$("#CouponForm input[name=availEdDay]").attr('disabled', true);
			$("#CouponForm select[name=availEdHH]").attr('readonly', true);
			$("#CouponForm select[name=availEdHH]").attr('disabled', true);
			$("#CouponForm select[name=availEdMM]").attr('readonly', true);
			$("#CouponForm select[name=availEdMM]").attr('disabled', true);
		}
	}
});
</script>
</html>