关于数据库的表图
在数据库中通过用户名查找对应的角色(UserDao.xml)
<!--通过用户名查找对应的角色-->
<select id="findMeauByUsername" resultMap="user2role2Menu">
SELECT * FROM `t_user` WHERE username=#{username}
</select>
<resultMap id="user2role2Menu" type="com.itheima.pojo.User" autoMapping="true">
<id property="id" column="id"></id>
<collection property="roles"
ofType="com.itheima.pojo.Role"
column="id"
select="com.itheima.dao.RoleDao.findMenuRoleByUerId">
</collection>
</resultMap>
通过角色查找对应的菜单(RoleDao.xml)**
<!--通过角色查找菜单-->
<select id="findMenuRoleByUerId" resultMap="role2Menu">
SELECT * FROM `t_role` t1 JOIN `t_user_role` t2 ON t1.`id`=t2.`role_id` WHERE t2.`user_id`=#{id}
</select>
<resultMap id="role2Menu" type="com.itheima.pojo.Role" autoMapping="true">
<id property="id" column="id"></id>
<collection
property="menus"
ofType="com.itheima.pojo.Menu"
column="id"
select="com.itheima.dao.MenuDao.findMenuByUsername"
></collection>
</resultMap>
通过角色id查询所有此用户可以看到的一级菜单,再通过角色id查找所有的子集菜单
<!--通过角色id查询所有此用户可以看到的一级菜单(.parentMenuId IS NULL)就代表是一级菜单-->
<select id="findMenuByUsername" resultMap="Menu2Menu" parameterType="java.util.Map">
SELECT t1.id id,t1.path path,t1.name NAME,t1.linkUrl linkUrl ,t1.priority priority,t1.icon icon,t1.parentMenuId parentMenuId,t1.level level,t2.role_id rid FROM `t_menu` t1 JOIN `t_role_menu` t2 ON t1.id=t2.menu_id
WHERE t2.`role_id`=#{id} AND t1.parentMenuId IS NULL
GROUP BY t1.name ORDER BY t1.priority
</select>
<!--通过 column="{id=id,rid=rid}" 将角色对应的id也传给子菜单,因为用户有可能有一些二级菜单没有权限-->
<resultMap id="Menu2Menu" type="com.itheima.pojo.Menu" autoMapping="true">
<id property="id" column="id"></id>
<collection property="children"
ofType="com.itheima.pojo.Menu"
column="{id=id,rid=rid}"
select="com.itheima.dao.MenuDao.findMenu">
</collection>
</resultMap>
<select id="findMenu" resultMap="Menu2Menu" parameterType="java.util.Map">
SELECT t1.id id,t1.path path,t1.name NAME,t1.linkUrl linkUrl,t1.priority priority,t1.icon icon,t1.parentMenuId parentMenuId,t1.level level,t2.`role_id` rid FROM `t_menu` t1
JOIN `t_role_menu` t2 ON t1.id=t2.menu_id
JOIN `t_menu` t3 ON t3.id=t1.parentMenuId
WHERE t2.`role_id`=#{rid} AND t1.parentMenuId =#{id} GROUP BY t1.priority
</select>
前端html页面
<el-menu>
<!-- 一级菜单 -->
<template v-for="item in menuList">
<el-submenu v-if="item.children && item.children.length" :index="item.path" :key="item.path">
<template slot="title"><i class="fa" :class="item.icon"></i><span>{{item.name}}</span>
</template>
<!-- 二级菜单 -->
<template v-for="itemChild in item.children">
<el-submenu v-if="itemChild.children && itemChild.children.length"
:index="itemChild.path" :key="itemChild.path">
<template slot="title"><i :class="itemChild.icon"></i><span> <a
:href="itemChild.linkUrl" target="right">{{itemChild.name}}</a></span>
</template>
<!--三级菜单-->
<el-menu-item v-for="itemChild_Child in itemChild.children"
:index="itemChild_Child .path" :key="itemChild_Child.path">
<i :class="itemChild_Child.icon"></i><span slot="title"> <a
:href="itemChild_Child.linkUrl" target="right">{{itemChild_Child.name}}</a></span>
</el-menu-item>
</el-submenu>
<el-menu-item v-else :index="itemChild.path" :key="itemChild.path"><i
:class="itemChild.icon"></i><span slot="title"><a :href="itemChild.linkUrl"
target="right">{{itemChild.name}}</a></span>
</el-menu-item>
</template>
</el-submenu>
<el-menu-item v-else :index="item.path" :key="item.path"><i :class="item.icon"></i><span
slot="title"><a :href="item.linkUrl" target="right">{{item.name}}</a></span>
</el-menu-item>
</template>
</el-menu>
js代码
new Vue({
el: '#app',
data: {
username: '',//当前登录用户的用户名
menuList: []/*[
{
"path": "1",
"title": "工作台",
"icon":"fa-dashboard",
"children": []
},
{
"path": "2",
"title": "会员管理",
"icon":"fa-user-md",
"children": [
{
"path": "/2-1",
"title": "会员档案",
"linkUrl":"member.html",
"children":[]
},
{
"path": "/2-2",
"title": "体检上传",
"children":[]
},
{
"path": "/2-3",
"title": "会员统计",
"linkUrl":"all-item-list.html",
"children":[]
},
]
},
{
"path": "3",
"title": "预约管理",
"icon":"fa-tty",
"children": [
{
"path": "/3-1",
"title": "预约列表",
"linkUrl":"ordersettinglist.html",
"children":[]
},
{
"path": "/3-2",
"title": "预约设置",
"linkUrl":"ordersetting.html",
"children":[]
},
{
"path": "/3-3",
"title": "套餐管理",
"linkUrl":"setmeal.html",
"children":[]
},
{
"path": "/3-4",
"title": "检查组管理",
"linkUrl":"checkgroup.html",
"children":[]
},
{
"path": "/3-5",
"title": "检查项管理",
"linkUrl":"checkitem.html",
"children":[]
},
]
},
{
"path": "4",
"title": "健康评估",
"icon":"fa-stethoscope",
"children":[
{
"path": "/4-1",
"title": "中医体质辨识",
"linkUrl":"all-medical-list.html",
"children":[]
},
]
},
{
"path": "5", //菜单项所对应的路由路径
"title": "统计分析", //菜单项名称
"icon":"fa-heartbeat",
"children":[//是否有子菜单，若没有，则为[]
{
"path": "/5-1",
"title": "会员数量统计",
"linkUrl":"report_member.html",
"children":[]
},
{
"path": "/5-2",
"title": "套餐预约占比统计",
"linkUrl":"report_setmeal.html",
"children":[]
},
{
"path": "/5-3",
"title": "运营数据统计",
"linkUrl":"report_business.html",
"children":[]
},{
"path": "/5-4",
"title": "后台运营数据统计",
"linkUrl": "report_order_visit.html",
"children": []
},
{
"path": "/5-5",
"title": "总收入",
"linkUrl": "report_income.html",
"children": []
},
{
"path": "/5-6",
"title": "年龄分布",
"linkUrl": "report_age.html",
"children": []
}
]
},
{
"path": "7",
"title": "知识库",
"icon": "fa-book",
"children": [
{
"path": "/7-1",
"title": "食物库",
"linkUrl": "food.html",
"children": []
},
{
"path": "/7-2",
"title": "运动库",
"linkUrl": "sports.html",
"children": []
}
]
}
]*/
},
created() {
axios.get("/user/getUsername.do")
.then((resp) = > {
if(resp.data.flag
)
{
this.username = resp.data.data;
}
else
{
this.$message.error(resp.data.message);
}
})
;
},
mounted() {
axios.get("/user/findSidebar.do").then((resp) = > {
this.menuList = resp.data.data;
})
;
}
});
$(function () {
var wd = 200;
$(".el-main").css('width', $('body').width() - wd + 'px');
});
Controller层
/**
* 通过用户名查找对应的侧边栏
*
* @return
*/
@RequestMapping("/findSidebar")
public Result findSidebar() {
String username = null;
User user = (User) SecurityContextHolder.getContext().getAuthentication().getPrincipal();
if (user != null) {
username = user.getUsername();
}
try {
List<Map> data = userService.findMeauByUsername(username);
return new Result(true, MessageConstant.GET_USERPERMISSION_SUCCESS, data);
} catch (Exception e) {
e.printStackTrace();
return new Result(false, MessageConstant.GET_USERPERMISSION_FAIL);
}
}
Service层
@Override
public List<Map> findMeauByUsername(String username) {
List<Map> lists = new ArrayList<>();
List<User> mapList = userDao.findMeauByUsername(username);
for (User user : mapList) {
Set<Role> roles = user.getRoles();
for (Role role : roles) {
LinkedHashSet<Menu> menus = role.getMenus();
for (Menu menu : menus) {
Map map = new HashMap();
map.put("path", menu.getPath());
map.put("title", menu.getName());
map.put("icon", menu.getIcon());
if (menu.getParentMenuId() == null) {
List<Menu> children = menu.getChildren();
if (children.size() > 0) {
findChildren(map, children);
}
}
lists.add(map);
}
}
}
return lists;
}
//使用递归无限极遍历所有的子菜单,一直到没有子菜单可以查询
public List findChildren(Map map, List<Menu> children) {
List clits = new ArrayList<>();
for (Menu child : children) {
Map mapc = new HashMap();
mapc.put("path", child.getPath());
mapc.put("title", child.getName());
mapc.put("linkUrl", child.getLinkUrl());
if (child.getChildren().size() != 0) {
List m = findChildren(mapc, child.getChildren());
mapc.put("children", m);
}
clits.add(mapc);
}
map.put("children", clits);
return clits;
}
1245
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
