<!-- 환불계좌 등록 팝업 -->
<div class="modal-header">
	<h5 class="modal-title" id="refundLabel">환불계좌등록</h5>
</div>
<div class="modal-body">
	<div class="pop_cont">
		<form class="form_wrap" id="refundAccountForm">
			<input type="hidden" name="confirmedAccountNo"/>
			<input type="hidden" name="confirmedAccountNm"/>
			<input type="hidden" name="confirmedBankCd"/>
			<table>
				<colgroup>
					<col width="90">
					<col width="380">
				</colgroup>
				<tbody>
					<tr>
						<th>
							<span>예금주</span>
						</th>
						<td>
							<div class="form_field">
								<div class="input_wrap">
									<input type="text" class="form_control" name="accountNm" th:value="${accountNm}" disabled="">
								</div>
							</div>
							<div class="txt_info">
								<ul>
									<li>
										회원명 본인이 예금주인 통장으로만 환불이 가능합니다.
									</li>
								</ul>
							</div>
						</td>
					</tr>
					<tr>
						<th>
							<span>은행명</span>
						</th>
						<td>
							<div class="form_field">
								<div class="select_custom select_bank">
									<div class="combo">
										<div class="select">은행명</div>
										<ul class="list">
											<li id="bankCd_" class="selected">
												<div text="선택"></div>
												<input type="hidden" name="bankCd" value=""/>
											</li>
											<th:block th:if="${bankList}" th:each="oneData, status : ${bankList}">
												<li th:id="|bankCd_${oneData.cd}|">
													<div th:text="${oneData.cdNm}"></div>
													<input type="hidden" name="bankCd" th:value="${oneData.cd}"/>
												</li>
											</th:block>
										</ul>
									</div>
								</div>
							</div>
						</td>
					</tr>
					<tr>
						<th>
							<span>계좌번호</span>
						</th>
						<td>
							<div class="form_field">
								<div class="input_wrap">
									<input type="text" id="accountNo" name="accountNo" class="form_control" maxlength="20" data-valid-type="numeric"  placeholder="계좌번호를 입력해 주세요"/>
									<button type="button" id="btnAccountCheck" class="btn btn_dark btn_sm">
										<span>계좌인증</span>
									</button>
								</div>
							</div>
						</td>
					</tr>
				</tbody>
			</table>
		</form>
	</div>
</div>
<div class="modal-footer">
	<button type="button" id="registerAccount" class="btn btn_dark"><span>계좌등록 후 환불신청</span></button>
</div>

<script th:inline="javascript">
	let ordNo = [[${ordNo}]];
	let isValid = false;

	$(document).ready( function() {
		var bank_selector = new sCombo('.select_custom.select_bank');
	});

	// 계좌인증 버튼 클릭 이벤트
	$('#btnAccountCheck').click(function() {
		// 승인된 계좌 정보
		let confirmedAccountNm = $('#refundAccountForm input[name=confirmedAccountNm]').val();
		let confirmedAccountNo = $('#refundAccountForm input[name=confirmedAccountNo]').val();
		let confirmedBankCd = $('#refundAccountForm input[name=confirmedBankCd]').val();

		// 계좌정보
		let accountNm = $('#refundAccountForm input[name=accountNm]').val();
		let accountNo = $('#refundAccountForm input[name=accountNo]').val();
		let bankCd = $('#refundAccountForm input[name=bankCd]').val();

		if (accountNm != confirmedAccountNm || accountNo != confirmedAccountNo || bankCd != confirmedBankCd) {
			isValid = false;
		}

		if (!isValid) {
			let url = '/mypage/account/check';

			let data = {};
			data.accountNm = accountNm;
			data.accountNo = accountNo;
			data.bankCd = bankCd;
			data.ordNo = ordNo;
			
			let jsonData = JSON.stringify(data);
			
			gagajf.ajaxJsonSubmit(url, jsonData, function (result) {
				isValid = result.isValid;
				if (isValid) {
					mcxDialog.alert('계좌인증에 성공했습니다.');

					// 계좌인증 성공 시 Disabled 처리
					//$('#refundAccountForm .select_custom.select_bank').attr('disabled', true);
					//$('#refundAccountForm input[name=accountNo]').attr('disabled', true);

					// 인증된 계좌 정보 설정
					$('#refundAccountForm input[name=confirmedAccountNo]').val(accountNo);
					$('#refundAccountForm input[name=confirmedAccountNm]').val(accountNm);
					$('#refundAccountForm input[name=confirmedBankCd]').val(bankCd);
				} else {
					mcxDialog.alert('계좌정보를 다시 확인해주세요.');
				}
			});
		}
	});

	// 계좌등록 후 환불신청 버튼 클릭 이벤트
	$('#registerAccount').click(function() {
		if (isValid) {
			// 승인된 계좌 정보
			let confirmedAccountNm = $('#refundAccountForm input[name=confirmedAccountNm]').val();
			let confirmedAccountNo = $('#refundAccountForm input[name=confirmedAccountNo]').val();
			let confirmedBankCd = $('#refundAccountForm input[name=confirmedBankCd]').val();

			// 계좌정보
			let accountNm = $('#refundAccountForm input[name=accountNm]').val();
			let accountNo = $('#refundAccountForm input[name=accountNo]').val();
			let bankCd = $('#refundAccountForm input[name=bankCd]').val();

			if (accountNm == confirmedAccountNm && accountNo == confirmedAccountNo && bankCd == confirmedBankCd) {
				let data = {};
				data.accountNm = accountNm;
				data.accountNo = accountNo;
				data.bankCd = bankCd;

				// 부모창으로 정보 전달
				fnRegisterAccountCallback(data);

				// 팝업 닫기
				$(".close-modal").trigger("click");
			} else {
				mcxDialog.alert('인증받은 계좌정보와 다릅니다.');
			}
		} else {
			mcxDialog.alert('계좌인증이 필요합니다.');
		}
	});
</script>
