逝夕诚

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

实现一个基本的用户,角色,菜单绑定的基本需求数据建模.先看er图,人员和用户,部门两张表绑定关联关系,同时用户和角色权限进行绑定,权限表和菜单进行绑定,这样,就可以得到该用户绑定的菜单,在菜单表中,父菜单id这一项关联有上一级菜单的菜单id,这样去体现菜单之间的关联关系,同时菜单表中的访问地址URL存放菜单对应的页面的url


在登录的时候,查询出该用户的菜单列表,并按树形结构排列起来,放入session中,这样,前台就能获得绑定的菜单数据,并根据菜单数据去显示菜单

其中将菜单列表转化为树形结构的数据的代码如下

	List<TSysMenu> menuList = tSysMenuAdminService.getAllTSysMenuAdmin(null);//获得所有菜单
	List<TSysMenu> topMenuList = l.getMenuList(menuList);
	request.getSession(true).setAttribute("menuList", topMenuList);

	public List<TSysMenu> getMenuList(List<TSysMenu> menuList) {
		List<TSysMenu> result = new ArrayList<TSysMenu>();
		for(int i = menuList.size() - 1; i >= 0; i--){
			if(menuList.get(i).getMenuParentId() == 1){
				TSysMenu menu = menuList.get(i);
				result.add(menuList.get(i));
				menuList.remove(i);
				nodeRecursion(menu,menuList);
			}
		}
		
		//二级菜单
		return result;
	}
	
	/**
	 * 初始化需要用的递归方法
	 * @param node 数的结点
	 * @param tList
	 */
	public void nodeRecursion(TSysMenu node, List<TSysMenu> tList){
		List<TSysMenu> tsysMenuList = new ArrayList<TSysMenu>();
		node.setChildren(tsysMenuList);
		for(int i=0;i<tList.size();i++){
			if(tList.get(i) != null && tList.get(i).getMenuParentId().equals(node.getMenuId())){
				TSysMenu node1=tList.get(i);
				tsysMenuList.add(node1);
				//tList.remove(i);
				//i--;
				nodeRecursion(node1,tList);
			}
		}
	}

前台的显示处理

前台jsp使用了三个iframe去处理,分为top,left,main,其中top放一级菜单,left放分支菜单,main中为菜单要跳转的页面

top菜单的生成用el表达式的foreach生成,left的菜单有jq去动态拼接html语句,在top菜单点击的同时去在left菜单页面动态去插入拼接好的html语句

代码如下

<!-- 一级菜单 -->
<div class="headernav">
	<div class="navchildmenu">
		<ul id="menuList">
			<c:forEach items="${menuList}" var="topMenu" varStatus="st">
				<li tag="landMenu${st.index }"><a target='MainMenu' href="<c:choose><c:when test="${empty topMenu.menuHref}">javascript:void(0);</c:when><c:otherwise>${ctx }${topMenu.menuHref}</c:otherwise></c:choose>" onfocus="this.blur();">${topMenu.menuName}</a></li>
			</c:forEach>
		</ul>
	</div>
</div>

<!-- 左侧二级菜单 -->
<div class="box3">
	<c:forEach items="${menuList}" var="topMenu" varStatus="st">
		<c:forEach items="${topMenu.children}" var="landMenu" varStatus="st2">
				<div id="landMenu${st.index }_leftMenu${st2.index}" style="display: none;">
					<dl>
						<dd>
							<div class="title">
								<a href="<c:choose><c:when test="${empty landMenu.menuHref}">javascript:void(0);</c:when><c:otherwise>${ctx }${landMenu.menuHref}</c:otherwise></c:choose>" target="MainMenu">
									<span><img src="${ctx}/static/images/system/leftico01.png" /></span>${landMenu.menuName}
								</a>
							</div>
						</dd>
					</dl>
				</div>
		</c:forEach>
	</c:forEach>
</div>
jq控制代码

$(".headernav div").show();
$("#menuList li").click(function() {
	var id = $(this).attr("tag");
	var html = "";
	$('div[id^='+id+']').each(function(){	//以id开始说有的元素
		html+=$(this).html();
	});
	parent.LeftMenu.navMain.innerHTML = "";
	parent.LeftMenu.navMain.innerHTML = html;
	parent.LeftMenu.menuClick();
});

//登录成功后的默认显示首页
var tag_first=$("#menuList li a")[0];
tag_first.click();



posted on 2016-08-12 17:31  逝夕诚  阅读(400)  评论(0编辑  收藏  举报