bwadmin/pear-admin-flask
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature: 角色增删改

Browse Source
This commit is contained in:
zhengxinonly
2023-10-14 20:20:46 +08:00
parent 075b624522
commit 52e0737311
5 changed files with 302 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/views/role/index.html
+242
View File
@@ -0,0 +1,242 @@
<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>权限管理</title>
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1"
/>
</head>
<body>
<div style="padding: 16px">
<div class="layui-card">
<div class="layui-card-body">
<table
class="layui-hide"
id="role-table"
lay-filter="role-table"
></table>
</div>
</div>
</div>
<form
class="layui-form"
lay-filter="role-form"
id="role-form"
action=""
style="padding: 15px; display: none"
>
<div class="layui-form-item">
<label class="layui-form-label">ID</label>
<div class="layui-input-block">
<input
type="text"
name="id"
value="0"
lay-verify="required"
autocomplete="off"
class="layui-input"
disabled
/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input
type="text"
name="name"
placeholder="请输入用户名"
lay-verify="required"
autocomplete="off"
class="layui-input"
/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">标识</label>
<div class="layui-input-block">
<input
type="text"
name="code"
placeholder="请输入用户标识"
lay-verify="required"
autocomplete="off"
class="layui-input"
/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<input
type="text"
name="desc"
placeholder="请输入用户描述"
autocomplete="off"
class="layui-input"
/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">权限列表</label>
<div class="layui-input-block">
<input
type="text"
name="rights_ids"
placeholder="请输入用户权限列表"
autocomplete="off"
class="layui-input"
/>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button
type="submit"
class="layui-btn"
lay-submit
lay-filter="role-form-btn"
>
立即提交
</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
<script type="text/html" id="role-toolbar">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" lay-event="role-toolbar-add">
新增角色
</button>
</div>
</script>
<script type="text/html" id="role-tool">
<div class="layui-btn-container">
<button
class="layui-btn layui-btn-sm layui-bg-blue"
lay-event="role-tool-edit"
>
编辑
</button>
<button
class="layui-btn layui-btn-sm layui-bg-yellow"
lay-event="role-tool-detail"
>
授权
</button>
<button
class="layui-btn layui-btn-sm layui-bg-red"
lay-event="role-tool-del"
>
删除
</button>
</div>
</script>
<script>
layui.use(function () {
var table = layui.table;
var $ = layui.$;
var form = layui.form;
table.render({
elem: "#role-table",
id: "role-table",
url: "/api/v1/role", // 此处为静态模拟数据，实际使用时需换成真实接口
height: "full-35", // 最大高度减去其他容器已占有的高度差
toolbar: "#role-toolbar",
page: true,
cols: [
[
//标题栏
{ field: "id", title: "ID", width: 80, sort: true },
{ field: "name", title: "用户名", width: 120 },
{ field: "code", title: "用户标识", width: 160 },
{ field: "desc", title: "描述", minWidth: 80 },
{ field: "ids", title: "权限列表", width: 100 },
{
fixed: "right",
title: "操作",
width: 180,
align: "center",
toolbar: "#role-tool",
},
],
],
});
table.on("toolbar(role-table)", function (obj) {
if (obj.event === "role-toolbar-add") {
layer.open({
type: 1,
shade: false,
content: $("#role-form"),
area: ["50%", "80%"],
});
form.render($("#role"));
}
});
table.on("tool(role-table)", function (obj) {
if (obj.event === "role-tool-edit") {
form.val("role-form", obj.data);
layer.open({
type: 1,
shade: false,
content: $("#role-form"),
area: ["50%", "80%"],
});
} else if (obj.event === "role-tool-del") {
$.ajax({
url: `/api/v1/role/${obj.data.id}`,
type: "DELETE",
contentType: "application/json",
headers: {
"X-CSRF-TOKEN": getCookie("csrf_access_token"),
},
success: function (res) {
if (!res.code) {
table.reloadData("role-table");
}
},
});
} else if (obj.event === "role-tool-detail") {
console.log("角色授权");
}
});
form.on("submit(role-form-btn)", function (data) {
var field = data.field;
let method, url;
if (field.id == 0) {
field.id = null;
method = "POST";
url = "/api/v1/role";
} else {
method = "PUT";
url = `/api/v1/role/${field.id}`;
}
$.ajax({
url: url,
type: method,
contentType: "application/json",
headers: {
"X-CSRF-TOKEN": getCookie("csrf_access_token"),
},
data: JSON.stringify(field),
success: function (res) {
if (!res.code) {
layer.closeAll();
table.reloadData("role-table");
}
},
});
return false;
});
});
</script>
</body>
</html>