root
/
ok-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化角色列表代码

v1.0
bobi 2019-05-15 22:35:09 +08:00
parent 9c9cb23ab2
commit 3efbc2a3ab
7 changed files with 171 additions and 146 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

166
data/permission-tree.json
View File

@ -1,85 +1,89 @@
[ {
{ "status": 1000,
"msg": "查询成功",
"data": [{
"id": "1", "id": "1",
"name": "根目录", "name": "根目录",
"isParent": true "isParent": true
}, },
{ {
"id": "2", "id": "2",
"name": "会员管理", "name": "会员管理",
"isParent": true, "isParent": true,
"parentId": "1" "parentId": "1"
}, },
{ {
"id": "3", "id": "3",
"name": "用户管理", "name": "用户管理",
"isParent": true, "isParent": true,
"parentId": "2" "parentId": "2"
}, },
{ {
"id": "4", "id": "4",
"name": "增加", "name": "增加",
"isParent": false, "isParent": false,
"parentId": "3" "parentId": "3"
}, },
{ {
"id": "5", "id": "5",
"name": "修改", "name": "修改",
"isParent": false, "isParent": false,
"parentId": "3" "parentId": "3"
}, },
{ {
"id": "6", "id": "6",
"name": "删除", "name": "删除",
"isParent": false, "isParent": false,
"parentId": "3" "parentId": "3"
}, },
{ {
"id": "7", "id": "7",
"name": "角色管理", "name": "角色管理",
"isParent": true, "isParent": true,
"parentId": "2" "parentId": "2"
}, },
{ {
"id": "8", "id": "8",
"name": "增加", "name": "增加",
"isParent": false, "isParent": false,
"parentId": "7" "parentId": "7"
}, },
{ {
"id": "9", "id": "9",
"name": "修改", "name": "修改",
"isParent": false, "isParent": false,
"parentId": "7" "parentId": "7"
}, },
{ {
"id": "10", "id": "10",
"name": "删除", "name": "删除",
"isParent": false, "isParent": false,
"parentId": "7" "parentId": "7"
}, },
{ {
"id": "11", "id": "11",
"name": "权限管理", "name": "权限管理",
"isParent": true, "isParent": true,
"parentId": "2" "parentId": "2"
}, },
{ {
"id": "12", "id": "12",
"name": "增加", "name": "增加",
"isParent": false, "isParent": false,
"parentId": "11" "parentId": "11"
}, },
{ {
"id": "13", "id": "13",
"name": "修改", "name": "修改",
"isParent": false, "isParent": false,
"parentId": "11" "parentId": "11"
}, },
{ {
"id": "14", "id": "14",
"name": "删除", "name": "删除",
"isParent": false, "isParent": false,
"parentId": "11" "parentId": "11"
} }
] ]
}

1
lib/layui_plugins/okLayer/okLayer.js
View File

@ -23,7 +23,6 @@ layui.define(["layer"], function (exports) {
layer.open({ layer.open({
title: title, title: title,
type: 2, type: 2,
shade: false,
maxmin: true, maxmin: true,
shade: 0.5, shade: 0.5,
anim: okLayer.animChoose(), anim: okLayer.animChoose(),

2
lib/layui_plugins/okUtils/okUtils.js
View File

@ -2,7 +2,7 @@
layui.define("layer", function (exports) { layui.define("layer", function (exports) {
var $ = layui.jquery; var $ = layui.jquery;
var okUtils = { var okUtils = {
isFrontendBackendSeparate: true, isFrontendBackendSeparate: false,
baseUrl: "http://localhost:8080", baseUrl: "http://localhost:8080",
/** /**
* ajax()函数二次封装 * ajax()函数二次封装

59
pages/role/role-add.html
View File

@ -38,6 +38,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">
<!--权限树-->
<ul class="ztree" id="permissionTree"></ul> <ul class="ztree" id="permissionTree"></ul>
</div> </div>
</div> </div>
@ -54,8 +55,15 @@
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="../../lib/zTree_v3/js/jquery.ztree.all.js"></script> <script src="../../lib/zTree_v3/js/jquery.ztree.all.js"></script>
<script type="text/javascript"> <script type="text/javascript">
layui.use(["element", "form"], function () { layui.config({
base: "../../lib/layui_plugins/"
}).extend({
okLayer: "okLayer/okLayer",
okUtils: "okUtils/okUtils"
}).use(["element", "form", "okLayer", "okUtils"], function () {
var form = layui.form; var form = layui.form;
var okLayer = layui.okLayer;
var okUtils = layui.okUtils;
// zTree设置 // zTree设置
var setting = { var setting = {
@ -66,31 +74,36 @@
}; };
// zTree异步请求所有权限树节点 // zTree异步请求所有权限树节点
var treeObj, loadIndex; var treeObj;
$.ajax({ okUtils.ajax("../../data/permission-tree.json", "get").done(function (response) {
url: "../../data/permission-tree.json", treeObj = $.fn.zTree.init($("#permissionTree"), setting, response);
type: "get", treeObj.expandAll(true);
dataType: "json", }).fail(function (error) {
data: {roleId: 1}, console.log(error)
beforeSend: function () {
loadIndex = layer.load(0, {shade: 0.1});
},
complete: function () {
layer.close(loadIndex);
},
success: function (data) {
treeObj = $.fn.zTree.init($("#permissionTree"), setting, data);
treeObj.expandAll(true);
},
error: function () {
layer.msg("服务器错误", {icon: 5, time: 1000});
}
}); });
form.on("submit(add)", function (data) { form.on("submit(add)", function (data) {
console.log(data.field); // 权限节点校验
layer.msg("添加成功！", {icon: 6, time: 1000, anim: 4}, function () { var nodes = treeObj.getCheckedNodes(true);
parent.layer.close(parent.layer.getFrameIndex(window.name)); if (nodes.length == 0) {
okLayer.msg.redCross("请选择权限节点");
return false;
}
// 权限节点获取
var permissionIds = "";
for (var i = 0; i < nodes.length; i++) {
permissionIds = permissionIds + nodes[i].id + ",";
}
// 请求后台
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;
}); });

59
pages/role/role-edit.html
View File

@ -38,6 +38,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">
<!--权限树-->
<ul class="ztree" id="permissionTree"></ul> <ul class="ztree" id="permissionTree"></ul>
</div> </div>
</div> </div>
@ -54,8 +55,15 @@
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="../../lib/zTree_v3/js/jquery.ztree.all.js"></script> <script src="../../lib/zTree_v3/js/jquery.ztree.all.js"></script>
<script type="text/javascript"> <script type="text/javascript">
layui.use(["element", "form"], function () { layui.config({
base: "../../lib/layui_plugins/"
}).extend({
okLayer: "okLayer/okLayer",
okUtils: "okUtils/okUtils"
}).use(["element", "form", "okLayer", "okUtils"], function () {
var form = layui.form; var form = layui.form;
var okLayer = layui.okLayer;
var okUtils = layui.okUtils;
// zTree设置 // zTree设置
var setting = { var setting = {
@ -66,31 +74,36 @@
}; };
// zTree异步请求所有权限树节点 // zTree异步请求所有权限树节点
var treeObj, loadIndex; var treeObj;
$.ajax({ okUtils.ajax("../../data/permission-tree.json", "get").done(function (response) {
url: "../../data/permission-tree.json", treeObj = $.fn.zTree.init($("#permissionTree"), setting, response);
type: "get", treeObj.expandAll(true);
dataType: "json", }).fail(function (error) {
data: {roleId: 1}, console.log(error)
beforeSend: function () {
loadIndex = layer.load(0, {shade: 0.1});
},
complete: function () {
layer.close(loadIndex);
},
success: function (data) {
treeObj = $.fn.zTree.init($("#permissionTree"), setting, data);
treeObj.expandAll(true);
},
error: function () {
layer.msg("服务器错误", {icon: 5, time: 1000});
}
}); });
form.on("submit(edit)", function (data) { form.on("submit(edit)", function (data) {
console.log(data.field); // 权限节点校验
layer.msg("编辑成功！", {icon: 6, time: 1000, anim: 4}, function () { var nodes = treeObj.getCheckedNodes(true);
parent.layer.close(parent.layer.getFrameIndex(window.name)); if (nodes.length == 0) {
okLayer.msg.redCross("请选择权限节点");
return false;
}
// 权限节点获取
var permissionIds = "";
for (var i = 0; i < nodes.length; i++) {
permissionIds = permissionIds + nodes[i].id + ",";
}
// 请求后台
okUtils.ajax("/role/edit", "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;
}); });

12
pages/role/role.html
View File

@ -44,7 +44,6 @@
}).use(["element", "table", "form", "laydate", "okLayer", "okUtils"], function () { }).use(["element", "table", "form", "laydate", "okLayer", "okUtils"], function () {
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 okLayer = layui.okLayer;
var okUtils = layui.okUtils; var okUtils = layui.okUtils;
@ -52,7 +51,7 @@
laydate.render({elem: "#startTime", type: "datetime"}); laydate.render({elem: "#startTime", type: "datetime"});
laydate.render({elem: "#endTime", type: "datetime"}); laydate.render({elem: "#endTime", type: "datetime"});
table.render({ var roleTable = table.render({
elem: "#tableId", elem: "#tableId",
url: "../../data/role.json", url: "../../data/role.json",
limit: 10, limit: 10,
@ -78,7 +77,6 @@
}); });
table.on("toolbar(tableFilter)", function (obj) { table.on("toolbar(tableFilter)", function (obj) {
var data = obj.data;
switch (obj.event) { switch (obj.event) {
case "add": case "add":
add(); add();
@ -103,7 +101,7 @@
function add () { function add () {
okLayer.open("添加角色", "role-add.html", "90%", "90%", function () { okLayer.open("添加角色", "role-add.html", "90%", "90%", function () {
$(".layui-laypage-btn")[0].click(); roleTable.reload();
}) })
} }
@ -114,7 +112,7 @@
if (idsStr) { if (idsStr) {
okUtils.ajax("/role/batchDel", "post", {idsStr: idsStr}).done(function (response) { okUtils.ajax("/role/batchDel", "post", {idsStr: idsStr}).done(function (response) {
console.log(response) console.log(response)
okUtils.table.operationSuccessMsg("批量删除成功"); okUtils.table.successMsg("批量删除成功");
}).fail(function (error) { }).fail(function (error) {
console.log(error) console.log(error)
}); });
@ -124,7 +122,7 @@
function edit (id) { function edit (id) {
okLayer.open("编辑角色", "role-edit.html?id=" + id, "90%", "90%", function () { okLayer.open("编辑角色", "role-edit.html?id=" + id, "90%", "90%", function () {
$(".layui-laypage-btn")[0].click(); roleTable.reload();
}) })
} }
@ -132,7 +130,7 @@
okLayer.confirm("确定要删除吗？", function () { okLayer.confirm("确定要删除吗？", function () {
okUtils.ajax("/user/batchDel", "post", {idsStr: id}).done(function (response) { okUtils.ajax("/user/batchDel", "post", {idsStr: id}).done(function (response) {
console.log(response) console.log(response)
okUtils.table.operationSuccessMsg("删除成功"); okUtils.table.successMsg("删除成功");
}).fail(function (error) { }).fail(function (error) {
console.log(error) console.log(error)
}); });

4
pages/user/user.html
View File

@ -44,7 +44,6 @@
}).use(["element", "table", "form", "laydate", "okLayer", "okUtils"], function () { }).use(["element", "table", "form", "laydate", "okLayer", "okUtils"], function () {
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 okLayer = layui.okLayer;
var okUtils = layui.okUtils; var okUtils = layui.okUtils;
@ -86,7 +85,6 @@
}); });
table.on("toolbar(tableFilter)", function (obj) { table.on("toolbar(tableFilter)", function (obj) {
var data = obj.data;
switch (obj.event) { switch (obj.event) {
case "batchEnabled": case "batchEnabled":
batchEnabled(); batchEnabled();
@ -162,7 +160,7 @@
function add () { function add () {
okLayer.open("添加用户", "user-add.html", "90%", "90%", function () { okLayer.open("添加用户", "user-add.html", "90%", "90%", function () {
$(".layui-laypage-btn")[0].click(); userTable.reload();
}) })
} }