《easyUI的树形菜单》

清疚 2022-05-10 02:33 209阅读 0赞

1：dao方法

package com.zy.dao;
    
    import java.sql.SQLException;
    import java.util.ArrayList;
    import java.util.HashMap;
    import java.util.List;
    import java.util.Map;
    
    import com.zy.entity.TreeNode;
    import com.zy.util.JsonBaseDao;
    import com.zy.util.JsonUtil;
    import com.zy.util.PageBean;
    import com.zy.util.StringUtils;
    
    public class MenuDao extends JsonBaseDao{
    	/**
    	 * 查询后台需要展示的树形菜单的数据
    	 * 注意：该数据转换成json对象，是不符合easyUI的tree组件展现的json格式
    	 * @param paramMap
    	 * @param pageBean
    	 * @return
    	 * @throws InstantiationException
    	 * @throws IllegalAccessException
    	 * @throws SQLException
    	 */
    	public List<Map<String, Object>> menuList(Map<String, String[]> paramMap,PageBean pageBean) throws InstantiationException, IllegalAccessException, SQLException{
    		String menuId = JsonUtil.getparamVal(paramMap, "Menuid"); //Menuid字段必须与数据库字段一致
    		System.out.println(menuId);
    		String sql=" select * from t_easyui_menu where true ";
    //		判断id是否为空，再拼接SQL语句
    		if(StringUtils.isNotBlank(menuId)) {
    			sql+=" and parentid="+menuId;
    		}else {
    			sql+=" and parentid=-1 ";
    		}
    		return super.executeQuery(sql, pageBean);
    	}
    	
    	/**
    	 * 直接查询出来的数据不能展示，需转换成可以展示的数据
    	 * @param map
    	 * @param treeNode
    	 * @throws SQLException 
    	 * @throws IllegalAccessException 
    	 * @throws InstantiationException 
    	 */
        private void mapToTreeNode(Map<String, Object> map,TreeNode treeNode) throws InstantiationException, IllegalAccessException, SQLException {
        	//将查询出来的节点结果集设置给treeNode
        	treeNode.setId(map.get("Menuid").toString());  //1,id
        	treeNode.setText(map.get("Menuname").toString());  //2,展示内容
        	treeNode.setAttributes(map);  //3,描述父子节点，用于递归子节点
        	
    //    	treeNode.setChildren(children);  4,树形菜单的节点，除了id以及展示文本，可能还伴有跳转页面，或者展示图片，等等一系列的描述都放到属性的map集合中
        	Map<String, String[]> paramMap=new HashMap<>();
        	//根据当前id作为父节点id，查询出他的所有的子节点
        	paramMap.put("Menuid", new String[] {treeNode.getId()});  //拿到当前id设置给menuList方法的参数paramMap,再次查询
        	List<Map<String, Object>> menuList = this.menuList(paramMap, null);//根据当前id再查询到他所有的子节点
        	List<TreeNode> TreeNodeList=new ArrayList<>();
        	mapListToTreeNodeList(menuList, TreeNodeList);
        	treeNode.setChildren(TreeNodeList);  //4,树形菜单的节点，除了id以及展示文本，可能还伴有跳转页面，或者展示图片，等等一系列的描述都放到属性的map集合中
        }
        
        /**
         * 遍历查询出的节点的方法
         * @param map
         * @param treeNode
         * @throws SQLException 
         * @throws IllegalAccessException 
         * @throws InstantiationException 
         */
        private void mapListToTreeNodeList(List<Map<String, Object>> list, List<TreeNode> TreeNodeList) throws InstantiationException, IllegalAccessException, SQLException {
        	TreeNode treeNode=null;
        	for (Map<String, Object> map : list) {  //遍历查询出的所有节点
        		treeNode=new TreeNode();
        		mapToTreeNode(map, treeNode);
        		TreeNodeList.add(treeNode);
    		}
        }
    
        /**
         * 该方法的返回值，是符合easyUI的tree组件展现的json格式
         * @param paramMap
         * @param pageBean
         * @return
         * @throws InstantiationException
         * @throws IllegalAccessException
         * @throws SQLException
         */
        public List<TreeNode> menuTreeList(Map<String, String[]> paramMap,PageBean pageBean) throws InstantiationException, IllegalAccessException, SQLException{
        	List<Map<String, Object>> menuList = this.menuList(paramMap, null); //根据页面传过来id查询节点
        	List<TreeNode> TreeNodeList=new ArrayList<>();
        	mapListToTreeNodeList(menuList, TreeNodeList);
    		return TreeNodeList;
        }
        
    
    }

2：easyUI的js代码

$(function() {
    	
    	var Aurl=$("#Aurl").val();
    	
    	$('#menuTree').tree({    
    	    url:Aurl+'/menuAction.action?methodName=menuTreeList',  //请求全路径
    	    onClick: function(node){  //点击事件
    	    	if($('#menuTab').tabs('exists',node.text)){  //如果已经存在
    	    	   $('#menuTab').tabs('select',node.text)    //就锁定
    	    	}else{
    	    	$('#menuTab').tabs('add',{  //否则就创建一个新的
    	    	    title:node.text,    
    	    	    content:'<iframe scrolling="no" frameborder="0" src="'+node.attributes.menuUrl+'" width="99%" height="99%"></iframe>',    
    	    	    closable:false
    	    	});
    	    	
    	      }
    	    	
    		}
    
    	});  
    	
    })