前五章均是从整体上讲述了Web应用程序的多用户权限控制实现流程，从本章起则重点讲述每一个模块的实现的流程。
首先讲解基本模块-用户组管理模块，涉及到的数据表为分组表。分组表定义了每一个用户属于的一种角色类型。本系统支持一个用户多种角色的情况，系统在登陆成功后，首先就加载用户的分组信息从而查看用户的可操作模块。
1.1分组域
为了更规范和方便后期系统的二次开发和维护，对应特定的业务模块采用Area(域)的方式开发，分组模块的开发域如下图所示：
由于在Areas下还建立了一个新的目录SystemManage,故需要改变原来的路由。分组模块的路由文件名称为SystemManageAreaRegistration。改变路由代码的文件名称为如下：
using System.Web.Mvc;
namespace CodeForMvcTest.Areas.SystemManage
{
public class SystemManageAreaRegistration : AreaRegistration
{
public override string AreaName
{
get
{
return "SystemManage/OperatorGroup";
}
}
public override void RegisterArea(AreaRegistrationContext context)
{
context.MapRoute(
"SystemManage_OperatorGroup",
"SystemManage/OperatorGroup/{controller}/{action}/{id}",
new { action = "index", id = UrlParameter.Optional }
);
}
}
}
1.2Model
分组模块的Model可参看第三章项目架构的系统共有类，对应model为OperatorGroup.cs。文件路径为Areas/SystemManage/Models。
1.3视图
分组模块的视图包含在分组域中，文件路径为Areas/SystemManage/OperatorGroup/Views/OperatorGroupManage，视图名称为OperatorGroupManage.cshtml。视图的完整代码如下：
1 @{ 2 ViewBag.Title = "用户组管理"; 3 Layout = "~/Views/Shared/_BaseLayout.cshtml"; 4 } 5 6 7 <div class="easyui-layout" data-options="fit:true"> 8 9 <div data-options="region:'north',split:true" style="height: 50px;"> 10 @using (Ajax.BeginForm("OperatorGroupManage", "OperatorGroupManage", new AjaxOptions 11 { 12 HttpMethod = "POST", 13 OnSuccess = "loadDataGrid(data,'dataGrid','btn_submit','未找到匹配的用户组信息！')", 14 OnBegin = "startDatagridLoading('dataGrid','btn_submit')", 15 OnFailure = "commErrorHandle(data,true,'dataGrid','btn_submit','查找用户组信息出错！')" 16 })) 17 { 18 <!--属性组筛选栏--> 19 <table style="margin-left: 5px; margin-top: 5px;"> 20 <tr> 21 <td><span style="margin-left: 10px;">用户组名称：</span></td> 22 <td> 23 <input id="groupName" name="groupName" /> 24 </td> 25 <td><span style="margin-left: 10px;">状态：</span></td> 26 <td> 27 <select class="easyui-combobox" name="state" id="state" style="width: 150px;" 28 data-options="editable:false,required:true"> 29 <option value="-1">全部</option> 30 <option value="0">禁用</option> 31 <option value="1">启用</option> 32 </select> 33 </td> 34 <td> 35 <input type="submit" value="查找" id="btn_submit" style="margin-left: 10px; margin-right: 10px;" /> 36 </td> 37 </tr> 38 </table> 39 } 40 </div> 41 42 <div data-options="region:'center',split:true" style="padding-bottom: 10px;"> 43 <table class="easyui-datagrid" id="dataGrid" title="用户组列表" 44 data-options=" 45 rownumbers:false, 46 singleSelect:true, 47 autoRowHeight:false, 48 toolbar:'#group_tb', 49 loadMsg:'Loading... ...'"> 50 <thead> 51 <tr> 52 <th data-options="field:'GroupId',align:'left'">用户组ID</th> 53 <th data-options="field:'GroupName',align:'left'">用户组名称</th> 54 <th data-options="field:'OrderNum',align:'left'">排序值</th> 55 <th data-options="field:'State',align:'center',formatter:statusformater">状态</th> 56 <th data-options="field:'ParentId',align:'center',formatter:operateFormater">操作</th> 57 </tr> 58 </thead> 59 <tbody> 60 @Html.Raw(ViewBag.GroupList) 61 </tbody> 62 </table> 63 <br /> 64 </div> 65 66 </div> 67 68 <!--用户组工具栏--> 69 <div id="group_tb" style="height: auto"> 70 <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick="openAddWindow();">添加用户组</a> 71 </div> 72 73 74 <!--用户组信息编辑窗体--> 75 <div id="groupEditWin" title="修改用户组信息" style="width: 450px; height: 250px; padding: 20px; text-align: center;"> 76 <form id="groupEditForm" method="POST" action="@Url.Action("UpdateGroup", "OperatorGroupManage")"> 77 <table style="margin: auto;"> 78 <tr> 79 <td style="text-align: right;"><span>名称:</span></td> 80 <td> 81 <input class="easyui-validatebox" id="e_groupName" name="groupName" data-options="required:true" /> 82 </td> 83 </tr> 84 <tr style="height: 40px;"> 85 <td style="text-align: right;"><span>排序值:</span></td> 86 <td> 87 <input class="easyui-numberbox" data-options="required:true" id="e_orderNum" name="orderNum" /> 88 </td> 89 </tr> 90 <tr style="height: 40px;"> 91 <td style="text-align: right;"><span>状态:</span></td> 92 <td> 93 <select class="easyui-combobox" name="state" id="e_state" style="width: 150px;" 94 data-options="editable:false,required:true"> 95 <option value="0">禁用</option> 96 <option value="1">启用</option> 97 </select> 98 </td> 99 </tr> 100 <tr style="height: 50px;"> 101 <td colspan="2" style="text-align: right;"> 102 <input type="hidden" id="e_groupId" name="groupId" /> 103 <input type="submit" value="提交" id="btn_editsubmit" style="margin-left: 10px; margin-right: 10px;" /> 104 <input type="button" value="取消" id="btn_editCancel" onclick="javascript: return $('#groupEditWin').window('close');" 105 style="margin-left: 10px; margin-right: 10px;" /> 106 </td> 107 </tr> 108 </table> 109 </form> 110 </div> 111 112 113 114 <!--添加用户组窗体--> 115 <div id="groupAddWin" title="添加用户组" style="width: 450px; height: 250px; padding: 20px; text-align: center;"> 116 <form id="groupAddForm" method="POST" action="@Url.Action("AddGroup", "OperatorGroupManage")"> 117 <table style="margin: auto;"> 118 <tr> 119 <td style="text-align: right;"><span>名称:</span></td> 120 <td> 121 <input class="easyui-validatebox" id="a_groupName" name="groupName" data-options="required:true" /> 122 </td> 123 </tr> 124 <tr style="height: 40px;"> 125 <td style="text-align: right;"><span>排序值:</span></td> 126 <td> 127 <input class="easyui-numberbox" data-options="required:true" id="a_orderNum" name="orderNum" /> 128 </td> 129 </tr> 130 <tr style="height: 40px;"> 131 <td style="text-align: right;"><span>状态:</span></td> 132 <td> 133 <select class="easyui-combobox" name="state" id="a_state" style="width: 150px;" 134 data-options="editable:false,required:true"> 135 <option value="0">禁用</option> 136 <option value="1">启用</option> 137 </select> 138 </td> 139 </tr> 140 <tr style="height: 50px;"> 141 <td colspan="2" style="text-align: right;"> 142 <input type="submit" value="提交" id="btn_addsubmit" style="margin-left: 10px; margin-right: 10px;" /> 143 <input type="button" value="取消" id="btn_addCancel" onclick="javascript: return $('#groupAddWin').window('close');" 144 style="margin-left: 10px; margin-right: 10px;" /> 145 </td> 146 </tr> 147 </table> 148 </form> 149 </div> 150 151 152 153 @section scripts 154 { 155 <script type="text/javascript" src="/Areas/SystemManage/SystemJS/operatorGroupManage.js"></script> 156 }