<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
<div class="d-flex flex-row justify-content-end p-3">
	<div>
		<button id="btnAddAuthUsers" onclick="${infoPrefix}Control.addUsers();" class="btn btn-primary">+ 추가</button>
		<button id="btnRemoveAuthUsers" onclick="removeAuthUsers();" class="btn btn-primary">- 제거</button>
	</div>
</div>
<table class="datatables-ajax table table-bordered dataTable no-footer" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info">
	<thead>
		<tr>
			<th tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="text-align:center;"><input id="authUserToggler" onchange="${infoPrefix}Control.users.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" aria-label="Email: activate to sort column ascending" >기관명</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" aria-label="Email: activate to sort column ascending" >사용자 계정</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" aria-label="Start date: activate to sort column ascending" >등록일자</th>
		</tr>
	</thead>
    <tbody id="authUserList">
	</tbody>
    <template id="authUserRow">
       	<tr data-key="{AUTH_ID}-{USER_ID}">
            <td style="text-align:center;"><input value="{AUTH_ID}-{USER_ID}" onchange="${infoPrefix}Control.users.select('{AUTH_ID}-{USER_ID}', this.checked);" type="checkbox" class="form-check-input"></td>
            <td onclick="${infoPrefix}Control.users.setCurrent('{AUTH_ID}-{USER_ID}')">{SGG_NM}</td>
            <td onclick="${infoPrefix}Control.users.setCurrent('{AUTH_ID}-{USER_ID}')">{INST_NM}</td>
            <td onclick="${infoPrefix}Control.users.setCurrent('{AUTH_ID}-{USER_ID}')">{DEPT_NM}</td>
            <td onclick="${infoPrefix}Control.users.setCurrent('{AUTH_ID}-{USER_ID}')">{USER_ACNT}</td>
            <td onclick="${infoPrefix}Control.users.setCurrent('{AUTH_ID}-{USER_ID}')">{USER_NM}</td>
            <td onclick="${infoPrefix}Control.users.setCurrent('{AUTH_ID}-{USER_ID}">{REG_DT}</td>
        </tr>
	</template>
	<template id="authUserNotFound">
		<tr class="odd">
			<td valign="top" colspan="7" class="dataTables_empty text-center">사용자 정보를 찾지 못했습니다.</td>
		</tr>
	</template>
	<template id="implicitActions">
		<tr class="odd">
			<td valign="top" colspan="7" class="dataTables_empty text-center">{authority}는 사용자를 지정하지 않습니다.</td>
		</tr>
	</template>
</table>
<div class="d-flex flex-row p-3 justify-content-between">
	<label id="authUserPagingInfo" class="dataTables_info" role="status" aria-live="polite"></label>
              <ul id="authUserPaging" class="pagination pagination-primary">
              </ul>
</div>
<c:set var="userFunc" scope="request">
function removeAuthUsers() {
	dialog.alert({
		content:"선택한 사용자를 삭제하시겠습니까?",
		onOK:() => {
			${infoPrefix}Control.removeUsers();
		}
	});
}

${infoPrefix}Control.onUserListChange = obj => {
	let authority = ${infoPrefix}Control.authorities.getCurrent();
	authority = authority ? authority.AUTH_NM : "";
	let ${infoPrefix}List = ${infoPrefix}Control.users.dataset;
	let empty = ${infoPrefix}List.empty;
	
	let trs = 
		${infoPrefix}Control.authorities.isImplicit() ? [document.getElementById("implicitActions").innerHTML.replace(/{authority}/, authority)] :
		empty ? [document.getElementById("authUserNotFound").innerHTML] : <%-- from template#${infoPrefix}NotFound --%>
		${infoPrefix}List.inStrings(document.getElementById("authUserRow").innerHTML); <%-- from template#${infoPrefix}Row --%>
	$("#authUserList").html(trs.join());
	$("#authUserToggler").prop("checked", false);

	$("#authUserPaging").setPaging({
		list:${infoPrefix}Control.users.dataset,
		prefix:${infoPrefix}Control.users.prefix,
		start:obj.userStart,
		totalSize:obj.userTotal,
		fetchSize:obj.userFetch,
		func:"${infoPrefix}Control.users.load({index})"
	});
};

${infoPrefix}Control.onCurrentUserChange = item => {
	if (!item) return;
	
	let data = item.data;
	let key = data.AUTH_ID + "-" + data.USER_ID;
	$("#authUserList").setCurrentRow(key);
};

${infoPrefix}Control.onUserSelect = selected => {
	let ${infoPrefix}List = ${infoPrefix}Control.users.dataset;
	let keys = selected.map(e => ${infoPrefix}List.getKey(e));
	$("#authUserList input[type='checkbox']").each(function() {
		let checkbox = $(this);
		checkbox.prop("checked", keys.includes(checkbox.val()));
	});
	
	$("#btnRemoveAuthUsers").prop("disabled", keys.length < 1);
};</c:set>