java web实现easyui树(第一版本)

来源:互联网 发布:手机唱歌美声软件 编辑:程序博客网 时间:2024/06/01 07:45

java代码:

package cmxui.pub.easyui;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import com.cmx.db.cmxDatabase;import com.cmx.tools.CmxTools;/** * 1、从表中取出树的内容。2、形成树的JSON串 * 形成首页的统计图用到,统计出每个分类对应的树结点,通过树查找出相应的内容,通过去重等,得到四个值 * @author Administrator * */public class cmxTree extends CmxTreePub{    private String projName = "";    private String sql = "";    private String fields = "";    /**     * 构造函数     * @param sql 运行查询的SQL语句     * @param fields  形成Map的Key定义     */    public cmxTree(String projName, String sql, String fields) {        this.projName = projName;        this.sql = sql;        this.fields = fields;    }    /**     * 将内容形成JSON  树的数据,List套List,通过fields形成MAP,构建三个MAP     * @author fanjw 2017年1月30日     * @return  返回easyui对应的树数据     */    public List<Object> getTreeJson(){      // id, pid, text, iconCls, checked, state, attributes, target   // select id,ClassID (结点),Parents(父结点),PreferredLabel(文本) from fenleishu        List<List<Object>> llo = cmxDatabase.getData(projName, sql);        List<Map<String, String>> lm = CmxTools.convertFieldMap(llo, fields);        Map<String, String> map_id_pid = new HashMap<String,String>();  // key为ID, Value为Pid        Map<String, Map<String, String>> map_id_attrMap = new HashMap<String,Map<String, String>>();  //复杂Map key为ID, Value为 id:text:pid        Map<String, List<String>> map_pid_ids = new HashMap<String,List<String>>();  // key为Pid,value为[id,id,id,id]        // 以下功能为构建几个MAP,用于生成树        for(int i=0; i<llo.size(); i++){            String myId = lm.get(i).get("id").toString();            String myPid = lm.get(i).get("pid").toString();            map_id_pid.put(myId, myPid);            map_id_attrMap.put(myId, lm.get(i));            CmxTools.addValueList(map_pid_ids, myPid, myId);        // 添加新的ID           }               List<String> roots = getRootKeyLst(map_id_pid);  // 找出多根        System.out.println("roots=" + roots);        List<Object> lo = new ArrayList<Object>();        for(String root : roots){            Map<String, Object> omap = getChild(map_pid_ids, map_id_attrMap, root, 0);            lo.add(omap);        }        return(lo);    }    /**     * 以下功能为找出根结点, 多个根返回List 父结点 与 子 结点相同,则设置父结点为空,表示此子结点为根结点     * @author fanjw 2017年1月30日     * @param map_id_pid     * @return     */    private List<String> getRootKeyLst(Map<String, String> map_id_pid) {        List<String> ls = new ArrayList<String>();        for(String key : map_id_pid.keySet()){            String value = map_id_pid.get(key);            if(value.equals(key) || value.trim().length()==0) ls.add(key);  // 如果父结点与子结点相等,或者父结点为空,则此结点为根            if(!map_id_pid.containsKey(value)) ls.add(key);   // 如果父结点不在结点表中,即此父结点没有自己的上一级结点了,则为根        }        return ls;    }    /**     * @param map_pid_ids key为Pid,value为[id,id,id,id]     * @param map_id_obj  复杂Map key为ID, Value为 map, 即 此结点对应的属性{id:1, text:2}     * @param rootid     * @param index     * @param comboboxMap     * @return     */    private Map<String, Object> getChild(Map<String, List<String>> map_pid_ids, Map<String, Map<String, String>> map_id_obj,  String rootid, int index){        index++;        Map<String, Object> omap = new HashMap<String, Object>();        if(map_id_obj.containsKey(rootid)) omap.putAll(map_id_obj.get(rootid));        if(map_pid_ids.containsKey(rootid) && index<4){  // 结点有孩子            List<Object> lo = new ArrayList<Object>();            for(String id : map_pid_ids.get(rootid)){                lo.add(getChild(map_pid_ids, map_id_obj, id, index));            }            omap.put("children", lo);        }        return(omap);    }    /**     *      * @author fanjw 2017年1月29日     * @param args     */    public static void main(String[] args) {        cmxTree tj = new cmxTree("cmxniaodb", "select id,ClassID,Parents,PreferredLabel from fenleishu", "noname,id,pid,text");        List<Object> gt = tj.getTreeJson();        System.out.println("gt=" + gt);    }    /* (non-Javadoc)     * @see cmxui.pub.easyui.CmxInterfaceUi#setData()     */    @Override    public void setData() {        // TODO Auto-generated method stub    }    /* (non-Javadoc)     * @see cmxui.pub.easyui.CmxInterfaceUi#getJsonStr()     */    @Override    public void getJsonStr() {        // TODO Auto-generated method stub    }}

拦截器代码:

package cmxui.controller.tree;import java.util.List;import javax.servlet.http.HttpServletRequest;import net.sf.json.JSONArray;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import cmxui.pub.easyui.cmxTree;import com.cmx.tools.CmxTools;import com.cmx05.pagepub.CmxPagePub;/** * 树测试用 * 2017.01.28 */@Controller@RequestMapping("/web")public class TreeController {    @RequestMapping(value = "/tree", method = { RequestMethod.GET,            RequestMethod.POST })    public String cmxtree(Model model, HttpServletRequest request) {        cmxTree ct = new cmxTree("cmxniaodb", "select id,ClassID,Parents,PreferredLabel from fenleishu", "noname,id,pid,text");        List<Object> lmap = ct.getTreeJson();        JSONArray lmjson = JSONArray.fromObject(lmap);        model.addAttribute("CmxTree", CmxTools.getJsonForJS(lmjson+""));        // 去除JSON内容中的单引号        request.getSession().setAttribute("basepath", CmxPagePub.getBasePath(request));        model.addAttribute("basepath", CmxPagePub.getBasePath(request));        String  rStr = "/treetest/indextree";        return rStr;    }}

JSP前端代码:

<%@ page import="java.sql.Timestamp"%><%@ page language="java" import="java.util.*" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><%@ page language="java" import="java.text.SimpleDateFormat"%><%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%><!doctype html><html lang="utf-8"> <head>    <meta charset="utf-8">    <jsp:include page="/page/treetest/cmx00_head0.jsp"/>    <script type="text/javascript">        var treedata = eval("(" + '${CmxTree}' + ")");          console.log(treedata);    </script> </head> <body>     <div style="margin:0px;">             <ul id="cmxLeftTree" style='border:2px solid blue;height:980px;width:600px;'></ul>    </div>    <script type="text/javascript">        var dd = treedata;        console.log(dd);        $('#cmxLeftTree').tree({            data:dd,            animate:true,            lines:true,            dnd:true,            method:'get'        });     </script></body> </html>
0 0