zoukankan      html  css  js  c++  java
  • 基于SSM的RBAC权限系统(1)-利用ajax,bootstrap,ztree完成权限树功能

    仅支持回显以及选择,不支持在树中的编辑

    搭建后台回显以及修改的模块

    JSON数据封装

    public class Msg {
        private int code;
        private String msg;
        private Map<String,Object> extend=new HashMap<String,Object>();
        //还有一些getset方法没显示出来
        public static Msg success(){
            Msg result = new Msg();
            result.setCode(100);
            result.setMsg("处理成功");
            return result;
        }
    
        public static Msg fail(){
            Msg result = new Msg();
            result.setCode(200);
            result.setMsg("处理失败");
            return result;
        }
    
        public static Msg noPermission(){
            Msg result = new Msg();
            result.setCode(250);
            result.setMsg("没有权限");
            return result;
        }
    
        public static Msg reject(){
            Msg result = new Msg();
            result.setCode(300);
            result.setMsg("拒绝请求");
            return result;
        }
    
    }

    Controller中的代码,RequiredPermission为自定义注解

       @ResponseBody
        @RequiredPermission("树形分配:获得回显信息")
        @RequestMapping("role/treePermission_echo")
        public Msg treePermission_echo(@RequestParam("ID")Long ID) throws Exception{
            //这里判断有无权限,具体原因请看其他文章
            Throwable t = new Throwable();
            boolean isHasPermission=PermissionUtil.hasPermission(this.getClass(),t.getStackTrace()[0].getMethodName());
            if(!isHasPermission)
                return Msg.noPermission().add("returnMsg","您没有权限【树形分配:获得回显信息】");
            //从下一层获取ztree权限树数据
            List<ZtreePermission> allZtreeMsg =
                    permissionService.getAllZtreeMsg(ID);
            System.out.println();
            return Msg.success().add("allZtreeMsg",allZtreeMsg);
        }
    
        @ResponseBody
        @RequiredPermission("树形分配:修改")
        @RequestMapping("role/treePermission_alter")
        public Msg treePermission_alter(@RequestParam("permissionListTree")List<String> permissionListTree
        ) throws Exception {
            Throwable t = new Throwable();
            boolean isHasPermission=PermissionUtil.hasPermission(this.getClass(),t.getStackTrace()[0].getMethodName());
            if(!isHasPermission)
                return Msg.noPermission().add("returnMsg","您没有权限【树形分配:修改】");
            ArrayList<Long> permissionListID = new ArrayList<>();
            Long ID=Long.valueOf(permissionListTree.get(0));
            //判断是权限组还是权限,是权限则加入
            for(String  permissionID:permissionListTree){
                if(permissionID.charAt(0)=='p'){
                    permissionListID.add(Long.valueOf(permissionID.substring(2,permissionID.length())));
                }
            }
            //这里其实可以优化,我暂时采用了删除所有再更新的方法
            roleToPermissionService.deleteById(ID);
            for(Long id:permissionListID){
                RoleToPermission roleToPermission=new RoleToPermission();
                Role role = new Role();
                role.setId(ID);
                Permission permission=new Permission();
                permission.setId(id);
                roleToPermission.setRole(role);
                roleToPermission.setPermission(permission);
                roleToPermissionService.addItem(roleToPermission);
            }
            return Msg.success();
        }

    ztree树的构建

    因为我需要的功能复杂度不高,所以ztree设定很简单

       var setting = {
                check: {
                    enable: true
                },
                data: {
                    simpleData: {
                        enable: true
                    }
                }
            };
            var zNodes ;
                   function setCheck() {
                var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
                    type = { "Y" : "ps", "N" : "ps" };
                zTree.setting.check.chkboxType =  type;
            }
                        $(".treeBtn").each(function () {
                    $(this).click(function () {
                        ID = $(this).attr("name");
                        $.ajax({
                            url: "role/treePermission_echo",
                            //ID为你本次选择需要为哪个角色分配权限的角色ID
                            data: "ID=" + ID,
                            type: "POST",
                            success: function (result) {
                                if (result.code == 100) {
                                    zNodes=result.extend.allZtreeMsg;
                                    $.fn.zTree.init($("#treeDemo"), setting, zNodes);
                                    setCheck();
                                } else if(result.code==250){
                             //弹出权限不足的窗口
                                    $("#btn_closeTree").click();
                            show_errorWindows(result.extend.returnMsg);
                                }
                            }
                        });
                    });
                });
    View Code

    看看最简单的checkbox权限树结构 
     
    ztree非常方便,甚至不用我们自己写算法递归出树,因此只要将结构封装成一样的json丢给zNodes就可以了!

    ztree对应的实体类

    public class ZtreePermission {
        String id;
        String pId;
        String name;
        Boolean checked;
        Boolean open;
    
        public ZtreePermission(){
    
        }
    
        public ZtreePermission(Permission permission){
            this.id="p."+permission.getId();
            this.pId="g."+permission.getParentID();
            this.name=permission.getName();
            this.open=false;
            this.checked=false;
        }
    
        public ZtreePermission(Permission_Groud permission_groud){
            this.id="g."+permission_groud.getId();
            this.pId="g."+permission_groud.getParentID();
            this.name=permission_groud.getName();
            this.checked=null;
            this.open=true;
        }
    }

    值得注意的是如果你有两张表而且id重复的话,可以这样 id=”student.1” pid=”teacher.2”

    回显部分代码

    这里只获取了ID,如果需要其他数据可以查看API文档

     $("#btn_inputTree").click(function () {
                    var zTree = $.fn.zTree.getZTreeObj("treeDemo");
                    var nodes=zTree.getCheckedNodes(true);
                    permissionListTree = new Array();
                    //这里我把ID丟进了ID第一位,后台要注意!!
                    permissionListTree.push(ID);
                    for ( var j = 0; j < nodes.length; j++) {
                        permissionListTree.push(nodes[j].id);
                    }
                    $.ajax({
                        url: "role/treePermission_alter",
                        data: "permissionListTree="+permissionListTree,
                        type: "POST",
                        success: function (result) {
                            if(result.code ==100){
                                $("#btn_closeTree").click();
                            }else if(result.code==250){
                                $("#btn_closeTree").click();
                               //权限不足,显示窗口 show_errorWindows(result.extend.returnMsg);
                            }
    
                        }
                    });
    
    
                });
    View Code

    最后来看看最简单窗口代码

        <div class="modal fade" id="dtreeModal" tabindex="-1" role="dialog" aria-labelledby="preModalLabel">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <form role="form" action="" method="post">
                                <div class="modal-header">
                                    <button data-dismiss="modal" class="close" type="button"><span
                                            aria-hidden="true">×</span><span
                                            class="sr-only">Close</span></button>
                                    <h4 class="modal-title">树形分配</h4>
                                </div>
                                <div class="modal-body" >
                                    <div>
                                        <ul id="treeDemo" class="ztree"></ul>
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button  id="btn_closeTree" data-dismiss="modal" class="btn btn-default" type="button">
                                        关闭
                                    </button>
                                    <button  id="btn_inputTree" class="btn btn-primary" type="button">提交</button>
                                </div>
                            </form>
                        </div><!-- /.modal-content -->
                    </div><!-- /.modal-dialog -->
                </div>
    View Code

    完整项目地址
    这是我第一个写的web项目,代码烂得飞起,仅供纪念,不做参考
    带Shiro版:https://github.com/EnTaroAdunZ/ssm_rbac_shiro.git
    不带Shiro版:https://github.com/EnTaroAdunZ/ssm_rbac.git
    ---------------------
    版权声明:本文为CSDN博主「EnTaroAdunZ」的原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/EnTaroAdunZ/article/details/76112781

  • 相关阅读:
    php练习4——排序,查找
    php练习3——猜拳游戏,评委打分问题
    php练习2——乘法表,变量的使用
    php练习1——计算器
    php函数的初步使用
    php练习——打印半金字塔、金字塔、空心金字塔、菱形、空心菱形
    Discuz论坛下载与安装
    phpMyAdmin下载与安装
    mysql5.7下载与安装,php5.6与mysql5.7整合
    php5下载,apache2.4与php5整合
  • 原文地址:https://www.cnblogs.com/blogpro/p/11339327.html
Copyright © 2011-2022 走看看