main
HuangHai 3 months ago
parent f927b67a57
commit 00737ab3b8

File diff suppressed because one or more lines are too long

@ -0,0 +1,234 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>单位管理</title>
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"
/>
<link rel="stylesheet" href="../../../static/css/font.css" />
<link rel="stylesheet" href="../../../static/css/weadmin.css" />
<link rel="stylesheet" href="../../../lib/ztree/zTreeStyle.css" />
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
.ztree li span.button.add {
margin-left: 2px;
margin-right: -1px;
background-position: -144px 0;
vertical-align: top;
}
</style>
</head>
<body>
<div class="weadmin-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">业务管理</a>
<a href="" id="switch">单位维护</a>
<a> <cite>部门维护</cite></a>
</span>
</div>
<div class="weadmin-body" style="height: 500px">
<div class="selectModel" style="height: 100%">
<!-- <div class="pc_selectModel_tree">
<div class="ztree" id="treeDemo"></div>
</div> -->
<div style="margin: 0 0 5px 10px;color: red;">
说明:以拖拽的方式进行操作。
<br/>
设置上下级关系:选中某人员按住鼠标拖拽至另一个人员上,即可设置上下级关系。
<br/>
取消上下级关系:选中下级人员,拖拽至树的下方空白区域,即可解除当前上下级关系。
<br/>
拖拽限制规则:若某人员已有下级,则不可将其拖拽至其他人员上。不能将某人员拖拽到下级人员上。
</div>
<div class="pc_selectModel_tree" style="height: 100%">
<ul id="treeDemo" class="ztree" style="height: 100%"></ul>
</div>
</div>
</div>
<script src="../../../lib/layui/layui.js"></script>
<script src="../../../lib/jquery-3.6.0.min.js"></script>
<script src="../../../lib/ztree/jquery.ztree.core-3.5.min.js"></script>
<script src="../../../lib/ztree/jquery.ztree.exedit-3.5.min.js"></script>
<script>
layui.extend({
admin: "{/}../../../static/js/admin",
});
layui.use(["jquery", "admin", "layer"], function () {});
</script>
<script type="text/javascript">
var zTreeObj;
var selectParentNodeId = null;
var setting = {
edit: {
drag: {
autoExpandTrigger: true,
prev: false,
inner: dropInner,
next: false,
},
enable: true,
showRemoveBtn: false,
showRenameBtn: false,
},
data: {
simpleData: {
enable: true,
},
},
callback: {
beforeDrag: beforeDrag,
beforeDrop: beforeDrop,
beforeDragOpen: beforeDragOpen,
onDrag: onDrag,
onDrop: onDrop,
onExpand: onExpand,
},
};
// var zNodes = [
// { id: 1, pId: 0, name: "张明远" },
// { id: 2, pId: 0, name: "李思涵" },
// { id: 3, pId: 0, name: "王浩宇" },
// { id: 4, pId: 0, name: "陈雨桐" },
// { id: 5, pId: 0, name: "刘子轩" },
// { id: 6, pId: 0, name: "赵雅琪" },
// { id: 7, pId: 0, name: "黄志强" },
// { id: 8, pId: 0, name: "周晓雯" },
// { id: 9, pId: 0, name: "吴天磊" },
// { id: 10, pId: 0, name: "林婉清" },
// ];
function dropInner(treeId, nodes, targetNode) {
if (targetNode && targetNode.dropInner === false) {
return false;
} else {
for (var i = 0, l = curDragNodes.length; i < l; i++) {
if (!targetNode && curDragNodes[i].dropRoot === false) {
return false;
} else if (
curDragNodes[i].parentTId &&
curDragNodes[i].getParentNode() !== targetNode &&
curDragNodes[i].getParentNode().childOuter === false
) {
return false;
}
}
}
return true;
}
var log,
className = "dark",
curDragNodes,
autoExpandNode;
function beforeDrag(treeId, treeNodes) {
className = className === "dark" ? "" : "dark";
for (var i = 0, l = treeNodes.length; i < l; i++) {
if (treeNodes[i].drag === false) {
curDragNodes = null;
return false;
} else if (
treeNodes[i].parentTId &&
treeNodes[i].getParentNode().childDrag === false
) {
curDragNodes = null;
return false;
}
}
curDragNodes = treeNodes;
return true;
}
function beforeDragOpen(treeId, treeNode) {
autoExpandNode = treeNode;
return true;
}
function beforeDrop(treeId, treeNodes, targetNode, moveType, isCopy) {
className = className === "dark" ? "" : "dark";
return true;
}
function onDrag(event, treeId, treeNodes) {
if (treeNodes[0].pId) {
selectParentNodeId = treeNodes[0].pId;
}
className = className === "dark" ? "" : "dark";
}
function onDrop(event, treeId, treeNodes, targetNode, moveType, isCopy) {
if (targetNode) {
var targetNodeObj = zTreeObj.getNodeByParam("id", targetNode.id);
targetNodeObj.drag = false;
zTreeObj.updateNode(targetNodeObj);
}
if (treeNodes) {
var selectNodeObj = zTreeObj.getNodeByParam("id", treeNodes[0].id);
if (selectNodeObj.pId) {
selectNodeObj.dropInner = false;
zTreeObj.updateNode(selectNodeObj);
} else {
selectNodeObj.dropInner = true;
zTreeObj.updateNode(selectNodeObj);
}
var child_person_id = selectNodeObj.id;
var parent_person_id = "-1";
if (selectNodeObj.pId) {
parent_person_id = selectNodeObj.pId;
}
$.ajax({
type: "POST",
async: false,
url: "/dsBase/companyUser/saveParentChild",
dataType: "json",
data: {
parent_person_id,
child_person_id,
},
success: function (res) {
console.log(res);
},
});
}
if (selectParentNodeId) {
var selectParnetNodeObj = zTreeObj.getNodeByParam(
"id",
selectParentNodeId
);
if (selectParnetNodeObj.children.length == 0) {
selectParnetNodeObj.drag = true;
zTreeObj.updateNode(selectParnetNodeObj);
}
}
className = className === "dark" ? "" : "dark";
}
function onExpand(event, treeId, treeNode) {
if (treeNode === autoExpandNode) {
className = className === "dark" ? "" : "dark";
}
}
$(document).ready(function () {
$.ajax({
type: "GET",
async: false,
url: "/dsBase/companyUser/getTreeData",
dataType: "json",
success: function (res) {
zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, res.data);
zTreeObj.expandAll(true);
},
});
});
</script>
</body>
</html>
Loading…
Cancel
Save