UserControl 변경: class -> function
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
|
||||||
|
Loading…
Reference in New Issue