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
Permission_Modules.sql

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

菜单编辑

模块编辑

图标选择:

菜单是树形结构,我控制器中应该使用递归绑定的方式绑定,一下子没写出来,就自己嵌套了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         }
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都加载到了主页面中,下图就是视图结构图

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

  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 }
ModuleController.cs

主页面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=" 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',  20 },
 58                     { title: '菜单名称', field: 'Name',  '200', align: 'left' },
 59                     { title: '链接地址', field: 'Url',  '120', align: 'left' },
 60                     { title: '排序', field: 'Sort',  '50', align: 'center' },
 61                     {
 62                         title: '显示', field: 'IsDisplay',  '50', align: 'center',
 63                         formatter: function (value) {
 64                             return Common.formatBoolean(value);
 65                         }
 66                     },
 67                     {
 68                         title: '菜单', field: 'IsMenu',  '60', align: 'center',
 69                         formatter: function (value) {
 70                             return Common.formatBoolean(value);
 71                         }
 72                     },
 73                     { title: '权重', field: 'Authority',  '50', align: 'center' }
 74                 ]],
 75                 columns: [[
 76                     { title: '添加人', field: 'AddUserName',  '80', align: 'center' },
 77                     { title: '最后更新人', field: 'UpdateUserName',  '80', align: 'center' },
 78                     {
 79                         title: '添加时间', field: 'AddDate',  '100', align: 'center',
 80                         formatter: function (value) {
 81                             return Common.formatDate(value);
 82                         }
 83                     },
 84                     {
 85                         title: '最后更新时间', field: 'LastUpdate',  '100', align: 'center',
 86                         formatter: function (value) {
 87                             return Common.formatDate(value);
 88                         }
 89                     },
 90                     { title: '描述', field: 'Description',  '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 }
Index.cshtml

局部分部视图(菜单表单和模块表单)图如下:

 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;  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="180px;"/>
13                 <span class="help-inline"><a class="t-icon" style="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="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=" 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 = "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>
_AddEditMenu.cshtml(菜单添加编辑视图)
 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;  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="180px;"/>
13                 <span class="help-inline"><a class="t-icon" style="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="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="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=" 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 = "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>
_AddEditModule.cshtml(模块添加编辑视图)

全局弹窗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>
_Icon.cshtml(全局Icon图标选择试图)

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

下载地址:猛击这里

原文地址:https://www.cnblogs.com/cmsdn/p/3433995.html