Java树状图展示的实现

这篇博客介绍了如何在Java中构建和显示树形结构,并计算每个节点的成员数量。提供了一个基类`BaseTreeVo`,包含计算成员数的方法,以及构建树结构的工具方法。示例代码展示了如何从数据库查询数据并构建部门树形列表,其中每个节点包含部门名、排序和成员数量。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Java树状图展示的实现

在项目中经常会遇到将数据以树状图的形式展现出来,如图:
在这里插入图片描述
有时候不仅要构建树结构,还要计算每个节点拥有的成员数量.

由于我们不能确定树的大小和层级就不能用常规的方法进行展示,我的解决放入如下,直接上代码:

首先准备实体类:
我已近将构造实体类的方法写在实体类里面了,以后需要构造树形结构的类只要写上自己独有的字段,然后继承这个类,就能直接调用写好的构造树形结构的方法,相当于一个工具类.

/**
 * ClassName: BaseTreeVo <br/>
 * Description: <br/>
 * date: 2022/8/20 12:33<br/>
 * 构造树形结构的类都应该继承该类
 *
 * @author 无情的花裤衩<br />
 */
@Data
public class BaseTreeVo {

    @ApiModelProperty(value = "节点id")
    private Long id;
    @ApiModelProperty(value = "上级节点的id 上级节点为0时为根节点")
    private Long superId;
    @ApiModelProperty(value = "子节点")
    private List<BaseTreeVo> children;
    @ApiModelProperty(value = "拥有成员总数量")
    private Integer memberNum;
    @ApiModelProperty(value = "直属子成员的id集合")
    private Set<Long> directlyMemberIds;
	//这里使用set集合是因为可能会出现一个员工属于多个部门的情况,
	//防止一个员工被重复计算为多个员工导致数量不准确

    /**
     * 计算当前节点拥有成员的总数
     *
     * @param element 需要计算拥有成员总数量的节点
     */
    public static void countMemberNum(BaseTreeVo element) {
        Set<Long> memberIds = Sets.newHashSet();
        if (!CollectionUtils.isEmpty(element.getDirectlyMemberIds())) {
            memberIds.addAll(element.getDirectlyMemberIds());
        }
        memberIds.addAll(getChildrenMemberIds(element.getChildren()));
        //设置拥有的成员数量
        element.setMemberNum(memberIds.size());
    }

    /**
     * 获取子节点拥有的全部成员的id集合
     *
     * @param children 某个节点的全部的子节点
     * @return 全部子节点拥有成员的id集合
     */
    public static Set<Long> getChildrenMemberIds(List<? extends BaseTreeVo> children) {
        //全部子节点拥有成员的id集合
        Set<Long> result = Sets.newHashSet();
        for (BaseTreeVo child : children) {
            //没有子节点  这个节点是叶子节点
            if (CollectionUtils.isEmpty(child.getChildren())) {
                //设置拥有的成员数量
                if (CollectionUtils.isEmpty(child.getDirectlyMemberIds())) {
                    child.setMemberNum(0);
                } else {
                    child.setMemberNum(child.getDirectlyMemberIds().size());
                    result.addAll(child.getDirectlyMemberIds());
                }
            } else {
                //这个节点还有子节点 不是叶子节点
                Set<Long> childrenMemberIds = getChildrenMemberIds(child.getChildren());
                if (!CollectionUtils.isEmpty(child.getDirectlyMemberIds())) {
                    childrenMemberIds.addAll(child.getDirectlyMemberIds());
                }
                child.setMemberNum(childrenMemberIds.size());
                result.addAll(childrenMemberIds);
            }
        }
        return result;
    }

    /**
     * 获取根节点
     * 多个根节点时用这个方法获取根节点
     *
     * @param elements 全部的需要构建树形结构的元素
     */
    public static List<BaseTreeVo> getRootNodes(List<? extends BaseTreeVo> elements) {
        List<BaseTreeVo> roots = Lists.newLinkedList();
        Iterator<? extends BaseTreeVo> iterator = elements.iterator();
        while (iterator.hasNext()) {
            BaseTreeVo element = iterator.next();
            if (element.getSuperId() == 0) {
                roots.add(element);
                //将根节点移除 降低以后的循环元素
                iterator.remove();
            }
        }
        return roots;
    }

    /**
     * 获取根节点
     * 只有一个根节点时用这个方法
     *
     * @param elements 全部的需要构建树形结构的元素
     */
    public static BaseTreeVo getRootNode(List<? extends BaseTreeVo> elements) {
        BaseTreeVo result = null;
        for (BaseTreeVo element : elements) {
            if (element.getSuperId() == 0) {
                //将集合中的根节点移除,减少后续的循环元素的个数
                elements.remove(element);
                result = element;
                return result;
            }
        }
        return null;
    }

    /**
     * 递归,建立子树形结构
     *
     * @param rootNode 根节点
     * @param elements 全部的子节点
     */
    public static BaseTreeVo buildTree(BaseTreeVo rootNode, List<? extends BaseTreeVo> elements) {
        List<BaseTreeVo> children = Lists.newLinkedList();
        for (BaseTreeVo element : elements) {
            if (element.getSuperId().equals(rootNode.getId())) {
                children.add(buildTree(element, elements));
            }
        }
        rootNode.setChildren(children);
        return rootNode;
    }
}

使用代码的示例:
表结构:
父子关系是通过superId进行绑定的
在这里插入图片描述

需要构造树形结构的类:

/**
 * 树形展示租户部门列表vo类
 *
 * @author yanglixin2
 */
@Data
@EqualsAndHashCode(callSuper = true)
@ApiModel(description = "部门树形列表")
public class TenantDepartmentListVo extends BaseTreeVo {



    @ApiModelProperty(value = "部门名称")
    private String departmentName;
    @ApiModelProperty(value = "本级排序")
    private Integer sort;
}
/**
     * 树形展示部门列表
     *
     * @return 部门树形列表
     */
    @Override
    public TenantDepartmentListVo queryDepartmentList() {
        //1.查询出全部部门
        List<TenantDepartment> departmentList = queryDepartmentAllList();

        List<TenantDepartmentListVo> departmentVoList = Lists.newLinkedList();
        //将实体类对象转化为视图对象
        for (TenantDepartment tenantDepartment : departmentList) {
            TenantDepartmentListVo departmentListVo = BeanHelper.copyProperties(tenantDepartment, TenantDepartmentListVo.class);
            departmentVoList.add(departmentListVo);
        }

        //查询每个部门的直属人员的数量
        //首先部门的id集合
        List<Long> departmentIds = departmentVoList.stream().map(BaseTreeVo::getId).collect(Collectors.toList());
        //通过部门id查询出每个部门拥有的员工id
        List<TenantDepartmentAccountIdsVo> departmentAccountIds = this.baseMapper.queryDepartmentAccountIds(departmentIds);
        List<Long> departmentHasAccountIds = departmentAccountIds.stream().map(TenantDepartmentAccountIdsVo::getDepartmentId).collect(Collectors.toList());
        //给每个部门设置直属账号的id集合
        for (TenantDepartmentListVo tenantDepartmentListVo : departmentVoList) {
            if (!departmentHasAccountIds.contains(tenantDepartmentListVo.getId())) {
                //当前部门没有直属账号
                tenantDepartmentListVo.setDirectlyMemberIds(null);
            } else {
                for (TenantDepartmentAccountIdsVo departmentAccountId : departmentAccountIds) {
                    if (departmentAccountId.getDepartmentId().equals(tenantDepartmentListVo.getId())) {
                        tenantDepartmentListVo.setDirectlyMemberIds(departmentAccountId.getAccountIds());
                    }
                }
            }
        }

        //2.获取根部门
        BaseTreeVo rootNode = BaseTreeVo.getRootNode(departmentVoList);
        if (Objects.isNull(rootNode)) {
            throw new BusinessException(ErrorDesc.SERVER_ERROR.getDesc());
        }
        //3.构建树结构  并将类型转换回来
        TenantDepartmentListVo resultTree = (TenantDepartmentListVo) BaseTreeVo.buildTree(rootNode, departmentVoList);
        //4.设置账号总数
        BaseTreeVo.countMemberNum(resultTree);
        return resultTree;
    }
$(function(){ $.fn.extend({ SimpleTree:function(options){ //初始化参数 var option = $.extend({ click:function(a){ } },options); option.tree=this; /* 在参数对象中添加对当前菜单树的引用,以便在对象中使用该菜单树 */ option._init=function(){ /* * 初始化菜单展开状态,以及分叉节点的样式 */ this.tree.find("ul ul").hide(); /* 隐藏所有子级菜单 */ this.tree.find("ul ul").prev("li").removeClass("open"); /* 移除所有子级菜单父节点的 open 样式 */ this.tree.find("ul ul[show='true']").show(); /* 显示 show 属性为 true 的子级菜单 */ this.tree.find("ul ul[show='true']").prev("li").addClass("open"); /* 添加 show 属性为 true 的子级菜单父节点的 open 样式 */ }/* option._init() End */ /* 设置所有超链接不响应单击事件 */ this.find("a").click(function(){ $(this).parent("li").click(); return false; }); /* 菜单项 接受单击 */ this.find("li").click(function(){ /* * 当单击菜单项 * 1.触发用户自定义的单击事件,将该 标签中的第一个超链接做为参数传递过去 * 2.修改当前菜单项所属的子菜单的显示状态(如果等于 true 将其设置为 false,否则将其设置为 true) * 3.重新初始化菜单 */ option.click($(this).find("a")[0]); /* 触发单击 */ /* * 如果当前节点下面包含子菜单,并且其 show 属性的值为 true,则修改其 show 属性为 false * 否则修改其 show 属性为 true */ /* if($(this).next("ul").attr("show")=="true"){ $(this).next("ul").attr("show","false"); }else{ $(this).next("ul").attr("show","true"); }*/ /* 初始化菜单 */ option._init(); }); /* 设置所有父节点样式 */ this.find("ul").prev("li").addClass("folder"); /* 设置节点“是否包含子节点”属性 */ this.find("li").find("a").attr("hasChild",false); this.find("ul").prev("li").find("a").attr("hasChild",true); /* 初始化菜单 */ option._init(); }/* SimpleTree Function End */ }); });
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值