fixed:role.html
bobi
parent
aa98c0fc57
commit
a4b83c9f1b
|
|
@ -59,10 +59,10 @@
|
||||||
bobi
|
bobi
|
||||||
</a>
|
</a>
|
||||||
<dl id="userInfo" class="layui-nav-child">
|
<dl id="userInfo" class="layui-nav-child">
|
||||||
<dd><a lay-id="u-1" href="javascript:" data-url="pages/user/user.html">个人中心<span
|
<dd><a lay-id="u-1" href="javascript:" data-url="pages/member/user.html">个人中心<span
|
||||||
class="layui-badge-dot"></span></a></dd>
|
class="layui-badge-dot"></span></a></dd>
|
||||||
<dd><a lay-id="u-2" href="javascript:" data-url="pages/user/user-info.html">基本资料</a></dd>
|
<dd><a lay-id="u-2" href="javascript:" data-url="pages/member/user-info.html">基本资料</a></dd>
|
||||||
<dd><a lay-id="u-3" href="javascript:" data-url="pages/user/changePwd.html">安全设置</a></dd>
|
<dd><a lay-id="u-3" href="javascript:" data-url="pages/member/changePwd.html">安全设置</a></dd>
|
||||||
<dd>
|
<dd>
|
||||||
<hr/>
|
<hr/>
|
||||||
</dd>
|
</dd>
|
||||||
|
|
|
||||||
|
|
@ -4,20 +4,18 @@
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>添加角色</title>
|
<title>添加角色</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
|
<link rel="stylesheet" href="../../css/sub.css">
|
||||||
<link rel="stylesheet" href="../../css/scroll-bar.css">
|
|
||||||
<link rel="stylesheet" href="../../css/sub-page.css">
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="ok-body">
|
<div class="ok-body">
|
||||||
<!--面包屑导航区域-->
|
<!--面包屑导航区域-->
|
||||||
<div class="ok-body-breadcrumb">
|
<div class="ok-body-breadcrumb">
|
||||||
<span class="layui-breadcrumb">
|
<span class="layui-breadcrumb">
|
||||||
<a><cite>首页</cite></a>
|
<a><cite>首页</cite></a>
|
||||||
<a><cite>常用页面</cite></a>
|
<a><cite>会员管理</cite></a>
|
||||||
<a><cite>用户列表</cite></a>
|
<a><cite>角色列表</cite></a>
|
||||||
<a><cite>添加角色</cite></a>
|
<a><cite>添加角色</cite></a>
|
||||||
</span>
|
</span>
|
||||||
<a class="layui-btn layui-btn-sm" href="javascript:location.replace(location.href);" title="刷新">
|
<a class="layui-btn layui-btn-sm" href="javascript:location.replace(location.href);" title="刷新">
|
||||||
<i class="layui-icon layui-icon-refresh"></i>
|
<i class="layui-icon layui-icon-refresh"></i>
|
||||||
</a>
|
</a>
|
||||||
|
|
@ -39,7 +37,7 @@
|
||||||
<div class="layui-form-item">
|
<div class="layui-form-item">
|
||||||
<label class="layui-form-label">权限</label>
|
<label class="layui-form-label">权限</label>
|
||||||
<div class="layui-input-block">
|
<div class="layui-input-block">
|
||||||
<div id="authTree"></div>
|
<div id="permissionTree"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="layui-form-item">
|
<div class="layui-form-item">
|
||||||
|
|
@ -52,22 +50,33 @@
|
||||||
</div>
|
</div>
|
||||||
<!--js逻辑-->
|
<!--js逻辑-->
|
||||||
<script src="../../lib/layui/layui.js"></script>
|
<script src="../../lib/layui/layui.js"></script>
|
||||||
<script>
|
<script type="text/javascript">
|
||||||
layui.config({
|
layui.use(["element", "form", "tree", "okLayer", "okUtils"], function () {
|
||||||
base: 'lib/layui/lay/modules/authtree/'
|
|
||||||
}).extend({
|
|
||||||
authtree: 'authtree',
|
|
||||||
});
|
|
||||||
|
|
||||||
layui.use(['element', 'form', 'jquery'], function () {
|
|
||||||
var element = layui.element;
|
|
||||||
var form = layui.form;
|
var form = layui.form;
|
||||||
var $ = layui.jquery;
|
var tree = layui.tree;
|
||||||
|
var okLayer = layui.okLayer;
|
||||||
|
var okUtils = layui.okUtils;
|
||||||
|
|
||||||
form.on('submit(add)', function (data) {
|
var data = [{"title":"根目录","spread":true,"children":[{"title":"会员管理","spread":true,"children":[{"title":"用户管理","spread":true,"children":[{"title":"添加用户"},{"title":"编辑用户"},{"title":"删除用户"}]},{"title":"角色管理","spread":true,"children":[{"title":"添加角色"},{"title":"编辑角色"},{"title":"删除角色"}]},{"title":"权限管理","spread":true,"children":[{"title":"添加权限"},{"title":"编辑权限"},{"title":"删除权限"}]}]}]}];
|
||||||
console.log(data.field);
|
|
||||||
layer.msg("添加成功！", {icon: 6, time: 1000, anim: 4}, function () {
|
tree.render({
|
||||||
parent.layer.close(parent.layer.getFrameIndex(window.name));
|
elem: "#permissionTree",
|
||||||
|
// data: okUtils.mockApi.permission.list,
|
||||||
|
data: data,
|
||||||
|
showCheckbox: true
|
||||||
|
});
|
||||||
|
|
||||||
|
form.on("submit(add)", function (data) {
|
||||||
|
// TODO 权限节点校验
|
||||||
|
|
||||||
|
// 请求后台
|
||||||
|
okUtils.ajax("/role/add", "post", data.field).done(function (response) {
|
||||||
|
console.log(response)
|
||||||
|
okLayer.msg.greenTick("添加成功", function () {
|
||||||
|
parent.layer.close(parent.layer.getFrameIndex(window.name));
|
||||||
|
});
|
||||||
|
}).fail(function (error) {
|
||||||
|
console.log(error)
|
||||||
});
|
});
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -4,9 +4,7 @@
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>编辑角色</title>
|
<title>编辑角色</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
|
<link rel="stylesheet" href="../../css/sub.css">
|
||||||
<link rel="stylesheet" href="../../css/scroll-bar.css">
|
|
||||||
<link rel="stylesheet" href="../../css/sub-page.css">
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="ok-body">
|
<div class="ok-body">
|
||||||
|
|
@ -39,6 +37,7 @@
|
||||||
<div class="layui-form-item">
|
<div class="layui-form-item">
|
||||||
<label class="layui-form-label">权限</label>
|
<label class="layui-form-label">权限</label>
|
||||||
<div class="layui-input-block">
|
<div class="layui-input-block">
|
||||||
|
<!-- TODO -->
|
||||||
<div id="authTree"></div>
|
<div id="authTree"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -4,10 +4,7 @@
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>角色列表</title>
|
<title>角色列表</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
|
|
||||||
<link rel="stylesheet" href="../../css/scroll-bar.css">
|
|
||||||
<link rel="stylesheet" href="../../css/sub.css">
|
<link rel="stylesheet" href="../../css/sub.css">
|
||||||
<link rel="stylesheet" href="../../lib/nprogress/nprogress.css">
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="ok-body">
|
<div class="ok-body">
|
||||||
|
|
@ -33,153 +30,122 @@
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<!--工具栏-->
|
|
||||||
<okToolbar>
|
|
||||||
<button class="layui-btn layui-btn-danger" id="batchDel">
|
|
||||||
<i class="layui-icon layui-icon-delete"></i>批量删除
|
|
||||||
</button>
|
|
||||||
<button class="layui-btn" id="addRole">
|
|
||||||
<i class="layui-icon"></i>添加角色
|
|
||||||
</button>
|
|
||||||
<span>共有数据：<i id="countNum"></i> 条</span>
|
|
||||||
</okToolbar>
|
|
||||||
<!--数据表格-->
|
<!--数据表格-->
|
||||||
<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
|
<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
|
||||||
</div>
|
</div>
|
||||||
<!--js逻辑-->
|
<!--js逻辑-->
|
||||||
<script src="../../lib/layui/layui.js"></script>
|
<script src="../../lib/layui/layui.js"></script>
|
||||||
<script src="../../lib/nprogress/nprogress.js"></script>
|
|
||||||
<script>
|
<script>
|
||||||
NProgress.start();
|
layui.use(["element", "table", "form", "laydate", "okLayer", "okUtils"], function () {
|
||||||
window.onload = function () {
|
|
||||||
NProgress.done();
|
|
||||||
}
|
|
||||||
|
|
||||||
layui.use(['element', 'table', 'form', 'jquery', 'laydate'], function () {
|
|
||||||
var element = layui.element;
|
|
||||||
var table = layui.table;
|
var table = layui.table;
|
||||||
var form = layui.form;
|
var form = layui.form;
|
||||||
var $ = layui.jquery;
|
|
||||||
var laydate = layui.laydate;
|
var laydate = layui.laydate;
|
||||||
|
var okLayer = layui.okLayer;
|
||||||
|
var okUtils = layui.okUtils;
|
||||||
|
|
||||||
laydate.render({
|
laydate.render({elem: "#startTime", type: "datetime"});
|
||||||
elem: '#startTime',
|
laydate.render({elem: "#endTime", type: "datetime"});
|
||||||
type: "datetime"
|
|
||||||
});
|
|
||||||
|
|
||||||
laydate.render({
|
var roleTable = table.render({
|
||||||
elem: '#endTime',
|
elem: "#tableId",
|
||||||
type: "datetime"
|
url: okUtils.mockApi.role.list,
|
||||||
});
|
|
||||||
|
|
||||||
table.render({
|
|
||||||
elem: '#tableId',
|
|
||||||
url: '../../data/role.json',
|
|
||||||
limit: 10,
|
limit: 10,
|
||||||
page: true,
|
page: true,
|
||||||
toolbar: true,
|
|
||||||
toolbar: "#toolbarTpl",
|
toolbar: "#toolbarTpl",
|
||||||
|
size: "sm",
|
||||||
cols: [[
|
cols: [[
|
||||||
{type: 'checkbox'},
|
{type: "checkbox"},
|
||||||
{field: 'id', title: 'ID', width: 80, sort: true},
|
{field: "id", title: "ID", width: 80, sort: true},
|
||||||
{field: 'name', title: '角色名', width: 100},
|
{field: "name", title: "角色名", width: 100},
|
||||||
{field: 'remarks', title: '备注', width: 100},
|
{field: "remarks", title: "备注", width: 100},
|
||||||
{field: 'createUser', title: '创建者', width: 85},
|
{field: "createUser", title: "创建者", width: 85},
|
||||||
{field: 'createTime', title: '创建时间', width: 200},
|
{field: "createTime", title: "创建时间", width: 200},
|
||||||
{title: '操作', width: 200, templet: '#operationTpl', align: 'center'}
|
{title: "操作", width: 200, align: "center", templet: "#operationTpl"}
|
||||||
]],
|
]],
|
||||||
done: function (res, curr, count) {
|
done: function (res, curr, count) {
|
||||||
$("#countNum").text(count);
|
console.log(res, curr, count);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
form.on('submit(search)', function () {
|
form.on("submit(search)", function () {
|
||||||
layer.msg('正在查询，请稍后...');
|
roleTable.reload({
|
||||||
|
where: data.field,
|
||||||
|
page: {curr: 1}
|
||||||
|
});
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
table.on('tool(tableFilter)', function (obj) {
|
table.on("toolbar(tableFilter)", function (obj) {
|
||||||
var data = obj.data;
|
switch (obj.event) {
|
||||||
var layEvent = obj.event;
|
case "add":
|
||||||
if (layEvent === 'edit') {
|
add();
|
||||||
layer.open({
|
break;
|
||||||
title: '编辑角色',
|
case "batchDel":
|
||||||
type: 2,
|
batchDel();
|
||||||
shade: false,
|
break;
|
||||||
maxmin: true,
|
}
|
||||||
shade: 0.5,
|
|
||||||
area: ['90%', '90%'],
|
|
||||||
content: 'role-edit.html',
|
|
||||||
zIndex: layer.zIndex,
|
|
||||||
end: function () {
|
|
||||||
$(".layui-laypage-btn")[0].click();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else if (layEvent === 'del') {
|
|
||||||
layer.confirm("确定要删除吗？", {skin: 'layui-layer-lan', icon: 2, title: '提示', anim: 6}, function () {
|
|
||||||
layer.msg("操作成功！", {icon: 1, time: 1000});
|
|
||||||
});
|
|
||||||
} else if (layEvent === 'auth') {
|
|
||||||
layer.open({
|
|
||||||
title: '角色授权',
|
|
||||||
type: 2,
|
|
||||||
shade: false,
|
|
||||||
maxmin: true,
|
|
||||||
shade: 0.5,
|
|
||||||
area: ['90%', '90%'],
|
|
||||||
content: 'role-auth.html',
|
|
||||||
zIndex: layer.zIndex,
|
|
||||||
end: function () {
|
|
||||||
$(".layui-laypage-btn")[0].click();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#batchDel").click(function () {
|
table.on("tool(tableFilter)", function (obj) {
|
||||||
layer.confirm("确定要批量删除吗？", {skin: 'layui-layer-lan', icon: 2, title: '提示', anim: 6}, function () {
|
var data = obj.data;
|
||||||
var checkStatus = table.checkStatus('tableId');
|
switch (obj.event) {
|
||||||
var rows = checkStatus.data.length;
|
case "edit":
|
||||||
if (rows > 0) {
|
edit(data.id);
|
||||||
var idsStr = "";
|
break;
|
||||||
for (var i = 0; i < checkStatus.data.length; i++) {
|
case "del":
|
||||||
idsStr += checkStatus.data[i].id + ',';
|
del(data.id);
|
||||||
}
|
break;
|
||||||
console.log("选择的id-->" + idsStr);
|
}
|
||||||
layer.msg("操作成功！", {icon: 1, time: 1000}, function () {
|
});
|
||||||
$(".layui-laypage-btn")[0].click();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
layer.msg('未选择有效数据', {
|
|
||||||
offset: 't',
|
|
||||||
anim: 6
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
})
|
|
||||||
|
|
||||||
$("#addRole").click(function () {
|
function add () {
|
||||||
layer.open({
|
okLayer.open("添加角色", "role-add.html", "90%", "90%", null, function () {
|
||||||
title: '添加角色',
|
roleTable.reload();
|
||||||
type: 2,
|
})
|
||||||
shade: false,
|
}
|
||||||
maxmin: true,
|
|
||||||
shade: 0.5,
|
function batchDel () {
|
||||||
anim: 4,
|
okLayer.confirm("确定要批量删除吗？", function (index) {
|
||||||
area: ['90%', '90%'],
|
layer.close(index);
|
||||||
content: 'role-add.html',
|
var idsStr = okUtils.table.batchCheck(table);
|
||||||
zIndex: layer.zIndex,
|
if (idsStr) {
|
||||||
// skin: 'layui-layer-molv',
|
okUtils.ajax("/role/batchDel", "post", {idsStr: idsStr}).done(function (response) {
|
||||||
end: function () {
|
console.log(response)
|
||||||
$(".layui-laypage-btn")[0].click();
|
okUtils.table.successMsg("批量删除成功");
|
||||||
}
|
}).fail(function (error) {
|
||||||
});
|
console.log(error)
|
||||||
})
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function edit (id) {
|
||||||
|
okLayer.open("编辑角色", "role-edit.html?id=" + id, "90%", "90%", null, function () {
|
||||||
|
roleTable.reload();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function del (id) {
|
||||||
|
okLayer.confirm("确定要删除吗？", function () {
|
||||||
|
okUtils.ajax("/user/batchDel", "post", {idsStr: id}).done(function (response) {
|
||||||
|
console.log(response)
|
||||||
|
okUtils.table.successMsg("删除成功");
|
||||||
|
}).fail(function (error) {
|
||||||
|
console.log(error)
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<!--模板-->
|
<!-- 头工具栏模板 -->
|
||||||
|
<script type="text/html" id="toolbarTpl">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<div class="layui-inline" lay-event="add"><i class="layui-icon layui-icon-add-1"></i></div>
|
||||||
|
<div class="layui-inline" lay-event="batchDel"><i class="layui-icon layui-icon-delete"></i></div>
|
||||||
|
</div>
|
||||||
|
</script>
|
||||||
|
<!-- 行工具栏模板 -->
|
||||||
<script type="text/html" id="operationTpl">
|
<script type="text/html" id="operationTpl">
|
||||||
<a href="javascript:;" title="授权" lay-event="auth"><i class="iconfont icon-jiaoseshouquan"></i></a>
|
|
||||||
<a href="javascript:;" title="编辑" lay-event="edit"><i class="layui-icon"></i></a>
|
<a href="javascript:;" title="编辑" lay-event="edit"><i class="layui-icon"></i></a>
|
||||||
<a href="javascript:;" title="删除" lay-event="del"><i class="layui-icon"></i></a>
|
<a href="javascript:;" title="删除" lay-event="del"><i class="layui-icon"></i></a>
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
<div class="ok-body-breadcrumb">
|
<div class="ok-body-breadcrumb">
|
||||||
<span class="layui-breadcrumb">
|
<span class="layui-breadcrumb">
|
||||||
<a><cite>首页</cite></a>
|
<a><cite>首页</cite></a>
|
||||||
<a><cite>常用页面</cite></a>
|
<a><cite>会员管理</cite></a>
|
||||||
<a><cite>用户列表</cite></a>
|
<a><cite>用户列表</cite></a>
|
||||||
</span>
|
</span>
|
||||||
<a class="layui-btn layui-btn-sm" href="javascript:location.replace(location.href);" title="刷新">
|
<a class="layui-btn layui-btn-sm" href="javascript:location.replace(location.href);" title="刷新">
|
||||||
|
|
@ -56,6 +56,7 @@
|
||||||
page: true,
|
page: true,
|
||||||
toolbar: true,
|
toolbar: true,
|
||||||
toolbar: "#toolbarTpl",
|
toolbar: "#toolbarTpl",
|
||||||
|
size: "sm",
|
||||||
cols: [[
|
cols: [[
|
||||||
{type: "checkbox"},
|
{type: "checkbox"},
|
||||||
{field: "id", title: "ID", width: 80, sort: true},
|
{field: "id", title: "ID", width: 80, sort: true},
|
||||||
|
|
@ -193,16 +194,21 @@
|
||||||
<button class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon"></i>添加用户</button>
|
<button class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon"></i>添加用户</button>
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
<!--模板-->
|
<!-- 行工具栏模板 -->
|
||||||
<script type="text/html" id="statusTpl">
|
|
||||||
<input type="checkbox" name="status" value="{{d.id}}" lay-skin="switch" lay-text="启用|停用" {{ d.status==0 ? 'checked' : ''}}>
|
|
||||||
</script>
|
|
||||||
<script type="text/html" id="roleTpl">
|
|
||||||
{{ d.role == 0 ? '管理员' : '普通用户 '}}
|
|
||||||
</script>
|
|
||||||
<script type="text/html" id="operationTpl">
|
<script type="text/html" id="operationTpl">
|
||||||
<a href="javascript:" title="编辑" lay-event="edit"><i class="layui-icon"></i></a>
|
<a href="javascript:" title="编辑" lay-event="edit"><i class="layui-icon"></i></a>
|
||||||
<a href="javascript:" title="删除" lay-event="del"><i class="layui-icon"></i></a>
|
<a href="javascript:" title="删除" lay-event="del"><i class="layui-icon"></i></a>
|
||||||
</script>
|
</script>
|
||||||
|
<!-- 启用|停用模板 -->
|
||||||
|
<script type="text/html" id="statusTpl">
|
||||||
|
{{# if(d.status == 0){ }}
|
||||||
|
<span class="layui-btn layui-btn-normal layui-btn-xs">已启用</span>
|
||||||
|
{{# } else if(d.status == 1) { }}
|
||||||
|
<span class="layui-btn layui-btn-warm layui-btn-xs">已停用</span>
|
||||||
|
{{# } }}
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="roleTpl">
|
||||||
|
{{ d.role == 0 ? '管理员' : '普通用户 '}}
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue