SpringMVC+ZTree實現(xiàn)樹形菜單權(quán)限配置

計劃在開源項目里加入權(quán)限配置的功能迈嘹,打算加入zTree實現(xiàn)樹形結(jié)構(gòu)甫菠。

Team的Github開源項目鏈接:https://github.com/u014427391/jeeplatform
歡迎star(收藏)

zTree 是一個依靠 jQuery 實現(xiàn)的多功能 “樹插件”。優(yōu)異的性能寿桨、靈活的配置、多種功能的組合是 zTree 最大優(yōu)點。

zTree下載鏈接:http://www.treejs.cn/v3/main.php#_zTreeInfo

這里寫圖片描述

角色信息實體類:

package org.muses.jeeplatform.core.entity.admin;

import javax.persistence.*;
import java.io.Serializable;
import java.util.HashSet;
import java.util.Set;

/**
 * @description 角色信息實體類
 * @author Nicky
 * @date 2017年3月16日
 */
@Table(name="sys_role")
@Entity
public class Role implements Serializable{

    /** 角色I(xiàn)d**/
    private int roleId;

    /** 角色描述**/
    private String roleDesc;

    /** 角色名稱**/
    private String roleName;

    /** 角色標(biāo)志**/
    private String role;

    private Set<Permission> permissions = new HashSet<Permission>();

    @Id
    @GeneratedValue(strategy=GenerationType.IDENTITY)
    public int getRoleId() {
        return roleId;
    }

    public void setRoleId(int roleId) {
        this.roleId = roleId;
    }

    @Column(length=100)
    public String getRoleDesc() {
        return roleDesc;
    }

    public void setRoleDesc(String roleDesc) {
        this.roleDesc = roleDesc;
    }

    @Column(length=100)
    public String getRoleName() {
        return roleName;
    }

    public void setRoleName(String roleName) {
        this.roleName = roleName;
    }

    @Column(length=100)
    public String getRole() {
        return role;
    }

    public void setRole(String role) {
        this.role = role;
    }

    //修改cascade策略為級聯(lián)關(guān)系
    @OneToMany(targetEntity=Permission.class,cascade=CascadeType.MERGE,fetch=FetchType.EAGER)
    @JoinTable(name="sys_role_permission", joinColumns=@JoinColumn(name="roleId",referencedColumnName="roleId"), inverseJoinColumns=@JoinColumn(name="permissionId",referencedColumnName="id",unique=true))
    public Set<Permission> getPermissions() {
        return permissions;
    }

    public void setPermissions(Set<Permission> permissions) {
        this.permissions = permissions;
    }

    @Override
    public boolean equals(Object obj) {
        if (obj instanceof Role) {
            Role role = (Role) obj;
            return this.roleId==(role.getRoleId())
                    && this.roleName.equals(role.getRoleName())
                    && this.roleDesc.equals(role.getRoleDesc())
                    && this.role.equals(role.getRole());
        }
        return super.equals(obj);
    }
}

權(quán)限信息實體類:

package org.muses.jeeplatform.core.entity.admin;

import java.io.Serializable;
import java.util.HashSet;
import java.util.Set;

import javax.persistence.CascadeType;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.FetchType;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.JoinColumn;
import javax.persistence.JoinTable;
import javax.persistence.ManyToMany;
import javax.persistence.OneToOne;
import javax.persistence.Table;

/**
 * @description 權(quán)限操作的Vo類
 * @author Nicky
 * @date 2017年3月6日
 */
@Table(name="sys_permission")
@Entity
public class Permission implements Serializable {

    private int id;
    private String pdesc;
    private String name;
    private static final long serialVersionUID = 1L;

    private Menu menu;

    private Set<Operation> operations = new HashSet<Operation>();

    public Permission() {
        super();
    }

    @GeneratedValue(strategy = GenerationType.IDENTITY)
    @Id
    public int getId() {
        return this.id;
    }

    public void setId(int id) {
        this.id = id;
    }

    @Column(length=100)
    public String getPdesc() {
        return this.pdesc;
    }

    public void setPdesc(String pdesc) {
        this.pdesc = pdesc;
    }

    @Column(length=100)
    public String getName() {
        return this.name;
    }

    public void setName(String name) {
        this.name = name;
    }

    @OneToOne(targetEntity=Menu.class,cascade=CascadeType.REFRESH,fetch=FetchType.EAGER)
    @JoinColumn(name="menuId",referencedColumnName="menuId")
    public Menu getMenu() {
        return menu;
    }

    public void setMenu(Menu menu) {
        this.menu = menu;
    }

    @ManyToMany(targetEntity=Operation.class,cascade=CascadeType.MERGE,fetch=FetchType.EAGER)
    @JoinTable(name="sys_permission_operation",joinColumns=@JoinColumn(name="permissionId",referencedColumnName="id"),inverseJoinColumns=@JoinColumn(name="operationId",referencedColumnName="id"))
    public Set<Operation> getOperations() {
        return operations;
    }

    public void setOperations(Set<Operation> operations) {
        this.operations = operations;
    }
}

實現(xiàn)菜單信息實體類鸯旁,用JPA來實現(xiàn)

package org.muses.jeeplatform.core.entity.admin;

import javax.persistence.*;
import java.io.Serializable;
import java.util.List;

/**
 * @description 菜單信息實體
 * @author Nicky
 * @date 2017年3月17日
 */
@Table(name="sys_menu")
@Entity
public class Menu implements Serializable {

    /** 菜單Id**/
    private int menuId;
    
    /** 上級Id**/
    private int parentId;
    
    /** 菜單名稱**/
    private String menuName;
    
    /** 菜單圖標(biāo)**/
    private String menuIcon;
    
    /** 菜單URL**/
    private String menuUrl;
    
    /** 菜單類型**/
    private String menuType;
    
    /** 菜單排序**/
    private String menuOrder;

    /**菜單狀態(tài)**/
    private String menuStatus;

    private List<Menu> subMenu;

    private String target;

    private boolean hasSubMenu = false;

    public Menu() {
        super();
    }   
    
    @Id
    @GeneratedValue(strategy=GenerationType.IDENTITY)
    public int getMenuId() {
        return this.menuId;
    }

    public void setMenuId(int menuId) {
        this.menuId = menuId;
    }

    @Column(length=100)
    public int getParentId() {
        return parentId;
    }

    public void setParentId(int parentId) {
        this.parentId = parentId;
    }

    @Column(length=100)
    public String getMenuName() {
        return this.menuName;
    }

    public void setMenuName(String menuName) {
        this.menuName = menuName;
    }   
    
    @Column(length=30)
    public String getMenuIcon() {
        return this.menuIcon;
    }

    public void setMenuIcon(String menuIcon) {
        this.menuIcon = menuIcon;
    }   
    
    @Column(length=100)
    public String getMenuUrl() {
        return this.menuUrl;
    }

    public void setMenuUrl(String menuUrl) {
        this.menuUrl = menuUrl;
    }   
    
    @Column(length=100)
    public String getMenuType() {
        return this.menuType;
    }

    public void setMenuType(String menuType) {
        this.menuType = menuType;
    }

    @Column(length=10)
    public String getMenuOrder() {
        return menuOrder;
    }

    public void setMenuOrder(String menuOrder) {
        this.menuOrder = menuOrder;
    }

    @Column(length=10)
    public String getMenuStatus(){
        return menuStatus;
    }

    public void setMenuStatus(String menuStatus){
        this.menuStatus = menuStatus;
    }

    @Transient
    public List<Menu> getSubMenu() {
        return subMenu;
    }

    public void setSubMenu(List<Menu> subMenu) {
        this.subMenu = subMenu;
    }

    public void setTarget(String target){
        this.target = target;
    }

    @Transient
    public String getTarget(){
        return target;
    }

    public void setHasSubMenu(boolean hasSubMenu){
        this.hasSubMenu = hasSubMenu;
    }

    @Transient
    public boolean getHasSubMenu(){
        return hasSubMenu;
    }

}

實現(xiàn)JpaRepository接口

package org.muses.jeeplatform.core.dao.repository.admin;

import org.muses.jeeplatform.core.entity.admin.Role;
import org.springframework.data.jpa.repository.JpaRepository;

/**
 * Created by Nicky on 2017/12/2.
 */
public interface RoleRepository extends JpaRepository<Role,Integer> {

}

實現(xiàn)JpaRepository接口

package org.muses.jeeplatform.core.dao.repository.admin;

import org.muses.jeeplatform.core.entity.admin.Menu;
import org.springframework.data.jpa.repository.JpaRepository;

/**
 * Created by Nicky on 2017/6/17.
 */
public interface MenuTreeRepository extends JpaRepository<Menu,Integer>{

}

角色Service類:

package org.muses.jeeplatform.service;


import com.google.common.collect.Lists;
import org.muses.jeeplatform.core.dao.repository.admin.RolePageRepository;
import org.muses.jeeplatform.core.entity.admin.Role;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.data.domain.Sort;
import org.springframework.stereotype.Service;

import java.util.List;

/**
 * Created by Nicky on 2017/7/30.
 */
@Service
public class RolePageService {

    @Autowired
    RolePageRepository roleRepository;

    /**
     * 構(gòu)建PageRequest對象
     * @param num
     * @param size
     * @param asc
     * @param string
     * @return
     */
    private PageRequest buildPageRequest(int num, int size, Sort.Direction asc,
                                         String string) {
        return new PageRequest(num-1, size,null,string);
    }

    /**
     * 獲取所有的菜單信息并分頁顯示
     * @param pageNo
     *          當(dāng)前頁面數(shù)
     * @param pageSize
     *          每一頁面的頁數(shù)
     * @return
     */
    public Page<Role> findAll(int pageNo, int pageSize, Sort.Direction dir, String str){
        PageRequest pageRequest = buildPageRequest(pageNo, pageSize, dir, str);
        Page<Role> roles = roleRepository.findAll(pageRequest);
        return roles;
    }

    public List<Role> findAllRole(){
        Iterable<Role> roles = roleRepository.findAll();
        List<Role> myList = Lists.newArrayList(roles);
        return myList;
    }

    /**
     * 根據(jù)角色id查找角色信息
     * @param roleId
     * @return
     */
    public Role findByRoleId(String roleId){
        return roleRepository.findOne(Integer.parseInt(roleId));
    }

    /**
     * 保存角色信息
     * @param role
     */
    public void doSave(Role role){
        roleRepository.save(role);
    }




}

菜單Service類:

package org.muses.jeeplatform.service;

import org.muses.jeeplatform.annotation.RedisCache;
import org.muses.jeeplatform.common.RedisCacheNamespace;
import org.muses.jeeplatform.core.dao.repository.admin.MenuTreeRepository;
import org.muses.jeeplatform.core.entity.admin.Menu;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import java.util.List;

/**
 * Created by Nicky on 2017/6/17.
 */
@Service
public class MenuTreeService {

    @Autowired
    MenuTreeRepository menuTreeRepository;

    /**
     * 查詢所有的菜單
     * @return
     */
    @Transactional
    //@RedisCache
    public List<Menu> findAll(){
        return menuTreeRepository.findAll();
    }

}

在Controller類里通過角色id獲取該角色可以查看的菜單:

/**
     * 跳轉(zhuǎn)到角色授權(quán)頁面
     * @param roleId
     * @param model
     * @return
     */
    @RequestMapping(value = "/goAuthorise" )
    public String goAuth(@RequestParam String roleId, Model model){

        List<Menu> menuList = menuTreeService.findAll();

        Role role = roleService.findByRoleId(roleId);

        Set<Permission> hasPermissions = null;

        if(role != null){
            hasPermissions = role.getPermissions();
        }

        for (Menu m : menuList) {
            for(Permission p : hasPermissions){
                if(p.getMenu().getMenuId()==m.getMenuId()){
                    m.setHasSubMenu(true);
                }
            }
        }

        model.addAttribute("roleId" , roleId);

        JSONArray jsonArray = JSONArray.fromObject(menuList);
        String json = jsonArray.toString();

        json = json.replaceAll("menuId","id").replaceAll("parentId","pId").
                replaceAll("menuName","name").replaceAll("hasSubMenu","checked");

        model.addAttribute("menus",json);

        return "admin/role/role_auth";
    }

在前端通過zTree實現(xiàn)樹形菜單展示,通過勾選然后實現(xiàn)角色授權(quán):

<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <base href="<%=basePath %>">
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>Insert title here</title>
    <!-- 引入JQuery庫 start -->
    <script type="text/javascript" src="${basePath}static/js/jquery-1.8.3.js"></script>
    <!-- 引入JQuery庫 end -->
    <script type="text/javascript" src="<%=basePath%>plugins/zDialog/zDialog.js"></script>
    <script type="text/javascript" src="<%=basePath%>plugins/zDialog/zDrag.js"></script>
    <script type="text/javascript" src="<%=basePath%>plugins/zDialog/zProgress.js"></script>
    <link rel="stylesheet" href="<%=basePath%>plugins/zTree/3.5/zTreeStyle.css" type="text/css">
    <script type="text/javascript" src="<%=basePath%>plugins/zTree/3.5/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>plugins/zTree/3.5/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="<%=basePath%>plugins/zTree/3.5/jquery.ztree.excheck.js"></script>
    <script type="text/javascript">
        <!--
        var setting = {
            check: {
                enable: true
            },
            data: {
                simpleData: {
                    enable: true
                }
            },
            callback:{
                onClick: {

                }
            }
        };


        /*[
         { id:1, pId:0, name:"隨意勾選 1", open:true},
         { id:11, pId:1, name:"隨意勾選 1-1", open:true},
         { id:12, pId:1, name:"隨意勾選 1-2", open:true}
         ];*/

        var json = ${menus};
        var zNodes = eval(json);

        var code;

        function setCheck() {
            var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
                py = $("#py").attr("checked")? "p":"",
                sy = $("#sy").attr("checked")? "s":"",
                pn = $("#pn").attr("checked")? "p":"",
                sn = $("#sn").attr("checked")? "s":"",
                type = { "Y":py + sy, "N":pn + sn};
            zTree.setting.check.chkboxType = type;
            showCode('setting.check.chkboxType = { "Y" : "' + type.Y + '", "N" : "' + type.N + '" };');
        }
        function showCode(str) {
            if (!code) code = $("#code");
            code.empty();
            code.append("<li>"+str+"</li>");
        }

        $(document).ready(function(){
            $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            setCheck();
            $("#py").bind("change", setCheck);
            $("#sy").bind("change", setCheck);
            $("#pn").bind("change", setCheck);
            $("#sn").bind("change", setCheck);
        });
        //-->

        function dialogClose()
        {
            parentDialog.close();
        }

        function doSave() {
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            var nodes = zTree.getCheckedNodes();
            var tmpNode;
            var ids = "";
            for(var i=0; i<nodes.length; i++){
                tmpNode = nodes[i];
                if(i!=nodes.length-1){
                    ids += tmpNode.id+",";
                }else{
                    ids += tmpNode.id;
                }
            }
            var roleId = ${roleId};
            var params = roleId +";"+ids;
            alert(ids);
            $.ajax({
                type: "POST",
                url: 'role/authorise.do',
                data: {params:params,tm:new Date().getTime()},
                dataType:'json',
                cache: false,
                success: function(data){
                    if("success" == data.result){
                        alert('授權(quán)成功!請重新登錄!');
                        parent.location.reload();
                        doDialogClose();
                    }else{
                        alert("授權(quán)失敗!");
                    }
                }
            });
        }

    </script>
</head>
<body >
<div class="content_wrap">
    <div class="zTreeDemoBackground left">
        <ul id="treeDemo" class="ztree"></ul>
    </div>
</div>
&nbsp;&nbsp;
<input type="button" onClick="doSave()" value="保存" class="buttonStyle" />
<input onClick="dialogClose();" class="buttonStyle" type="button" value="關(guān)閉" />
</body>
</html>
這里寫圖片描述

Team的Github開源項目鏈接:https://github.com/u014427391/jeeplatform
歡迎star(收藏)

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末量蕊,一起剝皮案震驚了整個濱河市铺罢,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌残炮,老刑警劉巖韭赘,帶你破解...
    沈念sama閱讀 222,590評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異势就,居然都是意外死亡泉瞻,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,157評論 3 399
  • 文/潘曉璐 我一進店門苞冯,熙熙樓的掌柜王于貴愁眉苦臉地迎上來袖牙,“玉大人,你說我怎么就攤上這事舅锄”薮铮” “怎么了?”我有些...
    開封第一講書人閱讀 169,301評論 0 362
  • 文/不壞的土叔 我叫張陵巧娱,是天一觀的道長碉怔。 經(jīng)常有香客問我,道長禁添,這世上最難降的妖魔是什么撮胧? 我笑而不...
    開封第一講書人閱讀 60,078評論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮老翘,結(jié)果婚禮上芹啥,老公的妹妹穿的比我還像新娘锻离。我一直安慰自己,他們只是感情好墓怀,可當(dāng)我...
    茶點故事閱讀 69,082評論 6 398
  • 文/花漫 我一把揭開白布汽纠。 她就那樣靜靜地躺著,像睡著了一般傀履。 火紅的嫁衣襯著肌膚如雪虱朵。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,682評論 1 312
  • 那天钓账,我揣著相機與錄音碴犬,去河邊找鬼。 笑死梆暮,一個胖子當(dāng)著我的面吹牛服协,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播啦粹,決...
    沈念sama閱讀 41,155評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼偿荷,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了唠椭?” 一聲冷哼從身側(cè)響起跳纳,我...
    開封第一講書人閱讀 40,098評論 0 277
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎贪嫂,沒想到半個月后棒旗,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,638評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡撩荣,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,701評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了饶深。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片餐曹。...
    茶點故事閱讀 40,852評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖敌厘,靈堂內(nèi)的尸體忽然破棺而出台猴,到底是詐尸還是另有隱情,我是刑警寧澤俱两,帶...
    沈念sama閱讀 36,520評論 5 351
  • 正文 年R本政府宣布饱狂,位于F島的核電站,受9級特大地震影響宪彩,放射性物質(zhì)發(fā)生泄漏休讳。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,181評論 3 335
  • 文/蒙蒙 一尿孔、第九天 我趴在偏房一處隱蔽的房頂上張望俊柔。 院中可真熱鬧筹麸,春花似錦、人聲如沸雏婶。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,674評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽留晚。三九已至酵紫,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間错维,已是汗流浹背奖地。 一陣腳步聲響...
    開封第一講書人閱讀 33,788評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留需五,地道東北人鹉动。 一個月前我還...
    沈念sama閱讀 49,279評論 3 379
  • 正文 我出身青樓,卻偏偏與公主長得像宏邮,于是被迫代替她去往敵國和親泽示。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,851評論 2 361

推薦閱讀更多精彩內(nèi)容