File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<%--
Class Name : EgovOrgChartManage.jsp
Desc:qription : 조직도 관리 화면
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2018.06.11 ITN 최초 생성
author : ITN
since : 2018.06.11
--%>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="egovframework.com.cmm.service.EgovProperties"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Language" content="ko">
<link href="<c:url value='/'/>css/jstree/themes/default/style.min.css" rel="stylesheet" type="text/css">
<style>
.jstree_orgChart {
overflow: auto;
border: 1px solid silver;
min-height: 100px;
width: 250px;
}
</style>
<script src="<c:url value='/js/jquery-1.12.4.min.js' />"></script>
<script src="<c:url value='/js/jstree.min.js' />"></script>
<script src="<c:url value='/js/EgovCmmUtl.js' />"></script>
<script>
// 부서 해당 직원 정보 리스트
function fn_select_part(empData, partIdx, upperIdxs) {
upperIdxs = upperIdxs.join("|");
var tmpHtml = "";
for (var i = 0; i < empData.length; i++) {
/* var btnModfy = "<a href='#LINK' onclick='javascript:fn_select_emp(" + empData[i].paIdx + ", " + empData[i].partIdx + ", \"" + upperIdxs + "\"); return false;'>수정</a>";
var btnDelete = "<a href='#LINK' onclick='javascript:fn_delete_empInf(" + empData[i].paIdx + ", " + empData[i].partIdx + "); return false;'>삭제</a>"; */
var btnModfy = "<button class='r_button' style='line-height:0px;' onclick='javascript:fn_select_emp(" + empData[i].paIdx + ", " + empData[i].partIdx + ", \"" + upperIdxs + "\"); return false;'>수정</button>";
var btnDelete = "<button class='d_button' style='line-height:0px;' onclick='javascript:fn_delete_empInf(" + empData[i].paIdx + ", " + empData[i].partIdx + "); return false;'>삭제</button>";
tmpHtml += "<tr id='emp_"+ empData[i].paIdx +"'>";
tmpHtml += "<td>" + (i+1) + "</td>";
// tmpHtml += "<td>" + empData[i].paGrade + "</td>";
tmpHtml += "<td>" + empData[i].paName + "</td>";
tmpHtml += "<td>" + empData[i].paTel + "</td>";
tmpHtml += "<td>" + empData[i].paJob + "</td>";
tmpHtml += "<td>" + empData[i].sortOrd + "</td>";
tmpHtml += "<td>" + btnModfy + "</td>";
tmpHtml += "<td>" + btnDelete + "</td>";
tmpHtml += "</tr>";
}
$("#tbEmpList>tbody").html(tmpHtml);
$("#selectPartIdx").val(partIdx);
$("#selectPartParents").val(upperIdxs);
fn_add_emp();
}
// 직원 수정 상세
function fn_select_emp(paIdx, partIdx, parentIds) {
fn_set_emp_part(partIdx, parentIds);
$("#empFormTitle").text("직원 수정 상세");
$("input[name='paIdx']").val(paIdx);
// $("input[name='paGrade']").val($("#emp_"+paIdx+">td:eq(1)").text());
$("input[name='paName']").val($("#emp_"+paIdx+">td:eq(1)").text());
$("input[name='paTel']").val($("#emp_"+paIdx+">td:eq(2)").text());
$("input[name='paJob']").val($("#emp_"+paIdx+">td:eq(3)").text());
$("input[name='sortOrd']").val($("#emp_"+paIdx+">td:eq(4)").text());
}
// 직원 상세 초기화
function fn_add_emp() {
var partIdx =$("#selectPartIdx").val();
var upperIdxs = $("#selectPartParents").val();
// 직원 상세 초기화
document.empInfForm.reset();
$("#empFormTitle").text("직원 추가등록 상세");
$("input[name='paIdx']").val("");
fn_set_emp_part(partIdx, upperIdxs);
}
// 직원 상세 - 부서 선택박스 셋팅
function fn_set_emp_part(partIdx, parentIds) {
fn_add_emp_part(0, 1);
// parentIds : ....(부모3id)|(부모2id)|(부모1id)|# : jstree parents 정보. 해당 노드의 부모들 ID. #은 최상위(우체국물류지원단)
var upperIdxs = (partIdx+"|"+parentIds).split("|");
var depth = 1;
for (var i = upperIdxs.length-3; i >= 0; i--) {
$("select[depth="+depth+"]").val(upperIdxs[i]);
fn_select_emp_part($("select[depth="+depth+"]"));
depth++;
}
}
// 직원 상세 - 부서 선택박스 변경 시
function fn_select_emp_part(obj) {
var selectId = $(obj).children("option:selected").val();
var selectDepth = $(obj).children("option:selected").attr("depth");
fn_add_emp_part(selectId, eval(selectDepth)+1);
}
// 직원 상세 - 부서 선택박스 추가
function fn_add_emp_part(upperIdx, depth) {
var instance = $('#kopost_organization').jstree(true);
var partInfList = instance.get_json('#', { 'flat': true });
var selectPart = $("select[depth="+ depth +"]");
// 하위 부서 삭제
if (selectPart.length > 0 ) {
var partSelects = $("select[id^='depth']");
for (var i = 0; i < partSelects.length; i++) {
if ($(partSelects[i]).attr("depth") >= depth) {
$(partSelects[i]).remove();
}
}
}
var tmpHtml = "<select id='depth_" + depth + "'"
+" depth=" + depth
+" onChange='fn_select_emp_part(this);' >";
tmpHtml += "<option value='' depth=" + depth + ">선택</option>"
var partCnt = 0;
for (var i = 0; i < partInfList.length; i++) {
if (partInfList[i].parent == upperIdx) {
tmpHtml += "<option value='" + partInfList[i].id + "' depth=" + partInfList[i].li_attr.depth + ">" + partInfList[i].text +"</option>"
partCnt++;
}
}
tmpHtml += "</select>";
// 하위 부서 없을 시 리턴
if (partCnt == 0) return;
$("#select_part").append(tmpHtml);
}
// 직원정보 init
function fn_init_empInf() {
$("#selectPartIdx").val("");
$("#selectPartParents").val("");
$("#tbEmpList>tbody").html("");
fn_add_emp();
}
// 직원 정보 저장. 등록/수정
function fn_save_empInf() {
var empInfForm = document.empInfForm;
// 최종 선택 부서ID
var selectedDepths = $("select[id^=depth_] option:selected[value!='']");
if (selectedDepths.length == 0) { alert("부서를 선택해주세요."); return; }
if (empInfForm.sortOrd.value == "") { alert("순번을 입력해주세요."); return; }
if (!isNumber(empInfForm.sortOrd.value, "순번 숫자")) { return };
var partIdx = selectedDepths[selectedDepths.length-1].value;
empInfForm.partIdx.value = partIdx;
var paIdx = empInfForm.paIdx.value;
var url = "";
if (empInfForm.paIdx.value == "") {
url = "<c:url value='/cop/org/insertEmpInfAjax.do'/>";
//ajax 전송 시 VO 변수 타입과 매칭되어. int 셋팅
empInfForm.paIdx.value="0";
} else {
url = "<c:url value='/cop/org/updateEmpInfAjax.do'/>";
}
var params = $(empInfForm).serialize();
$.ajax({
type:"POST",
"url":url,
data:params,
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
// 직원 목록 갱신
var selectPartIdx = $('#kopost_organization').jstree(true).get_node(partIdx).a_attr.id;
$("#" + selectPartIdx).trigger("click");
alert("직원 정보가 저장 되었습니다.");
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("직원 정보 저장이 실패되었습니다.");
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
}
});
}
// 직원 정보 삭제
function fn_delete_empInf(paIdx, partIdx) {
if (confirm("직원 정보를 삭제 하시겠습니까?")) {
$.ajax({
type:"POST",
"url" : "<c:url value='/cop/org/deleteEmpInfAjax.do'/>",
data:{ "paIdx" : paIdx },
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
// 직원 목록 갱신
var instance = $('#kopost_organization').jstree(true);
$("#" + instance.get_node(partIdx).a_attr.id).trigger("click");
alert("직원 정보가 삭제 되었습니다.");
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("부서 정보 조회가 실패되었습니다.");
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
}
});
}
}
/*********************************
* jstree
*********************************
*/
function jstreeInit() {
$('#kopost_organization').jstree({
"core" : {
"animation" : 0,
"multiple" : false,
"check_callback" : true,
"themes" : { "stripes" : true },
"data" : {
"url" : "<c:url value='/cop/org/orgChartPartListAjax.do'/>",
"dataType" : "json",
"data" : function (node) {
return {'id' : node.id};
}
}
},
"types" : {
"#" : {
/* "max_children" : 4, */
"max_depth" : 5,
"valid_children" : ["root"]
},
"root" : {
//"icon" : "/static/3.3.5/assets/images/tree_icon.png",
"icon" : "glyphicon glyphicon-flash",
"valid_children" : ["default"]
},
"default" : {
"valid_children" : ["default","file"]
},
"file" : {
//"icon" : "glyphicon glyphicon-file",
"icon" : "jstree-file",
"valid_children" : []
}
},
"plugins" : [
"contextmenu", "dnd", "search",
"types"
//, "unique"
//, "wholerow"
],
'contextmenu' : {
items : function(node) {
var items = $.jstree.defaults.contextmenu.items();
delete items.ccp;
// 우체국물류지원단 우클릭 시 '부서 추가' 메뉴만 제외하고 제거
if (node.id == "0") {
items.create.separator_after = false;
delete items.remove;
delete items.rename;
}
return items;
}
}
})
.bind('refresh.jstree', function(e, data) {
$(this).jstree(true).open_all();
})
.bind('before.jstree', function(e, data) {
//console.log("jstree before");
})
.bind('loaded.jstree', function(e, data) {
//console.log("jstree loaded");
$(this).jstree(true).open_all();
fn_add_emp();
})
.on('deselect_all.jstree', function (e, data) {
fn_init_empInf();
})
.on('select_node.jstree', function (e, data) {
/* 부서 선택 */
var partIdx = data.node.id;
$("#partNm").text(data.node.text);
$.ajax({
type:"POST",
url:"<c:url value='/cop/org/selectPartEmpInfAjax.do' />",
data:{ "partIdx" : partIdx },
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
//console.log(returnData);
var empData = returnData.empList;
var partData = returnData.partList;
//partInfList = partData;
fn_select_part(empData, partIdx, data.node.parents);
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("부서 정보 조회가 실패되었습니다.");
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
}
});
})
.on('delete_node.jstree', function (e, data) {
/* 부서 삭제 */
if (confirm("[" + data.node.text + "]" + " 부서 삭제 시 하위 부서 및 직원정보 전체가 삭제됩니다. 삭제 하시겠습니까?")) {
$.ajax({
type:"POST",
url:"<c:url value='/cop/org/deletePartAjax.do' />",
data:{ "partIdx" : data.node.id },
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
alert("부서 정보가 삭제되었습니다.");
fn_init_empInf();
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("부서 정보 삭제가 실패되었습니다.");
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
data.instance.refresh();
}
});
} else {
data.instance.refresh();
}
})
.on('rename_node.jstree', function (e, data) {
var nodeId = data.node.id;
var oldText = data.old;
var newText = data.text;
if (nodeId > 0) {
/* 부서명 변경 */
if (oldText != newText) {
//if (confirm("[" + oldText + "]" + "부서를 " + "[" + newText + "]" + "로 변경하시겠습니까?" )) {
if (confirm("부서명을 변경하시겠습니까?" )) {
$.ajax({
type:"POST",
url:"<c:url value='/cop/org/updatePartTitleAjax.do' />",
data:{ "partIdx" : nodeId, "partTitle" : newText },
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
alert("부서명이 변경되었습니다.");
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("부서명 변경이 실패되었습니다.");
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
data.instance.refresh();
}
});
} else {
data.instance.refresh();
}
}
} else {
/* 부서 추가 */
var instance = data.instance;
var partTitle = data.text;
var upperIdx = data.node.parent;
var sortOrd = 1;
var childrenNodes = instance.get_node(upperIdx).children;
// 하위 부서 있을 시 마지막 부서 sort_ord + 1
if (childrenNodes.length > 1) {
var lastChildrenNode = instance.get_node(childrenNodes[childrenNodes.length - 2]);
sortOrd = lastChildrenNode.li_attr.sortOrd + 1;
}
//console.log("신규 추가| upperIdx:" + upperIdx + " sortOrd:" + sortOrd);
$.ajax({
type:"POST",
url:"<c:url value='/cop/org/insertPartInfAjax.do' />",
data:{ "partTitle" : partTitle, "upperIdx" : upperIdx, "sortOrd" : sortOrd},
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
//alert("[" + partTitle + "]" + " 부서가 추가 되었습니다.");
alert("부서가 추가 되었습니다.");
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("부서 추가가 실패되었습니다.")
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
data.instance.refresh();
}
});
}
})
.on('move_node.jstree', function (e, data) {
/* 부서 위치 변경 */
if (confirm("부서 위치를 변경하시겠습니까?" )) {
var partIdx = data.node.id;
var upperIdx = data.parent;
var sortOrd = 1;
var incrsSortOrd = 0;
var instance = data.instance;
var position = data.position;
var parentNode = instance.get_node(upperIdx);
// sortOrd - 정렬순번 채번 및 전체 증가 필요 체크
if (parentNode.children.length > 1) {
if (position != 0) {
var prevNodeOrd = instance.get_node(parentNode.children[position - 1]).li_attr.sortOrd;
sortOrd = prevNodeOrd + 1;
}
var nextNode = instance.get_node(parentNode.children[position + 1]);
if (nextNode && sortOrd == nextNode.li_attr.sortOrd) {
incrsSortOrd = sortOrd;
}
}
//console.log("위치변경| sortOrd:" + sortOrd + " incrsSortOrd:" + incrsSortOrd);
$.ajax({
type:"POST",
url:"<c:url value='/cop/org/updatePartOrderAjax.do' />",
data:{ "partIdx" : partIdx, "upperIdx" : upperIdx, "sortOrd" : sortOrd, "incrsSortOrd" : incrsSortOrd},
dataType:'jsonp',
//timeout:(1000*30),
success : function(returnData, status) {
if (status == "success") {
alert("부서 위치가 변경되었습니다.");
} else { alert("ERROR"); return;}
},
error : function(request , status, error) {
alert("부서 위치 변경이 실패되었습니다.");
//alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
},
complete : function () {
data.instance.refresh();
}
});
} else {
data.instance.refresh();
}
})
.on('changed.jstree', function (e, data) {
if (data && data.selected && data.selected.length) {
/* $.get('?operation=get_content&id=' + data.selected.join(':'), function (d) {
}); */
//$('#kopost_data .default').text(data.selected.join(':')).show();
}
else {
//$('#kopost_data .content').hide();
//$('#kopost_data .default').text('Select a file from the tree.').show();
}
});
}
$( document ).ready(function() {
jstreeInit();
});
</script>
<title>조직도 관리</title>
</head>
<body>
<div class="ad_content">
<div class="ad_con_head">
<div class="ad_head_text">
<p class="today_txt">조직도 관리</p>
<div class="ad_head_ment">
<p class="today_last_txt"><span id="cnt_cate_list"></span></p>
</div>
</div>
</div>
<div class="ad_organcon">
<!-- 조직도 관리 시작 -->
<div class="organ_leftbox">
<!-- <button id="evts_button_open_all">open all</button> -->
<div id="kopost_organization" class="jstree_orgChart"></div>
</div>
<div class="organ_rightbox">
<div class="organ_righthead" id="partNm">부서선택</div>
<button class="main1_btn main1_save_btn" style="float: right; margin-bottom: 5px;" onclick="javascript:fn_add_emp(); return false;">
직원추가
</button>
<table id="tbEmpList">
<%-- <colgroup>
<col width="8%">
<col width="8%">
<col width="10%">
<col width="23%">
<col width="26%">
<col width="9%">
<col width="8%">
<col width="8%">
</colgroup> --%>
<thead>
<tr>
<th>번호</th>
<!-- <th>직위</th> -->
<th>이름</th>
<th>전화번호</th>
<th>업무</th>
<th>순번</th>
<th>수정</th>
<th>삭제</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<input type="hidden" id="selectPartIdx" />
<input type="hidden" id="selectPartParents" />
<form name="empInfForm">
<p class="reply_emp" id="empFormTitle">직원 추가등록 상세</p>
<div class="emp_div2">
<table class="emp_table">
<colgroup>
<col style="width:150px;"/>
<col style="width:500px;"/>
</colgroup>
<tr>
<th>부서</th>
<td>
<div id="select_part">
<input type="hidden" name="partIdx" />
<input type="hidden" name="paIdx" />
</div>
</td>
</tr>
<!--
<tr>
<th>직위</th>
<td>
<input type="text" name="paGrade" />
</td>
</tr>
-->
<tr>
<th>성명</th>
<td>
<input type="text" name="paName" />
</td>
</tr>
<tr>
<th>전화번호</th>
<td>
<input type="text" name="paTel" />
</td>
</tr>
<tr>
<th>담당업무</th>
<td>
<input type="text" name="paJob" />
</td>
</tr>
<tr>
<th>순번</th>
<td>
<input type="text" name="sortOrd" />
</td>
</tr>
</table>
<ul class="btn_li2" style="width: unset;">
<li><button class="main1_btn main1_save_btn" onClick="javascript:fn_save_empInf(); return false;" >저 장</button></li>
</ul>
</div>
</form>
</div>
<!-- //조직도 관리 끝 -->
</div>
</div>
</body>
</html>