ASP.NET MVC4+EasyUI+EntityFrameWork5权限管理系统——菜单模块的实现（二）

ASP.NET MVC4+EasyUI+EntityFrameWork5权限管理系统——数据库的设计（一）

菜单和模块是在同一个表中，采用的是树形结构，模块菜单表结构如下代码：

 USE [Permission]
 GO

 /****** Object:  Table [dbo].[Permission_Modules]    Script Date: 11/21/2013 17:06:55 ******/
 SET ANSI_NULLS ON
 GO

 SET QUOTED_IDENTIFIER ON
 GO

 SET ANSI_PADDING ON
 GO

 CREATE TABLE [dbo].[Permission_Modules](
     [ID] [int] IDENTITY(1,1) NOT NULL,
     [Name] [nvarchar](20) NOT NULL,
     [ParentID] [int] NOT NULL,
     [Icon] [varchar](20) NOT NULL,
     [Url] [nvarchar](500) NULL,
     [Sort] [int] NOT NULL,
     [IsDisplay] [bit] NOT NULL,
     [IsDelete] [bit] NOT NULL,
     [Authority] [int] NOT NULL,
     [IsMenu] [bit] NOT NULL,
     [AddUserID] [int] NOT NULL,
     [UpdateUserID] [int] NULL,
     [AddDate] [datetime] NOT NULL,
     [LastUpdate] [datetime] NULL,
     [Description] [nvarchar](500) NULL,
  CONSTRAINT [PK_Module] PRIMARY KEY CLUSTERED
 (
     [ID] ASC
 )WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
 ) ON [PRIMARY]

 GO

 SET ANSI_PADDING OFF
 GO

 EXEC sys.sp_addextendedproperty @name=N'MS_Description', @value=N'菜单名称/模块名称' , @level0type=N'SCHEMA',@level0name=N'dbo', @level1type=N'TABLE',@level1name=N'Permission_Modules', @level2type=N'COLUMN',@level2name=N'Name'
 GO

 EXEC sys.sp_addextendedproperty @name=N'MS_Description', @value=N'排序字段,数值越大,排序越靠前' , @level0type=N'SCHEMA',@level0name=N'dbo', @level1type=N'TABLE',@level1name=N'Permission_Modules', @level2type=N'COLUMN',@level2name=N'Sort'
 GO

 EXEC sys.sp_addextendedproperty @name=N'MS_Description', @value=N'是否显示' , @level0type=N'SCHEMA',@level0name=N'dbo', @level1type=N'TABLE',@level1name=N'Permission_Modules', @level2type=N'COLUMN',@level2name=N'IsDisplay'
 GO

 EXEC sys.sp_addextendedproperty @name=N'MS_Description', @value=N'是否删除' , @level0type=N'SCHEMA',@level0name=N'dbo', @level1type=N'TABLE',@level1name=N'Permission_Modules', @level2type=N'COLUMN',@level2name=N'IsDelete'
 GO

 EXEC sys.sp_addextendedproperty @name=N'MS_Description', @value=N'权重' , @level0type=N'SCHEMA',@level0name=N'dbo', @level1type=N'TABLE',@level1name=N'Permission_Modules', @level2type=N'COLUMN',@level2name=N'Authority'
 GO

 EXEC sys.sp_addextendedproperty @name=N'MS_Description', @value=N'True菜单，False模块' , @level0type=N'SCHEMA',@level0name=N'dbo', @level1type=N'TABLE',@level1name=N'Permission_Modules', @level2type=N'COLUMN',@level2name=N'IsMenu'
 GO

 ALTER TABLE [dbo].[Permission_Modules]  WITH CHECK ADD  CONSTRAINT [FK_Module_Permission_User] FOREIGN KEY([AddUserID])
 REFERENCES [dbo].[Permission_User] ([ID])
 GO

 ALTER TABLE [dbo].[Permission_Modules] CHECK CONSTRAINT [FK_Module_Permission_User]
 GO

 ALTER TABLE [dbo].[Permission_Modules]  WITH CHECK ADD  CONSTRAINT [FK_Module_Permission_User1] FOREIGN KEY([UpdateUserID])
 REFERENCES [dbo].[Permission_User] ([ID])
 GO

 ALTER TABLE [dbo].[Permission_Modules] CHECK CONSTRAINT [FK_Module_Permission_User1]
 GO

Permission_Modules.sql

菜单模块的实现，两种菜单，方便操作，先看整体结构图

菜单编辑

模块编辑

图标选择：

菜单是树形结构，我控制器中应该使用递归绑定的方式绑定，一下子没写出来，就自己嵌套了3层写死了，不知道大家有没有好的方法，我不想再定义拼接字符的方式去实现，有好的办法请提示一下，我现有写死的三层代码如下方法：

 public JsonResult Tree()
         {
             var modules = _ModuleBLL.Where(p => p.IsMenu == true).OrderByDescending(p => p.Sort).Select(p => new { ModeuleID = p.ModuleID, Name = p.Name, ParentID = p.ParentID }).ToList();
             var list1 = modules.Where(p => p.ParentID == ).ToList();
             list1.Insert(, new { ModeuleID = , Name = "请选择", ParentID =  });
             var list2 = modules.Where(p => p.ParentID != ).ToList();
             var result = list1.Select(p => new
             {
                 id = p.ModeuleID,
                 text = p.Name,
                 children = list2.Where(p1 => p1.ParentID == p.ModeuleID).Select(p1 => new
                 {
                     id = p1.ModeuleID,
                     text = p1.Name,
                     children = list2.Where(p2 => p2.ParentID == p1.ModeuleID).Select(p2 => new
                     {
                         id = p2.ModeuleID,
                         text = p2.Name,
                         children = list2.Where(p3 => p3.ParentID == p2.ModeuleID).Select(p3 => new
                         {
                             id = p3.ModeuleID,
                             text = p3.Name
                         }).ToList()
                     }).ToList()
                 }).ToList()
             });
             var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
             return json;
         }

Tree

这种代码看了就不爽，大家帮我写下吧……

每一个模块都会有一个权重，这个权重是一个int类型的值来存储，比如字典管理模块，它有（浏览，添加，编辑，删除，搜索）功能，这些功能在第一篇中有介绍，这个字典模块的权重等于（浏览|添加|编辑|删除|搜索）=(1|2|4|8|16)=31 而每个Action刚好也用上一篇枚举中的名称做Action，可以很巧妙的用2进制方式来做权限判断，某个角色对应数据字典的权重为3，此时就可以3&浏览(1)==1 为True就说明这个角色有浏览数据字典的权限，3&添加(2)==2 为True则说明这个角色有添加数据字典的权限……

菜单模块使用的全部是Ajax异步的方式数据交互，我也看见有人在弹窗比如添加，编辑都是弹窗中嵌入的iframe也就是一个子页面，这样也可以很好的控制；MVC中可以使用分部视图，我觉得可以用分布试图也可以模拟iframe中的表单，只是数据提交和填充都要使用Json数据交互，只是一次性把这弹窗的html都加载到了主页面中，下图就是视图结构图

模块菜单控制器代码如下：

 using System;
 using System.Linq;
 using System.Web;
 using System.Web.Mvc;
 using System.Collections.Generic;

 using Mydream.Permission.Entity;
 using Mydream.Permission.BLL;
 using Mydream.Permission.Common;
 using Mydream.Permission.Model;

 namespace Mydream.Permission.Web.Controllers
 {
     public class ModuleController : BaseController
     {
         private readonly ModuleBLL _ModuleBLL = new ModuleBLL();
         public ActionResult Index()
         {
             return View();
         }

         [HttpPost]
         public JsonResult Search()
         {
             IQueryable<Permission_Modules> query = _ModuleBLL.Where(p => p.IsDelete == false);
             var list = query.Select(p => new
             {
                 ID = p.ID,
                 Name = p.Name,
                 _parentId = p.ParentID,
                 iconCls = "t-icon " + p.Icon,
                 Url = p.Url,
                 Sort = p.Sort,
                 IsDisplay = p.IsDisplay,
                 Authority = p.Authority,
                 IsMenu = p.IsMenu,
                 AddUserName = p.Permission_User.UserName,
                 UpdateUserName = p.Permission_User1.UserName,
                 AddDate = p.AddDate,
                 LastUpdate = p.LastUpdate,
                 Description = p.Description
             }).ToList();
             return new JsonResult { Data = new { total = list.Count, rows = list }, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
         }

         [HttpPost]
         public JsonResult Add()
         {
             Permission_Modules model = Request.Form.ToModel<Permission_Modules>("Authority");
             model.AddUserID = base.UserID;
             model.AddDate = DateTime.Now;
             model.Authority = model.IsMenu ?  : (Request.Form["Authority"] ?? string.Empty).ToOrSum();
             bool result = _ModuleBLL.Add(model);
             string message = string.Format("{0}添加{1}", model.IsMenu ? "菜单" : "模块", result ? "成功" : "失败");
             var json = new { success = result, message = message };
             return Json(json, "json");
         }

         [HttpPost]
         public JsonResult Edit()
         {
             Permission_Modules model = Request.Form.ToModel<Permission_Modules>("Authority");
             Permission_Modules entity = _ModuleBLL.GetEntityByID(model.ID);
             entity.UpdateUserID = base.UserID;
             entity.LastUpdate = DateTime.Now;
             entity.Name = model.Name;
             entity.ParentID = model.ParentID;
             entity.Url = model.Url;
             entity.Icon = model.Icon;
             entity.Sort = model.Sort;
             entity.Authority = entity.IsMenu ?  : (Request.Form["Authority"] ?? string.Empty).ToOrSum();
             entity.IsDisplay = model.IsDisplay;
             entity.Description = model.Description;
             bool result = _ModuleBLL.Update(entity);
             string message = string.Format("{0}编辑{1}", entity.IsMenu ? "菜单" : "模块", result ? "成功" : "失败");
             var json = new { success = result, message = message };
             return Json(json, "json");
         }

         public JsonResult Edit(int ID)
         {
             var result = _ModuleBLL.Where(p => p.ID == ID).Select(p => new
             {
                 ID = p.ID,
                 Name = p.Name,
                 Icon = p.Icon,
                 Url = p.Url,
                 ParentID = p.ParentID,
                 Sort = p.Sort,
                 IsDisplay = p.IsDisplay,
                 Description = p.Description
             }).Single();
             var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
             return json;
         }

         #region 不在功能枚举中的Action或方法
         public JsonResult Tree()
         {
             var modules = _ModuleBLL.Where(p => p.IsMenu == true && p.IsDelete == false).OrderByDescending(p => p.Sort).Select(p => new { ID = p.ID, Name = p.Name, ParentID = p.ParentID }).ToList();
             var list1 = modules.Where(p => p.ParentID == ).ToList();
             list1.Insert(, new { ID = , Name = "请选择", ParentID =  });
             var list2 = modules.Where(p => p.ParentID != ).ToList();
             var result = list1.Select(p => new
             {
                 id = p.ID,
                 text = p.Name,
                 children = list2.Where(p1 => p1.ParentID == p.ID).Select(p1 => new
                 {
                     id = p1.ID,
                     text = p1.Name,
                     children = list2.Where(p2 => p2.ParentID == p1.ID).Select(p2 => new
                     {
                         id = p2.ID,
                         text = p2.Name,
                         children = list2.Where(p3 => p3.ParentID == p2.ID).Select(p3 => new
                         {
                             id = p3.ID,
                             text = p3.Name
                         }).ToList()
                     }).ToList()
                 }).ToList()
             });
             var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
             return json;
         }

         public JsonResult AuthorityTree(int ID)
         {
             int authority = ;
             if (ID != )
             {
                 authority = _ModuleBLL.Where(p => p.ID == ID).Select(p => p.Authority).Single();
             }
             IDictionary<int, string> dicts = new Dictionary<int, string>();
             dicts.Add(, "浏览");
             dicts.Add(, "添加");
             dicts.Add(, "编辑");
             dicts.Add(, "删除");
             dicts.Add(, "搜索");
             dicts.Add(, "审核");
             dicts.Add(, "移动");
             dicts.Add(, "打印");
             dicts.Add(, "下载");
             dicts.Add(, "备份");
             dicts.Add(, "授权");
             dicts.Add(, "查看详细");
             dicts.Add(, "导出");
             var result = dicts.Select(p => new
             {
                 id = p.Key,
                 text = p.Value,
                 @checked = ID !=  && authority !=  && ((p.Key & authority) == p.Key)
             }).ToList();
             var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
             return json;
         }
         #endregion
     }
 }

ModuleController.cs

主页面Html代码如下：

 @{
     ViewBag.Title = "菜单管理";
     string _ControllerName = "Module";
 }
 <div id="treegrid"></div>
 <div id="toolbar" class="z-toolbar" style="background: #f4f4f4;">
     <a id="btnAddMenu" href="javascript:;" class="easyui-linkbutton" title="新增菜单" data-options="iconCls:'icon-add',plain:true">新增菜单</a>
     <a id="btnAddModule" href="javascript:;" class="easyui-linkbutton" title="新增模块" data-options="iconCls:'icon-add',plain:true">新增模块</a>
     <a id="btnDelete" href="javascript:;" class="easyui-linkbutton" title="删除" data-options="iconCls:'icon-remove',plain:true">删除</a>
     <a id="btnEdit" href="javascript:;" class="easyui-linkbutton" title="编辑" data-options="iconCls:'icon-edit',plain:true">编辑</a>
     <a href="javascript:;" class="easyui-splitbutton" title="展开" data-options="menu:'#dropdown',iconCls:'icon-collapse',plain:true">展开</a>
     <a id="btnReload" href="javascript:;" class="easyui-linkbutton" title="刷新" data-options="iconCls:'icon-reload',plain:'true'">刷新</a>
 </div>
 <div id="dropdown">
     <div id="btnCollapseAll" data-options="iconCls:'t-icon t-icon-12-18'">全部折叠</div>
     <div id="btnExpandAll" data-options="iconCls:'t-icon t-icon-13-18'">全部展开</div>
 </div>
 <div id="treegrid-menu" class="easyui-menu">
     <div id="treegrid-add-menu" data-options="iconCls:'icon-add'" title="新增菜单">新增菜单</div>
     <div id="treegrid-add-module" data-options="iconCls:'icon-add'" title="新增模块">新增模块</div>
     <div id="treegrid-delete" data-options="iconCls:'icon-remove'" title="删除">删除</div>
     <div id="treegrid-edit" data-options="iconCls:'icon-edit'" title="编辑">编辑</div>
     <div id="treegrid-expand" data-options="iconCls:'icon-collapse'" title="展开">
         <span>展开</span>
         <div style="width: 150px;">
             <div id="treegrid-collapseAll" data-options="iconCls:'t-icon t-icon-12-18'">全部折叠</div>
             <div id="treegrid-expandAll" data-options="iconCls:'t-icon t-icon-13-18'">全部展开</div>
         </div>
     </div>
     <div class="menu-sep"></div>
     <div id="treegrid-reload" data-options="iconCls:'icon-reload'" title="刷新">刷新</div>
 </div>
 @Html.Partial("_AddEditMenu")
 @Html.Partial("_AddEditModule")
 @Html.Partial("_Icon")
 @section JS{
     <script type="text/javascript">
         $(document).ready(function () {
             var _rowData;
             $treeGrid = $('#treegrid');
             $treeGrid.treegrid({
                 state: 'open',
                 idField: 'ID',
                 treeField: 'Name',
                 url: '@Url.Action("Search", _ControllerName)',
                 border: false,
                 fitColumns: false,
                 title: '菜单管理',
                 iconCls: 't-icon t-icon-nav',
                 rownumbers: true,
                 animate: true,
                 fit: true,
                 fixed: false,
                 singleSelect: true,
                 toolbar: '#toolbar',
                 frozenColumns: [[
                     { field: 'ck', checkbox: true, align: 'center', width: 20 },
                     { title: '菜单名称', field: 'Name', width: '200', align: 'left' },
                     { title: '链接地址', field: 'Url', width: '120', align: 'left' },
                     { title: '排序', field: 'Sort', width: '50', align: 'center' },
                     {
                         title: '显示', field: 'IsDisplay', width: '50', align: 'center',
                         formatter: function (value) {
                             return Common.formatBoolean(value);
                         }
                     },
                     {
                         title: '菜单', field: 'IsMenu', width: '60', align: 'center',
                         formatter: function (value) {
                             return Common.formatBoolean(value);
                         }
                     },
                     { title: '权重', field: 'Authority', width: '50', align: 'center' }
                 ]],
                 columns: [[
                     { title: '添加人', field: 'AddUserName', width: '80', align: 'center' },
                     { title: '最后更新人', field: 'UpdateUserName', width: '80', align: 'center' },
                     {
                         title: '添加时间', field: 'AddDate', width: '100', align: 'center',
                         formatter: function (value) {
                             return Common.formatDate(value);
                         }
                     },
                     {
                         title: '最后更新时间', field: 'LastUpdate', width: '100', align: 'center',
                         formatter: function (value) {
                             return Common.formatDate(value);
                         }
                     },
                     { title: '描述', field: 'Description', width: '220', align: 'center' }
                 ]],
                 onContextMenu: onRowContextMenu
             });
             //新增菜单
             $('#btnAddMenu,#treegrid-add-menu').on('click', function () {
                 $('#frmAddEditMenu')[0].reset();
                 $('#_ID_Menu').val('0');
                 $('#_ParentID_Menu').combotree({ url: '@Url.Action("Tree", "Module")' }).combotree('setValue', 0);
                 $('#AddEditMenu').window({
                     iconCls: 'icon-add',
                     title: '添加菜单'
                 }).window('open');
             });
             //新增模块
             $('#btnAddModule,#treegrid-add-module').on('click', function () {
                 $('#frmAddEditModule')[0].reset();
                 $('#_ID_Module').val('0');
                 $('#_ParentID_Module').combotree({ url: '@Url.Action("Tree", "Module")' }).combotree('setValue', 0);
                 $('#AddEditModule').window({
                     iconCls: 'icon-add',
                     title: '添加菜单'
                 }).window('open');
             });
             //新增菜单
             $('#treegrid-edit').on('click', function () {
                 if (_rowData['IsMenu']) { //菜单
                     EditMenu(_rowData['ID']);
                 } else { //模块
                     EditModule(_rowData['ID']);
                 }
             });
             $('#btnEdit').on('click', function () {
                 var selecteds = $treeGrid.treegrid('getSelections');
                 if (Common.isEmptyObject(selecteds)) {
                     $.messager.alert('提示', '请选中一条数据编辑！', 'warning');
                 } else if (selecteds.length > 1) {
                     $.messager.alert('提示', '请只选中一条数据编辑！', 'warning');
                 } else {
                     if (selecteds[0].IsMenu) {
                         EditMenu(selecteds[0].ID);
                     }
                     else {
                         EditModule(selecteds[0].ID)
                     }
                 }
             });
             //全部折叠
             $('#btnCollapseAll,#treegrid-collapseAll').on('click', function () {
                 $treeGrid.treegrid('collapseAll');
             });
             //全部展开
             $('#btnExpandAll,#treegrid-expandAll').on('click', function () {
                 $treeGrid.treegrid('expandAll');
             });
             //刷新
             $('#btnReload,#treegrid-reload').on('click', function () {
                 $treeGrid.treegrid('load');
             });
             //添加右击菜单内容
             function onRowContextMenu(e, row) {
                 e.preventDefault();
                 _rowData = row;
                 $('#treegrid-menu').menu('show', {
                     left: e.pageX,
                     top: e.pageY
                 });
             }
             //编辑菜单
             function EditMenu(id) {
                 $.get('@Url.Action("Edit", _ControllerName)/' + id,
                     function (data) {
                         $('#frmAddEditMenu').form('load', data);
                         $('#_Icon_Menu').siblings().find('a').addClass(data.Icon);
                         var isDisplay = data.IsDisplay ? 'True' : 'False';
                         $('#_IsDisplay_Menu').val(isDisplay);
                     });
                 $('#AddEditMenu').window({
                     iconCls: 'icon-edit',
                     title: '编辑菜单'
                 }).window('open');
             }
             //编辑模块
             function EditModule(id) {
                 $.get('@Url.Action("Edit", _ControllerName)/' + id,
                     function (data) {
                         $('#frmAddEditModule').form('load', data);
                         $('#_Icon_Module').siblings().find('a').addClass(data.Icon);
                         var isDisplay = data.IsDisplay ? 'True' : 'False';
                         $('#_IsDisplay_Module').val(isDisplay);
                     });
                 //编辑默认选中
                 $('#_Authority_Module').combotree({
                     url: '@Url.Action("AuthorityTree", _ControllerName)/' + id
                 });
                 $('#AddEditModule').window({
                     iconCls: 'icon-edit',
                     title: '编辑模块'
                 }).window('open');
             }
             //菜单表单
             SubmitForm('Menu');
             //模块表单
             SubmitForm('Module');
             Common.getIcon('_Icon_Menu');
             Common.getIcon('_Icon_Module');
             //提交表单
             function SubmitForm(flag) {
                 $('#btnRest_' + flag + '').on('click', function () {
                     $('#frmAddEdit' + flag + '')[0].reset();
                 });
                 $('#btnOK_' + flag + '').on('click', function () {
                     var action = $('#_ID_' + flag + '').val() == '0' ? 'Add' : 'Edit';
                     if ($('#frmAddEdit' + flag + '').form('validate')) {
                         $.ajax({
                             type: 'post',
                             data: $('#frmAddEdit' + flag + '').serialize(),
                             url: '/@_ControllerName/' + action,
                             success: function (data) {
                                 if (data.success) {
                                     $.messager.alert('提示', data.message, 'info', function () {
                                         $('#AddEdit' + flag + '').window('close');
                                     });
                                     $treeGrid.treegrid('load');
                                 } else {
                                     $.messager.alert('错误', data.message, 'error');
                                 }
                             },
                             error: function () {
                                 $.messager.alert('提示', '数据提交失败', 'info');
                             }
                         });
                     }
                 });
             }
         });
     </script>
 }

Index.cshtml

局部分部视图（菜单表单和模块表单）图如下：

 <div id="AddEditMenu" class="easyui-window" data-options="modal:true,closed:true,maximizable:false,resizable:false,minimizable:false,collapsible:false,top:10,onClose:function(){$('#select-icon-list').fadeOut('fast');}" style="padding: 10px; width: 340px;">
     <form id="frmAddEditMenu" class="form-horizontal" method="post">
         <div class="control-group">
             <label class="control-label" for="_Name_Menu">菜单名称</label>
             <div class="controls">
                 <input name="Name" id="_Name_Menu" class="span3 easyui-validatebox" placeholder="菜单名称" maxlength="20" type="text" data-options="required:true" />
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Icon_Menu">ICON</label>
             <div class="controls">
                 <input name="Icon" id="_Icon_Menu" class="span3 easyui-validatebox" placeholder="ICON" type="text" data-options="required:true,missingMessage: '此输入项为必输项，请选择图标'" style="width:180px;"/>
                 <span class="help-inline"><a class="t-icon" style="width:18px;height:18px;"></a></span>
             </div>
         </div>
         <div class="input-prepend inline">
             <label class="control-label" for="_ParentID_Menu">上级菜单</label>
             <div class="controls">
                 <input name="ParentID" id="_ParentID_Menu" class="span3 easyui-combotree" data-options="url:'@Url.Action("Tree", "Module")',method:'get',required:true" style="width:216px;height:24px;"/>
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Sort_Menu">排序</label>
             <div class="controls">
                 <input name="Sort" id="_Sort_Menu" class="span3 easyui-numberspinner" placeholder="排序" type="text" data-options="required:true,min:0,max:100000,missingMessage: '此项为整数，数值越大排序越靠前'" style="width: 216px; height: 24px;" />
             </div>
         </div>
         <div class="input-prepend inline">
             <label class="control-label" for="_IsDisplay_Menu">是否显示</label>
             <div class="controls">
                 @Html.DropDownList("IsDisplay", MyHtmlHelper.GetDisplayList(), new { id = "_IsDisplay_Menu", style = "width:216px;" })
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Description_Menu">描述</label>
             <div class="controls">
                 <textarea id="_Description_Menu" name="Description" class="span3 easyui-validatebox" placeholder="描述" data-options="required:false" rows="4" maxlength="500"></textarea>
             </div>
         </div>
         <div class="control-group">
             <div class="controls">
                 <input id="_IsMenu_Menu" value="True" name="IsMenu" type="hidden" />
                 <input id="_ID_Menu" name="ID" type="hidden" />
                 <a id="btnOK_Menu" class="easyui-linkbutton" data-options="iconCls:'icon-ok'">确定</a>
                 <a id="btnRest_Menu" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'">重置</a>
             </div>
         </div>
     </form>
 </div>

_AddEditMenu.cshtml(菜单添加编辑视图)

 <div id="AddEditModule" class="easyui-window" data-options="modal:true,closed:true,maximizable:false,resizable:false,minimizable:false,collapsible:false,top:10,onClose:function(){$('#select-icon-list').fadeOut('fast');}" style="padding: 10px; width: 340px;">
     <form id="frmAddEditModule" class="form-horizontal" method="post">
         <div class="control-group">
             <label class="control-label" for="_Name_Module">模块名称</label>
             <div class="controls">
                 <input name="Name" id="_Name_Module" class="span3 easyui-validatebox" placeholder="模块名称" maxlength="20" type="text" data-options="required:true" />
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Icon_Module">ICON</label>
             <div class="controls">
                 <input name="Icon" id="_Icon_Module" class="span3 easyui-validatebox" placeholder="ICON" type="text" data-options="required:true,missingMessage: '此输入项为必输项，请选择图标'" style="width:180px;"/>
                 <span class="help-inline"><a class="t-icon" style="width:18px;height:18px;"></a></span>
             </div>
         </div>
         <div class="input-prepend inline">
             <label class="control-label" for="_Authority_Module">模块权限</label>
             <div class="controls">
                 <input name="Authority" id="_Authority_Module" class="span3 easyui-combotree" multiple data-options="url:'@Url.Action("AuthorityTree", "Module")/0',method:'get',required:true" style="width:216px;height:24px;"/>
             </div>
         </div>
         <div class="input-prepend inline">
             <label class="control-label" for="_ParentID_Module">上级菜单</label>
             <div class="controls">
                 <input name="ParentID" id="_ParentID_Module" class="span3 easyui-combotree" data-options="url:'@Url.Action("Tree", "Module")',method:'get',required:true" style="width:216px;height:24px;"/>
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Url_Module">URL</label>
             <div class="controls">
                 <input name="Url" id="_Url_Module" class="span3 easyui-validatebox" placeholder="URL" type="text" data-options="required:true" />
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Sort_Module">排序</label>
             <div class="controls">
                 <input name="Sort" id="_Sort_Module" class="span3 easyui-numberspinner" placeholder="排序" type="text" data-options="required:true,min:0,max:100000,missingMessage: '此项为整数，数值越大排序越靠前'" style="width: 216px; height: 24px;" />
             </div>
         </div>
         <div class="input-prepend inline">
             <label class="control-label" for="_IsDisplay_Module">是否显示</label>
             <div class="controls">
                 @Html.DropDownList("IsDisplay", MyHtmlHelper.GetDisplayList(), new { id = "_IsDisplay_Module", style = "width:216px;" })
             </div>
         </div>
         <div class="control-group">
             <label class="control-label" for="_Description_Module">描述</label>
             <div class="controls">
                 <textarea id="_Description_Module" name="Description" class="span3 easyui-validatebox" placeholder="描述" data-options="required:false" rows="4" maxlength="500"></textarea>
             </div>
         </div>
         <div class="control-group">
             <div class="controls">
                 <input id="_IsMenu_Module" value="False" name="IsMenu" type="hidden"/>
                 <input id="_ID_Module" name="ID" type="hidden" />
                 <a id="btnOK_Module" class="easyui-linkbutton" data-options="iconCls:'icon-ok'">确定</a>
                 <a id="btnRest_Module" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'">重置</a>
             </div>
         </div>
     </form>
 </div>

_AddEditModule.cshtml(模块添加编辑视图)

全局弹窗Icon选择视图如下：

 <div id="select-icon-list">
     <div class="header"><a id="select-icon-close" href="javascript:;" title="关闭">关闭</a></div>
     <div class="icon-list">
     @for (int i = 0; i <; i++)
     {
         for (int j = 0; j < 25; j++)
         {
             string icon = string.Format("t-icon-{0}-{1}", i, j);
             <a href="javascript:;" id="@icon" class="t-icon @icon"></a>
         }
     }
     @for (int i = 0; i <; i++)
     {
         string icon = string.Format("t-icon-25-{0}", i);
         <a href="javascript:;" id="@icon" class="t-icon @icon"></a>
     }
     </div>
 </div>

_Icon.cshtml(全局Icon图标选择试图)

ASP.NET MVC4 学习有几个月了，技术也就这样，还在摸索中，和大家一起慢慢成长，技术虽然很菜，但是有和大家一起分享的心；代码还有很多地方没有完善，不知道自己这样构思的权限系统能否最后实现；只有自己动手，才能检验自己所学，业余会慢慢实现，本人不善于书写，博文有所不足的，希望大家指导指导……以后代码完善了，全部打包上传……

下载地址：猛击这里