From 864468eca2b956de17a92e97d8151ed5174c000f Mon Sep 17 00:00:00 2001
From: leebeomjun <leebj91@xit.co.kr>
Date: Thu, 27 Jul 2023 11:26:09 +0900
Subject: [PATCH] =?UTF-8?q?=EC=86=8C=EC=8A=A4=20=EC=A0=95=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../WEB-INF/jsp/fims/crdn/crdn05030-info.jsp  | 35 ++++----
 .../WEB-INF/jsp/fims/crdn/crdn06010-main.jsp  | 61 +++++++------
 .../WEB-INF/jsp/fims/crdn/crdn06020-main.jsp  | 86 ++++++++++---------
 3 files changed, 93 insertions(+), 89 deletions(-)

diff --git a/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn05030-info.jsp b/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn05030-info.jsp
index 918cee4f..017977e0 100644
--- a/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn05030-info.jsp
+++ b/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn05030-info.jsp
@@ -9,7 +9,7 @@
 			<div class="row g-1">
 				<div class="col-md-12" slot="edit">
 					<template class="pvs bpv">
-						<slot name="edit">
+						<slot>
 							<label for="crdnSeCd--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">단속구분</label>
 							<select id="crdnSeCd--${pageName}" name="crdnSeCd" data-map="CRDN_SE_CD" class="form-select">
 								<c:forEach items="${FIM002List}" var="item">
@@ -64,14 +64,14 @@
 				</div>
 				<div class="col-md-8" slot="edit">
 					<template class="bpv">
-						<slot name="edit">
+						<slot>
 							<label for="dtlCrdnPlc--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">상세위반장소</label>
 							<input type="text" id="dtlCrdnPlc--${pageName}" name="dtlCrdnPlc" data-map="DTL_CRDN_PLC" class="form-control" 
 								data-maxlenghb="200" />
 						</slot>
 					</template>
 					<template class="pvs">
-						<slot name="edit">
+						<slot>
 							<label for="crdnSpareaCd--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">특별구역</label>
 							<select id="crdnSpareaCd--${pageName}" name="crdnSpareaCd" data-map="CRDN_SPAREA_CD" class="form-select">
 								<c:forEach items="${FIM007List}" var="item">
@@ -130,14 +130,14 @@
 				</div>
 				<div class="col-md-4" slot="edit">
 					<template class="pvs bpv">
-						<slot name="edit">
+						<slot>
 							<label class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">차량구분</label>
 						</slot>
 					</template>
 				</div>
 				<div class="col-md-4" slot="edit">
 					<template class="pvs bpv">
-						<slot name="edit">
+						<slot>
 							<label class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">차종</label>
 						</slot>
 					</template>
@@ -163,7 +163,7 @@
 				</div>
 				<div class="col-md-4" slot="edit">
 					<template class="dpv eca pvs">
-						<slot name="edit">
+						<slot>
 							<label for="towngYn--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">견인지시</label>
 							<select id="towngYn--${pageName}" name="towngYn" class="form-select" data-map="TOWNG_YN">
 								<c:forEach items="${FIM053List}" var="item">
@@ -175,7 +175,7 @@
 				</div>
 				<div class="col-md-4" slot="edit">
 					<template class="dpv eca pvs">
-						<slot name="edit">
+						<slot>
 							<label for="crdnSn--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">스티커번호</label>
 							<input type="text" id="crdnSn--${pageName}" name="crdnSn" data-map="CRDN_SN" class="form-control" 
 								maxlength="20" data-maxlengthb="20" />
@@ -184,7 +184,7 @@
 				</div>
 				<div class="col-md-4" slot="edit">
 					<template class="dpv">
-						<slot name="edit">
+						<slot>
 							<label for="parkngPsbltyRsltCd--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">장애차량확인</label>
 							<select id="parkngPsbltyRsltCd--${pageName}" name="parkngPsbltyRsltCd" data-map="PARKNG_PSBLTY_RSLT_CD" class="form-select">
 								<c:forEach items="${FIM034List}" var="item">
@@ -198,7 +198,7 @@
 				</div>
 				<div class="col-md-12" slot="edit">
 					<template class="pvs bpv">
-						<slot name="edit">
+						<slot>
 							<label for="teamNm--${pageName}" class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">단속조</label>
 							<select id="teamNm--${pageName}" name="teamNm" data-map="TEAM_NM" class="form-select">
 							</select>
@@ -207,7 +207,7 @@
 				</div>
 				<div class="col-md-12" slot="edit">
 					<template class="pvs bpv">
-						<slot name="edit">
+						<slot>
 							<label class="w-px-150 bg-lighter pe-2 col-form-label text-sm-end">단속원</label>
 							<input type="text" id="teamer1--${pageName}" name="teamer1" data-map="TEAMER_1" class="form-control" />
 							<input type="text" id="teamer2--${pageName}" name="teamer2" data-map="TEAMER_2" class="form-control" />
@@ -404,7 +404,7 @@ $(document).ready(function(){
 	var clsForTask = $("#taskSeCd--${pageName}").val().toLowerCase();
 	
 	//업무별 입력 항목
-	var editSlotAreas = $("#frmEdit--${pageName}").find("div[slot='edit']");
+	var editSlotAreas = $("#frmEdit--${pageName}").find("[slot='edit']");
 	editSlotAreas.each(function(){
 		
 		var tempHtml = "";
@@ -413,18 +413,13 @@ $(document).ready(function(){
 		});
 		
 		var taskTemplate = $(this).find("template."+clsForTask);
-		
 		if(taskTemplate.length < 1){
 			this.innerHTML = tempHtml;
-		} else {
-			var editContent = taskTemplate[0].content;
-			var taskItem = $(editContent).find("slot[name='edit']");
-			if(taskItem.length > 0){
-				this.innerHTML = tempHtml + taskItem[0].innerHTML;
-			} else {
-				this.innerHTML = tempHtml;
-			}
+			return;
 		}
+		
+		var inHtml = $(taskTemplate[0].content).find("slot")[0].innerHTML;
+		this.innerHTML = tempHtml + inHtml;
 	});
 	
 	
diff --git a/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06010-main.jsp b/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06010-main.jsp
index cea7b2fa..ecfdaaa6 100644
--- a/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06010-main.jsp
+++ b/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06010-main.jsp
@@ -101,28 +101,30 @@
 		                        </div>
 					        </div>
 					        <div class="row">
-					        	<div class="slot-search" data-slot-index="0"></div>
+					        	<div slot="search" class="col-6">
+					        		<template class="pvs dpv eca">
+							            <slot>
+							                <label class="form-label fw-bold form-search-title">견인</label>
+				                            <input type="radio" name="temp1" value="Y" />예
+				                            <input type="radio" name="temp1" value="N" />아니오
+							            </slot>
+								    </template>
+								    <template class="bpv">
+								    	<slot>
+							                <label class="form-label fw-bold form-search-title">전용차로구분</label>
+				                            <select name="temp2" class="form-select">
+				                            	<option value="">전체</option>
+				                            	<c:forEach items="${FIM005List}" var="item">
+				                            		<option value="${item.code}">${item.value}</option>
+				                            	</c:forEach>
+				                            </select>
+							            </slot>
+								    </template>
+					        	</div>
 					        </div>
 				        </div>
 				    </form>
 
-				    <template id="taskSearchOption--${pageName}">
-			            <div class="pvs dpv eca col-6 slot-search" data-slot-index="0">
-			                <label class="form-label fw-bold form-search-title">견인</label>
-                            <input type="radio" name="temp1" value="Y" />예
-                            <input type="radio" name="temp1" value="N" />아니오
-			            </div>
-			            <div class="bpv col-6 slot-search" data-slot-index="0">
-			                <label class="form-label fw-bold form-search-title">전용차로구분</label>
-                            <select name="temp2" class="form-select">
-                            	<option value="">전체</option>
-                            	<c:forEach items="${FIM005List}" var="item">
-                            		<option value="${item.code}">${item.value}</option>
-                            	</c:forEach>
-                            </select>
-			            </div>
-				    </template>
-
 				    <div>
 				        <div class="container-page-btn">
 				            <div class="d-flex flex-row justify-content-between">
@@ -300,17 +302,22 @@ $(document).ready(function(){
 		var clsForTask = taskSeCd.toLowerCase();
 
 		//업무별 조회조건
-		var searchOptionContent = document.getElementById("taskSearchOption--${pageName}").content;
-		var searchOptions = $(searchOptionContent).find("."+clsForTask);
-		var searchSlotAreas = $("#frmSearch--${pageName}").find(".slot-search");
+		var searchSlotAreas = $("#frmSearch--${pageName}").find("[slot='search']");
 		searchSlotAreas.each(function(){
-			var searchOption = searchOptions.filter("[data-slot-index='"+this.dataset.slotIndex+"']");
-			if(searchOption.length > 0){
-				this.replaceWith(searchOption[0].cloneNode(true));
-			} else {
-				this.classList.remove("pvs","bpv","dpv","eca");
-				this.innerHTML = "";
+			
+			var tempHtml = "";
+			$(this).find("template").each(function(){
+				tempHtml += this.cloneNode(true).outerHTML;
+			});
+			
+			var taskTemplate = $(this).find("template."+clsForTask);
+			if(taskTemplate.length < 1){
+				this.innerHTML = tempHtml;
+				return;
 			}
+			
+			var inHtml = $(taskTemplate[0].content).find("slot")[0].innerHTML;
+			this.innerHTML = tempHtml + inHtml;
 		});
 
 		//업무별 그리드
diff --git a/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06020-main.jsp b/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06020-main.jsp
index a306a0dc..5beaf5af 100644
--- a/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06020-main.jsp
+++ b/src/main/webapp/WEB-INF/jsp/fims/crdn/crdn06020-main.jsp
@@ -78,8 +78,15 @@
 		                        		<input type="checkbox" name="schOnlyUnpay" class="form-check-input" />
 		                        		미납만조회
 									</label>
-									<span class="slot-search" data-slot-index="0">
-
+									<span slot="search">
+										<template class="pvs">
+											<slot>
+												<label class="area-photoinspection">
+					                        		<input type="checkbox" name="schExclTimeout" class="form-check-input" />
+					                        		2시간초과제외
+												</label>
+											</slot>
+										</template>
 									</span>
 		                        	<span class="flr">
 		                                <button type="button" class="btn btn-open-detail"
@@ -125,16 +132,6 @@
 					        </div>
 				        </div>
 				    </form>
-					<!-- 업무별 조회조건  -->
-					<template id="taskSearchOption--${pageName}">
-						<span class="pvs slot-search" data-slot-index="0">
-							<label class="area-photoinspection">
-                        		<input type="checkbox" name="schExclTimeout" class="form-check-input" />
-                        		2시간초과제외
-							</label>
-						</span>
-					</template>
-
 
 			        <div id="gridbuttonArea--${pageName}" class="container-page-btn">
 			        	<div class="d-flex flex-row justify-content-between">
@@ -151,21 +148,16 @@
 						</div>
 			            <span class="container-window-btn-right">
 							<button class="btn btn-primary" id="btnInstLevyExcl--${pageName}" title="비부과 등록">비부과 등록</button>
-<%-- 							<a href="#" id="btnInstLevyExcl--${pageName}" class="btn btn-blue" title="비부과 등록">비부과 등록</a> --%>
-							<span class="slot-button" data-slot-index="0">
-
+							<span slot="button">
+								<template class="pvs">
+									<slot>
+										<button class="btn btn-primary" id="btnInstTimeout--${pageName}" title="2시간초과 등록">2시간초과 등록</button>
+									</slot>
+								</template>
 							</span>
 			            </span>
 			        </div>
-
-					<!-- 업무별 버튼 -->
-				    <template id="taskButton--${pageName}">
-						<span class="pvs slot-button" data-slot-index="0">
-							<a href="#" id="btnInstTimeout--${pageName}" class="btn btn-blue" title="2시간초과 등록"
-								onclick="">2시간초과 등록</a>
-						</span>
-					</template>
-
+			        
 					<div class="card-datatable text-nowrap area-photoinspection">
 				        <div id="photoInspection_Table_0_wrapper--${pageName}" class="dataTables_wrapper dt-bootstrap5 no-footer">
 							<div id="photoInspection-responsive--${pageName}" class="table-responsive"
@@ -445,31 +437,41 @@ $(document).ready(function(){
 
 		var clsForTask = taskSeCd.toLowerCase();
 		//업무별 조회조건
-		var searchOptionContent = document.getElementById("taskSearchOption--${pageName}").content;
-		var searchOptions = $(searchOptionContent).find("."+clsForTask);
-		var searchSlotAreas = $("#frmSearch--${pageName}").find(".slot-search");
+		var searchSlotAreas = $("#frmSearch--${pageName}").find("[slot='search']");
 		searchSlotAreas.each(function(){
-			var searchOption = searchOptions.filter("[data-slot-index='"+this.dataset.slotIndex+"']");
-			if(searchOption.length > 0){
-				this.replaceWith(searchOption[0].cloneNode(true));
-			} else {
-				this.classList.remove("pvs","bpv","dpv","eca");
-				this.innerHTML = "";
+			
+			var tempHtml = "";
+			$(this).find("template").each(function(){
+				tempHtml += this.cloneNode(true).outerHTML;
+			});
+			
+			var taskTemplate = $(this).find("template."+clsForTask);
+			if(taskTemplate.length < 1){
+				this.innerHTML = tempHtml;
+				return;
 			}
+			
+			var inHtml = $(taskTemplate[0].content).find("slot")[0].innerHTML;
+			this.innerHTML = tempHtml + inHtml;
 		});
 
 		//업무별 버튼
-		var buttonContent = document.getElementById("taskButton--${pageName}").content
-		var buttons = $(buttonContent).find("."+clsForTask);
-		var buttonSlotAreas = $("#gridbuttonArea--${pageName}").find(".slot-button");
+		var buttonSlotAreas = $("#gridbuttonArea--${pageName}").find("[slot='button']");
 		buttonSlotAreas.each(function(){
-			var button = buttons.filter("[data-slot-index='"+this.dataset.slotIndex+"']");
-			if(button.length > 0){
-				this.replaceWith(button[0].cloneNode(true));
-			} else {
-				this.className = "slot-button";
-				this.innerHTML = "";
+			
+			var tempHtml = "";
+			$(this).find("template").each(function(){
+				tempHtml += this.cloneNode(true).outerHTML;
+			});
+			
+			var taskTemplate = $(this).find("template."+clsForTask);
+			if(taskTemplate.length < 1){
+				this.innerHTML = tempHtml;
+				return;
 			}
+			
+			var inHtml = $(taskTemplate[0].content).find("slot")[0].innerHTML;
+			this.innerHTML = tempHtml + inHtml;
 		});
 
 		$('#btnPhotoInspection--${pageName}').trigger("click");