You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
178 lines
5.3 KiB
Plaintext
178 lines
5.3 KiB
Plaintext
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
|
|
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
|
|
<jsp:include page="/WEB-INF/jsp/include/head.jsp" />
|
|
<link rel="stylesheet" href="<c:url value="/resources/3rd-party/sneat/libs/jstree/jstree.css"/>" /--%>
|
|
<body>
|
|
<!-- Layout wrapper -->
|
|
<div class="layout-wrapper layout-content-navbar">
|
|
<div class="layout-container">
|
|
<jsp:include page="/WEB-INF/jsp/include/userMenus.jsp" />
|
|
<!-- Layout container -->
|
|
<!-- Layout page -->
|
|
<div class="layout-page">
|
|
|
|
<jsp:include page="/WEB-INF/jsp/include/top.jsp" />
|
|
|
|
<!-- Content wrapper -->
|
|
<div class="content-wrapper">
|
|
<!-- Content -->
|
|
|
|
<div class="container-xxl flex-grow-1 container-p-y">
|
|
<%--h4 id="pageTitle" class="fw-bold py-3 mb-4">페이지 제목</h4--%>
|
|
<c:set var="prefixName" scope="request">메뉴</c:set>
|
|
<!-- Page Body -->
|
|
<div class="card">
|
|
<div class="card-datatable text-nowrap">
|
|
<div id="DataTables_Table_0_wrapper" class="dataTables_wrapper dt-bootstrap5 no-footer">
|
|
|
|
<div class="d-flex flex-row justify-content-evenly">
|
|
<div style="width:49%;">
|
|
<h5 class="mt-3">레이아웃</h5>
|
|
<div id="menu-tree" class="main-left d-flex flex-column flex-grow-1">
|
|
<div class="d-flex justify-content-between" style="padding-top:.5em; padding-bottom:.5em; border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf;">
|
|
<span>
|
|
<button id="menuToggler" onclick="toggleMenus();" class="btn btn-primary"></button>
|
|
</span>
|
|
</div>
|
|
<div id="menuTree" style="padding-top:1em; min-height:26em; overflow:auto;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="width:49%;">
|
|
<h5 class="mt-3">등록 정보</h5>
|
|
<div class="d-flex flex-row justify-content-end p-3">
|
|
<div>
|
|
<button id="btnRemoveMenus" onclick="removeMenus();" class="btn btn-primary">- 제거</button>
|
|
</div>
|
|
</div>
|
|
<jsp:include page="menu-info.jsp" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--/ Page Body -->
|
|
|
|
<hr class="my-5" />
|
|
</div>
|
|
<!-- / Content -->
|
|
|
|
<jsp:include page="/WEB-INF/jsp/include/bottom.jsp" />
|
|
|
|
<div class="content-backdrop fade"></div>
|
|
</div>
|
|
<!-- Content wrapper -->
|
|
</div>
|
|
<!-- / Layout page -->
|
|
</div>
|
|
</div>
|
|
<!-- / Layout wrapper -->
|
|
|
|
<jsp:include page="/WEB-INF/jsp/include/tail.jsp" />
|
|
<script src="<c:url value="/resources/3rd-party/sneat/libs/jstree/jstree.js"/>"></script>
|
|
<script src="<c:url value="/resources/3rd-party/jstree/jstree-support.js"/>"></script>
|
|
<script src="<c:url value="/resources/js/base/menu.js"/>?${ver}"></script>
|
|
<script >
|
|
${functions}
|
|
${userMenus}
|
|
var menuBranches = treeSupport({
|
|
selector:"#menuTree",
|
|
trace:wctx.trace,
|
|
plugins: ["checkbox", "contextmenu", "dnd"] ,
|
|
core:{check_callback:true,
|
|
multiple:false
|
|
},
|
|
checkbox:{
|
|
whole_node:false,
|
|
tie_selection:false
|
|
},
|
|
contextmenu:{items:{
|
|
newMenu:{label:"메뉴 추가", action:function(obj){
|
|
var current = menuControl.getCurrent(),
|
|
parentID = current.parentID;
|
|
menuControl.newInfo({parentID:parentID});
|
|
$("input[name='parentID']").val(parentID);
|
|
}},
|
|
newChildMenu:{label:"하위메뉴 추가", action:function(obj){
|
|
var current = menuControl.getCurrent(),
|
|
parentID = current.id;
|
|
menuControl.newInfo({parentID:parentID});
|
|
$("input[name='parentID']").val(parentID);
|
|
log("current", menuControl.getCurrent());
|
|
}},
|
|
}},
|
|
onNodeSelect:function(obj) {
|
|
var key = obj[0];
|
|
menuControl.setCurrent(key);
|
|
},
|
|
onNodeMove:function(obj) {
|
|
var parentID = obj.parent,
|
|
menuID = obj.node.id;
|
|
if (parentID == "#")
|
|
parentID = null;
|
|
menuControl.move(parentID, menuID);
|
|
},
|
|
onNodeReorder:function(obj) {
|
|
var parentID = obj.parent,
|
|
menuID = obj.node.id,
|
|
menuIDs = menuBranches.getChildIDs(parentID);
|
|
menuControl.reorder(menuIDs);
|
|
},
|
|
onNodeCheck:function(obj) {
|
|
var checked = obj.checked,
|
|
menuID = obj.node.id;
|
|
menuControl.select(menuID, checked);
|
|
}
|
|
});
|
|
|
|
function toggleMenus() {
|
|
$("#menuToggler").text(menuBranches.toggleFolding() == "collapsed" ? "+ 펼치기" : "- 닫기");
|
|
}
|
|
|
|
let menuControl = new MenuControl();
|
|
|
|
menuControl.onDatasetChange = obj => {
|
|
menuBranches.setData(treeHtml(menuControl.menus, {
|
|
id:function(e){return e.id;},
|
|
text:function(e){
|
|
return e.name == e.url ? e.name : e.name + (e.url ? " (" + e.url + ")" : "");
|
|
}
|
|
}));
|
|
$("#btnSelectURL").prop("disabled", menuControl.dataset.empty);
|
|
}
|
|
|
|
menuControl.onCurrentChange = item => {
|
|
menuControl.setInfo(item.data);
|
|
menuBranches.selectNode(item.data.id);
|
|
}
|
|
|
|
menuControl.onSelectionChange = selected => {
|
|
$("#btnRemoveMenus").prop("disabled", selected.length < 1);
|
|
}
|
|
|
|
menuControl.onMenusChanged = () => loadUserMenus();
|
|
|
|
${menuFunc}
|
|
|
|
async function loadUserMenus() {
|
|
let userMenus = await menuControl.getUserMenus();
|
|
setUserMenus(userMenus);
|
|
}
|
|
|
|
function removeMenus() {
|
|
dialog.alert({
|
|
content:"선택한 메뉴 정보를 삭제하시겠습니까?",
|
|
onOK:() => menuControl.remove()
|
|
});
|
|
}
|
|
|
|
$(function(){
|
|
${onload}
|
|
$("#menuToggler").text(menuBranches._folding == "collapsed" ? "+ 펼치기" : "- 닫기");
|
|
menuControl.setData(${menus});
|
|
menuBranches.open();
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html> |