ASP.NET MVC4+EasyUI+EntityFrameWork5权限管理系统——菜单模块的实现（二）
ASP.NET MVC4+EasyUI+EntityFrameWork5权限管理系统——数据库的设计（一）
菜单和模块是在同一个表中，采用的是树形结构，模块菜单表结构如下代码：
1 USE [Permission] 2 GO 3 4 /****** Object: Table [dbo].[Permission_Modules] Script Date: 11/21/2013 17:06:55 ******/ 5 SET ANSI_NULLS ON 6 GO 7 8 SET QUOTED_IDENTIFIER ON 9 GO 10 11 SET ANSI_PADDING ON 12 GO 13 14 CREATE TABLE [dbo].[Permission_Modules]( 15 [ID] [int] IDENTITY(1,1) NOT NULL, 16 [Name] [nvarchar](20) NOT NULL, 17 [ParentID] [int] NOT NULL, 18 [Icon] [varchar](20) NOT NULL, 19 [Url] [nvarchar](500) NULL, 20 [Sort] [int] NOT NULL, 21 [IsDisplay] [bit] NOT NULL, 22 [IsDelete] [bit] NOT NULL, 23 [Authority] [int] NOT NULL, 24 [IsMenu] [bit] NOT NULL, 25 [AddUserID] [int] NOT NULL, 26 [UpdateUserID] [int] NULL, 27 [AddDate] [datetime] NOT NULL, 28 [LastUpdate] [datetime] NULL, 29 [Description] [nvarchar](500) NULL, 30 CONSTRAINT [PK_Module] PRIMARY KEY CLUSTERED 31 ( 32 [ID] ASC 33 )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY] 34 ) ON [PRIMARY] 35 36 GO 37 38 SET ANSI_PADDING OFF 39 GO 40 41 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' 42 GO 43 44 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' 45 GO 46 47 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' 48 GO 49 50 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' 51 GO 52 53 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' 54 GO 55 56 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' 57 GO 58 59 ALTER TABLE [dbo].[Permission_Modules] WITH CHECK ADD CONSTRAINT [FK_Module_Permission_User] FOREIGN KEY([AddUserID]) 60 REFERENCES [dbo].[Permission_User] ([ID]) 61 GO 62 63 ALTER TABLE [dbo].[Permission_Modules] CHECK CONSTRAINT [FK_Module_Permission_User] 64 GO 65 66 ALTER TABLE [dbo].[Permission_Modules] WITH CHECK ADD CONSTRAINT [FK_Module_Permission_User1] FOREIGN KEY([UpdateUserID]) 67 REFERENCES [dbo].[Permission_User] ([ID]) 68 GO 69 70 ALTER TABLE [dbo].[Permission_Modules] CHECK CONSTRAINT [FK_Module_Permission_User1] 71 GO
菜单模块的实现，两种菜单，方便操作，先看整体结构图
菜单编辑
模块编辑
图标选择：
菜单是树形结构，我控制器中应该使用递归绑定的方式绑定，一下子没写出来，就自己嵌套了3层写死了，不知道大家有没有好的方法，我不想再定义拼接字符的方式去实现，有好的办法请提示一下，我现有写死的三层代码如下方法：
1 public JsonResult Tree() 2 { 3 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(); 4 var list1 = modules.Where(p => p.ParentID == 0).ToList(); 5 list1.Insert(0, new { ModeuleID = 0, Name = "请选择", ParentID = 0 }); 6 var list2 = modules.Where(p => p.ParentID != 0).ToList(); 7 var result = list1.Select(p => new 8 { 9 id = p.ModeuleID, 10 text = p.Name, 11 children = list2.Where(p1 => p1.ParentID == p.ModeuleID).Select(p1 => new 12 { 13 id = p1.ModeuleID, 14 text = p1.Name, 15 children = list2.Where(p2 => p2.ParentID == p1.ModeuleID).Select(p2 => new 16 { 17 id = p2.ModeuleID, 18 text = p2.Name, 19 children = list2.Where(p3 => p3.ParentID == p2.ModeuleID).Select(p3 => new 20 { 21 id = p3.ModeuleID, 22 text = p3.Name 23 }).ToList() 24 }).ToList() 25 }).ToList() 26 }); 27 var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet }; 28 return json; 29 }
这种代码看了就不爽，大家帮我写下吧……
每一个模块都会有一个权重，这个权重是一个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都加载到了主页面中，下图就是视图结构图
模块菜单控制器代码如下：
1 using System; 2 using System.Linq; 3 using System.Web; 4 using System.Web.Mvc; 5 using System.Collections.Generic; 6 7 using Mydream.Permission.Entity; 8 using Mydream.Permission.BLL; 9 using Mydream.Permission.Common; 10 using Mydream.Permission.Model; 11 12 namespace Mydream.Permission.Web.Controllers 13 { 14 public class ModuleController : BaseController 15 { 16 private readonly ModuleBLL _ModuleBLL = new ModuleBLL(); 17 public ActionResult Index() 18 { 19 return View(); 20 } 21 22 [HttpPost] 23 public JsonResult Search() 24 { 25 IQueryable<Permission_Modules> query = _ModuleBLL.Where(p => p.IsDelete == false); 26 var list = query.Select(p => new 27 { 28 ID = p.ID, 29 Name = p.Name, 30 _parentId = p.ParentID, 31 iconCls = "t-icon " + p.Icon, 32 Url = p.Url, 33 Sort = p.Sort, 34 IsDisplay = p.IsDisplay, 35 Authority = p.Authority, 36 IsMenu = p.IsMenu, 37 AddUserName = p.Permission_User.UserName, 38 UpdateUserName = p.Permission_User1.UserName, 39 AddDate = p.AddDate, 40 LastUpdate = p.LastUpdate, 41 Description = p.Description 42 }).ToList(); 43 return new JsonResult { Data = new { total = list.Count, rows = list }, JsonRequestBehavior = JsonRequestBehavior.AllowGet }; 44 } 45 46 [HttpPost] 47 public JsonResult Add() 48 { 49 Permission_Modules model = Request.Form.ToModel<Permission_Modules>("Authority"); 50 model.AddUserID = base.UserID; 51 model.AddDate = DateTime.Now; 52 model.Authority = model.IsMenu ? 0 : (Request.Form["Authority"] ?? string.Empty).ToOrSum(); 53 bool result = _ModuleBLL.Add(model); 54 string message = string.Format("{0}添加{1}", model.IsMenu ? "菜单" : "模块", result ? "成功" : "失败"); 55 var json = new { success = result, message = message }; 56 return Json(json, "json"); 57 } 58 59 [HttpPost] 60 public JsonResult Edit() 61 { 62 Permission_Modules model = Request.Form.ToModel<Permission_Modules>("Authority"); 63 Permission_Modules entity = _ModuleBLL.GetEntityByID(model.ID); 64 entity.UpdateUserID = base.UserID; 65 entity.LastUpdate = DateTime.Now; 66 entity.Name = model.Name; 67 entity.ParentID = model.ParentID; 68 entity.Url = model.Url; 69 entity.Icon = model.Icon; 70 entity.Sort = model.Sort; 71 entity.Authority = entity.IsMenu ? 0 : (Request.Form["Authority"] ?? string.Empty).ToOrSum(); 72 entity.IsDisplay = model.IsDisplay; 73 entity.Description = model.Description; 74 bool result = _ModuleBLL.Update(entity); 75 string message = string.Format("{0}编辑{1}", entity.IsMenu ? "菜单" : "模块", result ? "成功" : "失败"); 76 var json = new { success = result, message = message }; 77 return Json(json, "json"); 78 } 79 80 public JsonResult Edit(int ID) 81 { 82 var result = _ModuleBLL.Where(p => p.ID == ID).Select(p => new 83 { 84 ID = p.ID, 85 Name = p.Name, 86 Icon = p.Icon, 87 Url = p.Url, 88 ParentID = p.ParentID, 89 Sort = p.Sort, 90 IsDisplay = p.IsDisplay, 91 Description = p.Description 92 }).Single(); 93 var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet }; 94 return json; 95 } 96 97 #region 不在功能枚举中的Action或方法 98 public JsonResult Tree() 99 { 100 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(); 101 var list1 = modules.Where(p => p.ParentID == 0).ToList(); 102 list1.Insert(0, new { ID = 0, Name = "请选择", ParentID = 0 }); 103 var list2 = modules.Where(p => p.ParentID != 0).ToList(); 104 var result = list1.Select(p => new 105 { 106 id = p.ID, 107 text = p.Name, 108 children = list2.Where(p1 => p1.ParentID == p.ID).Select(p1 => new 109 { 110 id = p1.ID, 111 text = p1.Name, 112 children = list2.Where(p2 => p2.ParentID == p1.ID).Select(p2 => new 113 { 114 id = p2.ID, 115 text = p2.Name, 116 children = list2.Where(p3 => p3.ParentID == p2.ID).Select(p3 => new 117 { 118 id = p3.ID, 119 text = p3.Name 120 }).ToList() 121 }).ToList() 122 }).ToList() 123 }); 124 var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet }; 125 return json; 126 } 127 128 public JsonResult AuthorityTree(int ID) 129 { 130 int authority = 0; 131 if (ID != 0) 132 { 133 authority = _ModuleBLL.Where(p => p.ID == ID).Select(p => p.Authority).Single(); 134 } 135 IDictionary<int, string> dicts = new Dictionary<int, string>(); 136 dicts.Add(1, "浏览"); 137 dicts.Add(2, "添加"); 138 dicts.Add(4, "编辑"); 139 dicts.Add(8, "删除"); 140 dicts.Add(16, "搜索"); 141 dicts.Add(32, "审核"); 142 dicts.Add(64, "移动"); 143 dicts.Add(128, "打印"); 144 dicts.Add(256, "下载"); 145 dicts.Add(512, "备份"); 146 dicts.Add(1024, "授权"); 147 dicts.Add(2048, "查看详细"); 148 dicts.Add(4096, "导出"); 149 var result = dicts.Select(p => new 150 { 151 id = p.Key, 152 text = p.Value, 153 @checked = ID != 0 && authority != 0 && ((p.Key & authority) == p.Key) 154 }).ToList(); 155 var json = new JsonResult { Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet }; 156 return json; 157 } 158 #endregion 159 } 160 }
主页面Html代码如下：
1 @{ 2 ViewBag.Title = "菜单管理"; 3 string _ControllerName = "Module"; 4 } 5 <div id="treegrid"></div> 6 <div id="toolbar" class="z-toolbar" style="background: #f4f4f4;"> 7 <a id="btnAddMenu" href="javascript:;" class="easyui-linkbutton" title="新增菜单" data-options="iconCls:'icon-add',plain:true">新增菜单</a> 8 <a id="btnAddModule" href="javascript:;" class="easyui-linkbutton" title="新增模块" data-options="iconCls:'icon-add',plain:true">新增模块</a> 9 <a id="btnDelete" href="javascript:;" class="easyui-linkbutton" title="删除" data-options="iconCls:'icon-remove',plain:true">删除</a> 10 <a id="btnEdit" href="javascript:;" class="easyui-linkbutton" title="编辑" data-options="iconCls:'icon-edit',plain:true">编辑</a> 11 <a href="javascript:;" class="easyui-splitbutton" title="展开" data-options="menu:'#dropdown',iconCls:'icon-collapse',plain:true">展开</a> 12 <a id="btnReload" href="javascript:;" class="easyui-linkbutton" title="刷新" data-options="iconCls:'icon-reload',plain:'true'">刷新</a> 13 </div> 14 <div id="dropdown"> 15 <div id="btnCollapseAll" data-options="iconCls:'t-icon t-icon-12-18'">全部折叠</div> 16 <div id="btnExpandAll" data-options="iconCls:'t-icon t-icon-13-18'">全部展开</div> 17 </div> 18 <div id="treegrid-menu" class="easyui-menu"> 19 <div id="treegrid-add-menu" data-options="iconCls:'icon-add'" title="新增菜单">新增菜单</div> 20 <div id="treegrid-add-module" data-options="iconCls:'icon-add'" title="新增模块">新增模块</div> 21 <div id="treegrid-delete" data-options="iconCls:'icon-remove'" title="删除">删除</div> 22 <div id="treegrid-edit" data-options="iconCls:'icon-edit'" title="编辑">编辑</div> 23 <div id="treegrid-expand" data-options="iconCls:'icon-collapse'" title="展开"> 24 <span>展开</span> 25 <div style="width: 150px;"> 26 <div id="treegrid-collapseAll" data-options="iconCls:'t-icon t-icon-12-18'">全部折叠</div> 27 <div id="treegrid-expandAll" data-options="iconCls:'t-icon t-icon-13-18'">全部展开</div> 28 </div> 29 </div> 30 <div class="menu-sep"></div> 31 <div id="treegrid-reload" data-options="iconCls:'icon-reload'" title="刷新">刷新</div> 32 </div> 33 @Html.Partial("_AddEditMenu") 34 @Html.Partial("_AddEditModule") 35 @Html.Partial("_Icon") 36 @section JS{ 37 <script type="text/javascript"> 38 $(document).ready(function () { 39 var _rowData; 40 $treeGrid = $('#treegrid'); 41 $treeGrid.treegrid({ 42 state: 'open', 43 idField: 'ID', 44 treeField: 'Name', 45 url: '@Url.Action("Search", _ControllerName)', 46 border: false, 47 fitColumns: false, 48 title: '菜单管理', 49 iconCls: 't-icon t-icon-nav', 50 rownumbers: true, 51 animate: true, 52 fit: true, 53 fixed: false, 54 singleSelect: true, 55 toolbar: '#toolbar', 56 frozenColumns: [[ 57 { field: 'ck', checkbox: true, align: 'center', width: 20 }, 58 { title: '菜单名称', field: 'Name', width: '200', align: 'left' }, 59 { title: '链接地址', field: 'Url', width: '120', align: 'left' }, 60 { title: '排序', field: 'Sort', width: '50', align: 'center' }, 61 { 62 title: '显示', field: 'IsDisplay', width: '50', align: 'center', 63 formatter: function (value) { 64 return Common.formatBoolean(value); 65 } 66 }, 67 { 68 title: '菜单', field: 'IsMenu', width: '60', align: 'center', 69 formatter: function (value) { 70 return Common.formatBoolean(value); 71 } 72 }, 73 { title: '权重', field: 'Authority', width: '50', align: 'center' } 74 ]], 75 columns: [[ 76 { title: '添加人', field: 'AddUserName', width: '80', align: 'center' }, 77 { title: '最后更新人', field: 'UpdateUserName', width: '80', align: 'center' }, 78 { 79 title: '添加时间', field: 'AddDate', width: '100', align: 'center', 80 formatter: function (value) { 81 return Common.formatDate(value); 82 } 83 }, 84 { 85 title: '最后更新时间', field: 'LastUpdate', width: '100', align: 'center', 86 formatter: function (value) { 87 return Common.formatDate(value); 88 } 89 }, 90 { title: '描述', field: 'Description', width: '220', align: 'center' } 91 ]], 92 onContextMenu: onRowContextMenu 93 }); 94 //新增菜单 95 $('#btnAddMenu,#treegrid-add-menu').on('click', function () { 96 $('#frmAddEditMenu')[0].reset(); 97 $('#_ID_Menu').val('0'); 98 $('#_ParentID_Menu').combotree({ url: '@Url.Action("Tree", "Module")' }).combotree('setValue', 0); 99 $('#AddEditMenu').window({ 100 iconCls: 'icon-add', 101 title: '添加菜单' 102 }).window('open'); 103 }); 104 //新增模块 105 $('#btnAddModule,#treegrid-add-module').on('click', function () { 106 $('#frmAddEditModule')[0].reset(); 107 $('#_ID_Module').val('0'); 108 $('#_ParentID_Module').combotree({ url: '@Url.Action("Tree", "Module")' }).combotree('setValue', 0); 109 $('#AddEditModule').window({ 110 iconCls: 'icon-add', 111 title: '添加菜单' 112 }).window('open'); 113 }); 114 //新增菜单 115 $('#treegrid-edit').on('click', function () { 116 if (_rowData['IsMenu']) { //菜单 117 EditMenu(_rowData['ID']); 118 } else { //模块 119 EditModule(_rowData['ID']); 120 } 121 }); 122 $('#btnEdit').on('click', function () { 123 var selecteds = $treeGrid.treegrid('getSelections'); 124 if (Common.isEmptyObject(selecteds)) { 125 $.messager.alert('提示', '请选中一条数据编辑！', 'warning'); 126 } else if (selecteds.length > 1) { 127 $.messager.alert('提示', '请只选中一条数据编辑！', 'warning'); 128 } else { 129 if (selecteds[0].IsMenu) { 130 EditMenu(selecteds[0].ID); 131 } 132 else { 133 EditModule(selecteds[0].ID) 134 } 135 } 136 }); 137 //全部折叠 138 $('#btnCollapseAll,#treegrid-collapseAll').on('click', function () { 139 $treeGrid.treegrid('collapseAll'); 140 }); 141 //全部展开 142 $('#btnExpandAll,#treegrid-expandAll').on('click', function () { 143 $treeGrid.treegrid('expandAll'); 144 }); 145 //刷新 146 $('#btnReload,#treegrid-reload').on('click', function () { 147 $treeGrid.treegrid('load'); 148 }); 149 //添加右击菜单内容 150 function onRowContextMenu(e, row) { 151 e.preventDefault(); 152 _rowData = row; 153 $('#treegrid-menu').menu('show', { 154 left: e.pageX, 155 top: e.pageY 156 }); 157 } 158 //编辑菜单 159 function EditMenu(id) { 160 $.get('@Url.Action("Edit", _ControllerName)/' + id, 161 function (data) { 162 $('#frmAddEditMenu').form('load', data); 163 $('#_Icon_Menu').siblings().find('a').addClass(data.Icon); 164 var isDisplay = data.IsDisplay ? 'True' : 'False'; 165 $('#_IsDisplay_Menu').val(isDisplay); 166 }); 167 $('#AddEditMenu').window({ 168 iconCls: 'icon-edit', 169 title: '编辑菜单' 170 }).window('open'); 171 } 172 //编辑模块 173 function EditModule(id) { 174 $.get('@Url.Action("Edit", _ControllerName)/' + id, 175 function (data) { 176 $('#frmAddEditModule').form('load', data); 177 $('#_Icon_Module').siblings().find('a').addClass(data.Icon); 178 var isDisplay = data.IsDisplay ? 'True' : 'False'; 179 $('#_IsDisplay_Module').val(isDisplay); 180 }); 181 //编辑默认选中 182 $('#_Authority_Module').combotree({ 183 url: '@Url.Action("AuthorityTree", _ControllerName)/' + id 184 }); 185 $('#AddEditModule').window({ 186 iconCls: 'icon-edit', 187 title: '编辑模块' 188 }).window('open'); 189 } 190 //菜单表单 191 SubmitForm('Menu'); 192 //模块表单 193 SubmitForm('Module'); 194 Common.getIcon('_Icon_Menu'); 195 Common.getIcon('_Icon_Module'); 196 //提交表单 197 function SubmitForm(flag) { 198 $('#btnRest_' + flag + '').on('click', function () { 199 $('#frmAddEdit' + flag + '')[0].reset(); 200 }); 201 $('#btnOK_' + flag + '').on('click', function () { 202 var action = $('#_ID_' + flag + '').val() == '0' ? 'Add' : 'Edit'; 203 if ($('#frmAddEdit' + flag + '').form('validate')) { 204 $.ajax({ 205 type: 'post', 206 data: $('#frmAddEdit' + flag + '').serialize(), 207 url: '/@_ControllerName/' + action, 208 success: function (data) { 209 if (data.success) { 210 $.messager.alert('提示', data.message, 'info', function () { 211 $('#AddEdit' + flag + '').window('close'); 212 }); 213 $treeGrid.treegrid('load'); 214 } else { 215 $.messager.alert('错误', data.message, 'error'); 216 } 217 }, 218 error: function () { 219 $.messager.alert('提示', '数据提交失败', 'info'); 220 } 221 }); 222 } 223 }); 224 } 225 }); 226 </script> 227 }
局部分部视图（菜单表单和模块表单）图如下：
1 <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;"> 2 <form id="frmAddEditMenu" class="form-horizontal" method="post"> 3 <div class="control-group"> 4 <label class="control-label" for="_Name_Menu">菜单名称</label> 5 <div class="controls"> 6 <input name="Name" id="_Name_Menu" class="span3 easyui-validatebox" placeholder="菜单名称" maxlength="20" type="text" data-options="required:true" /> 7 </div> 8 </div> 9 <div class="control-group"> 10 <label class="control-label" for="_Icon_Menu">ICON</label> 11 <div class="controls"> 12 <input name="Icon" id="_Icon_Menu" class="span3 easyui-validatebox" placeholder="ICON" type="text" data-options="required:true,missingMessage: '此输入项为必输项，请选择图标'" style="width:180px;"/> 13 <span class="help-inline"><a class="t-icon" style="width:18px;height:18px;"></a></span> 14 </div> 15 </div> 16 <div class="input-prepend inline"> 17 <label class="control-label" for="_ParentID_Menu">上级菜单</label> 18 <div class="controls"> 19 <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;"/> 20 </div> 21 </div> 22 <div class="control-group"> 23 <label class="control-label" for="_Sort_Menu">排序</label> 24 <div class="controls"> 25 <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;" /> 26 </div> 27 </div> 28 <div class="input-prepend inline"> 29 <label class="control-label" for="_IsDisplay_Menu">是否显示</label> 30 <div class="controls"> 31 @Html.DropDownList("IsDisplay", MyHtmlHelper.GetDisplayList(), new { id = "_IsDisplay_Menu", style = "width:216px;" }) 32 </div> 33 </div> 34 <div class="control-group"> 35 <label class="control-label" for="_Description_Menu">描述</label> 36 <div class="controls"> 37 <textarea id="_Description_Menu" name="Description" class="span3 easyui-validatebox" placeholder="描述" data-options="required:false" rows="4" maxlength="500"></textarea> 38 </div> 39 </div> 40 <div class="control-group"> 41 <div class="controls"> 42 <input id="_IsMenu_Menu" value="True" name="IsMenu" type="hidden" /> 43 <input id="_ID_Menu" name="ID" type="hidden" /> 44 <a id="btnOK_Menu" class="easyui-linkbutton" data-options="iconCls:'icon-ok'">确定</a> 45 <a id="btnRest_Menu" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'">重置</a> 46 </div> 47 </div> 48 </form> 49 </div>
1 <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;"> 2 <form id="frmAddEditModule" class="form-horizontal" method="post"> 3 <div class="control-group"> 4 <label class="control-label" for="_Name_Module">模块名称</label> 5 <div class="controls"> 6 <input name="Name" id="_Name_Module" class="span3 easyui-validatebox" placeholder="模块名称" maxlength="20" type="text" data-options="required:true" /> 7 </div> 8 </div> 9 <div class="control-group"> 10 <label class="control-label" for="_Icon_Module">ICON</label> 11 <div class="controls"> 12 <input name="Icon" id="_Icon_Module" class="span3 easyui-validatebox" placeholder="ICON" type="text" data-options="required:true,missingMessage: '此输入项为必输项，请选择图标'" style="width:180px;"/> 13 <span class="help-inline"><a class="t-icon" style="width:18px;height:18px;"></a></span> 14 </div> 15 </div> 16 <div class="input-prepend inline"> 17 <label class="control-label" for="_Authority_Module">模块权限</label> 18 <div class="controls"> 19 <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;"/> 20 </div> 21 </div> 22 <div class="input-prepend inline"> 23 <label class="control-label" for="_ParentID_Module">上级菜单</label> 24 <div class="controls"> 25 <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;"/> 26 </div> 27 </div> 28 <div class="control-group"> 29 <label class="control-label" for="_Url_Module">URL</label> 30 <div class="controls"> 31 <input name="Url" id="_Url_Module" class="span3 easyui-validatebox" placeholder="URL" type="text" data-options="required:true" /> 32 </div> 33 </div> 34 <div class="control-group"> 35 <label class="control-label" for="_Sort_Module">排序</label> 36 <div class="controls"> 37 <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;" /> 38 </div> 39 </div> 40 <div class="input-prepend inline"> 41 <label class="control-label" for="_IsDisplay_Module">是否显示</label> 42 <div class="controls"> 43 @Html.DropDownList("IsDisplay", MyHtmlHelper.GetDisplayList(), new { id = "_IsDisplay_Module", style = "width:216px;" }) 44 </div> 45 </div> 46 <div class="control-group"> 47 <label class="control-label" for="_Description_Module">描述</label> 48 <div class="controls"> 49 <textarea id="_Description_Module" name="Description" class="span3 easyui-validatebox" placeholder="描述" data-options="required:false" rows="4" maxlength="500"></textarea> 50 </div> 51 </div> 52 <div class="control-group"> 53 <div class="controls"> 54 <input id="_IsMenu_Module" value="False" name="IsMenu" type="hidden"/> 55 <input id="_ID_Module" name="ID" type="hidden" /> 56 <a id="btnOK_Module" class="easyui-linkbutton" data-options="iconCls:'icon-ok'">确定</a> 57 <a id="btnRest_Module" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'">重置</a> 58 </div> 59 </div> 60 </form> 61 </div>
全局弹窗Icon选择视图如下：
1 <div id="select-icon-list"> 2 <div class="header"><a id="select-icon-close" href="javascript:;" title="关闭">关闭</a></div> 3 <div class="icon-list"> 4 @for (int i = 0; i < 20; i++) 5 { 6 for (int j = 0; j < 25; j++) 7 { 8 string icon = string.Format("t-icon-{0}-{1}", i, j); 9 <a href="javascript:;" id="@icon" class="t-icon @icon"></a> 10 } 11 } 12 @for (int i = 0; i < 14; i++) 13 { 14 string icon = string.Format("t-icon-25-{0}", i); 15 <a href="javascript:;" id="@icon" class="t-icon @icon"></a> 16 } 17 </div> 18 </div>
ASP.NET MVC4 学习有几个月了，技术也就这样，还在摸索中，和大家一起慢慢成长，技术虽然很菜，但是有和大家一起分享的心；代码还有很多地方没有完善，不知道自己这样构思的权限系统能否最后实现；只有自己动手，才能检验自己所学，业余会慢慢实现，本人不善于书写，博文有所不足的，希望大家指导指导……以后代码完善了，全部打包上传……
下载地址：猛击这里
