业务逻辑 我项目的权限设计是用户--角色--权限 之间相互多对多 这也是一般系统权限管理的通用模型。
所以 当我给角色进行权限分配的时候 要把权限数据用树形显示出来,并且把这个角色的已经有的权限给回显出来,因为业务需求 我们权限数据只有三层 所以暂不考虑复杂情形。
后台代码就是将数据库顶层权限数据获取出来 然后将他们的子集合数据封装进去 总共三层 这里就不细说了 如有问题可私聊我。
引入jquery.js,jquery.treeview.js,jquery.treeview.css
将要显示树形的数据通过<ul>和<li>封装成以下格式就可以了
<ul id="tree">
<li>
1
<ul>
<li>
1.1
<ul>
<li>
1.1.1
</li>
</ul>
</li>
</ul>
</li>
</ul>
然后我们通过thymeleaf模板引擎进行数据遍历和获取 通过th:each遍历 然后采用thymeleaf的工具类对象#lists来判断这个角色是否有此权限来进行回显数据
<ul id="tree">
<li th:each="pr1:${privileges}">
<input type="checkbox" name="privilegeIds" th:value="${pr1.id}" th:checked="${privilegeIds!=null}?${#lists.contains(privilegeIds,pr1.id)}:''"/><span class="folder">[[${pr1.name}]]</span>
<ul>
<li th:each="pr2:${pr1.chidren}">
<input type="checkbox" name="privilegeIds" th:value="${pr2.id}" th:checked="${privilegeIds!=null}?${#lists.contains(privilegeIds,pr2.id)}:''"/><span class="folder" th:class="${pr2.chidren!=null}?'folder':'123'">[[${pr2.name}]]</span>
<ul>
<li th:each="pr3:${pr2.chidren}">
<input type="checkbox" name="privilegeIds" th:value="${pr3.id}" th:checked="${privilegeIds!=null}?${#lists.contains(privilegeIds,pr3.id)}:''"/>[[${pr3.name}]]
</li>
</ul>
</li>
</ul>
</li>
</ul>
上面的th:checked来回显选中 其中的privilegeIds是后台封装的此角色的已经有的权限集合 然后通过thymeleaf工具类对象#lists进行判断