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

时间:2024-08-04 15:04:32

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

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

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

菜单编辑

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

模块编辑

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

图标选择:

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

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

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

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

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

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

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

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

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

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

下载地址:猛击这里