개별총정보 수정.

- 단속정보에서 이미지(사진) 부분 수정.

src/main/webapp/WEB-INF/jsp/fims/excl/excl01010-main.jsp

@@ -743,9 +743,6 @@
 
 		// 업무 구분별 설정
 		setTask${pageName}(taskSeCd);
-
-		// URL 설정
-		setURL${pageName}(taskSeCd);
 	}
 
 	// 업무 구분별 설정
@@ -768,6 +765,9 @@
 
 		$("#theadTr--${pageName}").html(colsOuterHTML);
 		$("#DataTables_Table_0--${pageName}").find("th").resizable( {handles : "e"} );
+
+		// URL 설정
+		setURL${pageName}(taskSeCd);
 	}
 
 	// URL 설정

src/main/webapp/WEB-INF/jsp/fims/excl/excl03010-main.jsp

@@ -13,14 +13,14 @@
 				<div>
 					<!-- 상단 버튼 -->
 					<div class="container-page-btn">
-						<button type="button" class="btn btn-outline-dark w-px-120" id="btnReset--${pageName}" title="초기화" onclick="fnResetAndChangeBiz${pageName}();">
+						<button type="button" class="btn btn-outline-dark w-px-120" id="btnReset--${pageName}" title="초기화">
 							초기화
 						</button>
 						<span class="container-window-btn-right">
-							<button type="button" class="btn btn-search w-px-120" id="btnSearch--${pageName}" title="검색" onclick="fnSearchList${pageName}();">
+							<button type="button" class="btn btn-search w-px-120" id="btnSearch--${pageName}" title="검색">
 								검색
 							</button>
-							<button type="button" class="btn btn-excel w-px-120" id="btnExcel--${pageName}" title="엑셀" onclick="fnExcel${pageName}();">
+							<button type="button" class="btn btn-excel w-px-120" id="btnExcel--${pageName}" title="엑셀">
 								엑셀
 							</button>
 						</span>
@@ -124,7 +124,7 @@
 									</select>
 									<input type="hidden" id="schRgtrCd--${pageName}" name="schRgtrCd" />
 									<input type="text" class="form-control" id="schRgtrNm--${pageName}" name="schRgtrNm" />
-									<button type="button" class="btn btn-sm btn-outline-dark" id="btnFindUser--${pageName}" title="사용자 검색" onclick="fnFindUser${pageName}();">
+									<button type="button" class="btn btn-sm btn-outline-dark" id="btnFindUser--${pageName}" title="사용자 검색">
 										검색
 									</button>
 								</div>
@@ -145,7 +145,7 @@
 							</div>
 				            <span class="container-window-btn-right">
 								<!-- 업무 버튼 -->
-								<button type="button" class="btn btn-primary w-px-120" id="btnBfrCrdnTotalInfo--${pageName}" title="이전 단속 정보" onclick="fnBfrCrdnTotalInfo${pageName}();">
+								<button type="button" class="btn btn-primary w-px-120" id="btnBfrCrdnTotalInfo--${pageName}" title="이전 단속 정보">
 									이전 단속 정보
 								</button>
 				            </span>
@@ -250,8 +250,6 @@
 	</div>
 	<!-- / Content -->
 
-	
-
   	<div class="content-backdrop fade"></div>
 </div>
 <!-- / inner page html <div class="content-wrapper"> -->
@@ -260,18 +258,21 @@
 	/**************************************************************************
 	 * Global Variable
 	 **************************************************************************/
-	// URL
-	var ${pageName}PrefixUrl = "/excl/excl03";
+	pageObject["${pageName}"] = {};
+
+	$(document).ready(function() {
+		// pageObject
+		var $P = pageObject["${pageName}"];
+
 		// FormFields
- 	var ${pageName}Fields = new FimsFormFields("#frmSearch--${pageName}");
+	 	$P.formFields = new FimsFormFields("#frmSearch--${pageName}");
 
 		/**************************************************************************
 		 * DatasetControl
 		 **************************************************************************/
-	var ${pageName}Control = new DatasetControl({
+		 $P.crdnReRegControl = new DatasetControl({
 			  prefix : "crdnReReg"
 			, prefixName : "단속 재등록"
-		, infoSize : "lg"
 			, keymapper : info => info ? info.RE_REG_ID : ""
 			, dataGetter : obj => obj.crdnReRegList
 			, appendData : true
@@ -289,23 +290,23 @@
 		 * DatasetControl 이벤트
 		 **************************************************************************/
 		// Dataset 변경 이벤트
-	${pageName}Control.onDatasetChange = obj => {
-		renderList${pageName}(obj.${infoPrefix}Total);
+		$P.crdnReRegControl.onDatasetChange = obj => {
+			$P.renderList(obj.${infoPrefix}Total);
 
 			$("#paging--${pageName}").setPagingInfo({
-			  list : ${pageName}Control.dataset
+				  list : $P.crdnReRegControl.dataset
 				, prefix : "paging--${pageName}"
 				, start : obj.${infoPrefix}Start
 				, totalSize : obj.${infoPrefix}Total
 				, fetchSize : obj.${infoPrefix}Fetch
-			, func : "${pageName}Control.load({index})"
+				, func : "$P.crdnReRegControl.load({index})"
 			});
 
-		${pageName}Control.tableRenderComplete = true;			// dataTables 에 자료 추가 완료
+			$P.crdnReRegControl.tableRenderComplete = true;	// dataTables 에 자료 추가 완료
 		};
 
 		// 현재 선택 자료 변경 이벤트
-	${pageName}Control.onCurrentChange = item => {
+		$P.crdnReRegControl.onCurrentChange = item => {
 			if (!item) return;
 
 			let key = item.data.RE_REG_ID;
@@ -317,8 +318,8 @@
 		 * DataTables 이벤트
 		 **************************************************************************/
 		// DataTables에 click, dbclick 이벤트
-	renderList${pageName} = (totalSize) => {
-		let ${infoPrefix}List = ${pageName}Control.dataset;
+		$P.renderList = (totalSize) => {
+			let ${infoPrefix}List = $P.crdnReRegControl.dataset;
 			let empty = ${infoPrefix}List.empty;
 			let clsForTask = $("#frmSearch--${pageName} input[name='taskSeCd']:checked").val().toLowerCase();	// 소문자
 
@@ -333,21 +334,21 @@
 
 			//
 			let replacer = (str, dataItem) => str
-			.replace(/{onclick}/gi, "${pageName}Control.setCurrent('" + dataItem.getValue("LEVY_EXCL_ID") + "');")
-			.replace(/{ondblclick}/gi, "getTotalInfo${pageName}('" + dataItem.getValue("CRDN_ID") + "');");
+				.replace(/{onclick}/gi, "pageObject['${pageName}'].crdnReRegControl.setCurrent('" + dataItem.getValue("RE_REG_ID") + "');")
+				.replace(/{ondblclick}/gi, "pageObject['${pageName}'].getTotalInfo('" + dataItem.getValue("CRDN_ID") + "');");
 
 			let trs = empty ? [document.getElementById("${infoPrefix}NotFound--${pageName}").content.querySelector("." + clsForTask + ",.cmn").outerHTML]
 							: ${infoPrefix}List.inStrings(foundTr.outerHTML, replacer);
 
 			let noMore = (totalSize == ${infoPrefix}List.length);
-		let initScroll = (${pageName}Control.query.pageNum < 2) && (${pageName}Control.untilPageNum == 0);
+			let initScroll = ($P.crdnReRegControl.query.pageNum < 2) && ($P.crdnReRegControl.untilPageNum == 0);
 
 			$("#table-responsive--${pageName}")[0].changeContent(trs.join(), initScroll, noMore);
 
-	    if (${pageName}Control.untilPageNum != 0) {
-	    	${pageName}Control.query.fetchSize = ${pageName}Control.defaultFetchSize;
-	    	${pageName}Control.query.pageNum = ${pageName}Control.untilPageNum;
-	    	${pageName}Control.untilPageNum = 0;
+		    if ($P.crdnReRegControl.untilPageNum != 0) {
+		    	$P.crdnReRegControl.query.fetchSize = $P.crdnReRegControl.defaultFetchSize;
+		    	$P.crdnReRegControl.query.pageNum = $P.crdnReRegControl.untilPageNum;
+		    	$P.crdnReRegControl.untilPageNum = 0;
 			}
 
 		    // checkbox 체크 해제
@@ -358,25 +359,25 @@
 		}
 
 		// DataTables에 스크롤이 맨 밑으로 이동했을 때 이벤트
-	scrollDataList${pageName} = () => {
-		${pageName}Control.tableRenderComplete = false;			// dataTables 에 자료 추가 false
+		$P.scrollDataList = () => {
+			$P.crdnReRegControl.tableRenderComplete = false;			// dataTables 에 자료 추가 false
 
-		${pageName}Control.load(${pageName}Control.query.pageNum + 1);
+			$P.crdnReRegControl.load($P.crdnReRegControl.query.pageNum + 1);
 		}
 
 		/**************************************************************************
 		 * 사용자 함수(function)
 		 **************************************************************************/
 		// callback 사용자 검색
-	callbackFindUser${pageName} = (userId, userNm) => {
+		$P.callbackFindUser = (userId, userNm) => {
 			$("#schRgtrCd--${pageName}").val(userId);		// 사용자 ID
 			$("#schRgtrNm--${pageName}").val(userNm);		// 사용자 명
 		}
 
 		// 사용자 검색
-	getFindUser${pageName} = () => {
+		$P.getFindUser = () => {
 			let params = {
-			callbackFuncName : "callbackFindUser${pageName}"
+				callbackFuncName : "$P.callbackFindUser"
 			}
 
 			ajax.get({
@@ -394,12 +395,12 @@
 		}
 
 		// 개별총정보 dialog
-	getTotalInfo${pageName} = (crdnId, callSection) => {
+		$P.getTotalInfo = (crdnId, callSection) => {
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			let callControlName = "";
 			if (typeof callSection == "undefined" || callSection == null || callSection == "") {
-			callControlName = "${pageName}Control";
+				callControlName = "pageObject['${pageName}'].crdnReRegControl";
 			} else {
 				callControlName = callSection;
 			}
@@ -426,51 +427,46 @@
 		}
 
 		// 검색 자료 재조회
-	refreshList${pageName} = () => {
-		${pageName}Control.untilPageNum = ${pageName}Control.query.pageNum;
-		${pageName}Control.query.fetchSize = ${pageName}Control.defaultFetchSize * ${pageName}Control.query.pageNum;
+		$P.refreshList = () => {
+			$P.crdnReRegControl.untilPageNum = $P.crdnReRegControl.query.pageNum;
+			$P.crdnReRegControl.query.fetchSize = $P.crdnReRegControl.defaultFetchSize * $P.crdnReRegControl.query.pageNum;
 
-		${pageName}Control.load(1);
+			$P.crdnReRegControl.load(1);
 		}
 
 		/**************************************************************************
 		 * 버튼 clickEvent
 		 **************************************************************************/
 		// 업무 구분 변경
-	fnResetAndChangeBiz${pageName} = (taskSeCd) => {
+		$P.fnResetAndChangeBiz = (taskSeCd) => {
 			// 업무 구분 코드
 			if (typeof taskSeCd == "undefined" || taskSeCd == null || taskSeCd == "") {
 				taskSeCd = $("#layout-navbar input[name='taskSeCd']:checked").val();
 			}
 
-		// 화면 초기화
- 		$("#frmSearch--${pageName}")[0].reset();
-
 			// 초기 기본 설정
-		initFormData${pageName}(taskSeCd);
-		// 업무 구분별 설정
-		setTask${pageName}(taskSeCd);
+			$P.initForm();
+
 			// 기본 데이터 설정
-		setFormData${pageName}(taskSeCd);
+			$P.initData(taskSeCd);
 
 			// dataset 초기화
- 		${pageName}Control.dataset.clear();
+	 		$P.crdnReRegControl.dataset.clear();
 		}
 
 		// 검색 버튼 이벤트
-	fnSearchList${pageName} = () => {
+		$P.fnSearchList = () => {
 			// 검색조건
-		${pageName}Control.query = ${pageName}Fields.get();
+			$P.crdnReRegControl.query = $P.formFields.get();
+			$P.crdnReRegControl.query.fetchSize = $P.crdnReRegControl.defaultFetchSize;		// 한번에 조회되는 자료 건수 FETCH_XS = 30
+			$P.crdnReRegControl.query.delYN = "N";											// 삭제 여부
 
-		${pageName}Control.query.fetchSize = ${pageName}Control.defaultFetchSize;		// 한번에 조회되는 자료 건수 FETCH_XS = 30
-		${pageName}Control.query.delYN = "N";											// 삭제 여부
-
-		${pageName}Control.load(1);
+			$P.crdnReRegControl.load(1);
 		}
 
 		// 엑셀 버튼 이벤트
-	fnExcel${pageName} = () => {
-    	if (${pageName}Control.dataset.empty) {
+		$P.fnExcel = () => {
+	    	if ($P.crdnReRegControl.dataset.empty) {
 				dialog.alert({
 					  content : "검색된 자료가 없습니다."
 					, onOK : () => { }
@@ -482,32 +478,39 @@
 			// DataTables(그리드)
 			let cellDefs = getCellDefs($("#theadTr--${pageName} th").not(".dummy-th").not(":eq(0)")
 					, $($("#${infoPrefix}Row--${pageName}")[0].content).find("td").not(".dummy-td").not(":eq(0)"));
-		${pageName}Control.query.cellDefs = cellDefs;
+			$P.crdnReRegControl.query.cellDefs = cellDefs;
 
-		${pageName}Control.download();
+			$P.crdnReRegControl.download();
 		}
 
 		// 사용자 조회 버튼 이벤트
-	fnFindUser${pageName} = () => {
-		getFindUser${pageName}();
+		$P.fnFindUser = () => {
+			$P.getFindUser();
 		}
 
 		// 이전 단속정보 보기 버튼 이벤트
-	fnBfrCrdnTotalInfo${pageName} = () => {
-		let bfrCrdnId = ${pageName}Control.dataset.getValue("BFR_CRDN_ID");
+		$P.fnBfrCrdnTotalInfo = () => {
+			let bfrCrdnId = $P.crdnReRegControl.dataset.getValue("BFR_CRDN_ID");
 
 			// 이전 단속 ID 가 없다면.. return
 			if (typeof bfrCrdnId == "undefined" || bfrCrdnId == null || bfrCrdnId == "") return;
 
 			// 개별총정보 dialog
-		getTotalInfo${pageName}(bfrCrdnId, "noControlName");
+			$P.getTotalInfo(bfrCrdnId, "noControlName");
 		}
 
 		/**************************************************************************
 		 * 초기 설정
 		 **************************************************************************/
 		// 이벤트
-	setEvent${pageName} = () => {
+		$P.setEvent = () => {
+			// 버튼 이벤트
+			$("#btnReset--${pageName}").on("click", () => $P.fnResetAndChangeBiz());				// 초기화
+			$("#btnSearch--${pageName}").on("click", () => $P.fnSearchList());						// 검색
+			$("#btnExcel--${pageName}").on("click", () => $P.fnExcel());							// 엑셀
+			$("#btnFindUser--${pageName}").on("click", () => $P.fnFindUser());						// 사용자 검색
+			$("#btnBfrCrdnTotalInfo--${pageName}").on("click", () => $P.fnBfrCrdnTotalInfo());		// 이전단속정보
+
 			// 동적검색에서 엔터(Enter) 키를 누르면 검색한다.
 			$("#term--${pageName}").keypress(function(e) {
 				if (e.keyCode == 13) {
@@ -532,15 +535,13 @@
 			$("#DataTables_Table_0--${pageName}").find("th").resizable( {handles : "e"} );
 
 			// DataTables 스크롤 이벤트 생성
-		fnMakeScrollableTable($("#table-responsive--${pageName}")[0], scrollDataList${pageName});
+			fnMakeScrollableTable($("#table-responsive--${pageName}")[0], $P.scrollDataList);
 		}
 
-	// 화면 초기 설정
-	initFormData${pageName} = (taskSeCd) => {
-		// 초기 데이터 설정
-		if (typeof taskSeCd == "undefined" || taskSeCd == null || taskSeCd == "") {
-			clsForTask = $("#layout-navbar input[name='taskSeCd']:checked").val();
-		}
+		// 기본 데이터 설정
+		$P.initForm = (taskSeCd) => {
+			// 화면 초기화
+	 		$("#frmSearch--${pageName}")[0].reset();
 
 			// input, select 초기화
 			let searchForm = $("#frmSearch--${pageName}");
@@ -555,9 +556,6 @@
 	 			$(this).prop("disabled", "true");
 	 		});
 
-		$("#sggCd--${pageName}").val("${sggCd}");				// 시군구 코드
-		$("#frmSearch--${pageName} input[name='taskSeCd'][value='" + taskSeCd + "']").prop("checked", true);	// 업무 구분
-
 			// 달력 초기화
 			initDatepicker("frmSearch--${pageName}");
 			$("#schReRegYmdFrom--${pageName}").datepicker("setDate", new Date());
@@ -570,8 +568,25 @@
 			$("#schRgtrNm--${pageName}").prop("readonly", true);
 		}
 
+		// 기본 데이터 설정
+		$P.initData = (taskSeCd) => {
+			// $P.crdnReRegControl 설정
+			$P.crdnReRegControl.defaultFetchSize = FETCH_XS;		// 1 페이지당 조회되는 자료 건수 index.jsp에서 확인 FETCH_XS = 30
+
+			// 시군구 코드
+			$("#sggCd--${pageName}").val("${sggCd}");
+			// 업무 구분 코드
+			$("#frmSearch--${pageName} input[name='taskSeCd'][value='" + taskSeCd + "']").prop("checked", true);
+			// 일자
+			$("#schReRegYmdFrom--${pageName}").datepicker("setDate", DateUtil.getDateDay(-7).date);
+			$("#schReRegYmdTo--${pageName}").datepicker("setDate", new Date());
+
+			// 업무 구분별 설정
+			$P.setTask(taskSeCd);
+		}
+
 		// 업무 구분별 설정
-	setTask${pageName} = (taskSeCd) => {
+		$P.setTask = (taskSeCd) => {
 			let clsForTask = taskSeCd.toLowerCase();
 
 			// 업무별 조회조건
@@ -590,40 +605,28 @@
 
 			$("#theadTr--${pageName}").html(colsOuterHTML);
 			$("#DataTables_Table_0--${pageName}").find("th").resizable( {handles : "e"} );
-	}
-
-	// 기본 데이터 설정
-	setFormData${pageName} = (taskSeCd) => {
-		// ${pageName}Control 설정
-		${pageName}Control.defaultFetchSize = FETCH_XS;		// 1 페이지당 조회되는 자료 건수 index.jsp에서 확인 FETCH_XS = 30
-
-		// 일자
-		$("#schReRegYmdFrom--${pageName}").datepicker("setDate", DateUtil.getDateDay(-7).date);
-		$("#schReRegYmdTo--${pageName}").datepicker("setDate", new Date());
 
 			// URL 설정
-		setURL${pageName}(taskSeCd);
+			$P.setURL(taskSeCd);
 		}
 
 		// URL 설정
-	setURL${pageName} = (taskSeCd) => {
-		${pageName}Control.urls.load = wctx.url("/" + taskSeCd + ${pageName}PrefixUrl + "/010/list.do");		// 조회
-		${pageName}Control.urls.create = wctx.url("/" + taskSeCd + ${pageName}PrefixUrl + "/010/create.do");	// 등록
-		${pageName}Control.urls.getInfo = wctx.url("/" + taskSeCd + "/sprt/sprt02/010/main.do");				// 개별총정보
+		$P.setURL = (taskSeCd) => {
+			$P.crdnReRegControl.urls.load = wctx.url("/" + taskSeCd + "/excl/excl03/010/list.do");			// 조회
+			$P.crdnReRegControl.urls.create = wctx.url("/" + taskSeCd + "/excl/excl03/010/create.do");		// 등록
 		}
 
 		/**************************************************************************
-	 * script 진입
+		 * 초기 셋팅
 		 **************************************************************************/
-	$(document).ready(function() {
 		// 이벤트 설정
-		setEvent${pageName}();
+		$P.setEvent();
+
+		// 화면 초기 설정 및 업무 구분 변경
+		$P.fnResetAndChangeBiz($("#layout-navbar input[name='taskSeCd']:checked").val());
 
 		// 보안모드
 	    fn_securityModeToggle($("#securityMode--top").is(":checked"));
-
-		// 화면 초기 설정 및 업무 구분 변경
-		fnResetAndChangeBiz${pageName}($("#layout-navbar input[name='taskSeCd']:checked").val());
 	});
 
 </script>

src/main/webapp/WEB-INF/jsp/fims/photo-main.jsp

@@ -18,10 +18,10 @@
 			사진 추가
 			</button>
 			<button type="button" id="btnEditPhoto--${pageName}" class="btn btn-primary">
-			선택 사진 편집
+			사진 편집
 			</button>
 			<button type="button" id="btnDeleteExistPhoto--${pageName}" class="btn btn-primary">
-			선택 사진 삭제
+			사진 삭제
 			</button>
 		</div>
 	</div>
@@ -37,7 +37,6 @@
 		<input type="file" id="inputUploadSet--${pageName}" name="inputUploadSet"
 		multiple accept="image/*" hidden />
 	</form>
-	
 </div>
 
 <template id="imgRadioTemplate--${pageName}">
@@ -53,6 +52,21 @@
 		</label>
 	</li>
 </template>
+
+<template id="imgRadioTemplateTotalInfo--${pageName}">
+	<li style="display:flex">
+		<label class="mx-1" style="display:flex;flex-direction:row">
+			<input type="radio" name="{name}" class="form-check-input" value="{value}" checked="" />
+			<div style="position:relative;">
+				<img src="{src}" width="240" height="160" style="display:absolute;"
+					data-crdn-photo-id="{crdnPhotoId}"
+					data-mosaic="{mosaic}"
+					onload='fn_photoMask($("#photoMask--top").is(":checked"),this);' />
+			</div>
+		</label>
+	</li>
+</template>
+
 <script>
 	LoadScript("photoMainJspScript","/resources/js/fims/photo-main.js");
 </script>

src/main/webapp/WEB-INF/jsp/fims/sprt/sprt02010-main.jsp

@@ -34,8 +34,8 @@
 					<!-- 자료 이동 버튼 -->
 					<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>
+						<button type="button" id="btnPrev--${pageName}" class="w-px-50 btn-PageUp">◀</button>
+						<button type="button" id="btnNext--${pageName}" class="w-px-50 btn-PageDown">▶</button>
 					</div>
 				</div> <!-- <div class="row g-1"> -->
 			</form>	<!-- /입력 영역 -->
@@ -44,44 +44,44 @@
 		<div class="nav-align-top">
 			<ul class="nav nav-tabs" id="tabs--${pageName}" role="tablist">
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75 active" role="tab" data-bs-toggle="tab" data-bs-target="#crdnPayerInfo"
-							aria-controls="crdnPayerInfo" aria-selected="true" onClick="fnCrdnPayerInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75 active" id="btnCrdnPayer--${pageName}" name="btnCrdnPayer"
+							role="tab" data-bs-toggle="tab" data-bs-target="#crdnPayerInfo"	aria-controls="crdnPayerInfo" aria-selected="true">
 						단속 정보
 					</button>
 				</li>
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75" role="tab" data-bs-toggle="tab" data-bs-target="#opnnSbmsnInfo"
-							aria-controls="opnnSbmsnInfo" aria-selected="false" onClick="fnOpnnSbmsnInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75" id="btnOpnnSbmsn--${pageName}" name="btnOpnnSbmsn"
+							role="tab" data-bs-toggle="tab" data-bs-target="#opnnSbmsnInfo" aria-controls="opnnSbmsnInfo" aria-selected="false">
 						의견제출 정보
 					</button>
 				</li>
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75" role="tab" data-bs-toggle="tab" data-bs-target="#sndngInfo"
-							aria-controls="sndngInfo" aria-selected="false" onClick="fnSndngInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75" id="btnSndng--${pageName}" name="btnSndng"
+							role="tab" data-bs-toggle="tab" data-bs-target="#sndngInfo" aria-controls="sndngInfo" aria-selected="false">
 						발송반송 정보
 					</button>
 				</li>
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75" role="tab" data-bs-toggle="tab" data-bs-target="#prcsDtlInfo"
-							aria-controls="prcsDtlInfo" aria-selected="false" onClick="fnPrcsDtlInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75" id="btnPrcs--${pageName}" name="btnPrcs"
+							role="tab" data-bs-toggle="tab" data-bs-target="#prcsInfo" aria-controls="prcsInfo" aria-selected="false">
 						처리상세 정보
 					</button>
 				</li>
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75" role="tab" data-bs-toggle="tab" data-bs-target="#levyNpmntInfo"
-							aria-controls="levyNpmntInfo" aria-selected="false" onClick="fnLevyNpmntInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75" id="btnLevy--${pageName}" name="btnLevy"
+							role="tab" data-bs-toggle="tab" data-bs-target="#levyInfo" aria-controls="levyInfo" aria-selected="false">
 						부과체납 정보
 					</button>
 				</li>
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75" role="tab" data-bs-toggle="tab" data-bs-target="#rcvmtInfo"
-							aria-controls="rcvmtInfo" aria-selected="false" onClick="fnRcvmtInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75" id="btnRcvmt--${pageName}" name="btnRcvmt"
+							role="tab" data-bs-toggle="tab" data-bs-target="#rcvmtInfo" aria-controls="rcvmtInfo" aria-selected="false">
 						수납 정보
 					</button>
 				</li>
 				<li class="nav-item">
-					<button type="button" class="nav-link w-px-160 h-75" role="tab" data-bs-toggle="tab" data-bs-target="#cvlcptDscsnInfo"
-							aria-controls="cvlcptDscsnCnInfo" aria-selected="false" onClick="fnCvlcptDscsnInfo${pageName}();">
+					<button type="button" class="nav-link w-px-160 h-75" id="btnCvlcptDscsn--${pageName}" name="btnCvlcptDscsn"
+							role="tab" data-bs-toggle="tab" data-bs-target="#cvlcptDscsnInfo" aria-controls="cvlcptDscsnInfo" aria-selected="false">
 						민원상담 정보
 					</button>
 				</li>
@@ -91,8 +91,8 @@
 				<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="prcsInfo" role="tabpanel">처리상세 정보</div>
+				<div class="tab-pane fade" id="levyInfo" role="tabpanel">부과체납 정보</div>
 				<div class="tab-pane fade" id="rcvmtInfo" role="tabpanel">수납 정보</div>
 				<div class="tab-pane fade" id="cvlcptDscsnInfo" role="tabpanel">민원상담 정보</div>
 			</div>
@@ -104,21 +104,26 @@
 	/**************************************************************************
 	 * Global Variable
 	 **************************************************************************/
-	// URL
-	var ${pageName}PrefixUrl = "/sprt/sprt02";
+	pageObject["${pageName}"] = {};
+
  	// infoDialog 호출 용도(view 조회(편집불가), create 등록, update 수정)
  	var ${pageName}CallPurpose = "${callPurpose}";
-	// FormFields
- 	var ${pageName}Fields = new FimsFormFields("#frmEdit--${pageName}");
+
+	$(document).ready(function() {
+		// pageObject
+		var $P = pageObject["${pageName}"];
+
 	 	// 자료 이동을 위한 자료의 Index. 0부터 시작.
- 	var curDataIndex${pageName};
+	 	$P.curDataIndex;
 		// 현재 탭의 위치
- 	var activeTabIndex${pageName} = 0;
+	 	$P.activeTabIndex = 0;
+	 	// FormFields
+	 	$P.formFields = new FimsFormFields("#frmEdit--${pageName}");
 
 		/**************************************************************************
 		 * DatasetControl
 		 **************************************************************************/
-	var ${pageName}Control = new DatasetControl({
+		$P.mainControl = new DatasetControl({
 			  prefix : "totalInfoMain"
 			, prefixName : "개별총정보"
 			, keymapper : info => info ? info.CRDN_ID : ""
@@ -129,65 +134,68 @@
 			}
 		});
 
-	${pageName}Control.onCurrentChange = item => {
+		/**************************************************************************
+		 * DatasetControl 이벤트
+		 **************************************************************************/
+		 $P.mainControl.onCurrentChange = item => {
 			if (!item) return;
 
 			// Dataset 셋팅
-		${pageName}Fields.set(item);
+			$P.formFields.set(item);
 
 			// 건수 표기
 			let controlName = "${callControlName}";
 			if (controlName != "noControlName") {
-			fnChangeCountStauts${pageName}();
+				$P.fnChangeCountStauts();
 			}
 
 			// 자료 수정
-		useDataEdit${pageName}(item);
+			$P.useDataEdit(item);
 		}
 
 		/**************************************************************************
 		 * 네이게이션 Event
 		 **************************************************************************/
 		// 건수 표기
-	fnChangeCountStauts${pageName} = () => {
-		// curDataIndex${pageName} 에 값이 없다면..
-		if (curDataIndex${pageName} == null) {
+		$P.fnChangeCountStauts = () => {
+			// $P.curDataIndex 에 값이 없다면..
+			if ($P.curDataIndex == null) {
 				let mainDataItems = ${callControlName}.dataset._items;
-			let curCrdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+				let curCrdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 				for (iLoop = 0; iLoop < mainDataItems.length; iLoop++) {
 				    if (mainDataItems[iLoop].data.CRDN_ID == curCrdnId) {
-			    	curDataIndex${pageName} = iLoop;
+				    	$P.curDataIndex = iLoop;
 				    	break;
 				    }
 				}
 			}
 
-		let viewNumber = curDataIndex${pageName} + 1;
+			let viewNumber = $P.curDataIndex + 1;
 
 		   	$("#countStauts--${pageName}").val(viewNumber + " of " + ${callControlName}.dataset._items.length);
 		}
 
 		// 이전 자료 조회
-	fnPrev${pageName} = () => {
+		$P.fnPrev = () => {
 			let mainDataItems = ${callControlName}.dataset._items;
-		let curCrdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+			let curCrdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 초기 값은 callControl dataset 의 총 건수 - 1
-		if (curDataIndex${pageName} == null) {
-			curDataIndex${pageName} = mainDataItems.length - 1;
+			if ($P.curDataIndex == null) {
+				$P.curDataIndex = mainDataItems.length - 1;
 			}
 
-		for (iLoop = curDataIndex${pageName}; iLoop >= 0; iLoop--) {
+			for (iLoop = $P.curDataIndex; iLoop >= 0; iLoop--) {
 			    if (mainDataItems[iLoop].data.CRDN_ID == curCrdnId) {
 					if (iLoop - 1 < 0) { return; }									// 종료
 
-				curDataIndex${pageName} = iLoop - 1;
+					$P.curDataIndex = iLoop - 1;
 			    	break;
 			    }
 			}
 
-		let crdnId = mainDataItems[curDataIndex${pageName}].data.CRDN_ID;
+			let crdnId = mainDataItems[$P.curDataIndex].data.CRDN_ID;
 
 			// 단속 ID 가 없다면.. return
 			if (crdnId == null || crdnId == "") {
@@ -198,34 +206,35 @@
 				  callPurpose : "view"
 				, callControlName : "${callControlName}"
 				, crdnId : crdnId
-			, sggCd : mainDataItems[curDataIndex${pageName}].data.SGG_CD
-			, taskSeCd : mainDataItems[curDataIndex${pageName}].data.TASK_SE_CD
+				, sggCd : mainDataItems[$P.curDataIndex].data.SGG_CD
+				, taskSeCd : mainDataItems[$P.curDataIndex].data.TASK_SE_CD
 				, delYN : "N"
 			};
 
-		refreshList${pageName}(params);
+			$P.refreshList(params);
 		}
 
 		// 다음 자료 조회
-	fnNext${pageName} = () => {
+		$P.fnNext = () => {
 			let mainDataItems = ${callControlName}.dataset._items;
-		let curCrdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+			let curCrdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 초기 값은 0
-		if (curDataIndex${pageName} == null) {
-			curDataIndex${pageName} = 0;
+			if ($P.curDataIndex == null) {
+				$P.curDataIndex = 0;
 			}
 
-		for (iLoop = curDataIndex${pageName}; iLoop < mainDataItems.length; iLoop++) {
+			for (iLoop = $P.curDataIndex; iLoop < mainDataItems.length; iLoop++) {
 			    if (mainDataItems[iLoop].data.CRDN_ID == curCrdnId) {
-				if (iLoop + 1 >= mainDataItems.length) { return; }				// 종료
+					if (iLoop + 1 >= mainDataItems.length) return;			// 종료
+
+					$P.curDataIndex = iLoop + 1;
 
-		    	curDataIndex${pageName} = iLoop + 1;
 			    	break;
 			    }
 			}
 
-		let crdnId = mainDataItems[curDataIndex${pageName}].data.CRDN_ID;
+			let crdnId = mainDataItems[$P.curDataIndex].data.CRDN_ID;
 
 			// 단속 ID 가 없다면.. return
 			if (crdnId == null || crdnId == "") {
@@ -236,19 +245,19 @@
 				  callPurpose : "view"
 				, callControlName : "${callControlName}"
 				, crdnId : crdnId
-			, sggCd : mainDataItems[curDataIndex${pageName}].data.SGG_CD
-			, taskSeCd : mainDataItems[curDataIndex${pageName}].data.TASK_SE_CD
+				, sggCd : mainDataItems[$P.curDataIndex].data.SGG_CD
+				, taskSeCd : mainDataItems[$P.curDataIndex].data.TASK_SE_CD
 				, delYN : "N"
 			};
 
-		refreshList${pageName}(params);
+			$P.refreshList(params);
 		}
 
 		/**************************************************************************
 		 * 사용자 함수(function)
 		 **************************************************************************/
 		// 자료 삭제 가능 여부
-	useDataEdit${pageName} = (item) => {
+		$P.useDataEdit = (item) => {
 			// 삭제 자료일 경우 빨간색으로 변경
 			let elem = document.getElementById("crdnSttsNm--${pageName}");
 
@@ -262,8 +271,8 @@
 		}
 
 		//
-	fnClose${pageName} = (isDataReLoad) => {
-		dialog.close(${pageName}Control.prefix + "Dialog");
+		$P.fnClose = (isDataReLoad) => {
+			dialog.close($P.mainControl.prefix + "Dialog");
 
 			let controlName = "${callControlName}";
 			if (isDataReLoad && controlName != "noControlName") {
@@ -272,7 +281,7 @@
 		}
 
 		// 자료 재조회
-	refreshList${pageName} = (params) => {
+		$P.refreshList = (params) => {
 			if (!params) return;
 
 			ajax.get({
@@ -282,33 +291,33 @@
 				, success : resp => {
 					if (resp.totalInfo) {
 						// 최상단 단속 Data 셋팅
-					${pageName}Control.setData([resp.totalInfo]);
+						$P.mainControl.setData([resp.totalInfo]);
 
-					if (activeTabIndex${pageName} == 0) {
-						fnCrdnPayerInfo${pageName}();					// 단속 납부자 Data 셋팅
-					} else if (activeTabIndex${pageName} == 1) {
-						fnOpnnSbmsnInfo${pageName}();					// 의견제출 정보
-					} else if (activeTabIndex${pageName} == 2) {
-						fnSndngInfo${pageName}();						// 발송 반송 정보
-					} else if (activeTabIndex${pageName} == 3) {
-						fnPrcsDtlInfo${pageName}();						// 처리 상세 정보
-					} else if (activeTabIndex${pageName} == 4) {
-						fnLevyNpmntInfo${pageName}();					// 부과체납 정보
-					} else if (activeTabIndex${pageName} == 5) {
-						fnRcvmtInfo${pageName}();						// 수납 정보
-					} else if (activeTabIndex${pageName} == 6) {
-						fnCvlcptDscsnInfo${pageName}();					// 민원상담 정보
+						if ($P.activeTabIndex == 0) {
+							$P.fnCrdnPayerInfo();					// 단속 납부자 Data 셋팅
+						} else if ($P.activeTabIndex == 1) {
+							$P.fnOpnnSbmsnInfo();					// 의견제출 정보
+						} else if ($P.activeTabIndex == 2) {
+							$P.fnSndngInfo();						// 발송 반송 정보
+						} else if ($P.activeTabIndex == 3) {
+							$P.fnPrcsInfo();						// 처리 상세 정보
+						} else if ($P.activeTabIndex == 4) {
+							$P.fnLevyInfo();						// 부과체납 정보
+						} else if ($P.activeTabIndex == 5) {
+							$P.fnRcvmtInfo();						// 수납 정보
+						} else if ($P.activeTabIndex == 6) {
+							$P.fnCvlcptDscsnInfo();					// 민원상담 정보
 						}
 					}
 				}
 			});
 		}
 
-	getCrdnPayerInfo${pageName} = (params) => {
+		$P.getCrdnPayerInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/020/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/020/info.do")
 				, data : params || {}
 				, success : resp => {
 					$("#crdnPayerInfo").html(resp);
@@ -316,11 +325,11 @@
 			});
 		}
 
-	getOpnnSbmsnInfo${pageName} = (params) => {
+		$P.getOpnnSbmsnInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/030/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/030/info.do")
 				, data : params || {}
 				, success : resp => {
 					$("#opnnSbmsnInfo").html(resp);
@@ -328,11 +337,11 @@
 			});
 		}
 
-	getSndngInfo${pageName} = (params) => {
+		$P.getSndngInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/040/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/040/info.do")
 				, data : params || {}
 				, success : resp => {
 					$("#sndngInfo").html(resp);
@@ -340,35 +349,35 @@
 			});
 		}
 
-	getPrcsDtlInfo${pageName} = (params) => {
+		$P.getPrcsInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/050/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/050/info.do")
 				, data : params || {}
 				, success : resp => {
-				$("#prcsDtlInfo").html(resp);
+					$("#prcsInfo").html(resp);
 				}
 			});
 		}
 
-	getLevyNpmntInfo${pageName} = (params) => {
+		$P.getLevyInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/060/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/060/info.do")
 				, data : params || {}
 				, success : resp => {
-				$("#levyNpmntInfo").html(resp);
+					$("#levyInfo").html(resp);
 				}
 			});
 		}
 
-	getRcvmtInfo${pageName} = (params) => {
+		$P.getRcvmtInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/070/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/070/info.do")
 				, data : params || {}
 				, success : resp => {
 					$("#rcvmtInfo").html(resp);
@@ -376,11 +385,11 @@
 			});
 		}
 
-	getCvlcptDscsnInfo${pageName} = (params) => {
+		$P.getCvlcptDscsnInfo = (params) => {
 			if (!params) return;
 
 			ajax.get({
-			  url : wctx.url(params.taskSeCd + "/sprt/sprt02/080/info.do")
+				  url : wctx.url("/" + params.taskSeCd + "/sprt/sprt02/080/info.do")
 				, data : params || {}
 				, success : resp => {
 					$("#cvlcptDscsnInfo").html(resp);
@@ -392,183 +401,191 @@
 		 * 탭 clickEvent
 		 **************************************************************************/
 		// 단속 정보
-	fnCrdnPayerInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		$P.fnCrdnPayerInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 0;
+			$P.activeTabIndex = 0;
 
 			let params = {
 				  callPurpose : "view"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
 				, delYN : "N"
 			};
 
-		getCrdnPayerInfo${pageName}(params);
+			$P.getCrdnPayerInfo(params);
 		}
 
 		// 의견제출 정보
-	fnOpnnSbmsnInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		$P.fnOpnnSbmsnInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 1;
+			$P.activeTabIndex = 1;
 
 			let params = {
 				  callPurpose : "view"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
 				, delYN : "N"
 			};
 
-		getOpnnSbmsnInfo${pageName}(params);
+			$P.getOpnnSbmsnInfo(params);
 		}
 
 		// 발송 반송 정보
-	fnSndngInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		$P.fnSndngInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 2;
+			$P.activeTabIndex = 2;
 
 			let params = {
 				  callPurpose : "view"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
 				, delYN : "N"
 			};
 
-		getSndngInfo${pageName}(params);
+			$P.getSndngInfo(params);
 		}
 
-	// 처리 상세 정보
-	fnPrcsDtlInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		// 처리 정보
+		$P.fnPrcsInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 3;
+			$P.activeTabIndex = 3;
 
 			let params = {
 				  callPurpose : "view"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
-			, rtpyrId : ${pageName}Control.dataset.getValue("RTPYR_ID")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
+				, rtpyrId : $P.mainControl.dataset.getValue("RTPYR_ID")
 				, delYN : "N"
 			};
 
-		getPrcsDtlInfo${pageName}(params);
+			$P.getPrcsInfo(params);
 		}
 
 		// 부과체납 정보
-	fnLevyNpmntInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		$P.fnLevyInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 4;
+			$P.activeTabIndex = 4;
 
 			let params = {
 				  callPurpose : "view"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
 				, delYN : "N"
 			};
 
-		getLevyNpmntInfo${pageName}(params);
+			$P.getLevyInfo(params);
 		}
 
 		// 수납 정보
-	fnRcvmtInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		$P.fnRcvmtInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 5;
+			$P.activeTabIndex = 5;
 
 			let params = {
 				  callPurpose : "view"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
 				, delYN : "N"
 			};
 
-		getRcvmtInfo${pageName}(params);
+			$P.getRcvmtInfo(params);
 		}
 
 		// 민원상담 정보
-	fnCvlcptDscsnInfo${pageName} = () => {
-		let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
+		$P.fnCvlcptDscsnInfo = () => {
+			let crdnId = $P.mainControl.dataset.getValue("CRDN_ID");
 
 			// 단속 ID 가 없다면.. return
 			if (typeof crdnId == "undefined" || crdnId == null || crdnId == "") return;
 
 			// 탭 Index
-		activeTabIndex${pageName} = 6;
+			$P.activeTabIndex = 6;
 
 			let params = {
 				  callPurpose : "view"
 				, inquiryCondition : "crdnId_vhrno"
 				, crdnId : crdnId
-			, sggCd : ${pageName}Control.dataset.getValue("SGG_CD")
-			, taskSeCd : ${pageName}Control.dataset.getValue("TASK_SE_CD")
-			, vhrno : ${pageName}Control.dataset.getValue("VHRNO")
+				, sggCd : $P.mainControl.dataset.getValue("SGG_CD")
+				, taskSeCd : $P.mainControl.dataset.getValue("TASK_SE_CD")
+				, vhrno : $P.mainControl.dataset.getValue("VHRNO")
 				, delYN : "N"
 			};
 
-		getCvlcptDscsnInfo${pageName}(params);
+			$P.getCvlcptDscsnInfo(params);
 		}
 
 		/**************************************************************************
 		 * 초기 셋팅
 		 **************************************************************************/
 		// 이벤트 설정
-	setEvent${pageName} = () => {
-
+		$P.setEvent = () => {
+			// 버튼 이벤트
+			$("#btnPrev--${pageName}").on("click", () => $P.fnPrev());							// 이전
+			$("#btnNext--${pageName}").on("click", () => $P.fnNext());							// 다음
+			$("#btnCrdnPayer--${pageName}").on("click", () => $P.fnCrdnPayerInfo());			// 단속 정보
+			$("#btnOpnnSbmsn--${pageName}").on("click", () => $P.fnOpnnSbmsnInfo());			// 의견제출 정보
+			$("#btnSndng--${pageName}").on("click", () => $P.fnSndngInfo());					// 발송반송 정보
+			$("#btnPrcs--${pageName}").on("click", () => $P.fnPrcsInfo());						// 처리상세 정보
+			$("#btnLevy--${pageName}").on("click", () => $P.fnLevyInfo());						// 부과체납 정보
+			$("#btnRcvmt--${pageName}").on("click", () => $P.fnRcvmtInfo());					// 수납 정보
+			$("#btnCvlcptDscsn--${pageName}").on("click", () => $P.fnCvlcptDscsnInfo());		// 민원상담 정보
 		}
 
 		// 기본 데이터 설정
-	initData${pageName} = () => {
-		curDataIndex${pageName} = null;							// 화면이 열릴때 초기 값으로 null로 설정해야 건수가 정상 표시 된다.
+		$P.initData = () => {
+			$P.curDataIndex = null;					// 화면이 열릴때 초기 값으로 null로 설정해야 건수가 정상 표시 된다.
 		}
 
 		/**************************************************************************
-	 * script 진입
+		 * script 진입시 실행 함수
 		 **************************************************************************/
-	$(document).ready(function() {
-		// 이벤트 설정
-		setEvent${pageName}();
+		// 1. 이벤트 설정
+		$P.setEvent();
 
-		// 기본 데이터 설정
-		initData${pageName}();
+		// 2. 기본 데이터 설정
+		$P.initData();
 
-		// Dataset 설정
-		${pageName}Control.setData([${totalInfo}]);
+		// 3. Dataset 설정
+		$P.mainControl.setData([${totalInfo}]);
 
-		// 단속, 납부자 정보
-		fnCrdnPayerInfo${pageName}();
+		// 4. 단속, 납부자 정보 조회
+		$P.fnCrdnPayerInfo();
 	});
 
 </script>

src/main/webapp/resources/js/fims/photo-main.js

@@ -98,7 +98,14 @@ function settingPhotoMain(pageName, crdnIdElementId, carInfoFunc, carLinkFunc){
 				continue;
 			}
 
-			var template = document.getElementById("imgRadioTemplate--" + pageName).innerHTML;
+			// pageName에 따라 template이 다르다.
+			var template;
+			if (pageName == "sprt02020") {
+				template = document.getElementById("imgRadioTemplateTotalInfo--" + pageName).innerHTML;
+			} else {
+				template = document.getElementById("imgRadioTemplate--" + pageName).innerHTML;
+			}
+
 			template = template.replace(/{name}/gi, "existPhoto");
 			template = template.replace(/{value}/gi, item.FILE_ID);
 			template = template.replace(/{src}/gi, item.URL);