分类:
.NET MVC权限
站在青春的夕阳下，感受着过往，留下浅浅的笑靥，这大概就是我们的狂欢过得青春。
今天我们主要讲解EF中 不同用户登录管理分配树形权限（充分利用了layui框架）
上一章节我们讲解了登录权限和首页显示，下面我们讲解生成树形权限并分配权限:
1,生成树形级别图,代码如下:
@*权限树形图*@
<div id="test12" class="demo-tree demo-tree-box" style="margin-top:15px;margin-left:40px"></div>
@*方法1:*@
@*@model List<Powers>
@foreach (Powers item in Model.Where(a=>a.ParentId==null))
{
<input type="checkbox" />@item.PowerType
<div style="margin-left:10px">
@foreach (var children in Model.Where(a => a.ParentId == item.Id)
{
<input type="checkbox" />@children.PowerType
}
</div>
}*@
@*方法2:引用layui样式*@
<script>
layui.use(['tree', 'util', 'form'], function () {
var tree = layui.tree
, layer = layui.layer
, util = layui.util
, form =layui.form
$.get('/Premisson/GetALLPremission_power', function (data) {
//console.log(data);
var treenode = [];
for (var i = 0; i < data.length; i++) {
if (data[i].ParentId == null) //第一级
{
var parent = {};
parent.id = data[i].Id;
parent.title = data[i].PowerType; //名字
parent.children = [];
//默认全部展开
parent.spread = true;
console.log("-------------一级开始-----------------");
for (var j = 0; j < data.length; j++) {
if (data[j].ParentId == data[i].Id) {
var children = {};
children.id = data[j].Id; //需要的是子级的Id
children.title = data[j].PowerType; //名字
parent.children.push(children);
}
}
treenode.push(parent);
console.log("-------------子级结束-----------------");
}
}
console.log(treenode);
//树形的基本演示
tree.render({
elem: '#test12'
, data: treenode
, showCheckbox: true //是否显示复选框
, id: 'demoId1'
, isJump: true //是否允许点击节点时弹出新窗口跳转
, click: function (obj) {
var data = obj.data; //获取当前点击的节点数据
layer.msg('状态：' + obj.state + '<br>节点数据：' + JSON.stringify(data));
}
});
})
后台代码: (得到权限表数据的一个集合，然后传递前台)
注意:我们第二种方法是在layui的环境下生成的，(为了样式好看，专业等考虑),效果如下:
接下来我们需要做的是不同用户登录，然后树形图默认勾选对应的权限
1，先在前台用layui样式生成用户选择框和保存按钮
2,js代码：(主要使用layui样式完成对select的监听)
//监听所有的select
form.on('select(usersel)', function (data) {
// alert(data.value);
//console.log(data.elem); //得到select原始DOM对象
//console.log(data.value); //得到被选中的值
//console.log(data.othis); //得到美化后的DOM对象
//清空以前的选择效果
//重载实例
tree.reload('demoId1', {
});
//查询选择用户的权限
$.get('/Premisson/GetPremissonById/' + data.value, function (allids) {
// console.log(allids);
//alert(allids);
tree.setChecked('demoId1', allids); //勾选指定节点
})
});
后台代码主要就是获取该用户的所有权限Id,如图:
权限的类库层（pressionDAL）
控制器编辑代码:
这样我们的用户绑定并获取权限就好啦，如图：
最后一步就是不同用户分配权限：
1，按钮事件，获取选中节点的数据Id
//按钮事件 --保存更改
util.event('lay-demo', {
getChecked: function (othis) {
var checkedData = tree.getChecked('demoId1'); //获取选中节点的数据
// layer.alert(JSON.stringify(checkedData), { shade: 0 });
console.log(checkedData);
var ids = "";
//解析json对象
for (var i = 0; i < checkedData.length; i++) {
//console.log(checkedData[i].id);
//一级Id
ids += checkedData[i].id + ",";
for (var j = 0; j < checkedData[i].children.length; j++) {
//console.log(checkedData[i].children[j].id);
//系级Id
ids += checkedData[i].children[j].id + ",";
// console.log(ids);
}
}
alert(ids);
//获取选择要权限的用户Id
//alert($("#usersel").val());
var userid = $("#usersel").val();
if (userid == null || userid == "")
{
alert("请选择需要授权的用户");
return;
}
$.post('/Premisson/SavePremisson', { userid: userid, pressionid: ids }, function (result) {
alert(result.Message);
})
}
});
注释:最后的思路是：先遍历json对象->获取权限节点id->通过post请求传到后台。后台思路：先清除该用户所有的权限->保存用户选择的所有权限
/// <summary>
///给选中的用户授权 (保存)
/// </summary>
public ActionResult SavePremisson(int? userid, string pressionid)
{
//标准化判断
ReturnValue returnValue = new ReturnValue();
if (userid == null)
{
returnValue.Code = 201;
returnValue.Message = "用户Id不能为空";
return Json(returnValue);
}
if (pressionid == null)
{
returnValue.Code = 202;
returnValue.Message = "权限不能为空";
return Json(returnValue, JsonRequestBehavior.AllowGet);
}
PremissonDAL premissonDAL = new PremissonDAL();
//先清除该用户所有的权限
premissonDAL.ClearALLPremission((int)userid);
try
{
//然后保存用户选择的所有权限
List<Power_User> pressionList = new List<Power_User>();
foreach (var item in pressionid.TrimEnd(',').Split(',')) //TrimEnd：删除最后的逗号，Split：格式化
{
pressionList.Add(new Power_User() { PowerId = Convert.ToInt32(item), UserId = userid });
}
//调添加的方法
premissonDAL.AddPremission(pressionList);
returnValue.Code = 200;
returnValue.Message = "授权成功!";
}
catch (Exception ex)
{
returnValue.Code = 500;
returnValue.Message = "内部错误:"+ex.Message;
}
return Json(returnValue);
}
现在我们的树形权限管理分配就完成啦。用户可以随意修改权限啦，效果如下:
注意:我们前台js用到的方法来自于layui框架，使用的朋友记得配置layui环境哦.
喜欢的朋友可以留言谈论哦，本次浏览希望对你的学习有帮助.
50010702506256
