苏飞论坛广告位

苏飞论坛

 找回密码
 马上注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

分布式系统框架(V1.3) 轻松承载百亿数据,千万流量!讨论专区 - 源码下载 - 官方教程 - 订阅更新

HttpHelper万能框架(V2.2) HttpHelper官方出品,无敌框架讨论区 - 源码下载 - 在线测试和代码生成

HttpHelper爬虫类(V1.9) 最牛的爬虫类,没有爬不到只有想不到 源码 - 代码生成器 - 讨论区 - 教程- 例子

查看: 552|回复: 3

[教程] 【通用权限管理系统】角色管理>分配菜单页面逻辑处理

[复制链接]
  • TA的每日心情
    奋斗
    前天 17:19
  • 签到天数: 174 天

    [LV.7]常住居民III

    发表于 2018-1-9 17:09:08 | 显示全部楼层 |阅读模式
    【通用权限管理系统】角色管理>分配菜单页面逻辑处理


    导读部分





    教程部分


    本帖子主要讲解权限管理>角色管理>分配菜单的页面列表实现方法,稍后会在其它帖子中,详细讲解分配菜单的保存方法实现。

    1. 在角色管理中,点击分配菜单按钮
    1.png
    2. 点击分配菜单按钮后,出现分配菜单的页面,本次主要讲解的就是分配菜单页面的实现逻辑,如下图:
    2.png
    由此图可以看到,本次分配的菜单信息,主要是给基本员工的角色分配,在页面的左上角,可以清晰的看到分配菜单的角色信息。

    一下是代码部分讲解:
    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列表实现的过程
  • TA的每日心情
    奋斗
    前天 17:19
  • 签到天数: 174 天

    [LV.7]常住居民III

     楼主| 发表于 2018-1-9 21:10:35 | 显示全部楼层
    此页面的特点,就是分左右两级菜单处理,开始只显示一级菜单,方便设置者查看,一级选择所需要的子菜单信息
  • TA的每日心情
    开心
    前天 12:49
  • 签到天数: 548 天

    [LV.9]以坛为家II

    发表于 2018-1-9 21:21:39 | 显示全部楼层
  • TA的每日心情
    奋斗
    前天 17:19
  • 签到天数: 174 天

    [LV.7]常住居民III

     楼主| 发表于 2018-1-10 19:36:00 | 显示全部楼层
    您需要登录后才可以回帖 登录 | 马上注册

    本版积分规则

    QQ|手机版|小黑屋|手机版|联系我们|关于我们|广告合作|苏飞论坛 ( 豫ICP备17001017号-1 )

    GMT+8, 2018-7-22 01:20

    © 2017-2018

    快速回复 返回顶部 返回列表