|
|
|
@ -41,8 +41,8 @@
|
|
|
|
|
<div class="row mb-3 justify-content-start">
|
|
|
|
|
<div class="col-md-12">
|
|
|
|
|
<div class="float-start">
|
|
|
|
|
<button type="button" id="btnUniqueAdd--${pageName}" class="btn btn-info">추가</button>
|
|
|
|
|
<button type="button" id="btnUniqueDel--${pageName}" class="btn btn-info">삭제</button>
|
|
|
|
|
<button type="button" id="btnUniqueAdd--${pageName}" class="btn btn-info">+ 추가</button>
|
|
|
|
|
<button type="button" id="btnUniqueDel--${pageName}" class="btn btn-info">- 삭제</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -54,8 +54,9 @@
|
|
|
|
|
id="tableUnique--${pageName}" aria-describedby="DataTables_Table_0_info">
|
|
|
|
|
<thead class="sticky-thead">
|
|
|
|
|
<tr id="theadTrUnique--${pageName}">
|
|
|
|
|
<th style="width:50px"></th>
|
|
|
|
|
<th style="width:200px">출력항목명</th>
|
|
|
|
|
<th style="width:120px">텍스트/이미지</th>
|
|
|
|
|
<th style="width:120px">유형</th>
|
|
|
|
|
<th style="width:120px">위치(좌)</th>
|
|
|
|
|
<th style="width:120px">위치(상)</th>
|
|
|
|
|
<th style="width:120px">사이즈(좌우)</th>
|
|
|
|
@ -69,89 +70,6 @@
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody id="tbodyUnique--${pageName}">
|
|
|
|
|
</tbody>
|
|
|
|
|
<template id="foundUnique--${pageName}">
|
|
|
|
|
<tr data-key="{OTPT_FORM_ID}">
|
|
|
|
|
<td>
|
|
|
|
|
<input type="text" readonly />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="text" readonly />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<option value="left">왼쪽</option>
|
|
|
|
|
<option value="center">중앙</option>
|
|
|
|
|
<option value="right">오른쪽</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<option value="gulimche">굴림체</option>
|
|
|
|
|
<option value="gulim">굴림</option>
|
|
|
|
|
<option value="batangche">바탕체</option>
|
|
|
|
|
<option value="batang">바탕</option>
|
|
|
|
|
<option value="dotumche">돋움체</option>
|
|
|
|
|
<option value="dotum">돋움</option>
|
|
|
|
|
<option value="gungsuhche">궁서체</option>
|
|
|
|
|
<option value="gungsuh">궁서</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<option value="8">8</option>
|
|
|
|
|
<option value="9">9</option>
|
|
|
|
|
<option value="10">10</option>
|
|
|
|
|
<option value="11">11</option>
|
|
|
|
|
<option value="12">12</option>
|
|
|
|
|
<option value="13">13</option>
|
|
|
|
|
<option value="14">14</option>
|
|
|
|
|
<option value="15">15</option>
|
|
|
|
|
<option value="16">16</option>
|
|
|
|
|
<option value="17">17</option>
|
|
|
|
|
<option value="18">18</option>
|
|
|
|
|
<option value="19">19</option>
|
|
|
|
|
<option value="20">20</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<option value="BLACK">검정</option>
|
|
|
|
|
<option value="RED">빨강</option>
|
|
|
|
|
<option value="ORANGE">주황</option>
|
|
|
|
|
<option value="YELLOW">노랑</option>
|
|
|
|
|
<option value="YELLOW_GREEN">연두</option>
|
|
|
|
|
<option value="GREEN">초록</option>
|
|
|
|
|
<option value="CYAN">청록</option>
|
|
|
|
|
<option value="BLUE">파랑</option>
|
|
|
|
|
<option value="VIOLET">보라</option>
|
|
|
|
|
<option value="MAGENTA">마젠타</option>
|
|
|
|
|
<option value="DEEP_PINK">짙은분홍</option>
|
|
|
|
|
<option value="LIGHT_GREY">밝은회색</option>
|
|
|
|
|
<option value="GREY">회색</option>
|
|
|
|
|
<option value="DARK_GREY">어두운회색</option>
|
|
|
|
|
<option value="WHITE">하양</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<option value="FILL">일반</option>
|
|
|
|
|
<option value="FILL_STROKE">굵게</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</template>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -160,8 +78,8 @@
|
|
|
|
|
<div class="row mb-3 justify-content-start">
|
|
|
|
|
<div class="col-md-12">
|
|
|
|
|
<div class="float-start">
|
|
|
|
|
<button type="button" id="btnMultipleAdd--${pageName}" class="btn btn-info">추가</button>
|
|
|
|
|
<button type="button" id="btnMultipleDel--${pageName}" class="btn btn-info">삭제</button>
|
|
|
|
|
<button type="button" id="btnMultipleAdd--${pageName}" class="btn btn-info">+ 추가</button>
|
|
|
|
|
<button type="button" id="btnMultipleDel--${pageName}" class="btn btn-info">- 삭제</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -173,8 +91,9 @@
|
|
|
|
|
id="tableMultiple--${pageName}" aria-describedby="DataTables_Table_0_info">
|
|
|
|
|
<thead class="sticky-thead">
|
|
|
|
|
<tr id="theadTrMultiple--${pageName}">
|
|
|
|
|
<th style="width:50px"></th>
|
|
|
|
|
<th style="width:200px">출력항목명</th>
|
|
|
|
|
<th style="width:120px">텍스트/이미지</th>
|
|
|
|
|
<th style="width:120px">유형</th>
|
|
|
|
|
<th style="width:120px">위치(좌)</th>
|
|
|
|
|
<th style="width:120px">위치(상)</th>
|
|
|
|
|
<th style="width:120px">사이즈(좌우)</th>
|
|
|
|
@ -188,35 +107,59 @@
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody id="tbodyMultiple--${pageName}">
|
|
|
|
|
</tbody>
|
|
|
|
|
<template id="foundMultiple--${pageName}">
|
|
|
|
|
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<form id="frmEdit--${pageName}" name="frmEdit">
|
|
|
|
|
<input type="hidden" name="sggCd" />
|
|
|
|
|
<input type="hidden" name="taskSeCd" />
|
|
|
|
|
<input type="hidden" name="sndngSeCd" />
|
|
|
|
|
<input type="hidden" name="otptPaperSeCd" />
|
|
|
|
|
|
|
|
|
|
<input type="text" name="dialogId" hidden />
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
|
|
<span id="tempArea--${pageName}" hidden></span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<template id="found--${pageName}">
|
|
|
|
|
<tr data-key="{OTPT_FORM_ID}">
|
|
|
|
|
<td>
|
|
|
|
|
<select></select>
|
|
|
|
|
<td data-col="checkbox">
|
|
|
|
|
<input type="checkbox" class="form-check-input" />
|
|
|
|
|
</td>
|
|
|
|
|
<td data-col="otptNm">
|
|
|
|
|
<select class="form-select" onchange="pageObject['${pageName}'].fnChangeComponent(this);">
|
|
|
|
|
{COMPONENTS}
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="text" readonly />
|
|
|
|
|
<td data-col="componentType">
|
|
|
|
|
<input type="text" class="form-control w-px-90" readonly />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
<td data-col="leftPstn">
|
|
|
|
|
<input type="number" class="form-control w-px-90" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
<td data-col="topPstn">
|
|
|
|
|
<input type="number" class="form-control w-px-90" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
<td data-col="widthSz">
|
|
|
|
|
<input type="number" class="form-control w-px-90" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<input type="number" min="0" max="300" />
|
|
|
|
|
<td data-col="heightSz">
|
|
|
|
|
<input type="number" class="form-control w-px-90" min="0" max="300" />
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<td data-col="textSort">
|
|
|
|
|
<select class="form-select">
|
|
|
|
|
<option value="left">왼쪽</option>
|
|
|
|
|
<option value="center">중앙</option>
|
|
|
|
|
<option value="right">오른쪽</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<td data-col="fontNm">
|
|
|
|
|
<select class="form-select">
|
|
|
|
|
<option value="gulimche">굴림체</option>
|
|
|
|
|
<option value="gulim">굴림</option>
|
|
|
|
|
<option value="batangche">바탕체</option>
|
|
|
|
@ -227,8 +170,8 @@
|
|
|
|
|
<option value="gungsuh">궁서</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<td data-col="fontSz">
|
|
|
|
|
<select class="form-select">
|
|
|
|
|
<option value="8">8</option>
|
|
|
|
|
<option value="9">9</option>
|
|
|
|
|
<option value="10">10</option>
|
|
|
|
@ -244,8 +187,8 @@
|
|
|
|
|
<option value="20">20</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<td data-col="fontColor">
|
|
|
|
|
<select class="form-select">
|
|
|
|
|
<option value="BLACK">검정</option>
|
|
|
|
|
<option value="RED">빨강</option>
|
|
|
|
|
<option value="ORANGE">주황</option>
|
|
|
|
@ -263,33 +206,19 @@
|
|
|
|
|
<option value="WHITE">하양</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
<td>
|
|
|
|
|
<select>
|
|
|
|
|
<td data-col="fontStyle">
|
|
|
|
|
<select class="form-select">
|
|
|
|
|
<option value="FILL">일반</option>
|
|
|
|
|
<option value="FILL_STROKE">굵게</option>
|
|
|
|
|
</select>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</template>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<form id="frmEdit--${pageName}" name="frmEdit">
|
|
|
|
|
<input type="hidden" name="sggCd" />
|
|
|
|
|
<input type="hidden" name="taskSeCd" />
|
|
|
|
|
<input type="hidden" name="sndngSeCd" />
|
|
|
|
|
<input type="hidden" name="otptPaperSeCd" />
|
|
|
|
|
|
|
|
|
|
<input type="text" name="dialogId" hidden />
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
|
|
<span id="tempArea--${pageName}" hidden></span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
var FIM054 = new CommonCodes(${FIM054});
|
|
|
|
|
var FIM047 = new CommonCodes(${FIM047});
|
|
|
|
|
var FIM078 = new CommonCodes(${FIM078});
|
|
|
|
|
|
|
|
|
|
pageObject["${pageName}"] = {};
|
|
|
|
|
|
|
|
|
@ -297,17 +226,96 @@ $(document).ready(function(){
|
|
|
|
|
|
|
|
|
|
var $P = pageObject["${pageName}"];
|
|
|
|
|
|
|
|
|
|
$P.otptStngMap = {};
|
|
|
|
|
|
|
|
|
|
$("#btnSave--${pageName}").attr("disabled","disabled");
|
|
|
|
|
$("#btnUniqueAdd--${pageName}").attr("disabled","disabled");
|
|
|
|
|
$("#btnUniqueDel--${pageName}").attr("disabled","disabled");
|
|
|
|
|
$("#btnMultipleAdd--${pageName}").attr("disabled","disabled");
|
|
|
|
|
$("#btnMultipleDel--${pageName}").attr("disabled","disabled");
|
|
|
|
|
|
|
|
|
|
$P.fnLoad = () => {
|
|
|
|
|
|
|
|
|
|
var ff = new FimsFormFields("#frmSearch--${pageName}");
|
|
|
|
|
|
|
|
|
|
var query = ff.get();
|
|
|
|
|
ajax.post({
|
|
|
|
|
url : wctx.url("/sprt/sprt01/200/info.do"),
|
|
|
|
|
data : ff.get(),
|
|
|
|
|
data : query,
|
|
|
|
|
success : (resp) => {
|
|
|
|
|
$("#btnSave--${pageName}").removeAttr("disabled");
|
|
|
|
|
$("#btnUniqueAdd--${pageName}").removeAttr("disabled");
|
|
|
|
|
$("#btnUniqueDel--${pageName}").removeAttr("disabled");
|
|
|
|
|
$("#btnMultipleAdd--${pageName}").removeAttr("disabled");
|
|
|
|
|
$("#btnMultipleDel--${pageName}").removeAttr("disabled");
|
|
|
|
|
$("#tbodyUnique--${pageName}").html("");
|
|
|
|
|
$("#tbodyMultiple--${pageName}").html("");
|
|
|
|
|
|
|
|
|
|
$("#frmEdit--${pageName}").find("[name='sggCd']").val(query.sggCd);
|
|
|
|
|
$("#frmEdit--${pageName}").find("[name='taskSeCd']").val(query.taskSeCd);
|
|
|
|
|
$("#frmEdit--${pageName}").find("[name='sndngSeCd']").val(query.sndngSeCd);
|
|
|
|
|
$("#frmEdit--${pageName}").find("[name='otptPaperSeCd']").val(query.otptPaperSeCd);
|
|
|
|
|
|
|
|
|
|
$("#currentOtpt--${pageName}").text(resp.otptStngTitle);
|
|
|
|
|
$P.otptStngMap = resp.otptStngMap;
|
|
|
|
|
|
|
|
|
|
$P.renderOtptStngGrid("tbodyUnique--${pageName}",$P.otptStngMap.unique.prototypeList,$P.otptStngMap.unique.dataList);
|
|
|
|
|
$P.renderOtptStngGrid("tbodyMultiple--${pageName}",$P.otptStngMap.multiple.prototypeList,$P.otptStngMap.multiple.dataList);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
$P.renderOtptStngGrid = (tbodyId, prototypeList, dataList) => {
|
|
|
|
|
|
|
|
|
|
var components = "<option value='' data-component-type=''>선택</option>";
|
|
|
|
|
|
|
|
|
|
for(var i=0; i < prototypeList.length; i++){
|
|
|
|
|
var p = prototypeList[i];
|
|
|
|
|
components += "<option value='"+p.otptNm+"' data-component-type='"+p.componentType+"'>"+p.dscrp+"</option>";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
for(var i=0; i < dataList.length; i++){
|
|
|
|
|
var data = dataList[i];
|
|
|
|
|
var found = document.getElementById("found--${pageName}").innerHTML;
|
|
|
|
|
|
|
|
|
|
found = found.replace(/{OTPT_FORM_ID}/gi, data.OTPT_FORM_ID);
|
|
|
|
|
found = found.replace(/{COMPONENTS}/gi, components);
|
|
|
|
|
$("#"+tbodyId).append(found);
|
|
|
|
|
|
|
|
|
|
var lastTr = $("#"+tbodyId).find("tr").last()[0];
|
|
|
|
|
$($P.fnGetElement(lastTr,"otptNm")).val(data.OTPT_NM);
|
|
|
|
|
$($P.fnGetElement(lastTr,"componentType")).val(data.COMPONENT_TYPE);
|
|
|
|
|
$($P.fnGetElement(lastTr,"leftPstn")).val(data.LEFT_PSTN);
|
|
|
|
|
$($P.fnGetElement(lastTr,"topPstn")).val(data.TOP_PSTN);
|
|
|
|
|
$($P.fnGetElement(lastTr,"widthSz")).val(data.WIDTH_SZ);
|
|
|
|
|
$($P.fnGetElement(lastTr,"heightSz")).val(data.HEIGHT_SZ);
|
|
|
|
|
|
|
|
|
|
$($P.fnGetElement(lastTr,"textSort")).val(!isEmpty(data.TEXT_SORT) ? data.TEXT_SORT : "left");
|
|
|
|
|
$($P.fnGetElement(lastTr,"fontNm")).val(!isEmpty(data.FONT_NM) ? data.FONT_NM : "gulimche");
|
|
|
|
|
$($P.fnGetElement(lastTr,"fontSz")).val(!isEmpty(data.FONT_SZ) ? data.FONT_SZ : 10);
|
|
|
|
|
$($P.fnGetElement(lastTr,"fontColor")).val(!isEmpty(data.FONT_COLOR) ? data.FONT_COLOR : "BLACK");
|
|
|
|
|
$($P.fnGetElement(lastTr,"fontStyle")).val(!isEmpty(data.FONT_STYLE) ? data.FONT_STYLE : "FILL");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if(tbodyId == "tbodyUnique--${pageName}"){
|
|
|
|
|
$("#"+tbodyId).find("tr").each(function(){
|
|
|
|
|
var el = $P.fnGetElement(this,"otptNm");
|
|
|
|
|
$(el).attr("disabled","disabled");
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
$P.fnGetElement = (tableRow, colName) => {
|
|
|
|
|
return $(tableRow).find("td[data-col='"+colName+"']").children().first()[0];
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
$P.fnChangeComponent = (selectElement) => {
|
|
|
|
|
var tr = $(selectElement).parent().parent()[0];
|
|
|
|
|
var componentTypeEl = $P.fnGetElement(tr,"componentType");
|
|
|
|
|
|
|
|
|
|
var selectedOption = $(selectElement).find("option:selected")[0];
|
|
|
|
|
|
|
|
|
|
$(componentTypeEl).val(selectedOption.dataset.componentType);
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|