【通用权限管理系统】角色管理>分配菜单页面逻辑处理 导读部分
教程部分
本帖子主要讲解权限管理>角色管理>分配菜单的页面列表实现方法，稍后会在其它帖子中，详细讲解分配菜单的保存方法实现。
1. 在角色管理中，点击分配菜单按钮 2. 点击分配菜单按钮后，出现分配菜单的页面，本次主要讲解的就是分配菜单页面的实现逻辑，如下图： 由此图可以看到，本次分配的菜单信息，主要是给基本员工的角色分配，在页面的左上角，可以清晰的看到分配菜单的角色信息。
一下是代码部分讲解： 1. 分配菜单按钮的html实现如下： [C#] 纯文本查看 复制代码 <td><a href="/Sys/RoleMenu.aspx?roleId=<%=roleInfo.RoleID %>&name=<%=roleInfo.Name %>" class="btn btn-success btn-small">分配菜单</a></td> 此处可以看到，主要是个a链接，在链接中有两个参数，roleId（角色id），（角色名称）name（角色名称） 此两个参数，主要是在分配菜单页面使用
2. 分配菜单页面cs逻辑实现如下： 1. 参数实例化 [C#] 纯文本查看 复制代码 private Sys_MenuBLL sys_menuBll = new Sys_MenuBLL();
private Sys_MenuInRoleBLL sys_menuInRoleBll = new Sys_MenuInRoleBLL();
protected List<Sys_MenuInfo> parentMenuList = new List<Sys_MenuInfo>();
protected List<Sys_MenuInfo> sonMenuList = new List<Sys_MenuInfo>();
protected List<Sys_MenuInRoleInfo> rmlist = new List<Sys_MenuInRoleInfo>();
protected List<int> menuIdList = new List<int>();
protected int roleId = 0;
protected string roleName = string.Empty; 2. Page_Load 中页面数据绑定实现如下： [C#] 纯文本查看 复制代码 protected void Page_Load(object sender, EventArgs e) {
var action = this.Request.Params[ "action" ];
roleId = InputHelper.GetInputInt( this.Request.Params[ "roleId" ] );
roleName = this.Request.Params[ "name" ];
// 权限判断,没有权限，直接返回
if (!LoginUser.IsAssignPermission(10))
{
Response.Write("您暂无分配菜单的权限");
Response.End();
return;
}
if ( string.IsNullOrWhiteSpace( action ) ) {
//初始化 加载数据
/*
* 1. 获取所有菜单信息（包括主导航）
* 2. 获取所有主导航
* 3. 获取所有子导航
* 4. 获取当前角色的菜单分配信息
*/
// 获取所有导航信息
var menuList = sys_menuBll.GetList( "", "", "" );
// 获取所有主导航信息，赋值给 parentMenuList
parentMenuList = menuList.Where( m => m.ParentID == 0 ).ToList();
// 获取所有子导航信息，复制给 sonMenuList
sonMenuList = menuList.Where( m => m.ParentID != 0 ).ToList();
// 获取当前角色的菜单分配信息
rmlist = sys_menuInRoleBll.GetList( "", string.Format( "RoleID = {0}", roleId ), "" );
menuIdList = rmlist.Select( r => r.MenuID ).ToList();
}
}在此处可以看到，添加了是否有权限的限制，即代码： [C#] 纯文本查看 复制代码 // 权限判断,没有权限，直接返回
if (!LoginUser.IsAssignPermission(10))
{
Response.Write("您暂无分配菜单的权限");
Response.End();
return;
}如果没有权限，页面会直接输出，在页面上显示如下内容： ‘您暂无分配菜单的权限’
在Page_Load中，页面初始化数据，绘制页面html需要的数据处理如下： [C#] 纯文本查看 复制代码 if ( string.IsNullOrWhiteSpace( action ) ) {
//初始化 加载数据
/*
* 1. 获取所有菜单信息（包括主导航）
* 2. 获取所有主导航
* 3. 获取所有子导航
* 4. 获取当前角色的菜单分配信息
*/
// 获取所有导航信息
var menuList = sys_menuBll.GetList( "", "", "" );
// 获取所有主导航信息，赋值给 parentMenuList
parentMenuList = menuList.Where( m => m.ParentID == 0 ).ToList();
// 获取所有子导航信息，复制给 sonMenuList
sonMenuList = menuList.Where( m => m.ParentID != 0 ).ToList();
// 获取当前角色的菜单分配信息
rmlist = sys_menuInRoleBll.GetList( "", string.Format( "RoleID = {0}", roleId ), "" );
menuIdList = rmlist.Select( r => r.MenuID ).ToList();
}
主要为如上代码中所述的4步
* 1. 获取所有菜单信息（包括主导航）
* 2. 获取所有主导航
* 3. 获取所有子导航
* 4. 获取当前角色的菜单分配信息
详细代码如上。
分配菜单，页面html如下：
[C#] 纯文本查看 复制代码 <div class="si-main">
<div class="si-block">
<div class="si-form">
<table class="table-form table">
<tbody>
<tr>
<td align="left"><h4><%=roleName %></h4></td>
</tr>
</tbody>
</table>
<table class="table table-page" id="grid">
<thead>
<tr>
<td align="center" style="width:30%">主导航</td>
<td align="center" style="width:20%">操作</td>
<td align="center" style="width:50%">二级导航（勾选二级导航时请务必勾选它所在的主导航，否则系统将不会显示，切记）</td>
</tr>
</thead>
<tbody>
<%foreach (var menuInfo in parentMenuList)
{ %>
<tr >
<td align="center">
<label for="like<%=menuInfo.MenuID %>" class="form-check" data-scheck>
<input type="checkbox" id="like<%=menuInfo.MenuID %>" name="like" value="<%=menuInfo.MenuID %>" <%=(menuIdList.Contains(menuInfo.MenuID) ? "checked=\"checked\"" : string.Empty ) %> data-value=<%=menuInfo.MenuID %>>
<span class="check-icons"><i class="icon icon-check"></i> <i class="icon icon-uncheck">
</i> </span><%=menuInfo.MenuName %>
</label>
</td>
<td align="center">
<a href="javascript:;" class="toggle" >查看|设置菜单</a>
</td>
<td>
<%var sonList = sonMenuList.Where(m => m.ParentID == menuInfo.MenuID); %>
<ul id="UL<%=menuInfo.MenuID %>" style="display:none">
<%if( sonList != null && sonList.Any() ){
foreach (var sonMenu in sonList)
{%>
<li>
<label for="Checkbox<%=sonMenu.MenuID %>" class="form-check" data-scheck>
<input type="checkbox" id="Checkbox<%=sonMenu.MenuID %>" name="menuChild" value="<%=sonMenu.MenuID %>" <%=(menuIdList.Contains(sonMenu.MenuID) ? "checked=\"checked\"" : string.Empty ) %> data-value="<%=menuInfo.MenuID %>"/>
<span class="check-icons"><i class="icon icon-check"></i> <i class="icon icon-uncheck">
</i> </span><%=sonMenu.MenuName%>
</label>
</li>
<%}} else{%>
<li style="color:Red">暂无子菜单项</li>
<%}%>
</ul>
</td>
</tr>
<%
} %>
<tr>
<td colspan="3" align="center">
</td>
</tr>
<tr>
<td colspan="3" align="center">
<button class="btn btn-primary" id="btnSave">保存</button>
<button class="btn btn-cancel" id="btnCancle">取消</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
实现效果如下所示：
获取所有菜单信息，并将该角色原有的菜单信息选中
点击查看|设置菜单按钮，展开子菜单js如下：
[C#] 纯文本查看 复制代码 $('#grid').on('click', '.toggle', function () {
var $this = $(this);
$this.parent().next().find('ul').toggle();
$this.parents('tr').siblings().find('ul').hide();
})
以上即为分配菜单页面html列表实现的过程
| 
窥视卡
雷达卡
发表于 2018-1-9 17:09:08
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡
楼主
发表于 2018-12-11 19:22:29
