这里以常用首页的导航树为例子,返回所需要的json格式
1.导航树对应的数据库
2.后端代码
1)自定义导航树的实体类
@Data
@AllArgsConstructor
@NoArgsConstructor
public class TreeNode {
private Integer id;
private Integer pid;
private String title;
private String icon;
private String href;
private boolean spread;
private List<TreeNode> children = new ArrayList<>();
/**
* 首页导航树构造器
*/
public TreeNode(Integer id, Integer pid, String title, String icon, String href, boolean spread) {
this.id = id;
this.pid = pid;
this.title = title;
this.icon = icon;
this.href = href;
this.spread = spread;
}
}
2)导航树类的构建者,用于层级控制,这里只做二级
public class TreeNodeBuilder {
/**
* 构造层级关系的导航树
*
* @param treeNodes
* @param topId
* @return
*/
public static List<TreeNode> build(List<TreeNode> treeNodes, Integer topId) {
List<TreeNode> nodes = new ArrayList<>();
for (TreeNode n1 : treeNodes) {
if (n1.getPid() == topId) {
nodes.add(n1);
}
for (TreeNode n2 : treeNodes) {
if (n1.getId() == n2.getPid()) {
n1.getChildren().add(n2);
}
}
}
return nodes;
}
}
3)前端控制器menu返回的的json格式的类
@RestController
@RequestMapping("/menu")
public class MenuController {
@Autowired
private IPermissionService permissionService;
@RequestMapping("/loadIndexLeftMenuJson")
public DataGridView loadIndexLeftMenuJson(PermissionVo permissionVo) {
//查询所有菜单
QueryWrapper<Permission> queryWrapper = new QueryWrapper<>();
//设置值查询菜单
queryWrapper.eq("type", "menu");
queryWrapper.eq("available", 1);//1表可用
User user = (User) WebUtils.getSession().getAttribute("user");
List<Permission> list = null;
//超级管理员为0
if (user.getType() == 0) {
list = permissionService.list(queryWrapper);
} else {
//否则根据用户ID+角色+权限去查询
// list=permissionService.list(queryWrapper);
}
List<TreeNode> treeNodes=new ArrayList<>();
for (Permission p: list){
Boolean spread =p.getOpen()==1?true:false;
treeNodes.add(new TreeNode(p.getId(),p.getPid(),p.getTitle(),p.getIcon(),p.getHref(),spread));
}
//构造层级关系,建造者模式
List<TreeNode> list2= TreeNodeBuilder.build(treeNodes,1);//最高层为1,0不要
return new DataGridView(list2);
}
}
3.获取json,怎么其实使用layui直接方法直接导入该json即可
function getData(json){
$.getJSON(tab.tabConfig.url,function(data){
dataStr = data.data;//DatagridView里面的data
//重新渲染左侧菜单
tab.render();
})
}