本次学习RABC权限总结

后台采用ssm,前端页面采用jsp
关系

点击用户旁边的按钮,可给用户分配对应的角色(多对多)
点击角色旁边的按钮,可回显对应的权限,可修改权限(数据库直接执行删除操作,重新添加)(一对多)

  1. 配置原来项目路径${pageContext.request.contextPath},配置成${APP_PATH},这样使用起来就方便很多。
public class ServerStartUpListener  implements ServletContextListener {
    @Override
    public void contextInitialized(ServletContextEvent sce) {
        //将web应用名称(路径)保存application范围中
        ServletContext application = sce.getServletContext();
        String path = application.getContextPath();
        application.setAttribute("APP_PATH",path);
    }

    @Override
    public void contextDestroyed(ServletContextEvent sce) {

    }
}

web.xml中配置

<listener>
    <listener-class>com.scitc.crowd.listener.ServerStartUpListener</listener-class>
</listener>

两者使用:

 <link rel="stylesheet" href="${APP_PATH}/css/main.css">
 <link rel="stylesheet" href="${pageContext.request.contextPath}/css/main.css">
  1. ajax 发送数据时候,启用加载符号(beforeSend),这是使用的是layer插件
        //使用ajax传值
        var loadingIndex = null;
        $.ajax({
            type: "post",
            url: "doAJAXLogin",
            data: {
                "loginacct": loginacct,
                "userpswd": userpswd
            },
            beforeSend: function () {
                loadingIndex = layer.msg('处理中', {icon: 16});
            },
            success: function (result) {
                layer.close(loadingIndex);
                if (result.success) {

                    window.location.href = "main";
                } else {
                    layer.msg("用户名或者密码错误,请从新输入", {time: 2000, icon: 5, shift: 6}, function () {
                    });
                }
            }
        })
  1. jsp中 实现重置达到未修改前的回显效果

在这里插入图片描述
jsp页面代码
在这里插入图片描述使用js重置表单,达到刚进来时回显的效果

这是js中的方法,我们需要把jq转换为js,所以加[0]

$('#reset-btn').click(function () {

      $('#edit-form')[0].reset();
})
  1. 用户分页显示和模糊查询公用一个ajax请求

判断搜索是否为空,不为空就封装在查询条件中。

  1. 批量删除用户

给列表(1-10)中的checkbox,设置一个一个相同的name,然后把value属性也进行赋值,通过获取form,序列化表单的方式发送给后台data: $("#from-users").serialize()
序列化后的效果:userId=41&userId=1&userId=29&userId=30&userId=33&userId=34&userId=35&userId=36&userId=37&userId=38

在这里插入图片描述
控制全选,全不选

//最上面的选择框
  $("#select-all-user").click(function () {
      var flag = this.checked;
	//列表中的选择框
      $("#pageData :checkbox").each(function () {
          this.checked = flag;
      })
  })

mybatis批量删除 运用in,打开(,分割)关闭,
添加同理value,只需要,分割

<delete id="deleteUsers" parameterType="int" >
    delete from tb_user where id in
    <foreach collection="array" index="index" item="id" open="(" separator="," close=")">
        #{id}
    </foreach>
</delete>
  1. 这种两边都是select-option,可分别给name,添加一个大form表单,全部包住,当有option被选中时,序列化表单可拿到数据。
    在这里插入图片描述

  2. 获取参数

function getQueryString(name) {
    //匹配
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return decodeURIComponent(r[2]);
    }
    return '';
}

插件

消息提示

  • layer
    弹出层,作为消息提示
  • toastr
    作为消息提示

ztree

ztree官网

简单使用

zTree组件是基于jQuery框架开发的,所以使用前,必须引入JQuery库

渲染数据

 <ul id="treeDemo" class="ztree">

调用组件方法在页面中渲染数据

    var setting = {};
    var jsonData = [
        {"id":1,"name":"系统权限菜单","open":true,
            "children":[
                {"id":2,"name":"控制面板","open":true,"checked":false,
                    "children":[]
                }
            ]
        }
    ];
    $.fn.zTree.init($("#treeDemo"), setting, jsonData);

Setting属性含义


属性	名称	例子
事件	callback	
callback: {
	onClick : function(event, treeId, json) {
	}
}
异步加载	async	
async: {
	enable: true,
	url:"xxxxx",
	autoParam:["id", "name=n", "level=lv"]
}
复选框	check	
check : {
    enable : true 
}

本次用到的setting

        var setting = {
            async: {
                enable: true,
                url: "${APP_PATH}/permission/loadData",
                autoParam: ["id"]
            },
            view: {
                selectedMulti: false,//是否支持多选
                //使用自己数据库里面的icon
                addDiyDom: function (treeId, treeNode) {
                    var icoObj = $("#" + treeNode.tId + "_ico"); // tId = permissionTree_1, $("#permissionTree_1_ico")
                    if (treeNode.icon) {
                        icoObj.removeClass("button ico_docu ico_open").addClass(treeNode.icon).css("background", "");
                    }

                },
                addHoverDom: function (treeId, treeNode) {
                    //   <a><span></span></a>
                    var aObj = $("#" + treeNode.tId + "_a"); // tId = permissionTree_1, ==> $("#permissionTree_1_a")
                    aObj.attr("href", "javascript:;");
                    if (treeNode.editNameFlag || $("#btnGroup" + treeNode.tId).length > 0) return;
                    var s = '<span id="btnGroup' + treeNode.tId + '">';
                    if (treeNode.level == 0) {
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="addNode(' + treeNode.id + ')" href="#" >&nbsp;&nbsp;<i class="fa fa-fw fa-plus rbg "></i></a>';
                    } else if (treeNode.level == 1) {
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="editNode(' + treeNode.id + ')" href="#" title="修改权限信息">&nbsp;&nbsp;<i class="fa fa-fw fa-edit rbg "></i></a>';
                        if (treeNode.children.length == 0) {
                            s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;"οnclick="deleteNode(' + treeNode.id + ')" href="#" >&nbsp;&nbsp;<i class="fa fa-fw fa-times rbg "></i></a>';
                        }
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="addNode(' + treeNode.id + ')" href="#" >&nbsp;&nbsp;<i class="fa fa-fw fa-plus rbg "></i></a>';
                    } else if (treeNode.level == 2) {
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="editNode(' + treeNode.id + ')" href="#" title="修改权限信息">&nbsp;&nbsp;<i class="fa fa-fw fa-edit rbg "></i></a>';
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;"  οnclick="deleteNode(' + treeNode.id + ')"  href="#">&nbsp;&nbsp;<i class="fa fa-fw fa-times rbg "></i></a>';
                    }

                    s += '</span>';
                    aObj.after(s);
                },
//                check: { 前面显示选择框
//	                enable: true,
//	                autoCheckTrigger: true
//            	},
                removeHoverDom: function (treeId, treeNode) {
                    // $("#btnGroup"+treeNode.tId).remove();
                }
            }
        };
//刷新数结构
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
treeObj.reAsyncChildNodes(null, "refresh");

后台构建返回树结构(看不太懂)

  1. 递归
//读取 数据库的数据
Permission root = new Permission();
root.setId(0);
递归,数据库 查询次数 过多,效率低
getChildrenPermissions(root);
return root.getChildren();


public void getChildrenPermissions(Permission root) {
    List<Permission> childrenPermissions = permissionService.queryChildPermission(root.getId());

    for (Permission childrenPermission : childrenPermissions) {
        getChildrenPermissions(childrenPermission);
    }
    root.setChildren(childrenPermissions);
}
  1. for循环
public Object tree() {
    List<Permission> root = new ArrayList<>();
    List<Permission> ps = permissionService.queryAll();//获取所有
    for (Permission p : ps) {
        //子节点
        if (p.getPid() == 0) {
            root.add(p);
        } else {
            //pid都不为0
            for (Permission innerPermission : ps) {
                if (p.getPid().equals(innerPermission.getId())) {
                    //父节点
                    //组合父子节点的关系
                    innerPermission.getChildren().add(p);
                    break;
                }
            }
        }
    }
    return root;
}
  1. for+map
List<Permission> permissions = new ArrayList<>();
//查询所有页许可数据
List<Permission> ps = permissionService.queryAll();

Map<Integer, Permission> permissionMap = new HashMap<>();

for (Permission p : ps) {
    permissionMap.put(p.getId(),p);
}

for (Permission p : ps) {
    if (p.getPid() == 0) {
        permissions.add(p);
    }else{
        //拿到父级id
        Permission parent = permissionMap.get(p.getPid());
        parent.getChildren().add(p);
    }
}
return permissions;

根据用户id查询所用权限

用户id—>用户角色—>角色权限—>权限

select * from  tb_permission where id in(
        select permission_id from tb_role_permission where role_id in(
        select role_id from tb_user_role where user_id = #{userId}))

回显权限

判断用户是否拥有该权限,有就设置true

public Object loadData(Integer id) {
    List<Permission> permissions = new ArrayList<>();
    List<Integer> permissionIds = rolePermissionService.findPermissionIds(id);
    List<Permission> ps = permissionService.queryAll();
    Map<Integer, Permission> permissionMap = new HashMap<>();

    for (Permission p : ps) {
        if(permissionIds.contains(p.getId())){
            p.setChecked(true);
        }
        permissionMap.put(p.getId(), p);
    }

    for (Permission p : ps) {
        if (p.getPid() == 0) {
            permissions.add(p);
        } else {
            //拿到父级id
            Permission parent = permissionMap.get(p.getPid());
            parent.getChildren().add(p);
        }
    }
  return  permissions;
}

拦截器

  1. 拦截用户session
  2. 拦截url请求(继承 HandlerInterceptorAdapter )

用户登录成功后,把用户的权限信息查询出来放在session
拦截器:

  1. 先获取用户请求url地址,项目路径,
  2. 获取数据库所有权限地址,放在set集合中
  3. 判断set中是否包括该访问路径,不包括—>放行
  4. 包括,再判断该用户的权限中是否包括 该请求的url地址,包括—>放行,不包括—>拦截 401
public class AuthInterceptor extends HandlerInterceptorAdapter {

    @Autowired
    private PermissionService permissionService;

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {

        //获取用户的请求地址
        String path = request.getSession().getServletContext().getContextPath();


        String uri = request.getRequestURI();
        //当前的路径是否需要进行权限验证
        //查询需要验证的路径集合
        List<Permission> permissions = permissionService.queryAll();
        Set<String> uriSet = new HashSet<>();
        for (Permission permission : permissions) {
            if (permission.getUrl() != null && !"".equals(permission.getUrl())) {
                uriSet.add(permission.getUrl());
            }
        }
        if (uriSet.contains(uri)) {
            //权限验证
            //判断当前的用哪个户是否拥有
            Set<String> authUriSet = (Set<String>) request.getSession().getAttribute("authUriSet");
            if (authUriSet.contains(uri)) {
                return true;
            }else {
                response.sendRedirect(path + "/error");

                return false;
            }
        }
        return true;
    }
}
已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页