}1.角色设置权限
利用Layui.Open方法弹框显示设置界面方法如下：
-
table.on("tool(Rt)", function (obj) {//语法：table.on('event(filter)', callback); 注：event为内置事件名，filter为容器lay-filter设定的值
//alert(obj.event)
var event = obj.event;
var data = obj.data;
if (event == "修改") {//点击头部工具栏区域设定了属性为 lay-event="" 的元素时触发
//我点击了修改
}} else if (event == "删除") {
var arrays = new Array();
$(data).each(function () {
arrays.push(this.Id);
});//便利多行被选ID
var ID = arrays.join(',');
layer.confirm('真的删除么', function (xID) {//判断是否删除前的提示
xID = ID;
Del(xID);
});
} else if (event == "设置权限") {
//我点击了设置权限
alert("我点击了设置权限");
layer.open({
title: '角色权限设置',
type: 2,
area: ['500px', '300px'],//弹出层大小设置
content: '//配置控制器路径' + data.Id//需要传的参数或者数据});} - 效果如图：
- 页面利用TreeTable实现了多层显示方法如下
- 后台代码:
public JsonResult Getrolelist(Guid roleid)
{
layuiTableObj<Rrm> res = new layuiTableObj<Rrm>();//实例的工具数据模型类
OsDB db = new OsDB();//数据库上下文类
List<Guid> roleSourseIDs = db.RoleResourceModule.Where(e => e.RoleId == roleid)
.Select(e => e.ResourceModuleId).ToList();//获取ID并查出相应需要的ID集合
List<SystemResourceModule> SystemRm = db.SystemResourceModule.ToList();//实例类
List<Rrm> list = db.SystemResourceModule.Select(e => new Rrm()
{
Id = e.Id,
Code = e.Code,
Name = e.Name,
OrderNo = e.OrderNo,
Type=e.Type,
ParentId =e.ParentId??new Guid("11000000-0000-0000-0000-000000000011"),
Url=e.Url,
LAY_CHECKED1 = roleSourseIDs.Contains(e.Id)//判断是否被选中 LAY_CHECKED1 创建工具类来完成
}).ToList();
res.count = list.Count;
res.data = list;
return Json(res, JsonRequestBehavior.AllowGet);
} -
前端代码：<script>
var table;
var treetable;
layui.config({
base: '//你TreeTable js包的路径到modules即可'
}).extend({
treetable: "treetable-lay/treetable"
}).use(["treetable", "table"], function () {//这里[]可以使用多种的方法
treetable = layui.treetable;
table = layui.table;
treetable.render({
elem: "#test",//#test是你需要渲染的Table控件Id属性
url: "",//路径
cols: [[
{ type: "checkbox" },
{
title: "角色名称",
field: "Name",
},
{
title: "角色代码",
field: "Code",
}
]],
page: false,
treeColIndex: 1,
treeIdName: "Id",
treePidName: "ParentId",
treeDefaultClose: true,
treeSpid: "test",//test 需要唯一Id
treeDefaultClose: true
});
//以上参数不懂的可以去https://www.layui.com/doc/modules/layer.html#tips layui官网文档查找
})</script> - 设置时需要实现的方法如下：
- 后台代码：
public int SetRoleList(Guid roleid, List<Rrm> roles)
{
try
{
OsDB db = new OsDB();//生成数据库上下文类
List<RoleResourceModule> list = db.RoleResourceModule.Where(e => e.RoleId == roleid).ToList();//查询符合条件的集合
db.RoleResourceModule.RemoveRange(list);//删除集合
db.SaveChanges();//保存操作
List<RoleResourceModule> addlist = new List<RoleResourceModule>();
foreach (Rrm item in roles)//循环遍历
{
RoleResourceModule rrm = new RoleResourceModule();
rrm.RoleId = roleid;
rrm.ResourceModuleId = item.Id;
addlist.Add(rrm);//添加
}
db.RoleResourceModule.AddRange(addlist);//多行添加
db.SaveChanges();//保存
return 1;
}
catch (Exception)
{return 0;
}
} -
前端代码:function updateRole() {
var checkStatus = table.checkStatus('Role_table').data;
$.post("/Roleresource/SetRoleList", { "roleid":"@ViewBag.id", "roles": checkStatus }, function (data) {//@ViewBag.id是后台保存的值
if (data == 1) {
//当你在iframe页面关闭自身时
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
top.window.location.href = "/Role/Index";//页面跳转==刷新页面
} else {
alert("失败");
}
})
}
谢谢大家的观看与学习，如果有问题或者是错误请及时私信我，我会加一改正！！