标签:override context EDA intel eth checked 下载 throws option
目标:
1、通过layout布局
2、通过tree加载菜单
3、通过菜单去打开不同的tab页
ui框架:
easyui=jquery+html4(用来做后台的管理界面)
bootstrap=jquery+html5
layui
导包:
导入需要的工具类:
下载程序库并导入EasyUI的CSS和Javascript文件到您的页面。
一定要严格按照顺序
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"> <script type="text/javascript" src="easyui/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
一旦你导入了EasyUI必须的文件,你就可以通过标记或Javascript定义一个EasyUI组件。例如:定义一个带可折叠功能的面板,你需要写的HTML代码如下:
<div data-options="region:‘north‘,border:false" style="height:60px;background:#B3DFDA;padding:10px">north region</div> <div data-options="region:‘west‘,split:true,title:‘West‘" style="width:150px;padding:10px;"> 菜单管理 <ul id="tt"></ul> </div> <div data-options="region:‘east‘,split:true,collapsed:true,title:‘East‘" style="width:100px;padding:10px;">east region</div> <div data-options="region:‘south‘,border:false" style="height:50px;background:#A9FACD;padding:10px;">south region</div> <div data-options="region:‘center‘,title:‘Center‘"></div>
实体类:
TreeNode.java
作用是通过TreeNode类转换成 tree_data1.json
package com.huang.entity; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; public class TreeNode { private String id; private String text; private Map<String, Object> attributes = new HashMap<>(); private List<TreeNode> children = new ArrayList<>(); public String getId() { return id; } public void setId(String id) { this.id = id; } public String getText() { return text; } public void setText(String text) { this.text = text; } public Map<String, Object> getAttributes() { return attributes; } public void setAttributes(Map<String, Object> attributes) { this.attributes = attributes; } public List<TreeNode> getChildren() { return children; } public void setChildren(List<TreeNode> children) { this.children = children; } public TreeNode(String id, String text, Map<String, Object> attributes, List<TreeNode> children) { super(); this.id = id; this.text = text; this.attributes = attributes; this.children = children; } public TreeNode() { super(); } @Override public String toString() { return "TreeNode [id=" + id + ", text=" + text + ", attributes=" + attributes + ", children=" + children + "]"; } }
tree_data1.json
[{ "id":1, "text":"菜单管理", "children":[{ "id":11, "text":"财务", "state":"closed", "children":[{ "id":111, "text":"联系我们" },{ "id":112, "text":"Wife" },{ "id":113, "text":"Company" }] },{ "id":12, "text":"后勤 ", "children":[{ "id":121, "text":"Intel" },{ "id":122, "text":"Java", "attributes":{ "p1":"Custom Attribute1", "p2":"Custom Attribute2" } },{ "id":123, "text":" 费用缴纳" },{ "id":124, "text":"Games", "checked":true }] },{ "id":13, "text":"index.html" },{ "id":14, "text":"about.html" },{ "id":15, "text":"welcome.html" }] }]
MenuDao.java
package com.huang.dao; import java.sql.SQLException; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import com.huang.entity.TreeNode; import com.huang.util.JsonBaseDao; import com.huang.util.JsonUtils; import com.huang.util.PageBean; import com.huang.util.StringUtils; public class MenuDao extends JsonBaseDao{ /** * 给前台返回tree_data1_json的字符集 * 从前台jsp传递过来的参数集合 * @param paMap * @param pageBean * @return * @throws SQLException * @throws IllegalAccessException * @throws InstantiationException */ public List<TreeNode> listTreeNode(Map<String, String[]> paMap,PageBean pageBean) throws InstantiationException, IllegalAccessException, SQLException{ List<Map<String, Object>> listMap=this.listMap(paMap, pageBean); List<TreeNode> listTreeNode=new ArrayList<>(); this.listMapToListtreeNode(listMap, listTreeNode); return null; } /** * [{‘Menuid‘:001,‘Menuname‘:‘学生管理‘},{‘Menuid‘:001,‘Menuname‘:‘后勤管理‘}] * @param paMap * @param pageBean * @return * @throws InstantiationException * @throws IllegalAccessException * @throws SQLException */ public List<Map<String, Object>> listMap(Map<String, String[]> paMap,PageBean pageBean) throws InstantiationException, IllegalAccessException, SQLException{ String sql="select * from t_easyui_menu where true"; String menuId=JsonUtils.getParamVal(paMap, "Menuid"); if(StringUtils.isNotBlank(menuId)) { sql+=" and parentid="+menuId; } else { sql+=" and parentid=-1"; } //这里面存放的是数据库菜单信息 List<Map<String, Object>> listMap=super.executeQuery(sql, pageBean); return listMap; } /** * {‘Menuid‘:001,‘Menuname‘:‘学生管理‘} * * {id:...,text:...} * @param map * @param treeNode * @throws SQLException * @throws IllegalAccessException * @throws InstantiationException */ private void MapTotreeNode(Map<String, Object> map,TreeNode treeNode) throws InstantiationException, IllegalAccessException, SQLException { treeNode.setId(map.get("Menuid")+""); treeNode.setText(map.get("Menuid")+""); treeNode.setAttributes(map); // 将子节点添加到父节点当中,建立数据之间的父子关系 Map<String, String[]> childrenMap=new HashMap<>(); childrenMap.put("Menuid", new String[] {treeNode.getId()}); List<Map<String, Object>> listMap=this.listMap(childrenMap, null); List<TreeNode> listTreeNode=new ArrayList<>(); this.listMapToListtreeNode(listMap, listTreeNode); treeNode.setChildren(listTreeNode); } /** * [{‘Menuid‘:001,‘Menuname‘:‘学生管理‘},{‘Menuid‘:001,‘Menuname‘:‘后勤管理‘}] * @param listMap * @param listTreeNode * @throws SQLException * @throws IllegalAccessException * @throws InstantiationException */ private void listMapToListtreeNode(List<Map<String, Object>> listMap, List<TreeNode> listTreeNode) throws InstantiationException, IllegalAccessException, SQLException { TreeNode treeNode=null; for (Map<String, Object> map : listMap) { treeNode=new TreeNode(); MapTotreeNode(map, treeNode); listTreeNode.add(treeNode); } } }
MenuAction.java
package com.huang.web; import java.util.List; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import com.fasterxml.jackson.databind.ObjectMapper; import com.huang.dao.MenuDao; import com.huang.entity.TreeNode; import com.huang.util.ResponseUtil; import com.zking.framework.ActionSupport; public class MenuAction extends ActionSupport{ private MenuDao menuDao=new MenuDao(); public String menuTree(HttpServletRequest req,HttpServletResponse resp) { ObjectMapper om=new ObjectMapper(); try { // 获取到easyui框架所识别的json格式 List<TreeNode> listTreeNode =this.menuDao.listTreeNode(req.getParameterMap(), null); ResponseUtil.write(resp, om.writeValueAsString(listTreeNode)); } catch (Exception e) { e.printStackTrace(); } return null; } }
index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>后台主界面</title> <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/js/public/easyui5/themes/black/easyui.css"> <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/js/public/easyui5/themes/icon.css"> <script type="text/javascript" src="${pageContext.request.contextPath }/static/js/public/easyui5/jquery.min.js"></script> <script type="text/javascript" src="${pageContext.request.contextPath }/static/js/public/easyui5/jquery.easyui.min.js"></script> <script type="text/javascript" src="${pageContext.request.contextPath }/static/js/index.js"></script> </head> <body class="easyui-layout"> <div data-options="region:‘north‘,border:false" style="height:60px;background:#B3DFDA;padding:10px">north region</div> <div data-options="region:‘west‘,split:true,title:‘West‘" style="width:150px;padding:10px;"> 菜单管理 <ul id="tt"></ul> </div> <div data-options="region:‘east‘,split:true,collapsed:true,title:‘East‘" style="width:100px;padding:10px;">east region</div> <div data-options="region:‘south‘,border:false" style="height:50px;background:#A9FACD;padding:10px;">south region</div> <div data-options="region:‘center‘,title:‘Center‘"></div> </body> </html>
index.js
$(function(){ $(‘#tt‘).tree({ url:‘/menuAction.action?methodName=menuTree‘ }); })
标签:override context EDA intel eth checked 下载 throws option
原文地址:https://www.cnblogs.com/bf6rc9qu/p/11105375.html