출력항목 순서 지정 기능 추가

src/main/java/cokr/xit/fims/cmmn/pdf/format/Advntce.java

@@ -76,7 +76,9 @@ public class Advntce extends PDFFormat {
 			text("otptDD","출력일",""),
 
 			text("offcsText","관인명",""),
-			image("offcs","관인이미지","").size(20, 20)
+			image("offcs","관인이미지","").size(20, 20),
+
+			text("undefined","(미정)","미정항목")
 		);
 	}
 
@@ -224,6 +226,9 @@ public class Advntce extends PDFFormat {
 			result = printOption.getGlobalVariable().get("offcsFilePath");
 		}
 
+		case "undefined" -> {
+			result = defaultValue;
+		}
 		}
 
 		return result;
@@ -274,6 +279,7 @@ public class Advntce extends PDFFormat {
 		case "postSenderFax" -> {
 			result = printOption.getGlobalVariable().get("deptFxno");
 		}
+
 		}
 		return result;
 	}

src/main/java/cokr/xit/fims/sprt/OtptStng.java

@@ -18,6 +18,7 @@ public class OtptStng extends AbstractEntity {
 	private String fontSz; //글자크기
 	private String fontColor; //글자색
 	private String fontStyle; //글자스타일
+	private String otptArtclOrdr; //출력항목순서
 	private String sggCd;
 	private String taskSeCd;
 	private String sndngSeCd;

src/main/resources/sql/mapper/fims/sprt/otptStng-mapper.xml

@@ -52,6 +52,7 @@ INSERT
      , FONT_SZ
      , FONT_COLOR
      , FONT_STYLE
+     , OTPT_ARTCL_ORDR
      , USE_YN
      , REG_DT
      , RGTR
@@ -71,6 +72,7 @@ INSERT
      , #{fontSz}
      , #{fontColor}
      , #{fontStyle}
+     , #{otptArtclOrdr}
      , 'Y'
      , <include refid="utility.now" />
      , #{createdBy}
@@ -80,19 +82,21 @@ INSERT
 <update id="updateStng" parameterType="cokr.xit.fims.sprt.OtptStng">
 /* 출력 설정 수정(otptStngMapper.updateStng) */
 UPDATE TB_OTPT_FORM_STNG
-   SET OTPT_ARTCL_NM    = #{otptArtclNm}
-     , LEFT_PSTN  = #{leftPstn}
-     , TOP_PSTN   = #{topPstn}
-     , WIDTH_SZ   = #{widthSz}
-     , HEIGHT_SZ  = #{heightSz}
-     , TEXT_SORT  = #{textSort}
-     , FONT_NM    = #{fontNm}
-     , FONT_SZ    = #{fontSz}
-     , FONT_COLOR = #{fontColor}
-     , FONT_STYLE = #{fontStyle}
-     , MDFCN_DT   = <include refid="utility.now" />
-     , MDFR       = #{modifiedBy}
+   SET OTPT_ARTCL_NM   = #{otptArtclNm}
+     , LEFT_PSTN       = #{leftPstn}
+     , TOP_PSTN        = #{topPstn}
+     , WIDTH_SZ        = #{widthSz}
+     , HEIGHT_SZ       = #{heightSz}
+     , TEXT_SORT       = #{textSort}
+     , FONT_NM         = #{fontNm}
+     , FONT_SZ         = #{fontSz}
+     , FONT_COLOR      = #{fontColor}
+     , FONT_STYLE      = #{fontStyle}
+     , OTPT_ARTCL_ORDR = #{otptArtclOrdr}
+     , MDFCN_DT        = <include refid="utility.now" />
+     , MDFR            = #{modifiedBy}
  WHERE OTPT_FORM_ID = #{otptFormId}
+   AND USE_YN = 'Y'
 </update>
 
 <update id="deleteStng" parameterType="cokr.xit.fims.sprt.OtptForm">
@@ -101,10 +105,11 @@ UPDATE TB_OTPT_FORM_STNG
    SET USE_YN   = 'N'
      , MDFCN_DT = <include refid="utility.now" />
      , MDFR     = #{modifiedBy}
- WHERE SGG_CD           = #{sggCd}
-   AND TASK_SE_CD       = #{taskSeCd}
-   AND SNDNG_SE_CD      = #{sndngSeCd}
+ WHERE SGG_CD      = #{sggCd}
+   AND TASK_SE_CD  = #{taskSeCd}
+   AND SNDNG_SE_CD = #{sndngSeCd}
    AND PAPER_SE_CD = #{paperSeCd}
+   AND USE_YN = 'Y'
 <if test='otptFormIDs != null'>
    AND OTPT_FORM_ID NOT IN (<foreach collection="otptFormIDs" item="OTPT_FORM_ID" separator=",">#{OTPT_FORM_ID}</foreach>)
 </if>

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

@@ -54,7 +54,7 @@
 		</div>
 		<div class="card-datatable text-nowrap mb-3">
 			<div class="dataTables_wrapper dt-bootstrap5 no-footer">
-				<div class="table-responsive"
+				<div id="scrollUnique--${pageName}" class="table-responsive"
 				style="overflow-x:scroll; height:300px; overflow-y:scroll;" >
 					<table 
 					class="table-layout-fixed compress-cell dataTable table table-bordered" 
@@ -79,7 +79,7 @@
 		</div>
 		<div class="card-datatable text-nowrap mb-3">
 			<div class="dataTables_wrapper dt-bootstrap5 no-footer">
-				<div class="table-responsive"
+				<div id="scrollMultiple--${pageName}" class="table-responsive"
 				style="overflow-x:scroll; height:300px; overflow-y:scroll;" >
 					<table 
 					class="table-layout-fixed compress-cell dataTable table table-bordered" 
@@ -110,6 +110,7 @@
 
 <template id="theadTr--${pageName}">
 	<tr>
+		<th style="width:130px">순서</th>
 		<th style="width:40px"></th>
 		<th style="width:200px">출력항목명</th>
 		<th style="width:110px">유형</th>
@@ -128,6 +129,11 @@
 
 <template id="found--${pageName}">
 	<tr data-key="{OTPT_FORM_ID}">
+		<td data-col="otptArtclOrdr" class="text-center">
+			<button type="button">▲</button>
+			<input type="text" readonly class="w-px-50 text-center" />
+			<button type="button">▼</button>
+		</td>
 		<td data-col="checkbox" class="text-center">
 			<input type="checkbox" class="form-check-input" />
 		</td>
@@ -321,6 +327,16 @@ $(document).ready(function(){
 			var toPrev = $(sel).siblings()[0];
 			var toNext = $(sel).siblings()[1];
 			fnMakeSpinnerSelect(sel, toPrev, toNext);
+			
+			var scrollDiv = "";
+			if(tbodyId == "tbodyUnique--${pageName}"){
+				scrollDiv = "scrollUnique--${pageName}";
+			} else {
+				scrollDiv = "scrollMultiple--${pageName}";
+			}
+			
+			var rowSpinButtons = $(this).find("td[data-col='otptArtclOrdr']").find("button");
+			fnMakeRowSpinner(this,rowSpinButtons[0],rowSpinButtons[1],document.getElementById(scrollDiv));
 		});
 	}
 	
@@ -412,6 +428,15 @@ $(document).ready(function(){
 		fnMakeOptionStyleSelect($P.fnGetElement(lastTr,"fontColor"));
 		fnMakeOptionStyleSelect($P.fnGetElement(lastTr,"fontStyle"));
 		
+		var scrollDiv = "";
+		if(tbodyId == "tbodyUnique--${pageName}"){
+			scrollDiv = "scrollUnique--${pageName}";
+		} else {
+			scrollDiv = "scrollMultiple--${pageName}";
+		}
+		var rowSpinButtons = $(lastTr).find("td[data-col='otptArtclOrdr']").find("button");
+		fnMakeRowSpinner(lastTr,rowSpinButtons[0],rowSpinButtons[1],document.getElementById(scrollDiv));
+		
 		if(otptArtclNm != null && otptArtclNm != ""){	
 			
 			$($P.fnGetElement(lastTr,"otptArtclNm")).set(otptArtclNm);
@@ -528,6 +553,7 @@ $(document).ready(function(){
 			var fontSz = $($P.fnGetElement(this,"fontSz")).val();
 			var fontColor = $($P.fnGetElement(this,"fontColor")).val();
 			var fontStyle = $($P.fnGetElement(this,"fontStyle")).val();
+			var otptArtclOrdr = $($P.fnGetElement(this,"otptArtclOrdr")).val();
 			
 			var row = {
 				otptFormId : otptFormId,
@@ -541,6 +567,7 @@ $(document).ready(function(){
 				fontSz : fontSz,
 				fontColor : fontColor,
 				fontStyle : fontStyle,
+				otptArtclOrdr : otptArtclOrdr,
 				 
 				sggCd : query.sggCd,
 				taskSeCd : query.taskSeCd,
@@ -644,5 +671,16 @@ $(document).ready(function(){
 	
 	$("#btnSave--${pageName}").on("click", () => $P.fnSave() );
 
+	var markerFinder = function(tr){
+		return $P.fnGetElement(tr,"otptArtclOrdr");
+	};
+	var markerSetter = function(marker, value){
+		marker.value = value;
+	};
+	
+	fnMakeRowNumberingTable(document.getElementById('tbodyUnique--${pageName}'), markerFinder, markerSetter);
+	fnMakeRowNumberingTable(document.getElementById('tbodyMultiple--${pageName}'), markerFinder, markerSetter);
+	
 });
+
 </script>

src/main/webapp/resources/js/fims/framework/cmm/componentization.js

@@ -48,3 +48,86 @@ function fnMakeOptionStyleSelect(selectEl){
 
 	selectEl.changeUI();
 }
+
+/**************************************************************************
+* 행 위치 이동 가능한 테이블
+**************************************************************************/
+function fnMakeRowSpinner(tableRowEl, upBtnEl, downBtnEl, scrollEl){
+
+	$(upBtnEl).on("click", function(){
+		var tbody = $(tableRowEl).parent();
+		
+		var theadHeight = $(scrollEl).find("thead").outerHeight();
+		var scrollElStart = $(scrollEl).offset().top + theadHeight;
+		var scrollElHeight = $(scrollEl).height() - theadHeight - VERTICAL_SCROLL_HEIGHT;
+		var scrollMiddle = scrollElStart + (scrollElHeight/2);
+		
+		if($(tableRowEl).index() == 0){
+			return;
+		}
+		
+		var beforeIndex = $(tableRowEl).index() - 1;
+		var beforeTr = $(tbody).find("tr").eq(beforeIndex);
+		
+		var rowStart = beforeTr.offset().top;
+		var rowHeight = beforeTr.outerHeight();
+		var rowMiddle = rowStart+(rowHeight/2);
+		
+		beforeTr.before(tableRowEl);
+
+		if(rowMiddle < scrollMiddle){
+			var move = scrollMiddle - rowMiddle;
+			$(scrollEl).scrollTop($(scrollEl).scrollTop() - move);
+		}
+
+		$(tbody).find("tr").removeClass("current-row");
+		$(tableRowEl).addClass("current-row");
+	});
+	
+	$(downBtnEl).on("click", function(){
+		var tbody = $(tableRowEl).parent();
+		
+		var theadHeight = $(scrollEl).find("thead").outerHeight();
+		var scrollElStart = $(scrollEl).offset().top + theadHeight;
+		var scrollElHeight = $(scrollEl).height() - theadHeight - VERTICAL_SCROLL_HEIGHT;
+		var scrollMiddle = scrollElStart + (scrollElHeight/2);
+		
+		if($(tableRowEl).index() == ($(tbody).children().length) - 1){
+			return;
+		}
+		
+		var afterIndex = $(tableRowEl).index() + 1;
+		var afterTr = $(tbody).find("tr").eq(afterIndex);
+		
+		var rowStart = afterTr.offset().top;
+		var rowHeight = afterTr.outerHeight();
+		var rowMiddle = rowStart+(rowHeight/2);
+		
+		afterTr.after(tableRowEl);
+		
+		if(rowMiddle > scrollMiddle){
+			var move = rowMiddle - scrollMiddle;
+			$(scrollEl).scrollTop($(scrollEl).scrollTop() + move);
+		}
+		
+		$(tbody).find("tr").removeClass("current-row");
+		$(tableRowEl).addClass("current-row");
+	});
+}
+
+
+/**************************************************************************
+* 행 번호 표시 테이블
+**************************************************************************/
+function fnMakeRowNumberingTable(tbody, markerFinder, markerSetter){
+	
+	var moCallbackFunc = function(mutationList, observer){
+		var target = mutationList[0].target;
+		
+		$(target).find("tr").each(function(idx, item){
+			markerSetter(markerFinder(item),idx+1);
+		});
+	};
+	var mo = new MutationObserver(moCallbackFunc);
+	mo.observe(tbody, {childList : true});
+}