Ztree新增角色和编辑角色回显问题的解决

最近在项目中使用到了ztree,在回显时候费了点时间,特记录下来供下次参考。

1、新增角色使用ztree加载权限,由于权限不多,所以使用直接全部加载。

效果图:

具体涉及ztree代码

jsp中导入:/js/ztree/zTreeStyle.css和js/ztree/jquery.ztree.all-3.5.js

页面加入

js代码(此js中加入了layer弹框效果):

rush:js;">

权限中Ztree格式: 

rush:java;"> private String id; private String name; private String code; private String description;

// private String page;
//private String generatemenu;
//private String zindex;

private String pid;
private boolean isParent;

//ztree组件需要格式
public String getpId() {
return this.pid==null?"0":this.pid;
}

......
  

2、编辑角色回显Ztree

js代码

rush:java;">

java后台

controller:

rush:java;"> /** * 编辑角色,回显角色权限 * @param roleId * @return */ @RequestMapping(value = "queryFunByRoleId",method = RequestMethod.POST) public ResponseEntity>> queryFunByRoleId(String roleId) { try { if(StringUtils.isBlank(roleId)){ // 返回400 return ResponseEntity.status(HttpStatus.BAD_REQUEST).body(null); } return ResponseEntity.ok(sysService.queryFunByRoleId(roleId)); } catch (Exception e) { e.printstacktrace(); } // 出错 500 return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null); }

service:

由于List中的contains方法校验老是失败,也没纠结什么原因,自己写的根据id校验

rush:java;"> /** * zTree v3回显 * 初始化化权限树 * 拼接treeNode属性 */ @Transactional(readOnly=true) public List> queryFunByRoleId(String roleId) { //查询所有权限 List functions = queryAllAuthFunction(); //查询指定角色的权限 List functionsByRoleId = findFunctionByRoleId(roleId); //包装zTree
List<Map<String,Object>> list =new ArrayList<Map<String,Object>>();
Map<String,Object>map=null;
for(int i=0;i<functions.size();i++){
  map=new HashMap<>();
  //Role role=functions.get(i);
  AuthFunction fun = functions.get(i);
  map.put("id",fun.getId());
  map.put("pId",fun.getpId());
  map.put("name",fun.getName());
  map.put("isParent",fun.getIsParent());
  //判断指定<a href="https://www.jb51.cc/tag/yonghu/" target="_blank" class="keywords">用户</a>的角色是否在所有角色中包含,有则设置checked=true.
  if(functionsByRoleId != null && functionsByRoleId.size()>0 && ListIsContainsObj(functionsByRoleId,fun)){
    map.put("checked",true);
  }else {
    map.put("checked",false);
  }
  list.add(map);
}
return list;

}

//校验全部权限中是否有某个权限,有返回true
private boolean ListIsContainsObj(List functions,AuthFunction fun) {
if(fun == null || functions == null || functions.size()<=0){
return false;
}
for (AuthFunction authFunction : functions) {
if(fun.getId().equals(authFunction.getId())){
return true;
}
}
return false;
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...