<#ftl>
|
<#--
|
textName 显示选择文本的DOM组件ID
|
valueName 保存选择值的DOM组件ID
|
url ztree数据路径
|
-->
|
<#macro popTree textName="" valueName="" levelName="" showName="" url="" width="225px" showLevel="3" >
|
|
<script type="text/javascript" src="${common_static}/static/plugins/ztree/js/jquery.ztree.all-3.5.min.js"></script>
|
<link rel="stylesheet" href="${common_static}/static/plugins/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css"/>
|
<link rel="stylesheet" href="${common_static}/static/plugins/ztree/css/demo.css" type="text/css"/>
|
|
<div class="fill_item"><label>配置分类:</label>
|
<input id="${valueName}" name="${valueName}" type="hidden" />
|
<input id="${textName}" name="${textName}" value="${showName}" class="general" style="width:${width};" type="text" readonly/>
|
</div>
|
|
<script type="text/javascript">
|
|
var setting = {
|
view: {
|
dblClickExpand: false,
|
showLine: true,
|
selectedMulti: false
|
},
|
data: {
|
simpleData: {
|
enable: true,
|
idKey: "id",
|
pIdKey: "pid",
|
rootPId: "1"
|
},
|
key:{
|
name:"name"
|
}
|
},
|
async:{
|
type:'post',
|
autoParam: ["id"],
|
url:'${url}',
|
enable:true
|
},
|
callback: {
|
onClick: onClick
|
}
|
};
|
var ztreeNodes=[];
|
|
|
function onClick(e, treeId, treeNode) {
|
v=treeNode.name;
|
s=treeNode.id;
|
t=treeNode.jb;
|
var sh = ${showLevel};
|
if(sh == 1) {
|
$("#${textName}").val(v);
|
$("#${valueName}").val(s);
|
hideMenu();
|
} else if(sh == 2) {
|
if(t==2 || t == 3) {
|
$("#${textName}").val(v);
|
$("#${valueName}").val(s);
|
hideMenu();
|
}
|
} else if(sh == 3) {
|
if(t == 3) {
|
$("#${textName}").val(v);
|
$("#${valueName}").val(s);
|
hideMenu();
|
}
|
}
|
|
}
|
|
function showMenu() {
|
var categoryObj = $("#${textName}");
|
var categoryOffset = $("#${textName}").offset();
|
$("#menuContent").css({left:categoryOffset.left + "px", top:categoryOffset.top + categoryObj.outerHeight() + "px"}).slideDown("fast");
|
$("body").bind("mousedown", onBodyDown);
|
}
|
function hideMenu() {
|
$("#menuContent").fadeOut("fast");
|
$("body").unbind("mousedown", onBodyDown);
|
}
|
function onBodyDown(event) {
|
if (!(event.target.id == "menuBtn" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {
|
hideMenu();
|
}
|
}
|
|
function clearTree() {
|
$("#${textName}").val("");
|
$("#${valueName}").val("");
|
hideMenu();
|
}
|
|
$(function(){
|
$.fn.zTree.init($("#treeDemo"), setting, ztreeNodes);
|
$("#${textName}").click(function(){
|
showMenu();
|
});
|
});
|
|
</script>
|
<div id="menuContent" style="display:none; position: absolute;z-index:2001;">
|
<ul id="treeDemo" class="ztree" style="margin-top:0; width:${width};border:1px solid #d4d4d4;"></ul>
|
<a style="border:1px solid #bfbfbf;border-top:none; width:${width};line-height:25px;display:block;font-size:14px; padding:0px 10px 0 0;color:#0e76e5;text-align:right;background:#fff;" href="javascript:clearTree();">清空</a>
|
</div>
|
</#macro>
|