<%@ 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="card">
	<div class="wrapper-list">
		<div>
			<!-- 입력 영역 -->
			<form id="frmEdit--${pageName}" name="frmEdit">
				<!-- hidden -->
				<input type="hidden" id="crdnId--${pageName}" name="crdnId" data-map="CRDN_ID" />
				<input type="hidden" id="sggCd--${pageName}" name="sggCd" data-map="SGG_CD" />
				<input type="hidden" id="taskSeCd--${pageName}" name="taskSeCd" data-map="TASK_SE_CD" />

				<div class="row g-1">
					<!-- 차량번호 -->
					<div class="col-md-3">
						<label for="vhrno--${pageName}" class="w-px-100 bg-lighter pe-2 col-form-label text-sm-end">차량번호</label>
						<input type="text" class="form-control w-35" id="vhrno--${pageName}" name="vhrno" data-map="VHRNO" readonly />
					</div>
					<!-- 위반일시 -->
					<div class="col-md-3">
						<label for="crdnYmdTm--${pageName}" class="w-px-100 bg-lighter pe-2 col-form-label text-sm-end">위반일시</label>
						<input type="text" class="form-control w-45" id="crdnYmdTm--${pageName}" name="crdnYmdTm" data-map="CRDN_YMD_TM" readonly />
					</div>
					<!-- 단속상태 -->
					<div class="col-md-4">
						<label for="crdnSttsNm--${pageName}" class="w-px-100 bg-lighter pe-2 col-form-label text-sm-end">단속상태</label>
						<input type="text" class="form-control w-35" id="crdnSttsChgDt--${pageName}" name="crdnSttsChgDt" data-map="CRDN_STTS_CHG_DT" readonly />
						<input type="text" class="form-control w-30 fw-bolder text-primary" id="crdnSttsNm--${pageName}" name="crdnSttsNm" data-map="CRDN_STTS_NM" readonly />
					</div>
					<!-- 자료 이동 버튼 -->
					<div class="col-md-2 text-end">
						<input type="text" id="countStauts--${pageName}" class="form-control w-px-120 text-center fw-bold" readonly />
						<button type="button" id="btnPrev--${pageName}" class="w-px-50 btn-PageUp" onClick="fnPrev${pageName}();">◀</button>
						<button type="button" id="btnNext--${pageName}" class="w-px-50 btn-PageDown" onClick="fnNext${pageName}();">▶</button>
					</div>
				</div> <!-- <div class="row g-1"> -->
			</form>	<!-- /입력 영역 -->
		</div>

		<p></p>

		<div class="nav-align-top">
			<ul class="nav nav-tabs" role="tablist">
				<li class="nav-item">
					<button type="button" class="nav-link active" role="tab" data-bs-toggle="tab" data-bs-target="#crdnPayerInfo"
							aria-controls="crdnPayerInfo" aria-selected="true" onClick="fnCrdnPayerInfo${pageName}();">
						단속 정보
					</button>
				</li>
				<li class="nav-item">
					<button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#opnnSbmsnInfo"
							aria-controls="opnnSbmsnInfo" aria-selected="false" onClick="fnOpnnSbmsnInfo${pageName}();">
						의견제출 정보
					</button>
				</li>
				<li class="nav-item">
					<button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#sndngInfo"
							aria-controls="sndngInfo" aria-selected="false" onClick="fnSndngInfo${pageName}();">
						발송반송 정보
					</button>
				</li>
				<li class="nav-item">
					<button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#prcsDtlInfo"
							aria-controls="prcsDtlInfo" aria-selected="false" onClick="fnPrcsDtlInfo${pageName}();">
						처리상세 정보
					</button>
				</li>
				<li class="nav-item">
					<button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#levyNpmntInfo"
							aria-controls="levyNpmntInfo" aria-selected="false" onClick="fnLevyNpmntInfo${pageName}();">
						부과체납 정보
					</button>
				</li>
				<li class="nav-item">
					<button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#rcvmtInfo"
							aria-controls="rcvmtInfo" aria-selected="false" onClick="fnRcvmtInfo${pageName}();">
						수납 정보
					</button>
				</li>
				<li class="nav-item">
					<button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#cvlcptDscsnInfo"
							aria-controls="cvlcptDscsnCnInfo" aria-selected="false" onClick="fnCvlcptDscsnInfo${pageName}();">
						민원상담 정보
					</button>
				</li>
			</ul>

			<div class="tab-content">
				<div class="tab-pane fade show active" id="crdnPayerInfo" role="tabpanel"></div>
				<div class="tab-pane fade" id="opnnSbmsnInfo" role="tabpanel">단속 정보</div>
				<div class="tab-pane fade" id="sndngInfo" role="tabpanel">의견제출 정보</div>
				<div class="tab-pane fade" id="prcsDtlInfo" role="tabpanel">발송반송 정보</div>
				<div class="tab-pane fade" id="levyNpmntInfo" role="tabpanel">부과체납 정보</div>
				<div class="tab-pane fade" id="rcvmtInfo" role="tabpanel">수납 정보</div>
				<div class="tab-pane fade" id="cvlcptDscsnInfo" role="tabpanel">민원상담 정보</div>
			</div>
		</div>
	</div> <!-- <div class="wrapper-list"> -->
</div> <!-- <div class="card"> -->

<script>
	/**************************************************************************
	 * Global Variable
	 **************************************************************************/
	// URL
	var ${pageName}PrefixUrl = "/sprt/sprt02";
	// FormFields
 	var ${pageName}Fields = new FormFields("#frmEdit--${pageName}");
 	// 자료 이동을 위한 자료의 Index. 0부터 시작.
 	var curDataIndex;

	/**************************************************************************
	 * DatasetControl
	 **************************************************************************/
	var ${pageName}Control = new DatasetControl({
		  prefix : "totalInfoMain"
		, prefixName : "개별총정보"
		, keymapper : info => info ? info.CRDN_ID : ""
		, dataGetter : obj => obj.totalInfo
		, formats : {
			  CRDN_YMD_TM : datetimeFormat
			, CRDN_STTS_CHG_DT : datetimeFormat
		}
	});

	${pageName}Control.onCurrentChange = item => {
		// Dataset 셋팅
		${pageName}Fields.set(item);

		// 건수 표기
		fnChangeCountStauts${pageName}();
	}

	/**************************************************************************
	 *
	 **************************************************************************/
	// 자료 재조회
	refreshDataInfo${pageName} = (params) => {
		ajax.get({
			  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/010/main.do")
			, headers: { Accept: "application/json; charset=utf-8" }			// json
			, data : params || {}
			, success : resp => {
				if (resp.totalInfo) {
					// 최상단 단속 Data 셋팅
					${pageName}Control.setData([resp.totalInfo]);

					// 단속 납부자 Data 셋팅
					fnCrdnPayerInfo${pageName}();
				}
			}
		});
	}

	/**************************************************************************
	 * 초기 셋팅
	 **************************************************************************/
	// 화면 초기값 셋팅
	initForm${pageName} = () => {
		curDataIndex = null;					// 화면이 열릴때 초기 값으로 null로 설정해야 건수가 정상 표시 된다.
	}

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

	}

	/**************************************************************************
	 * 네이게이션 Event
	 **************************************************************************/
	// 건수 표기
	fnChangeCountStauts${pageName} = () => {
		// curDataIndex 에 값이 없다면..
		if (curDataIndex == null) {
			let mainDataItems = ${callControlName}.dataset._items;
			let curCrdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

			for (iLoop = 0; iLoop < mainDataItems.length; iLoop++) {
			    if (mainDataItems[iLoop].data.CRDN_ID == curCrdnId) {
			    	curDataIndex = iLoop;
			    	break;
			    }
			}
		}

		let viewNumber = curDataIndex + 1;

	   	$("#countStauts--${pageName}").val(viewNumber + " of " + ${callControlName}.dataset._items.length);
	}

	// 이전 자료 조회
	fnPrev${pageName} = () => {
		let mainDataItems = ${callControlName}.dataset._items;
		let curCrdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

		// 초기 값은 callControl dataset 의 총 건수 - 1
		if (curDataIndex == null) {
			curDataIndex = mainDataItems.length - 1;
		}

		for (iLoop = curDataIndex; iLoop >= 0; iLoop--) {
		    if (mainDataItems[iLoop].data.CRDN_ID == curCrdnId) {
				if (iLoop - 1 < 0) { return; }									// 종료

				curDataIndex = iLoop - 1;
		    	break;
		    }
		}

		let crdnId = mainDataItems[curDataIndex].data.CRDN_ID;

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, callControlName : "${callControlName}"
			, crdnId : crdnId
			, sggCd : mainDataItems[curDataIndex].data.SGG_CD
			, taskSeCd : mainDataItems[curDataIndex].data.TASK_SE_CD
			, delYn : "N"
		};

		refreshDataInfo${pageName}(params);
	}

	// 다음 자료 조회
	fnNext${pageName} = () => {
		let mainDataItems = ${callControlName}.dataset._items;
		let curCrdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

		// 초기 값은 0
		if (curDataIndex == null) {
			curDataIndex = 0;
		}

		for (iLoop = curDataIndex; iLoop < mainDataItems.length; iLoop++) {
		    if (mainDataItems[iLoop].data.CRDN_ID == curCrdnId) {
				if (iLoop + 1 >= mainDataItems.length) { return; }				// 종료

		    	curDataIndex = iLoop + 1;
		    	break;
		    }
		}

		let crdnId = mainDataItems[curDataIndex].data.CRDN_ID;

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, callControlName : "${callControlName}"
			, crdnId : crdnId
			, sggCd : mainDataItems[curDataIndex].data.SGG_CD
			, taskSeCd : mainDataItems[curDataIndex].data.TASK_SE_CD
			, delYn : "N"
		};

		refreshDataInfo${pageName}(params);
	}

	/**************************************************************************
	 * 탭 clickEvent
	 **************************************************************************/
	// 단속 정보
	fnCrdnPayerInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
		let sggCd = ${pageName}Control.dataset.getValue("SGG_CD");
		let taskSeCd = ${pageName}Control.dataset.getValue("TASK_SE_CD");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, crdnId : crdnId
			, sggCd : sggCd
			, taskSeCd : taskSeCd
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/020/info.do")
			, data : params || {}
			, success : resp => {
				$("#crdnPayerInfo").html(resp);
			}
		});
	}

	// 의견제출 정보
	fnOpnnSbmsnInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
		let sggCd = ${pageName}Control.dataset.getValue("SGG_CD");
		let taskSeCd = ${pageName}Control.dataset.getValue("TASK_SE_CD");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, crdnId : crdnId
			, sggCd : sggCd
			, taskSeCd : taskSeCd
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/030/info.do")
			, data : params || {}
			, success : resp => {
				$("#opnnSbmsnInfo").html(resp);
			}
		});
	}

	// 발송 반송 정보
	fnSndngInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, crdnId : crdnId
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/040/info.do")
			, data : params || {}
			, success : resp => {
				$("#sndngInfo").html(resp);
			}
		});
	}

	// 처리 상세 정보
	fnPrcsDtlInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, crdnId : crdnId
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/050/info.do")
			, data : params || {}
			, success : resp => {
				$("#prcsDtlInfo").html(resp);
			}
		});
	}

	// 부과체납 정보
	fnLevyNpmntInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, crdnId : crdnId
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/060/info.do")
			, data : params || {}
			, success : resp => {
				$("#levyNpmntInfo").html(resp);
			}
		});
	}

	// 수납 정보
	fnRcvmtInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, crdnId : crdnId
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/070/info.do")
			, data : params || {}
			, success : resp => {
				$("#rcvmtInfo").html(resp);
			}
		});
	}

	// 민원상담 정보
	fnCvlcptDscsnInfo${pageName} = () => {
		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
		let vhrno = ${pageName}Control.dataset.getValue("VHRNO");

		// 단속 ID 가 없다면.. return
		if (crdnId == null || crdnId == "") {
			return;
		}

		let params = {
			  callPurpose : "view"
			, inquiryCondition : "crdnId_vhrno"
			, crdnId : crdnId
			, vhrno : vhrno
			, delYn : "N"
		};

		ajax.get({
			  url : wctx.url("/sprt/sprt02/080/info.do")
			, data : params || {}
			, success : resp => {
				$("#cvlcptDscsnInfo").html(resp);
			}
		});
	}

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

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

		// Dataset 셋팅
		${pageName}Control.setData([${totalInfo}]);

		// 단속, 납부자 정보
		fnCrdnPayerInfo${pageName}();
	});

// #sourceURL=sprt02010-main.jsp
</script>
