tree后台实现

最新推荐文章于 2024-03-25 17:17:02 发布

爱嘤斯塔

最新推荐文章于 2024-03-25 17:17:02 发布

阅读量153

点赞数

文章标签：数据库

本文链接：https://blog.csdn.net/weixin_60389087/article/details/120241565

版权

一、大概内容

目标：将原有的死数据替换成数据库中读取的方式

将上期内容继续改编与完善~~~~~

二、Jackson转换成json串

1、首先我们需要导入三个jar包

2、建一个类，用于存放数据里的所有属性

3、转换成json串

package lv.com.demo;

import java.util.HashMap;
import java.util.Map;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;

public class JsonDemo1 {

//       {"id":11,
//       "text":"Photos",
//       "state":"closed",
//       }

   public static void main(String[] args) throws Exception {
//       方式一：拿到数据，实体类对象转换成json串-->json对象
       JsonObject1 obj1=new JsonObject1("11", "学生管理", "closed");
       ObjectMapper om=new ObjectMapper();
       System.out.println(om.writeValueAsString(obj1));
//       方式二：不需要实体类对象，Map集合转换成json串-->json对象
       Map<String, Object> map=new HashMap<String, Object>();
       map.put("id", "11");
       map.put("text", "学生管理");
       map.put("state", "closed");
       System.out.println(om.writeValueAsString(map));
   }

}

②、得到数组串

package lv.com.demo;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;

public class JsonDemo2 {
/*   用于得到数组串：
   [{
       "id":14,
       "text":"about.html"
   },{
       "id":15,
       "text":"welcome.html"
   }]
   */

   public static void main(String[] args) throws Exception {
//       方式一：拿到数据，实体类集合对象转换成json串-->json数组
       JsonObject1 obj1=new JsonObject1("14", "about.html", null);
       JsonObject1 obj2=new JsonObject1("15", "welcome.html", null);
       List<JsonObject1> list=new ArrayList<JsonObject1>();
       list.add(obj1);
       list.add(obj2);
       ObjectMapper om=new ObjectMapper();
       System.out.println(om.writeValueAsString(list));

//       方式二：不需要实体类对象，Map集合对象转换成json串-->json数组
       Map<String, Object> map=new HashMap<String, Object>();
       map.put("id", "14");
       map.put("text", "about.html");
       map.put("state", null);
       Map<String, Object> mapew HashMap<String, Object>();
       map2.put("id", "15");
       map2.put("text", "welcome.html");
       map2.put("state", null);
       List<Map<String, Object>> listMap=new ArrayList<>();
       listMap.add(map);
       listMap.add(map2);
       System.out.println(om.writeValueAsString(listMap));
// 结论：在json串的转换结果而言，Map等价于对象，List<Map>等价于List<创建的类>

   }

}

4、缺陷：

①、json串并没有体现出父子层级关系，数据都是平级的

②、json串属性并不是id/text……等easyui要求的属性

三、tree控件的实现思路

最终得到的数据格式↓：

建立实体类Menu，与数据库的实体类相对应，属性名要与数据库内表的属性对应（区别字母大小写）

package lv.com.entity;

public class Menu {
   private String serialNo;
   private String menuid;
   private String menuname;
   private String menuURL;
   private String parentid;
   public String getSerialNo() {
       return serialNo;
   }
   public void setSerialNo(String serialNo) {
       this.serialNo = serialNo;
   }
   public String getMenuid() {
       return menuid;
   }
   public void setMenuid(String menuid) {
       this.menuid = menuid;
   }
   public String getMenuname() {
       return menuname;
   }
   public void setMenuname(String menuname) {
       this.menuname = menuname;
   }
   public String getMenuURL() {
       return menuURL;
   }
   public void setMenuURL(String menuURL) {
       this.menuURL = menuURL;
   }
   public String getParentid() {
       return parentid;
   }
   public void setParentid(String parentid) {
       this.parentid = parentid;
   }
   public Menu(String serialNo, String menuid, String menuname, String menuURL, String parentid) {
       super();
       this.serialNo = serialNo;
       this.menuid = menuid;
       this.menuname = menuname;
       this.menuURL = menuURL;
       this.parentid = parentid;
   }
   public Menu() {
       super();
       // TODO Auto-generated constructor stub
   }
   @Override
   public String toString() {
       return "Menu [serialNo=" + serialNo + ", menuid=" + menuid + ", menuname=" + menuname + ", menuURL=" + menuURL
               + ", parentid=" + parentid + "]";
   }
}

四、easyui树形组件数据结构的生成

1、写个dao类，将自定义mvc内容引进，引入util包、jar包与tag包，记得配置文件与修改资源文件

解决二标题内的缺陷：

①建立TreeVo<T>对象，写树控件数据格式化具备的属性，如id，text，state……等

public class TreeVo<T> {
   /**
   * 节点ID
   */
   private String id;
   /**
   * 显示节点文本
   */
   private String text;
   /**
   * 节点状态，open closed
   */
   private Map<String, Object> state;
   /**
   * 节点是否被选中 true false
   */
   private boolean checked = false;
   /**
   * 节点属性
   */
   private Map<String, Object> attributes;

   /**
   * 节点的子节点
   */
   private List<TreeVo<T>> children = new ArrayList<TreeVo<T>>();

   /**
   * 父ID
   */
   private String parentId;
   /**
   * 是否有父节点
   */
   private boolean hasParent = false;
   /**
   * 是否有子节点
   */
   private boolean hasChildren = false;

②、List<Menu> 转换成 List<TreeVo<Menu>>

package com.zking.util;

import java.util.ArrayList;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class BuildTree {

   /**
   * 默认-1为顶级节点
   * @param nodes 平级数据
   * @param <T>
   * @return
   */
   public static <T> TreeVo<T> build(List<TreeVo<T>> nodes) {

       if (nodes == null) {
           return null;
       }
       List<TreeVo<T>> topNodes = new ArrayList<TreeVo<T>>();

       for (TreeVo<T> children : nodes) {
           String pid = children.getParentId();
           if (pid == null || "-1".equals(pid)) {
               topNodes.add(children);

               continue;
           }

           for (TreeVo<T> parent : nodes) {
               String id = parent.getId();
               if (id != null && id.equals(pid)) {
                   parent.getChildren().add(children);
                   children.setHasParent(true);
                   parent.setChildren(true);
                   continue;
               }
           }

       }

       TreeVo<T> root = new TreeVo<T>();
       if (topNodes.size() == 1) {
           root = topNodes.get(0);
       } else {
           root.setId("000");
           root.setParentId("-1");
           root.setHasParent(false);
           root.setChildren(true);
           root.setChecked(true);
           root.setChildren(topNodes);
           root.setText("顶级节点");
           Map<String, Object> state = new HashMap<>(16);
           state.put("opened", true);
           root.setState(state);
       }

       return root;
   }

   /**
   * 指定idparam为顶级节点
   * @param nodes 平级数据
   * @param idParam
   * @param <T>
   * @return
   */
   public static <T> List<TreeVo<T>> buildList(List<TreeVo<T>> nodes, String idParam) {
       if (nodes == null) {
           return null;
       }
       List<TreeVo<T>> topNodes = new ArrayList<TreeVo<T>>();

       for (TreeVo<T> children : nodes) {

           String pid = children.getParentId();
           if (pid == null || idParam.equals(pid)) {
               topNodes.add(children);

               continue;
           }

           for (TreeVo<T> parent : nodes) {
               String id = parent.getId();
               if (id != null && id.equals(pid)) {
                   parent.getChildren().add(children);
                   children.setHasParent(true);
                   parent.setChildren(true);

                   continue;
               }
           }

       }
       return topNodes;
   }

}

③、让List<TreeVo<Menu>>中的数据有父子层级关系(由工具类BuildTree实现)

外层循环节点id如果等于内层循环节点的父id，那么就意味着内层循环当前的循环的节点是外层循环节点的儿子，那么此时就可以将内层循环的节点放入外层循环节点的children属性中

package lv.com.dao;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.zking.util.BaseDao;
import com.zking.util.BuildTree;
import com.zking.util.PageBean;
import com.zking.util.TreeVo;

import lv.com.entity.Menu;

public class MenuDao extends BaseDao<Menu>{

   public List<Menu> list(Menu menu,PageBean pageBean) throws Exception{
       return super.executeQuery("select * from t_easyui_menu",Menu.class, pageBean);
   }

   public List<TreeVo<Menu>> tree(Menu menu,PageBean pageBean) throws Exception{
//       拿到的是平级，没有父子层级关系的数据
       List<Menu> list=this.list(menu, pageBean);
       List<TreeVo<Menu>> listVos=new ArrayList<TreeVo<Menu>>();
       for (Menu m : list) {
           TreeVo<Menu> vo=new TreeVo<>();
           vo.setId(m.getMenuid());
           vo.setText(m.getMenuname());
           vo.setParentId(m.getParentid());
           Map<String, Object> attributes=new HashMap<String, Object>();
           attributes.put("self", m);
           vo.setAttributes(attributes);
           listVos.add(vo);
       }
//       构建父子层级关系（希望拿到菜单管理下的所有节点数据）
       return BuildTree.buildList(listVos,"000");
   }

   public static void main(String[] args) throws Exception {
       MenuDao menuDao=new MenuDao();
//       List<Menu> list=menuDao.list(null, null);
       List<TreeVo<Menu>> tree = menuDao.tree(null, null);

       ObjectMapper om=new ObjectMapper();

//       System.out.println(om.writeValueAsString(list));
       System.out.println(om.writeValueAsString(tree));
   }

}

出现父子层级关系：

五、 easyui的前台js的改变

在jsp中写入一个隐藏值，方便调用

<input type="hidden" id="ctx" value="${pageContext.request.contextPath}">

js文件中，不支持el表达式的

$(function(){
   $('#stuMenu').tree({
   url:$("#ctx").val()+'/menu.action?methodName=tree',
   onClick: function(node){
//           alert(node.text); // 在用户点击的时候提示
//            add a new tab panel
//       判断当前将要打开的选项卡是否存在
       var exists=$('#stuTabs').tabs('exists',node.text);
       if(exists){
           $('#stuTabs').tabs('select',node.text);
       }else{
           $('#stuTabs').tabs('add',{
               title:node.text,
               content:'<iframe width="100%" height="100%" src="'+node.attributes.url+'"></iframe>',
               closable:true,
               tools:[{
               iconCls:'icon-mini-refresh',
               handler:function(){
               alert('refresh');
               }
               }]
               });
       }
   }
   });
})

导入一个封装工具类

package com.zking.util;

import java.io.PrintWriter;

import javax.servlet.http.HttpServletResponse;

import com.fasterxml.jackson.databind.ObjectMapper;

public class ResponseUtil {
//封装类
   public static void write(HttpServletResponse response,Object o)throws Exception{
       response.setContentType("text/html;charset=utf-8");
       PrintWriter out=response.getWriter();
       out.println(o.toString());
       out.flush();
       out.close();
   }

   public static void writeJson(HttpServletResponse response,Object o)throws Exception{
       ObjectMapper om=new ObjectMapper();
//       om.writeValueAsString代表了json串
       write(response, om.writeValueAsString(o));
   }
}

写一个MenuAction

package lv.com.web;

import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.zking.framework.ActionSupport;
import com.zking.framework.ModelDriver;
import com.zking.util.ResponseUtil;
import com.zking.util.TreeVo;

import lv.com.dao.MenuDao;
import lv.com.entity.Menu;

public class MenuAction extends ActionSupport implements ModelDriver<Menu>{
   private Menu menu=new Menu();
   private MenuDao menuDao=new MenuDao();

   @Override
   public Menu getModel() {
       // TODO Auto-generated method stub
       return menu;
   }

   public String tree(HttpServletRequest req, HttpServletResponse resp) {
       try {
           List<TreeVo<Menu>> tree = menuDao.tree(null, null);
           ResponseUtil.writeJson(resp, tree);
       } catch (Exception e) {
           // TODO Auto-generated catch block
           e.printStackTrace();
       }
       return null;
   }

}