@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>角色管理</title>
<link href="~/Content/themes/default/easyui.css" rel="stylesheet" />
<link href="~/Content/themes/icon.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.easyui.min.js"></script>
<script src="~/Scripts/easyui-lang-zh_CN.js"></script>
<script src="~/Scripts/datapattern.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script type="text/javascript">
$(function () {
$("#addDiv").css("display", "none");
$("#setActionDiv").css("display","none");
loadData();
});
function loadData(pars) {
$('#tt').datagrid({
url: '/RoleInfo/GetRoleInfoList',
title: '角色数据表格',
width: 700,
height: 400,
fitColumns: true, //列自适应
nowrap: false,
idField: 'ID',//主键列的列明
loadMsg: '正在加载角色的信息...',
pagination: true,//是否有分页
singleSelect: false,//是否单行选择
pageSize: 5,//页大小,一页多少条数据
pageNumber: 1,//当前页,默认的
pageList: [5, 10, 15],
queryParams: pars,//往后台传递参数
columns: [[//c.UserName, c.UserPass, c.Email, c.RegTime
{ field: 'ck', checkbox: true, align: 'left', width: 50 },
{ field: 'ID', title: '编号', width: 80 },
{ field: 'RoleName', title: '角色名称', width: 120 },
{ field: 'Sort', title: '排序', width: 120 },
{ field: 'Remark', title: '备注', width: 120 },
{
field: 'SubTime', title: '时间', width: 80, align: 'right',
formatter: function (value, row, index) {
return (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-M-d");
}
}
]],
toolbar: [{
id: 'btnDelete',
text: '删除',
iconCls: 'icon-remove',
handler: function () {
deleteInfo();
}
}, {
id: 'btnAdd',
text: '添加',
iconCls: 'icon-add',
handler: function () {
addInfo();
}
}, {
id: 'btnEidt',
text: '编辑',
iconCls: 'icon-edit',
handler: function () {
showEditInfo();
}
}, {
id: 'btnSetRoleAction',
text: '为角色分配权限',
iconCls: 'icon-edit',
handler: function () {
showRoleAction();
}
}],
});
}
//添加信息
function addInfo() {
//给ifrme指定页面的URL地址。
$("#addFrame").attr("src", "/RoleInfo/ShowAddInfo");
$("#addDiv").css("display", "block");
$('#addDiv').dialog({
title: '添加角色数据',
width: 300,
height: 400,
collapsible: true,
maximizable: true,
resizable: true,
modal: true,
buttons: [{
text: 'Ok',
iconCls: 'icon-ok',
handler: function () {
//提交表单
//调用子窗口的方法.
var childWindow = $("#addFrame")[0].contentWindow;//表示获取了嵌入在iframe中的子窗体的window对象。
childWindow.subForm();//调用子窗体中的方法,完成表单的提交。
}
}, {
text: 'Cancel',
handler: function () {
$('#addDiv').dialog('close');
}
}]
});
}
//添加完成后调用该方法。
function afterAdd(data) {
if (data == "ok") {
$('#addDiv').dialog('close');
$('#tt').datagrid('reload');//加载表格不会跳到第一页。
}
}
//为角色分配权限
function showRoleAction() {
//判断是否选择了一个角色.
var rows = $('#tt').datagrid('getSelections');//获取所选择的行
if (rows.length != 1) {
$.messager.alert("提示", "请选择要分配权限的角色", "error");
return;
}
//指定iframe的src.
$("#setActionFrame").attr("src", "/RoleInfo/ShowRoleAction/?id=" + rows[0].ID);
$("#setActionDiv").css("display", "block");
$('#setActionDiv').dialog({
title: '为角色分配权限数据',
width: 300,
height: 400,
collapsible: true,
maximizable: true,
resizable: true,
modal: true,
buttons: [{
text: 'Ok',
iconCls: 'icon-ok',
handler: function () {
//提交表单
//调用子窗口的方法.
var childWindow = $("#setActionFrame")[0].contentWindow;//表示获取了嵌入在iframe中的子窗体的window对象。
childWindow.subForm();//调用子窗体中的方法,完成表单的提交。
}
}, {
text: 'Cancel',
handler: function () {
$('#setActionDiv').dialog('close');
}
}]
});
}
//为角色分配完成权限后调用该方法
function afterSet(data) {
if (data == "ok") {
$('#setActionDiv').dialog('close');
}
}
</script>
</head>
<body>
<div>
<table id="tt" style="width: 700px;" title="标题,可以使用代码进行初始化,也可以使用这种属性的方式" iconcls="icon-edit">
</table>
</div>
<!------------添加表单------------------>
<div id="addDiv">
<iframe id="addFrame" width="100%" height="100%" frameborder="0"></iframe>
</div>
<!------------添加表单------------------>
<div id="setActionDiv">
<iframe id="setActionFrame" width="100%" height="100%" frameborder="0"></iframe>
</div>
</body>
</html>