fix : 전체적인 팝업 그리드 다시 수정
psy
2 years ago
parent
e9b99ba657
commit
548a400887
@ -1,286 +1,296 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ include file="/WEB-INF/jsp/framework/taglibs.jsp" %>
|
||||
<%@ taglib prefix="validator" uri="http://www.springmodules.org/tags/commons-validator" %>
|
||||
|
||||
<style>
|
||||
ul li {
|
||||
color: #0f438a;
|
||||
margin: 2px 0 0 5px;
|
||||
}
|
||||
|
||||
div.popup, div.popup_inner{
|
||||
min-width: 680px;
|
||||
}
|
||||
table li {
|
||||
margin-top: 10px;
|
||||
}
|
||||
table li:not(.separator) span{
|
||||
border: solid #dddddd 1px;
|
||||
border-radius: 8px;
|
||||
padding: 3px;
|
||||
margin: 10px 2px 10px 0px;
|
||||
}
|
||||
#authorRescue {
|
||||
white-space: normal;
|
||||
word-break: break-word;
|
||||
}
|
||||
#authorRescue li, #authorList li {
|
||||
/* 가로 정렬 */
|
||||
margin: 10px 0 10px 0;
|
||||
padding: 0 0 0 0;
|
||||
border : 0;
|
||||
float: left;
|
||||
}
|
||||
table span {
|
||||
/* border: solid 1px gray; */
|
||||
padding: 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
table.tbl03 th {
|
||||
font-weight: bold;
|
||||
font-size: 100%;
|
||||
}
|
||||
ul li {
|
||||
color: #0f438a;
|
||||
margin: 2px 0 0 5px;
|
||||
}
|
||||
|
||||
div.popup, div.popup_inner {
|
||||
min-width: 680px;
|
||||
}
|
||||
|
||||
table li {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
table li:not(.separator) span {
|
||||
border: solid #dddddd 1px;
|
||||
border-radius: 8px;
|
||||
padding: 3px;
|
||||
margin: 10px 2px 10px 0px;
|
||||
}
|
||||
|
||||
#authorRescue {
|
||||
white-space: normal;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
#authorRescue li, #authorList li {
|
||||
/* 가로 정렬 */
|
||||
margin: 10px 0 10px 0;
|
||||
padding: 0 0 0 0;
|
||||
border: 0;
|
||||
float: left;
|
||||
}
|
||||
|
||||
table span {
|
||||
/* border: solid 1px gray; */
|
||||
padding: 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
table.tbl03 th {
|
||||
font-weight: bold;
|
||||
font-size: 100%;
|
||||
}
|
||||
</style>
|
||||
<!-- 검색 필드 박스 시작 -->
|
||||
|
||||
<validator:javascript formName="authHierarchyManage" staticJavascript="false" xhtml="true" cdata="false"/>
|
||||
|
||||
<div class="popup">
|
||||
<div class="popup_inner">
|
||||
<p class="pop_title">권한 계층 설정</p>
|
||||
|
||||
<div>
|
||||
<ul>
|
||||
<li style="font-weight: bold;">※권한계층 이란?</li>
|
||||
<li>
|
||||
<ul>
|
||||
<li>: 권한계층은 부모와 자녀로 이루어 집니다.</li>
|
||||
<li>: 상속받은 부모의 Role이 많을 수록 "상위 권한"이 되며, 적을 수록 "하위 권한"이 됩니다.</li>
|
||||
<li>: 자녀는 부모에게 부여된 모든 Role에 대해 접근이 가능 합니다.</li>
|
||||
<li>: 권한 계층에서 부모를 제외 할 시 해당 부모의 Role이 자녀에게도 동일하게 부여되어 있지 않다면 자녀는 접근이 불가 하기에 계층 구조에서 제외 시에는 주의가 필요 합니다.</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<%--@elvariable id="authHierarchyManage" type=""--%>
|
||||
<form:form commandName="authHierarchyManage" name="authHierarchyManage">
|
||||
|
||||
<div>
|
||||
<table class="tbl03">
|
||||
<caption>권한의 ROLE 상속 구조</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>권한의 ROLE 상속구조(부모->자녀 순)</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="authorRescue" class="connectWith">
|
||||
<c:set var="strAuthorRescueCode" value="${fn:trim(authHierarchyManage.authorRescueCode) }" />
|
||||
<c:set var="arrAuthorCode" value="${fn:split(strAuthorRescueCode, '>') }" />
|
||||
<c:forEach var="row" items="${arrAuthorCode }" varStatus="status">
|
||||
<c:set var="arrSilbingAutorCode" value="${fn:split(row, ',') }" />
|
||||
<c:forEach var="authorCode" items="${arrSilbingAutorCode }">
|
||||
<li>
|
||||
<span><c:out value="${mAuthorInfo[fn:trim(authorCode)] }"/></span>
|
||||
<input type="hidden" id="authorCode" value="<c:out value="${fn:trim(authorCode) }"/>" />
|
||||
</li>
|
||||
</c:forEach>
|
||||
|
||||
|
||||
<c:if test="${not status.last }">
|
||||
<li class="separator">
|
||||
<span style="font-weight: bold"> > </span>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
<table class="tbl03">
|
||||
<caption>미설정 권한 목록</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>미설정 권한 목록</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="authorList" class="connectWith">
|
||||
|
||||
<li class="separator">
|
||||
<span style="font-weight: bold"> > </span>
|
||||
</li>
|
||||
|
||||
<c:forEach var="row" items="${authorList }">
|
||||
<li>
|
||||
<div class="popup_inner_02">
|
||||
<p class="pop_title">권한 계층 설정</p>
|
||||
|
||||
<div>
|
||||
<ul>
|
||||
<li style="font-weight: bold;">※권한계층 이란?</li>
|
||||
<li>
|
||||
<ul>
|
||||
<li>: 권한계층은 부모와 자녀로 이루어 집니다.</li>
|
||||
<li>: 상속받은 부모의 Role이 많을 수록 "상위 권한"이 되며, 적을 수록 "하위 권한"이 됩니다.</li>
|
||||
<li>: 자녀는 부모에게 부여된 모든 Role에 대해 접근이 가능 합니다.</li>
|
||||
<li>: 권한 계층에서 부모를 제외 할 시 해당 부모의 Role이 자녀에게도 동일하게 부여되어 있지 않다면 자녀는 접근이 불가 하기에 계층 구조에서 제외 시에는 주의가
|
||||
필요 합니다.
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<%--@elvariable id="authHierarchyManage" type=""--%>
|
||||
<form:form commandName="authHierarchyManage" name="authHierarchyManage">
|
||||
|
||||
<div>
|
||||
<table class="tbl03">
|
||||
<caption>권한의 ROLE 상속 구조</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>권한의 ROLE 상속구조(부모->자녀 순)</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="authorRescue" class="connectWith">
|
||||
<c:set var="strAuthorRescueCode" value="${fn:trim(authHierarchyManage.authorRescueCode) }"/>
|
||||
<c:set var="arrAuthorCode" value="${fn:split(strAuthorRescueCode, '>') }"/>
|
||||
<c:forEach var="row" items="${arrAuthorCode }" varStatus="status">
|
||||
<c:set var="arrSilbingAutorCode" value="${fn:split(row, ',') }"/>
|
||||
<c:forEach var="authorCode" items="${arrSilbingAutorCode }">
|
||||
<li>
|
||||
<span><c:out value="${mAuthorInfo[fn:trim(authorCode)] }"/></span>
|
||||
<input type="hidden" id="authorCode"
|
||||
value="<c:out value="${fn:trim(authorCode) }"/>"/>
|
||||
</li>
|
||||
</c:forEach>
|
||||
|
||||
|
||||
<c:if test="${not status.last }">
|
||||
<li class="separator">
|
||||
<span style="font-weight: bold"> > </span>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
<table class="tbl03">
|
||||
<caption>미설정 권한 목록</caption>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>미설정 권한 목록</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="authorList" class="connectWith">
|
||||
|
||||
<li class="separator">
|
||||
<span style="font-weight: bold"> > </span>
|
||||
</li>
|
||||
|
||||
<c:forEach var="row" items="${authorList }">
|
||||
<li>
|
||||
<span>
|
||||
<c:out value="${row.author_nm }"/>
|
||||
<input type="hidden" id="authorCode" value="<c:out value="${row.author_code }"/>" />
|
||||
<input type="hidden" id="authorCode"
|
||||
value="<c:out value="${row.author_code }"/>"/>
|
||||
</span>
|
||||
</li>
|
||||
</c:forEach>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</form:form>
|
||||
<div class="popup_btn">
|
||||
<span class="flr align_center">
|
||||
</li>
|
||||
</c:forEach>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</form:form>
|
||||
<div class="popup_btn_02">
|
||||
<span>
|
||||
<a href="#" class="btn blue" id="btnRegist">저장</a>
|
||||
<a href="#" class="btn gray" id="btnInit">원래대로</a>
|
||||
<a href="#" class="btn red" id="btnReload">설정정보적용</a>
|
||||
<a href="#" class="btn lightgray" id="btnClose">닫기</a>
|
||||
</span>
|
||||
</div> <!-- //등록버튼 -->
|
||||
</div>
|
||||
</div> <!-- //등록버튼 -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- //popup -->
|
||||
|
||||
<script type="text/javaScript">
|
||||
|
||||
/**************************************************************************
|
||||
* Global Variable
|
||||
**************************************************************************/
|
||||
let initArrAuthorCode;
|
||||
let orgData;
|
||||
|
||||
/* *******************************
|
||||
* Biz function
|
||||
******************************* */
|
||||
const fnBiz = {
|
||||
save: () => {
|
||||
let data = $(document.authHierarchyManage).serialize();
|
||||
if(initArrAuthorCode === data){
|
||||
alert('변경된 내역이 없습니다.');
|
||||
return false;
|
||||
}
|
||||
|
||||
if(confirm("저장 하시겠습니까?")) {
|
||||
cmmAjax({
|
||||
url: '<c:url value="/framework/biz/mng/auth/saveAuthHierarchy.do"/>'
|
||||
, data: data
|
||||
,success: () => {
|
||||
//$('#btnReload').css('display', 'inline-block');
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
,init: () => {
|
||||
window.location = '<c:url value="/framework/biz/mng/auth/mngAuthHierarchyMgtPopup.do"/>'
|
||||
}
|
||||
,reload: () => {
|
||||
const msg = [];
|
||||
msg.push('설정하신 정보를 적용 하시겠습니까?');
|
||||
msg.push('적용된 설정은 사이트를 재접속 하셔야 동작 합니다.');
|
||||
msg.push('※"설정정보 적용"을 하지 않을 시 저장하신 정보는 서버가 재기동 되기전까진 반영되지 않습니다.');
|
||||
if(confirm(msg.join('\n'))) {
|
||||
cmmAjax({
|
||||
url: '<c:url value="/framework/biz/mng/auth/reloadAuthHierarchy.do"/>'
|
||||
});
|
||||
}
|
||||
}
|
||||
,setParam : function(){
|
||||
let i = 0;
|
||||
const totCnt = $('#authorRescue li').length;
|
||||
let sb = [];
|
||||
const arrAuthorCode = [];
|
||||
|
||||
$('#authorRescue li').each(function(){
|
||||
if($(this).hasClass('separator')){ //구분자 일때
|
||||
//배열에 담기
|
||||
if(sb.length>0)
|
||||
// arrAuthorCode.push(sb);
|
||||
arrAuthorCode.push(sb.join(';'));
|
||||
|
||||
//StringBuffer 초기화
|
||||
sb = [];
|
||||
|
||||
}else{ //구분자가 아닐때
|
||||
sb.push($(this).find('#authorCode').val());
|
||||
}
|
||||
|
||||
//마지막 요소
|
||||
if(i == totCnt-1){
|
||||
//배열에 담기
|
||||
if(sb.length>0)
|
||||
arrAuthorCode.push(sb);
|
||||
}
|
||||
i++;
|
||||
});
|
||||
//if(arrAuthorCode.)
|
||||
const frm = document.authHierarchyManage;
|
||||
//Elements 삭제
|
||||
$(frm).find('input[name="authorCode"]').remove();
|
||||
//Elements 생성
|
||||
for(let i = 0; i<arrAuthorCode.length; i++){
|
||||
const param = document.createElement('input');
|
||||
param.setAttribute('type', 'hidden');
|
||||
param.setAttribute('name', 'authorCode');
|
||||
param.setAttribute('value', arrAuthorCode[i]);
|
||||
frm.appendChild(param);
|
||||
}
|
||||
}
|
||||
,validate: () => {
|
||||
if(orgData === $('form').serialize()){
|
||||
alert('변경된 내용이 없습니다.');
|
||||
return false;
|
||||
}
|
||||
if($('#groupId').val() === ''){
|
||||
alert('[권한그룹 ID]는 필수 입니다.');
|
||||
$('#authorCode').focus();
|
||||
return false;
|
||||
}
|
||||
if($('#groupNm').val() === ''){
|
||||
alert('[권한그룹 명]은 필수 입니다.');
|
||||
$('#authorNm').focus();
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
};
|
||||
|
||||
/**************************************************************************
|
||||
* event
|
||||
**************************************************************************/
|
||||
$(() => {
|
||||
$(window).on("unload", function (e) {
|
||||
window.opener?.unblockUI();
|
||||
window.opener?.callbackSearch();
|
||||
return null;
|
||||
});
|
||||
|
||||
$("#btnClose").on('click', () => {
|
||||
window.close()
|
||||
});
|
||||
|
||||
$('#btnRegist').on('click', () => fnBiz.save());
|
||||
|
||||
$('#btnInit').on('click', () => fnBiz.init());
|
||||
|
||||
$('#btnReload').on('click', () => fnBiz.reload());
|
||||
|
||||
//sortable 적용
|
||||
$('.connectWith').sortable({
|
||||
connectWith: '.connectWith'
|
||||
,stop : function(){
|
||||
//구분자 생성
|
||||
$('#authorList li.separator').remove();
|
||||
$('#authorList').prepend('<li class="separator"><span style="font-weight: bold"> > </span></li>');
|
||||
|
||||
//param 설정
|
||||
fnBiz.setParam();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
/**************************************************************************
|
||||
* initialize
|
||||
**************************************************************************/
|
||||
$(document).ready(function(){
|
||||
fnBiz.setParam();
|
||||
initArrAuthorCode = $(document.authHierarchyManage).serialize();
|
||||
orgData = $('form').serialize();
|
||||
});
|
||||
/**************************************************************************
|
||||
* Global Variable
|
||||
**************************************************************************/
|
||||
let initArrAuthorCode;
|
||||
let orgData;
|
||||
|
||||
/* *******************************
|
||||
* Biz function
|
||||
******************************* */
|
||||
const fnBiz = {
|
||||
save: () => {
|
||||
let data = $(document.authHierarchyManage).serialize();
|
||||
if (initArrAuthorCode === data) {
|
||||
alert('변경된 내역이 없습니다.');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (confirm("저장 하시겠습니까?")) {
|
||||
cmmAjax({
|
||||
url: '<c:url value="/framework/biz/mng/auth/saveAuthHierarchy.do"/>'
|
||||
, data: data
|
||||
, success: () => {
|
||||
//$('#btnReload').css('display', 'inline-block');
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
, init: () => {
|
||||
window.location = '<c:url value="/framework/biz/mng/auth/mngAuthHierarchyMgtPopup.do"/>'
|
||||
}
|
||||
, reload: () => {
|
||||
const msg = [];
|
||||
msg.push('설정하신 정보를 적용 하시겠습니까?');
|
||||
msg.push('적용된 설정은 사이트를 재접속 하셔야 동작 합니다.');
|
||||
msg.push('※"설정정보 적용"을 하지 않을 시 저장하신 정보는 서버가 재기동 되기전까진 반영되지 않습니다.');
|
||||
if (confirm(msg.join('\n'))) {
|
||||
cmmAjax({
|
||||
url: '<c:url value="/framework/biz/mng/auth/reloadAuthHierarchy.do"/>'
|
||||
});
|
||||
}
|
||||
}
|
||||
, setParam: function () {
|
||||
let i = 0;
|
||||
const totCnt = $('#authorRescue li').length;
|
||||
let sb = [];
|
||||
const arrAuthorCode = [];
|
||||
|
||||
$('#authorRescue li').each(function () {
|
||||
if ($(this).hasClass('separator')) { //구분자 일때
|
||||
//배열에 담기
|
||||
if (sb.length > 0)
|
||||
// arrAuthorCode.push(sb);
|
||||
arrAuthorCode.push(sb.join(';'));
|
||||
|
||||
//StringBuffer 초기화
|
||||
sb = [];
|
||||
|
||||
} else { //구분자가 아닐때
|
||||
sb.push($(this).find('#authorCode').val());
|
||||
}
|
||||
|
||||
//마지막 요소
|
||||
if (i == totCnt - 1) {
|
||||
//배열에 담기
|
||||
if (sb.length > 0)
|
||||
arrAuthorCode.push(sb);
|
||||
}
|
||||
i++;
|
||||
});
|
||||
//if(arrAuthorCode.)
|
||||
const frm = document.authHierarchyManage;
|
||||
//Elements 삭제
|
||||
$(frm).find('input[name="authorCode"]').remove();
|
||||
//Elements 생성
|
||||
for (let i = 0; i < arrAuthorCode.length; i++) {
|
||||
const param = document.createElement('input');
|
||||
param.setAttribute('type', 'hidden');
|
||||
param.setAttribute('name', 'authorCode');
|
||||
param.setAttribute('value', arrAuthorCode[i]);
|
||||
frm.appendChild(param);
|
||||
}
|
||||
}
|
||||
, validate: () => {
|
||||
if (orgData === $('form').serialize()) {
|
||||
alert('변경된 내용이 없습니다.');
|
||||
return false;
|
||||
}
|
||||
if ($('#groupId').val() === '') {
|
||||
alert('[권한그룹 ID]는 필수 입니다.');
|
||||
$('#authorCode').focus();
|
||||
return false;
|
||||
}
|
||||
if ($('#groupNm').val() === '') {
|
||||
alert('[권한그룹 명]은 필수 입니다.');
|
||||
$('#authorNm').focus();
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
};
|
||||
|
||||
/**************************************************************************
|
||||
* event
|
||||
**************************************************************************/
|
||||
$(() => {
|
||||
$(window).on("unload", function (e) {
|
||||
window.opener?.unblockUI();
|
||||
window.opener?.callbackSearch();
|
||||
return null;
|
||||
});
|
||||
|
||||
$("#btnClose").on('click', () => {
|
||||
window.close()
|
||||
});
|
||||
|
||||
$('#btnRegist').on('click', () => fnBiz.save());
|
||||
|
||||
$('#btnInit').on('click', () => fnBiz.init());
|
||||
|
||||
$('#btnReload').on('click', () => fnBiz.reload());
|
||||
|
||||
//sortable 적용
|
||||
$('.connectWith').sortable({
|
||||
connectWith: '.connectWith'
|
||||
, stop: function () {
|
||||
//구분자 생성
|
||||
$('#authorList li.separator').remove();
|
||||
$('#authorList').prepend('<li class="separator"><span style="font-weight: bold"> > </span></li>');
|
||||
|
||||
//param 설정
|
||||
fnBiz.setParam();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
/**************************************************************************
|
||||
* initialize
|
||||
**************************************************************************/
|
||||
$(document).ready(function () {
|
||||
fnBiz.setParam();
|
||||
initArrAuthorCode = $(document.authHierarchyManage).serialize();
|
||||
orgData = $('form').serialize();
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue