ztree 树

页面代码:

<div class="content minheight">
    <ul id="treeDemo" class="ztree" style="width:360px; overflow:auto;min-height: 500px;">加载中...</ul>
</div>

js代码:

<script type="text/javascript">

var isShow = false;
var dragId;
var setting = {
    /*async: {
        enable: true,
        url:"${ctx}/goods/cat/getGoodsCatList.html",
        autoParam:["id"],
        dataFilter: filter
    },*/
    view: {
        expandSpeed:"",
        addHoverDom: addHoverDom,
        removeHoverDom: removeHoverDom,
        selectedMulti: false
    },
    data: {
        simpleData: {enable: true}
    },
    edit: {
        enable: true,
        removeTitle: "删除类目",
        renameTitle: "修改类目",
        drag:{isMove:false}
    },
    callback: {
        onClick: onClick,
        beforeRemove: beforeRemove,
        beforeDrag: beforeDrag,
        beforeDrop: beforeDrop,
        beforeEditName: beforeEditName
    }
};


$(function(){
    var t = new Date().getTime();
    $.getJSON("${ctx}/goods/cat/ajaxAllGoodsCatList.html",{t:t},function(data){
        $.fn.zTree.init($("#treeDemo"), setting, data);
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        var nodes = zTree.getSelectedNodes();
        if (nodes.length>0) {
            zTree.expandNode(nodes[0], true, false, true);
        }
        var nodes = zTree.transformToArray(zTree.getNodes());
        for(var i =0;i<nodes.length;i++){
            if(nodes[i].pubFlag == 0){
                nodes[i].icon = "${ctx}/css/zTreeStyle/img/icongreen.png";
                zTree.updateNode(nodes[i]);
            }
        }
    });
});

function beforeDrag(treeId, treeNodes) {
            for ( var i = 0, l = treeNodes.length; i < l; i++) {
                dragId = treeNodes[i].pid;
                if (treeNodes[i].drag === false) {
                    return false;
                }
            }
            return true;

        }

function beforeDrop(treeId, treeNodes, targetNode, moveType) {
            if(targetNode.pid != treeNodes[0].pid || moveType=="inner") {
                alert("只能同级进行拖拽!");
                return false;
            }
            
            var targetId=targetNode.id;
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            var newOrderNum=0;
            var oldNum = zTree.getNodeIndex(treeNodes[0]);
            targetId=targetNode.pid;
            newOrderNum=zTree.getNodeIndex(targetNode);
            if(targetNode.pid == treeNodes[0].pid){
                if( moveType=="next" && oldNum >newOrderNum){
                    newOrderNum=newOrderNum+1;
                }else if(moveType=="prev" && oldNum < newOrderNum){
                    newOrderNum = newOrderNum-1;
                }
            }            
            
            $.ajax({
                type : "POST",
                url : "${ctx}/goods/cat/moveNode.html",
                data : {
                    "id" : treeNodes[0].id,
                    "parentFuncId" : targetNode.pid,
                    "position" : newOrderNum
                },
                async : false,
                success : function(data) {
                    if (data == '1') {
                        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
                        var nodes = zTree.getSelectedNodes();
                        zTree.reAsyncChildNodes(nodes[0].getParentNode(), "refresh");
                    }else{
                        alert("移动失败");
                        zTree.reAsyncChildNodes(nodes[0].getParentNode(), "refresh");
                    }
                        
                }
            });
        }

function filter(treeId, parentNode, childNodes) {
    if (!childNodes) return null;
    for (var i=0, l=childNodes.length; i<l; i++) {
        childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
        if(childNodes[i].pubFlag == 0){
            childNodes[i].icon = "${ctx}/css/zTreeStyle/img/icongreen.png";
        }
    }
    return childNodes;
}

function addHoverDom(treeId, treeNode) {
    var sObj = $("#" + treeNode.tId + "_span");
    if ($("#addBtn_"+treeNode.id).length>0 || treeNode.catLevel >= 3) return;
    var addStr = "<span class='button add' id='addBtn_" + treeNode.id
                + "' title='新增类目' onfocus='this.blur();'></span>";
    sObj.after(addStr);
    
    var btn = $("#addBtn_" + treeNode.id);
    if (btn) btn.bind("click", function(){
        $.post("${ctx}/goods/cat/getGoodsCatCode.html",{pid:treeNode.id},
            function(data){
                var result = eval("(" + data + ")");
                if(result.resMsg == "pidnull"){
                    alert("所属类目不能为空!"); return false;
                }else if(result.resMsg == "notexist"){
                    alert("所属类目不存在!"); return false;
                }else{
                    $("#optType").val("save");
                    $("#goodsCatForm").attr("action", "${ctx}/goods/cat/saveOrUpdate.html");
                    $("#goodscatId").val("");
                    $("#name").val("");
                      
                    $("#name").next("span.tempInfo").html("");
                    $("#catOrder").next("span.tempInfo").html("");
                    $(":radio[name=catShow]").parent("label").next("span.tempInfo").html("");
                    
                    $("#catLevel").val(result.level);
                    var catLevel = $("#catLevel").val();
                    $("#erpMatCodeDiv").hide();
                    $("#erpMatDescDiv").hide();
                    if(catLevel=='3'){
                        $("#erpMatCodeDiv").show();
                        $("#erpMatDescDiv").show();
                        $("#erpMatCode").val("");
                        $("#erpMatCode").next("span.tempInfo").html("");
                        $("#erpMatDesc").val(result.catNamePath);
                        $("#catNamePath").val(result.catNamePath);
                        $("#erpMatDesc").next("span.tempInfo").html("");
                   }
 
                    $("#catOrder").val(result.catOrder);
                    $("#catCode").val(result.catCode);
                    
                    $("#parendName").val(treeNode.name);
                    $("#parentId").val(treeNode.id);
                    $("#deptRollBackBtn").show();
                    
                    $(":radio[name=catShow]").removeAttr("checked").attr("disabled","disabled");
                    $(":radio[name=catShow][value=2]").attr("checked","checked").removeAttr("disabled");

                    $("#deptSubBtn").removeAttr("disabled");
                    $("#deptEditDiv").css({visibility:"visible"});
                    $("#deptRollBackBtn").hide();
                    if(!isShow){
                        $("#deptEditDiv .member_mainnav").css("position","relative").css("left","100px").css("opacity",0);
                        $("#deptEditDiv .member_mainnav").animate({left:'0',opacity:1},"fast");
                        isShow = true;
                    }
                }
            }
         );
        return false;
    });
};
 

// 鼠标移出树节点事件。
function removeHoverDom(treeId, treeNode) {
    $("#addBtn_"+treeNode.id).unbind().remove();
};

// 点击删除图标时的事件处理。
function beforeRemove(treeId, treeNode){
    if(treeNode.id == "-1"){
        alert("不能删除顶级菜单");
        return false;
    }
    var zTree = $.fn.zTree.getZTreeObj("treeDemo");
    zTree.selectNode(treeNode);
    if(confirm("确定要删除类目\"" + treeNode.name + "\"吗?如果该类目下有商品,该类目下的所有商品将会下架。")){
        $.ajax({
           type: "post",
           url: "${ctx}/goods/cat/removeGoodsCatById.html",
           data: {id:treeNode.id},
           dataType: "text",
           success: function(data){
               if(data == "idnull"){
                   alert("类目ID不能为空!");
                   return false;
               }else if(data == "goodsnull"){
                   alert("要删除的类目不存在!");
                   return false;
               }else if(data == "subgoods"){
                   alert("该类目下有子类目,请先删除子类目!");
                   return false;
               }else if(data == "success"){
                   alert("类目删除成功"); 
                   zTree.removeNode(treeNode);
                   $("#deptEditDiv").css({visibility:"hidden"});
               }
           }
        });
    }
    return false;
}
 

function beforeEditName(treeId, treeNode){
    if(treeNode.id == "-1"){
        alert("不能修改顶级菜单");
        return false;
    }
    loadEditCatForm(treeNode);
    return false;
}

</script >

后台代码:

public String ajaxAllGoodsCatList(){
    // 要返回的结果。
    List<Map<String, Object>> resList = new ArrayList<Map<String, Object>>();

    Map<String, Object> root = null;
    root = new HashMap<String, Object>();
    root.put("id", "-1");
    root.put("name", "商品类目根目录");
    root.put("open", true);
    root.put("isParent", true);
    root.put("nocheck", true);
    resList.add(root);

    GoodsCatQuery goodsCatQuery = new GoodsCatQuery();
    goodsCatQuery.setDelFlag(0);
    //goodsCatQuery.setParentId("-1");
    goodsCatQuery.setSortColumns(" CAT_ORDER ASC");
    List<GoodsCat> goodsCatList = baseService.find(SERVICE, goodsCatQuery);
    if(goodsCatList != null && goodsCatList.size() != 0){
        Map<String, Object> temp = null;
        for(GoodsCat goodsCat : goodsCatList){
            temp = new HashMap<String, Object>();
            temp.put("id", goodsCat.getId());
            temp.put("name", goodsCat.getName());
            temp.put("catCode", goodsCat.getCatCode());
            temp.put("catLevel", goodsCat.getCatLevel());
            temp.put("catOrder", goodsCat.getCatOrder());
            temp.put("catShow", goodsCat.getCatShow());
            temp.put("pubFlag", goodsCat.getPubFlag());
            temp.put("pId", goodsCat.getParentId());
            //temp.put("isParent", true);
            resList.add(temp);
        }
    }
    //root.put("children", resList);
    return writeAjaxResponse(JSONObject.toJSONString(resList));
}

猜你喜欢

转载自blog.csdn.net/qq_35872777/article/details/87895016
今日推荐