实际开发中,可能经常需要开发树形菜单,本篇文章就讲述一下树形菜单的制作。
用到的技术
1、SpringMVC
2、Spring
3、mybatis
4、easyui代码实现
- dto(适用于easyui的实体类)
public class OrgnDto {
	private String id;
	private String text;
	private String iconCls;
	private int checked;
	private String parent_id;
	private Map<String,Object> attributes = new HashMap<String,Object>();
	private String state;
//以下省略get和set方法
public OrgnDto(String id, String text, String iconCls, int checked,
			String parent_id, Map<String, Object> attributes, String state) {
		super();
		this.id = id;
		this.text = text;
		this.iconCls = iconCls;
		this.checked = checked;
		this.parent_id = parent_id;
		this.attributes = attributes;
		this.state = state;
	}
}- 实体类(对应于数据库的实体)
public class OrgnBasic implements Serializable{
	private Long id;
	private String orgnCode;//中心机构号
	private String fOrgnId;//父机构号
	private String orgnUnicode;//单位机构号
	private String orgnName;//机构名称
	private String orgnAbbrname;
	private String orgnDiv;
	private String orgnType;
	private String orgnLvl;
	private String orgnStat;
	private String zoneType;
	private String adminLevel;
	private String funcType;
	private String bankNo;
	private Date sdate;
	private Short state;
	private Date lastMod;
	private String leaf;
	private String orgnWdsign;
//省略了set和get方法
}- service
控制业务逻辑
@Service
public class OrgnBasicServiceImpl {
	@Autowired
	private OrgnBasicMapper orgnBasicMapper;
	/**
	 * @author 
	 * @description 查找机构
	 * @param request
	 * @return 返回easyui适用形式的实体类
	 */
	public List<OrgnDto> listOrgnTree(HttpServletRequest request) {
		OrgnBasicExample example = new OrgnBasicExample();
		List<OrgnBasic> orgns = orgnBasicMapper.selectByExample(example);
		List<OrgnDto> orgnDtos = new ArrayList<OrgnDto>();
		for (OrgnBasic orgn : orgns) {
			OrgnDto dto = new OrgnDto();
			dto.setId(orgn.getOrgnUnicode());
			dto.setText(orgn.getOrgnName());
			dto.setParent_id(orgn.getfOrgnId());
			if (getChildren(orgn.getOrgnUnicode()).size() > 0) {
				//还有下属机构,关闭状态
				dto.setState("closed");
			} else {
				dto.setState("open");
			}
			orgnDtos.add(dto);
		}
		System.out.println(orgnDtos);
		return orgnDtos;
	}
	/**
	 * @author 
	 * @time 2020/2/15
	 * @param orgnUnicode
	 *            机构号
	 * @return 传入机构的子机构
	 * @description 根据机构号查找子机构
	 */
	public List<OrgnBasic> getChildren(String orgnUnicode) {
		OrgnBasicExample example = new OrgnBasicExample();
		example.createCriteria().andFOrgnIdEqualTo(orgnUnicode);
		List<OrgnBasic> orgns = orgnBasicMapper.selectByExample(example);
		return orgns;
	}
}
- controller
@Autowired
private OrgnBasicServiceImpl orgnBasicServiceImpl;
@ResponseBody
@RequestMapping("listOrgnTree")
public List<OrgnDto> listOrgnTree(HttpServletRequest request) {
  return orgnBasicServiceImpl.listOrgnTree(request);
}- jsp(easyui)
<ul id="orgnTree">机构列表</ul>
$("#orgnTree").tree({
	url:"${pageContext.request.contextPath}/machine_update/listOrgnTree",
	animate:true,
	checkbox:true,
	loadFilter:function(rows){
		return convert(rows);
	}
});
/*easyui官方提供的处理json数据的方法*/
function convert(rows){
    function exists(rows, parent_id){
        for(var i=0; i<rows.length; i++){
            if (rows[i].id == parent_id) return true;
        }
        return false;
    }
    var nodes = [];
    for(var i=0; i<rows.length; i++){   // get the top level nodes
        var row = rows[i];
        if (!exists(rows, row.parent_id)){
            nodes.push({
                id:row.id,
                text:row.text,
                state:row.state
            });
        }
    }
    var toDo = [];
    for(var i=0; i<nodes.length; i++){
        toDo.push(nodes[i]);
    }
    while(toDo.length){
        var node = toDo.shift();    // the parent node
        for(var i=0; i<rows.length; i++){   // get the children nodes
            var row = rows[i];
            if (row.parent_id == node.id){
                var child = {id:row.id,text:row.text,state:row.state};
                if (node.children){
                    node.children.push(child);
                } else {
                    node.children = [child];
                }
                toDo.push(child);
            }
        }
    }
    return nodes;
}
- 效果图
爱生活爱java
