UserControl 변경: class -> function

main
이범준 4 months ago
parent 239d18a496
commit f1a79edf7a

@ -1,127 +1,125 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%> <%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
<c:set var="prefixName" scope="request">사용자</c:set> <c:set var="prefixName" scope="request">사용자</c:set>
<!-- Page Body --> <div class="card" data-doctx="select-user"><!-- Page Body -->
<div class="card">
<div class="card-datatable text-nowrap"> <div class="card-datatable text-nowrap">
<div id="DataTables_Table_0_wrapper" class="dataTables_wrapper dt-bootstrap5 no-footer"> <div id="DataTables_Table_0_wrapper" class="dataTables_wrapper dt-bootstrap5 no-footer">
<div class="d-flex flex-row justify-content-between p-3"> <div class="d-flex flex-row justify-content-between p-3">
<div> <div>
<div class="input-group" id="DataTables_Table_0_length"> <div class="input-group" id="DataTables_Table_0_length">
<select id="_userBy" onchange="document.getElementById('_userTerm').focus();" aria-controls="DataTables_Table_0" class="form-select"> <select name="by" onchange="userSelector.find('term').focus();" aria-controls="DataTables_Table_0" class="form-select">
<option value="${infoPrefix}Name">이름</option> <option value="userName">이름</option>
<option value="${infoPrefix}Account">계정</option> <option value="userAccount">계정</option>
</select> </select>
<input id="_userTerm" autofocus type="text" placeholder="조회 조건을 입력하십시오." class="form-control"> <input name="term" autofocus type="text" placeholder="조회 조건을 입력하십시오." class="form-control">
</div> </div>
</div> </div>
<div> <div>
<button onclick="search${infoPrefix}s();" class="btn btn-primary">찾기</button> <button onclick="userSelector.search();" class="btn btn-primary">찾기</button>
</div> </div>
</div> </div>
<table class="datatables-ajax table table-bordered dataTable no-footer" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info"> <table class="datatables-ajax table table-bordered dataTable no-footer" >
<thead id="_${infoPrefix}Thead"> <thead name="userThead">
<tr><th tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="text-align:center;"><input onchange="${infoPrefix}Control.dataset.select(this.checked);" type="checkbox" class="form-check-input"></th> <tr><th tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="text-align:center;"><input onchange="userSelector.dataset.select(this.checked);" type="checkbox" class="form-check-input"></th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Email: activate to sort column ascending" >시군구명</th> <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" >시군구명</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Email: activate to sort column ascending" >기관명</th> <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" >기관명</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Email: activate to sort column ascending" >부서명</th> <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" >부서명</th>
<th class="sorting sorting_asc" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Full name: activate to sort column descending" >계정</th> <th class="sorting sorting_asc" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Full name: activate to sort column descending" >계정</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Email: activate to sort column ascending" >이름</th> <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" >이름</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Start date: activate to sort column ascending" >등록일자</th> <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" >등록일자</th>
</tr> </tr>
</thead> </thead>
<tbody id="_${infoPrefix}List"> <tbody name="userList">
</tbody> </tbody>
<template id="_${infoPrefix}Row"> <template name="userRow">
<tr data-key="{USER_ID}"> <tr data-key="{USER_ID}">
<td style="text-align:center;"><input value="{USER_ID}" onchange="${infoPrefix}Control.dataset.select('{USER_ID}', this.checked);" type="checkbox" class="form-check-input"></td> <td style="text-align:center;"><input value="{USER_ID}" onchange="userSelector.dataset.select('{USER_ID}', this.checked);" type="checkbox" class="form-check-input"></td>
<td onclick="${infoPrefix}Control.setCurrent('{USER_ID}')" ondblclick="${infoPrefix}Control.getInfo({})">{SGG_NM}</td> <td onclick="userSelector.setCurrent('{USER_ID}')" ondblclick="userSelector.getInfo({})">{SGG_NM}</td>
<td onclick="${infoPrefix}Control.setCurrent('{USER_ID}')" ondblclick="${infoPrefix}Control.getInfo({})">{INST_NM}</td> <td onclick="userSelector.setCurrent('{USER_ID}')" ondblclick="userSelector.getInfo({})">{INST_NM}</td>
<td onclick="${infoPrefix}Control.setCurrent('{USER_ID}')" ondblclick="${infoPrefix}Control.getInfo({})">{DEPT_NM}</td> <td onclick="userSelector.setCurrent('{USER_ID}')" ondblclick="userSelector.getInfo({})">{DEPT_NM}</td>
<td onclick="${infoPrefix}Control.setCurrent('{USER_ID}')" ondblclick="${infoPrefix}Control.getInfo({})">{USER_ACNT}</td> <td onclick="userSelector.setCurrent('{USER_ID}')" ondblclick="userSelector.getInfo({})">{USER_ACNT}</td>
<td onclick="${infoPrefix}Control.setCurrent('{USER_ID}')" ondblclick="${infoPrefix}Control.getInfo({})">{USER_NM}</td> <td onclick="userSelector.setCurrent('{USER_ID}')" ondblclick="userSelector.getInfo({})">{USER_NM}</td>
<td onclick="${infoPrefix}Control.setCurrent('{USER_ID}')" ondblclick="${infoPrefix}Control.getInfo({})">{REG_DT}</td> <td onclick="userSelector.setCurrent('{USER_ID}')" ondblclick="userSelector.getInfo({})">{REG_DT}</td>
</tr> </tr>
</template> </template>
<template id="_${infoPrefix}NotFound"> <template name="userNotFound">
<tr class="odd"> <tr class="odd">
<td valign="top" colspan="7" class="dataTables_empty text-center">${prefixName} 정보를 찾지 못했습니다.</td> <td valign="top" colspan="7" class="dataTables_empty text-center">${prefixName} 정보를 찾지 못했습니다.</td>
</tr> </tr>
</template> </template>
</table> </table>
<div class="d-flex flex-row p-3 justify-content-between"> <div class="d-flex flex-row p-3 justify-content-between">
<label id="_${infoPrefix}PagingInfo" class="dataTables_info" role="status" aria-live="polite"></label> <label name="userPagingInfo" class="dataTables_info" role="status" aria-live="polite"></label>
<ul id="_${infoPrefix}Paging" class="pagination pagination-primary"> <ul name="userPaging" class="pagination pagination-primary">
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</div> </div><!--/ Page Body -->
<!--/ Page Body -->
<script > <script >
var ${infoPrefix}Control = new UserControl(); var userSelector = newUserControl("select-user");
function getSelectedUser() { function getSelectedUser() {
let selected = ${infoPrefix}Control.dataset.getKeys("selected"); let selected = userSelector.dataset.getKeys("selected");
if (selected.length < 1) if (selected.length < 1)
return dialog.alert("사용자를 선택하십시오."); return dialog.alert("사용자를 선택하십시오.");
else else
return selected; return selected;
} }
function search${infoPrefix}s() { userSelector.search = () => {
${infoPrefix}Control.query = { userSelector.query = {
by:$("#_userBy").val(), by: userSelector.find("by").value,
term:$("#_userTerm").val() term: userSelector.find("term").value
}; };
${infoPrefix}Control.load(1); userSelector.load(1);
} }
${infoPrefix}Control.onDatasetChange = obj => { userSelector.onDatasetChange = obj => {
let ${infoPrefix}List = ${infoPrefix}Control.dataset; let list = userSelector.dataset;
let empty = ${infoPrefix}List.empty; let empty = list.empty;
let trs = empty ? let trs = empty ?
[document.getElementById("_${infoPrefix}NotFound").innerHTML] : <%-- from template#${infoPrefix}NotFound --%> [userSelector.find("userNotFound").innerHTML] :
${infoPrefix}List.inStrings(document.getElementById("_${infoPrefix}Row").innerHTML); <%-- from template#${infoPrefix}Row --%> list.inStrings(userSelector.find("userRow").innerHTML);
$("#_${infoPrefix}List").html(trs.join()); userSelector.find("userList").innerHTML = trs.join("");
$("#_${infoPrefix}Thead").find("th input[type='checkbox']").prop("checked", false); userSelector.querySelector("[name='userThead'] th input[type='checkbox']").checked = false;
$("#_${infoPrefix}Paging").setPaging({ $(userSelector.selector("[name='userPaging']")).setPaging({
list:${infoPrefix}Control.dataset, list: list,
prefix:${infoPrefix}Control.prefix, prefix: userSelector.prefix,
start:obj.${infoPrefix}Start, start: obj.userStart,
totalSize:obj.${infoPrefix}Total, totalSize: obj.userTotal,
fetchSize:obj.${infoPrefix}Fetch, fetchSize: obj.userFetch,
func:"${infoPrefix}Control.load({index})" func:"userSelector.load({index})"
}); });
}; };
${infoPrefix}Control.onCurrentChange = item => { userSelector.onCurrentChange = item => {
if (!item) return; if (!item) return;
let key = item.data.USER_ID; let key = item.data.USER_ID;
$("#_${infoPrefix}List").setCurrentRow(key); $(userSelector.selector("[name='userList']")).setCurrentRow(key);
}; };
${infoPrefix}Control.onSelectionChange = selected => { userSelector.onSelectionChange = selected => {
let ${infoPrefix}List = ${infoPrefix}Control.dataset; let list = userSelector.dataset;
let keys = selected.map(e => ${infoPrefix}List.getKey(e)); let keys = selected.map(e => list.getKey(e));
$("#_${infoPrefix}List input[type='checkbox']").each(function() { $(userSelector.selector("[name='userList'] input[type='checkbox']")).each(function() {
let checkbox = $(this); let checkbox = $(this);
checkbox.prop("checked", keys.includes(checkbox.val())); checkbox.prop("checked", keys.includes(checkbox.val()));
}); });
}; };
$("#_userTerm").onEnterPress(search${infoPrefix}s); $(userSelector.selector("[name='term']")).onEnterPress(userSelector.search);
$(function(){ $(function(){
${onload} ${onload}
${infoPrefix}Control.setData({ userSelector.setData({
${infoPrefix}List:${userList}, userList:${userList},
${infoPrefix}Start:${userStart}, userStart:${userStart},
${infoPrefix}Fetch:${userFetch}, userFetch:${userFetch},
${infoPrefix}Total:${userTotal} userTotal:${userTotal}
}); });
}); });
//# sourceURL=select-user.jsp //# sourceURL=select-user.jsp

@ -1,6 +1,6 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%> <%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
<form id="infoPrefix-form"> <form id="infoPrefix-form" data-doctx="user">
<input type="hidden" name="cntnSeCd" data-map="CNTN_SE_CD" /> <input type="hidden" name="cntnSeCd" data-map="CNTN_SE_CD" />
<div class="row g-3"> <div class="row g-3">
@ -193,7 +193,7 @@
<script type="text/javascript"> <script type="text/javascript">
var infoPrefixFields = new FimsFormFields("#infoPrefix-form"); var infoPrefixFields = new FimsFormFields("#infoPrefix-form");
infoPrefixControl.setInfo = (obj) => { infoPrefixCtrl.setInfo = (obj) => {
let create = isEmpty(obj.data.USER_ACNT); let create = isEmpty(obj.data.USER_ACNT);
if(create){ if(create){
obj.data.CNTN_SE_CD = "01"; obj.data.CNTN_SE_CD = "01";
@ -208,7 +208,7 @@ infoPrefixControl.setInfo = (obj) => {
$("#btnSelectOgdp").removeAttr("hidden"); $("#btnSelectOgdp").removeAttr("hidden");
} }
infoPrefixFields.set(infoPrefixControl,obj); infoPrefixFields.set(infoPrefixCtrl,obj);
$("#infoPrefix-form input[name='account']").prop("readonly", !create); $("#infoPrefix-form input[name='account']").prop("readonly", !create);
$("#infoPrefix-form input[name='name']").prop("readonly", !create); $("#infoPrefix-form input[name='name']").prop("readonly", !create);
@ -260,19 +260,19 @@ infoPrefixControl.setInfo = (obj) => {
let input = $(this), let input = $(this),
name = input.attr("data-map"), name = input.attr("data-map"),
val = input.val(); val = input.val();
infoPrefixControl.setValue(name, val); infoPrefixCtrl.setValue(name, val);
}) })
.onEnterPress(saveinfoPrefix); .onEnterPress(saveinfoPrefix);
document.querySelector("#infoPrefix-form input[name='" + (create ? "account" : "name") + "']").focus(); document.querySelector("#infoPrefix-form input[name='" + (create ? "account" : "name") + "']").focus();
} }
infoPrefixControl.onModify = (changed) => { infoPrefixCtrl.onModify = (changed) => {
if (["USER_NM", "EML_ADRS", "MBL_TELNO"].filter(e => changed.includes(e)).length < 1) if (["USER_NM", "EML_ADRS", "MBL_TELNO"].filter(e => changed.includes(e)).length < 1)
return; return;
renderinfoPrefixList(); infoPrefixCtrl.renderList();
infoPrefixControl.dataset.setState(); infoPrefixCtrl.dataset.setState();
} }
function saveinfoPrefix() { function saveinfoPrefix() {
@ -294,7 +294,7 @@ function saveinfoPrefix() {
dialog.alert({ dialog.alert({
content:"현재 prefixName 정보를 저장하시겠습니까?", content:"현재 prefixName 정보를 저장하시겠습니까?",
onOK:() => { onOK:() => {
infoPrefixControl.save(infoPrefixFields.get()); infoPrefixCtrl.save(infoPrefixFields.get());
} }
}); });
} }

@ -1,29 +1,28 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%> <%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
<c:set var="prefixName" scope="request">사용자</c:set> <c:set var="prefixName" scope="request">사용자</c:set>
<!-- Page Body --> <div data-doctx="user" class="d-flex flex-column flex-grow-1"><!-- Page Body -->
<div class="d-flex flex-column flex-grow-1">
<div id="DataTables_Table_0_wrapper" class="dataTables_wrapper dt-bootstrap5 no-footer"> <div id="DataTables_Table_0_wrapper" class="dataTables_wrapper dt-bootstrap5 no-footer">
<div class="d-flex flex-row justify-content-between p-3"> <div class="d-flex flex-row justify-content-between p-3">
<div class="d-flex flex-grow-1 me-5" id="${infoPrefix}-query"> <div class="d-flex flex-grow-1 me-5">
<div class="input-group me-3 w-px-400"> <div class="input-group me-3 w-px-400">
<select id="${infoPrefix}by" name="by" onchange="document.getElementById('${infoPrefix}term').focus();" aria-controls="DataTables_Table_0" class="form-select"> <select name="by" onchange="userCtrl.find('term').focus();" class="form-select">
<option value="${infoPrefix}Name">이름</option> <option value="userName">이름</option>
<option value="${infoPrefix}Account">계정</option> <option value="userAccount">계정</option>
</select> </select>
<input id="${infoPrefix}term" name="term" autofocus type="text" placeholder="조회 조건을 입력하십시오." class="form-control"> <input name="term" autofocus type="text" placeholder="조회 조건을 입력하십시오." class="form-control">
</div> </div>
<label for="${infoPrefix}status" class="form-label fw-bold px-3 d-flex flex-wrap align-content-center justify-content-center">상태</label> <label for="userStatus" class="form-label fw-bold px-3 d-flex flex-wrap align-content-center justify-content-center">상태</label>
<select id="${infoPrefix}status" name="status" class="form-select"> <select name="status" class="form-select">
<option value="">전체</option> <option value="">전체</option>
<option value="A">신청</option> <option value="A">신청</option>
<option value="P">승인</option> <option value="P">승인</option>
<option value="D">삭제</option> <option value="D">삭제</option>
</select> </select>
<label for="${infoPrefix}type" class="form-label fw-bold px-3 d-flex flex-wrap align-content-center justify-content-center">접속구분</label> <label for="type" class="form-label fw-bold px-3 d-flex flex-wrap align-content-center justify-content-center">접속구분</label>
<select id="${infoPrefix}type" name="type" class="form-select"> <select name="type" class="form-select">
<option value="">전체</option> <option value="">전체</option>
<c:forEach items="${CMN009List}" var="item"> <c:forEach items="${CMN009List}" var="item">
<option value="${item.code}">${item.value}</option> <option value="${item.code}">${item.value}</option>
@ -31,16 +30,15 @@
</select> </select>
</div> </div>
<div> <div>
<button onclick="search${infoPrefix}s();" class="btn btn-primary">찾기</button> <button onclick="userCtrl.search();" class="btn btn-primary">찾기</button>
<button onclick="${infoPrefix}Control.newInfo();" class="btn btn-primary">+ 추가</button> <button onclick="userCtrl.newInfo();" class="btn btn-primary">+ 추가</button>
<button id="btnRemove${infoPrefix}s" onclick="remove${infoPrefix}s();" class="btn btn-primary">- 제거</button> <button onclick="userCtrl.removeUsers();" class="btn btn-primary enable-onfound">- 제거</button>
</div> </div>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="datatables-ajax table table-bordered dataTable no-footer" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info"> <table class="datatables-ajax table table-bordered dataTable no-footer">
<thead id="${infoPrefix}Thead"> <thead name="userThead">
<tr> <tr><th tabindex="0" style="width: 158.828px; text-align:center;"><input onchange="userCtrl.select(this.checked);" type="checkbox" class="form-check-input"></th>
<th tabindex="0" style="width: 158.828px; text-align:center;"><input onchange="${infoPrefix}Control.select(this.checked);" type="checkbox" class="form-check-input"></th>
<th class="sorting" style="width: 146.156px;">상태</th> <th class="sorting" style="width: 146.156px;">상태</th>
<th class="sorting" style="width: 146.156px;">사용자구분</th> <th class="sorting" style="width: 146.156px;">사용자구분</th>
<th class="sorting" style="width: 146.156px;">기관</th> <th class="sorting" style="width: 146.156px;">기관</th>
@ -52,11 +50,11 @@
<th class="sorting" style="width: 230.469px;">등록일자</th> <th class="sorting" style="width: 230.469px;">등록일자</th>
</tr> </tr>
</thead> </thead>
<tbody id="${infoPrefix}List"> <tbody name="userList">
</tbody> </tbody>
<template id="${infoPrefix}Row"> <template name="userRow">
<tr data-key="{USER_ID}"> <tr data-key="{USER_ID}">
<td style="text-align:center;"><input value="{USER_ID}" onchange="${infoPrefix}Control.select('{USER_ID}', this.checked);" type="checkbox" class="form-check-input"></td> <td style="text-align:center;"><input value="{USER_ID}" onchange="userCtrl.select('{USER_ID}', this.checked);" type="checkbox" class="form-check-input"></td>
<td {onclick} {ondblclick}>{STTS_NM}</td> <td {onclick} {ondblclick}>{STTS_NM}</td>
<td {onclick} {ondblclick}>{USER_SE_NM}</td> <td {onclick} {ondblclick}>{USER_SE_NM}</td>
<td {onclick} {ondblclick}>{INST_NM}</td> <td {onclick} {ondblclick}>{INST_NM}</td>
@ -68,7 +66,7 @@
<td {onclick} {ondblclick}>{REG_DT}</td> <td {onclick} {ondblclick}>{REG_DT}</td>
</tr> </tr>
</template> </template>
<template id="${infoPrefix}NotFound"> <template name="userNotFound">
<tr class="odd"> <tr class="odd">
<td valign="top" colspan="10" class="dataTables_empty text-center">${prefixName} 정보를 찾지 못했습니다.</td> <td valign="top" colspan="10" class="dataTables_empty text-center">${prefixName} 정보를 찾지 못했습니다.</td>
</tr> </tr>
@ -76,104 +74,100 @@
</table> </table>
</div> </div>
<div class="d-flex flex-row p-3 justify-content-between"> <div class="d-flex flex-row p-3 justify-content-between">
<label id="${infoPrefix}PagingInfo" class="dataTables_info" role="status" aria-live="polite"></label> <label name="userPagingInfo" class="dataTables_info" role="status" aria-live="polite"></label>
<ul id="${infoPrefix}Paging" class="pagination pagination-primary"> <ul name="userPaging" class="pagination pagination-primary">
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
<!--/ Page Body --> <!--/ Page Body -->
<script > <script >
var ${infoPrefix}Control = new UserControl(); var userCtrl = newUserControl();
function search${infoPrefix}s() { userCtrl.search = () => {
${infoPrefix}Control.query = { userCtrl.query = {
by: $("#${infoPrefix}-query [name='by']").val(), by: userCtrl.find("by").value,
term: $("#${infoPrefix}-query [name='term']").val(), term: userCtrl.find("term").value,
status: $("#${infoPrefix}-query [name='status']").val(), status: userCtrl.find("status").value,
type: $("#${infoPrefix}-query [name='type']").val(), type: userCtrl.find("type").value,
}; };
if(${infoPrefix}Control.query.by == "userAccount"){ if(userCtrl.query.by == "userAccount"){
${infoPrefix}Control.query.term = ${infoPrefix}Control.query.term.toUpperCase(); userCtrl.query.term = userCtrl.query.term.toUpperCase();
} }
${infoPrefix}Control.load(1); userCtrl.load(1);
} }
function remove${infoPrefix}s() { userCtrl.removeUsers= () => {
dialog.alert({ dialog.alert({
content:"선택한 ${prefixName} 정보를 제거하시겠습니까?", content:"선택한 ${prefixName} 정보를 제거하시겠습니까?",
onOK:() => { onOK:() => {
${infoPrefix}Control.remove(); userCtrl.remove();
} }
}); });
} }
function render${infoPrefix}List() { userCtrl.renderList = () => {
let ${infoPrefix}List = ${infoPrefix}Control.dataset; let userList = userCtrl.dataset;
let empty = ${infoPrefix}List.empty; let empty = userList.empty;
let trs = empty ? let trs = empty ?
[document.getElementById("${infoPrefix}NotFound").innerHTML] : <%-- from template#${infoPrefix}NotFound --%> [document.getElementById("userNotFound").innerHTML] : <%-- from template#userNotFound --%>
${infoPrefix}List.inStrings( userList.inStrings(
document.getElementById("${infoPrefix}Row").innerHTML, <%-- from template#${infoPrefix}Row --%> userCtrl.find("userRow").innerHTML, <%-- from template#userRow --%>
(str, dataItem) => str (str, dataItem) => str
.replace(/{onclick}=""/gi, 'onclick="userControl.setCurrent(\'' + dataItem.getValue("USER_ID") + '\');"') .replace(/{onclick}=""/gi, 'onclick="userCtrl.setCurrent(\'' + dataItem.getValue("USER_ID") + '\');"')
.replace(/{ondblclick}=""/gi, 'ondblclick="userControl.getInfo(\'' + dataItem.getValue("USER_ID") + '\')"') .replace(/{ondblclick}=""/gi, 'ondblclick="userCtrl.getInfo(\'' + dataItem.getValue("USER_ID") + '\')"')
<%-- OR
(str, dataItem) => {
let userID = dataItem.getValue("USER_ID");
return str
.replace(/{onclick}=""/gi, 'onclick="userControl.setCurrent(\'' + userID + '\');"')
.replace(/{ondblclick}=""/gi, 'ondblclick="userControl.getInfo(\'' + userID + '\')"')
}
--%>
); );
$("#${infoPrefix}List").html(trs.join()); userCtrl.find("userList").innerHTML = trs.join("");
$("#${infoPrefix}Thead").find("th input[type='checkbox']").prop("checked", false); userCtrl.querySelector("[name='userThead'] th input[type='checkbox']").checked = false;
} }
${infoPrefix}Control.onDatasetChange = obj => { userCtrl.onDatasetChange = obj => {
render${infoPrefix}List(); userCtrl.renderList();
$("#${infoPrefix}Paging").setPaging({ $(userCtrl.selector("[name='userPaging']")).setPaging({
list:${infoPrefix}Control.dataset, list:userCtrl.dataset,
prefix:${infoPrefix}Control.prefix, prefix:userCtrl.prefix,
start:obj.${infoPrefix}Start, start:obj.userStart,
totalSize:obj.${infoPrefix}Total, totalSize:obj.userTotal,
fetchSize:obj.${infoPrefix}Fetch, fetchSize:obj.userFetch,
func:"${infoPrefix}Control.load({index})" func:"userCtrl.load({index})"
}); });
}; };
${infoPrefix}Control.onCurrentChange = item => { userCtrl.onCurrentChange = item => {
if (!item) return; if (!item) return;
let key = item.data.USER_ID; let key = item.data.USER_ID;
$("#${infoPrefix}List").setCurrentRow(key); $(userCtrl.selector("[name='userList']")).setCurrentRow(key);
}; };
${infoPrefix}Control.onSelectionChange = selected => { userCtrl.onSelectionChange = selected => {
let ${infoPrefix}List = ${infoPrefix}Control.dataset; let userList = userCtrl.dataset;
let keys = selected.map(e => ${infoPrefix}List.getKey(e)); let keys = selected.map(e => userList.getKey(e));
$("#${infoPrefix}List input[type='checkbox']").each(function() {
let checkbox = $(this); userCtrl.querySelectorAll("[name='userList'] input[type='checkbox']")
checkbox.prop("checked", keys.includes(checkbox.val())); .forEach(node => {
node.checked = keys.includes(node.value);
}); });
$("#btnRemove${infoPrefix}s").prop("disabled", keys.length < 1); userCtrl.querySelectorAll(".enable-onfound")
.forEach(node => {
node.disabled = keys.length < 1;
});
}; };
$("#${infoPrefix}term").onEnterPress(search${infoPrefix}s); $(userCtrl.selector("[name='term']")).onEnterPress(userCtrl.search);
$(function(){ $(function(){
${onload} ${onload}
${infoPrefix}Control.setData({ userCtrl.setData({
${infoPrefix}List:${userList}, userList:${userList},
${infoPrefix}Start:${userStart}, userStart:${userStart},
${infoPrefix}Fetch:${userFetch}, userFetch:${userFetch},
${infoPrefix}Total:${userTotal} userTotal:${userTotal}
}); });
}); });
//# sourceURL=user-main.jsp //# sourceURL=user-main.jsp

@ -33,7 +33,7 @@
</head> </head>
<body> <body>
<form id="user-form"> <form id="user-form" data-doctx="user">
<input type="hidden" name="cntnSeCd" data-map="CNTN_SE_CD" /> <input type="hidden" name="cntnSeCd" data-map="CNTN_SE_CD" />
<div class="row g-3 mt-4"> <div class="row g-3 mt-4">
@ -237,7 +237,7 @@
<script src="/resources/js/base/fimsFormFields.js"></script> <script src="/resources/js/base/fimsFormFields.js"></script>
<script> <script>
var userFields = new FimsFormFields("#user-form"); var userFields = new FimsFormFields("#user-form");
var userControl = new UserControl(); var userControl = newUserControl();
userControl.setInfo = obj => { userControl.setInfo = obj => {
userFields.set(userControl,obj); userFields.set(userControl,obj);

Loading…
Cancel
Save