<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>

<!-- Page Body -->
<div class="content-wrapper">
	<div class="d-flex flex-row justify-content-evenly">
		<!-- 수납 정보 -->
		<div class="col-xl-12 mx-1">
			<div class="card">
				<!-- 업무 버튼 -->
				<div class="container-page-btn">
					<label class="w-px-120 bg-label-danger pe-2 col-form-label text-sm-center">수납 정보</label>
					<!-- 버튼 우측 정렬 -->
					<span class="container-window-btn-right">
						<button type="button" class="btn btn-primary" id="btnCreateRcvmt--${pageName}" title="수기 수납 등록" onclick="fnCreateRcvmt${pageName}();">
							수기 수납 등록
						</button>
						<button type="button" class="btn btn-primary" id="btnRemoveRcvmt--${pageName}" title="수기 수납 삭제" onclick="fnRemoveRcvmt${pageName}();">
							수기 수납 삭제
						</button>
					</span>
				</div> <!-- <div class="container-page-btn"> -->

				<!-- 입력 영역 -->
				<form id="frmEdit--${pageName}" name="frmEdit">
					<!-- hidden -->
					<input type="hidden" id="rcvmtId--${pageName}" name="rcvmtId" data-map="RCVMT_ID" />
					<input type="hidden" id="levyId--${pageName}" name="levyId" data-map="LEVY_ID" />

					<div class="row g-1">
						<!-- 회계 연도 -->
						<div class="col-md-3">
							<label for="acntgYr--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">회계 연도</label>
							<input type="text" class="form-control w-15" id="acntgYr--${pageName}" name="acntgYr" data-map="ACNTG_YR" readonly />
						</div>
						<!-- 회계 구분 -->
						<div class="col-md-3">
							<label for="acntgSe--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">회계 구분</label>
							<input type="text" class="form-control w-15" id="acntgSe--${pageName}" name="acntgSe" data-map="ACNTG_SE" readonly />
						</div>
						<!-- 세목 코드 -->
						<div class="col-md-3">
							<label for="txitmCd--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">세목 코드</label>
							<input type="text" class="form-control w-30" id="txitmCd--${pageName}" name="txitmCd" data-map="TXITM_CD" readonly />
						</div>
						<!-- 부과 번호 -->
						<div class="col-md-3">
							<label for="levyNo--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">부과 번호</label>
							<input type="text" class="form-control w-20" id="levyNo--${pageName}" name="levyNo" data-map="LEVY_NO" readonly />
							<input type="text" class="form-control w-10" id="inspySn--${pageName}" name="inspySn" data-map="INSPY_SN" readonly />
						</div>
						<!-- 수납 순번 -->
						<div class="col-md-3">
							<label for="rcvmtSn--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 순번</label>
							<input type="text" class="form-control w-15" id="rcvmtSn--${pageName}" name="rcvmtSn" data-map="RCVMT_SN" readonly />
						</div>
						<!-- 수납 일자 -->
						<div class="col-md-3">
							<label for="rcvmtYmd--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 일자</label>
							<input type="text" class="form-control w-30" id="rcvmtYmd--${pageName}" name="rcvmtYmd" data-map="RCVMT_YMD" readonly />
						</div>
						<!-- 소인 일자 -->
						<div class="col-md-3">
							<label for="pstmrkYmd--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">소인 일자</label>
							<input type="text" class="form-control w-30" id="pstmrkYmd--${pageName}" name="pstmrkYmd" data-map="PSTMRK_YMD" readonly />
						</div>
						<!-- 회계 일자 -->
						<div class="col-md-3">
							<label for="acntgYmd--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">회계 일자</label>
							<input type="text" class="form-control w-30" id="acntgYmd--${pageName}" name="acntgYmd" data-map="ACNTG_YMD" readonly />
						</div>
						<!-- 수납 구분 -->
						<div class="col-md-3">
							<label for="rcvmtSeNm--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 구분</label>
							<input type="text" class="form-control w-25" id="rcvmtSeNm--${pageName}" name="rcvmtSeNm" data-map="RCVMT_SE_NM" readonly />
						</div>
						<!-- 수납 본세 -->
						<div class="col-md-3">
							<label for="rcvmtPcptax--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 본세</label>
							<input type="text" class="form-control w-30 text-end" id="rcvmtPcptax--${pageName}" name="rcvmtPcptax" data-map="RCVMT_PCPTAX" readonly />
						</div>
						<!-- 수납 가산금 -->
						<div class="col-md-3">
							<label for="rcvmtAdamt--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 가산금</label>
							<input type="text" class="form-control w-30 text-end" id="rcvmtAdamt--${pageName}" name="rcvmtAdamt" data-map="RCVMT_ADAMT" readonly />
						</div>
						<!-- 수납 이자 -->
						<div class="col-md-3">
							<label for="rcvmtInt--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 이자</label>
							<input type="text" class="form-control w-30 text-end" id="rcvmtInt--${pageName}" name="rcvmtInt" data-map="RCVMT_INT" readonly />
						</div>
						<!-- 수납 은행 -->
						<div class="col-md-3">
							<label for="rcvmtBankNm--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">수납 은행</label>
							<input type="text" class="form-control w-50" id="rcvmtBankNm--${pageName}" name="rcvmtBankNm" data-map="RCVMT_BANK_NM" readonly />
						</div>
						<!-- 납부 방식 -->
						<div class="col-md-3">
							<label for="payMthdSeNm--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">납부 방식</label>
							<input type="text" class="form-control w-50" id="payMthdSeNm--${pageName}" name="payMthdSeNm" data-map="PAY_MTHD_SE_NM" readonly />
						</div>
						<!-- 등록 일시 -->
						<div class="col-md-3">
							<label for="regDt--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">등록 일시</label>
							<input type="text" class="form-control w-45" id="regDt--${pageName}" name="regDt" data-map="REG_DT" readonly />
						</div>
						<!-- 등록자 -->
						<div class="col-md-3">
							<label for="rgtrNm--${pageName}" class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">등록자</label>
							<input type="text" class="form-control w-30" id="rgtrNm--${pageName}" name="rgtrNm" data-map="RGTR_NM" readonly />
						</div>
					</div> <!-- <div class="row g-1"> -->
				</form>
			</div> <!-- <div class="card"> -->

			<p></p>

			<div class="card">
				<div class="row g-1">
					<!-- DataTables(그리드) -->
					<div class="card-datatable text-nowrap">
						<div id="DataTables_Table_0_wrapper--${pageName}" class="dataTables_wrapper dt-bootstrap5 no-footer">
							<div id="table-responsive--${pageName}" class="table-responsive" style="overflow-x:scroll; height:400px; overflow-y:scroll;" >
								<table class="dataTable datatables-ajax table table-bordered no-footer" id="DataTables_Table_0--${pageName}" aria-describedby="DataTables_Table_0_info">
									<thead>
										<tr id="theadTr--${pageName}">
											<th>수납일련번호</th>
											<th>수납취소</th>
											<th>회계연도</th>
											<th>회계구분</th>
											<th>세목코드</th>
											<th>부과번호</th>
											<th>분납일련번호</th>
											<th>수납일자</th>
											<th>수납본세</th>
											<th>수납가산금</th>
											<th>수납이자</th>
											<th>수납은행명</th>
											<th>납부방법구분</th>
											<th>소인일자</th>
											<th>회계일자</th>
											<th>가상계좌번호</th>
											<th>전자납부번호</th>
											<th>수납구분</th>
											<th>수납취소일시</th>
											<th>수납취소사유</th>
											<th>수납상태</th>
											<th>수납입력구분</th>
											<th>등록일시</th>
											<th>등록사용자</th>
										</tr>
									</thead>
									<tbody id="tbody--${pageName}">
									</tbody>
									<template id="${infoPrefix}Row--${pageName}">
										<tr data-key="{RCVMT_ID}">
											<td class="text-center" onclick="{onclick}">{RCVMT_SN}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_RTRCN_YN_NM}</td>
											<td class="text-center" onclick="{onclick}">{ACNTG_YR}</td>
											<td class="text-center" onclick="{onclick}">{ACNTG_SE}</td>
											<td class="text-center" onclick="{onclick}">{TXITM_CD}</td>
											<td class="text-center" onclick="{onclick}">{LEVY_NO}</td>
											<td class="text-center" onclick="{onclick}">{INSPY_SN}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_YMD}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_PCPTAX}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_ADAMT}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_INT}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_BANK_NM}</td>
											<td class="text-center" onclick="{onclick}">{PAY_MTHD_SE_NM}</td>
											<td class="text-center" onclick="{onclick}">{PSTMRK_YMD}</td>
											<td class="text-center" onclick="{onclick}">{ACNTG_YMD}</td>
											<td class="text-center" onclick="{onclick}">{VRACTNO}</td>
											<td class="text-center" onclick="{onclick}">{EPAYNO}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_SE_NM}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_RTRCN_DT}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_RTRCN_RSN}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_STTS_NM}</td>
											<td class="text-center" onclick="{onclick}">{RCVMT_INPT_SE_NM}</td>
											<td class="text-center" onclick="{onclick}">{REG_DT}</td>
											<td class="text-center" onclick="{onclick}">{RGTR_NM}</td>
										</tr>
									</template>
									<template id="${infoPrefix}NotFound--${pageName}">
										<tr class="odd">
											<td valign="top" colspan="24" class="dataTables_empty text-center">수납정보 이력 정보를 찾지 못했습니다.</td>
										</tr>
									</template>
								</table>
							</div>
						</div>
					</div> <!-- / DataTables(그리드) -->
				</div> <!-- <div class="row g-1"> -->
			</div> <!-- <div class="card"> -->
		</div> <!-- 수납 정보 <div class="col-xl-12 mx-1"> -->
	</div> <!-- <div class="d-flex flex-row justify-content-evenly"> -->
</div>

<script>
	/**************************************************************************
	 * Global Variable
	 **************************************************************************/
	// URL
	var ${pageName}PrefixUrl = "/sprt/sprt02";
	// FormFields
 	var ${pageName}Fields = new FormFields("#frmEdit--${pageName}");

	/**************************************************************************
	 * DatasetControl
	 **************************************************************************/
	var ${pageName}Control = new DatasetControl({
		  prefix : "rcvmt"
		, prefixName : "수납 정보"
		, keymapper : info => info ? info.RCVMT_ID : ""
		, dataGetter : obj => obj.rcvmt
		, formats : {
			  RCVMT_YMD : dateFormat
			, ACNTG_YMD : dateFormat
			, PSTMRK_YMD : dateFormat
			, RCVMT_PCPTAX : numberFormat
			, RCVMT_ADAMT : numberFormat
			, RCVMT_INT : numberFormat
			, REG_DT : datetimeFormat
		}
	});

	/**************************************************************************
	 * DatasetControl 이벤트
	 **************************************************************************/
	// Dataset 변경 이벤트
	${pageName}Control.onDatasetChange = obj => {
		renderList${pageName}();

		$("#paging--${pageName}").setPagingInfo({
			  list : ${pageName}Control.dataset
			, prefix : "paging--${pageName}"
			, start : obj.${infoPrefix}Start
			, totalSize : obj.${infoPrefix}Total
			, fetchSize : obj.${infoPrefix}Fetch
			, func : "${pageName}Control.load({index})"
		});
	};

	// 현재 선택 자료 변경 이벤트
	${pageName}Control.onCurrentChange = item => {
		if (!item) return;

		let key = item.data.RCVMT_ID;

		$("#tbody--${pageName}").setCurrentRow(key);		// datatable에 자료 셋팅

		${pageName}Fields.set(item);						// 화면에 자료 셋팅
	};

	/**************************************************************************
	 *
	 **************************************************************************/
	// DataTables에 click 이벤트
	renderList${pageName} = () => {
		let ${infoPrefix}List = ${pageName}Control.dataset;
		let empty = ${infoPrefix}List.empty;

		let trs = empty ?
			[document.getElementById("${infoPrefix}NotFound--${pageName}").innerHTML] : <%-- from template#${infoPrefix}NotFound --%>
			${infoPrefix}List.inStrings(
				document.getElementById("${infoPrefix}Row--${pageName}").innerHTML, <%-- from template#${infoPrefix}Row --%>
				(str, dataItem) => str
					.replace(/{onclick}/gi, "${pageName}Control.setCurrent('" + dataItem.getValue("RCVMT_ID") + "');")
			);

		$("#tbody--${pageName}").html(trs.join());
	}

	/**************************************************************************
	 * 초기 셋팅
	 **************************************************************************/
	// 검색조건 초기값 셋팅
	initForm${pageName} = () => {

	}

	// 이벤트 설정
	setEvent${pageName} = () => {

	}

	/**************************************************************************
	 * function
	 **************************************************************************/
	// 수기 수납 등록
	fnCreateRcvmt${pageName} = () => {
		alert("수기 수납 등록");
	}

	// 수기 수납 삭제
	fnRemoveRcvmt${pageName} = () => {
		alert("수기 수납 삭제");
	}

	/**************************************************************************
	 * script 진입
	 **************************************************************************/
	$(document).ready(function() {
		// 이벤트 설정
		setEvent${pageName}();

		// 화면 초기 설정
		initForm${pageName}();

		// Data 셋팅
		${pageName}Control.setData(${rcvmt});
	});

// #sourceURL=sprt02070-info.jsp
</script>
