mirror of https://gitee.com/stylefeng/guns
更新菜单列表,查询,删除
parent
cbcbd85a8c
commit
c829c6cea8
|
@ -0,0 +1,52 @@
|
|||
package cn.stylefeng.guns.modular.menu;
|
||||
|
||||
import cn.stylefeng.roses.kernel.resource.api.annotation.ApiResource;
|
||||
import cn.stylefeng.roses.kernel.resource.api.annotation.GetResource;
|
||||
import lombok.extern.slf4j.Slf4j;
|
||||
import org.springframework.stereotype.Controller;
|
||||
|
||||
/**
|
||||
* 菜单管理界面
|
||||
*
|
||||
* @author fengshuonan
|
||||
* @date 2021/1/6 16:43
|
||||
*/
|
||||
@Controller
|
||||
@Slf4j
|
||||
@ApiResource(name = "菜单管理界面")
|
||||
public class MenuViewController {
|
||||
|
||||
/**
|
||||
* 菜单管理首页
|
||||
*
|
||||
* @author fengshuonan
|
||||
* @date 2021/1/6 13:32
|
||||
*/
|
||||
@GetResource(name = "菜单管理首页", path = "/view/menu")
|
||||
public String menuIndex() {
|
||||
return "/modular/auth/menu/menu.html";
|
||||
}
|
||||
|
||||
/**
|
||||
* 新增菜单界面
|
||||
*
|
||||
* @author fengshuonan
|
||||
* @date 2021/1/6 13:37
|
||||
*/
|
||||
@GetResource(name = "新增菜单界面", path = "/view/menu/add")
|
||||
public String menuAdd() {
|
||||
return "/modular/auth/menu/menu_add.html";
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改菜单界面
|
||||
*
|
||||
* @author fengshuonan
|
||||
* @date 2021/1/6 13:37
|
||||
*/
|
||||
@GetResource(name = "修改菜单界面", path = "/view/menu/edit")
|
||||
public String menuEdit() {
|
||||
return "/modular/auth/menu/menu_edit.html";
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,181 @@
|
|||
layui.use(['HttpRequest', 'treeTable', 'func'], function () {
|
||||
var HttpRequest = layui.HttpRequest;
|
||||
var treeTable = layui.treeTable;
|
||||
var func = layui.func;
|
||||
|
||||
/**
|
||||
* 系统管理--菜单管理
|
||||
*/
|
||||
var Menu = {
|
||||
tableId: "menuTable",
|
||||
condition: {
|
||||
menuName: "",
|
||||
menuCode: ""
|
||||
},
|
||||
|
||||
// treeTable实例
|
||||
treeTableInstance: null
|
||||
};
|
||||
|
||||
/**
|
||||
* 初始化表格的列
|
||||
*/
|
||||
Menu.initColumn = function () {
|
||||
return [
|
||||
{type: 'numbers'},
|
||||
{field: 'menuName', align: "left", sort: true, title: '菜单名称', minWidth: 120},
|
||||
{field: 'menuCode', align: "center", sort: true, title: '菜单编号', minWidth: 120},
|
||||
{field: 'appName', align: "center", sort: true, title: '应用名称'},
|
||||
{field: 'layuiPath', align: "center", sort: true, title: '请求地址', minWidth: 180},
|
||||
{
|
||||
field: 'layuiIcon', align: "center", sort: true, title: '图标', templet: '<p><i class="{{d.layuiIcon}}"></i></p>'
|
||||
},
|
||||
{
|
||||
field: 'visible', align: "center", sort: true, title: '是否可见', templet: function (data) {
|
||||
if (data.visible === 'Y') {
|
||||
return '<span class="layui-badge layui-badge-green">可见</span>';
|
||||
} else {
|
||||
return '<span class="layui-badge layui-badge-gray">不可见</span>';
|
||||
}
|
||||
}
|
||||
},
|
||||
{field: 'menuSort', align: "center", sort: true, title: '排序'},
|
||||
{
|
||||
field: 'statusFlag', align: "center", sort: true, title: '状态', templet: function (data) {
|
||||
if (data.statusFlag === 1) {
|
||||
return '<span class="layui-badge layui-badge-green">启用</span>';
|
||||
} else {
|
||||
return '<span class="layui-badge layui-badge-gray">禁用</span>';
|
||||
}
|
||||
}
|
||||
},
|
||||
{field: 'createTime', align: "center", sort: true, title: '创建时间', minWidth: 120},
|
||||
{field: 'updateTime', align: "center", sort: true, title: '更新时间', minWidth: 120},
|
||||
{align: 'center', toolbar: '#menuTableBar', title: '操作', minWidth: 120}
|
||||
];
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击查询按钮
|
||||
*/
|
||||
Menu.search = function () {
|
||||
var queryData = {};
|
||||
queryData['menuName'] = $("#menuName").val();
|
||||
queryData['menuCode'] = $("#menuCode").val();
|
||||
Menu.initTable(Menu.tableId, queryData);
|
||||
};
|
||||
|
||||
/**
|
||||
* 弹出添加菜单对话框
|
||||
*/
|
||||
Menu.openAddMenu = function () {
|
||||
func.open({
|
||||
height: 720,
|
||||
title: '添加菜单',
|
||||
content: Feng.ctxPath + '/view/menu/add',
|
||||
tableId: Menu.tableId,
|
||||
endCallback: function () {
|
||||
Menu.initTable(Menu.tableId);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击编辑菜单按钮时
|
||||
*
|
||||
* @param data 点击按钮时候的行数据
|
||||
*/
|
||||
Menu.onEditMenu = function (data) {
|
||||
func.open({
|
||||
height: 720,
|
||||
title: '修改菜单',
|
||||
content: Feng.ctxPath + "/view/menu/edit?menuId=" + data.menuId,
|
||||
tableId: Menu.tableId,
|
||||
endCallback: function () {
|
||||
Menu.initTable(Menu.tableId);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击删除菜单按钮
|
||||
*
|
||||
* @param data 点击按钮时候的行数据
|
||||
*/
|
||||
Menu.onDeleteMenu = function (data) {
|
||||
var operation = function () {
|
||||
var request = new HttpRequest(Feng.ctxPath + "/sysMenu/delete", 'post', function () {
|
||||
Feng.success("删除成功!");
|
||||
Menu.condition.menuId = "";
|
||||
Menu.initTable(Menu.tableId);
|
||||
}, function (data) {
|
||||
Feng.error("删除失败!" + data.message + "!");
|
||||
});
|
||||
request.set("menuId", data.menuId);
|
||||
request.start(true);
|
||||
};
|
||||
Feng.confirm("是否删除菜单" + data.menuName + "?", operation);
|
||||
};
|
||||
|
||||
/**
|
||||
* 初始化表格
|
||||
*/
|
||||
Menu.initTable = function (menuId, reqData) {
|
||||
return treeTable.render({
|
||||
elem: '#' + menuId,
|
||||
tree: {
|
||||
iconIndex: 1, // 折叠图标显示在第几列
|
||||
idName: 'menuId', // 自定义id字段的名称
|
||||
pidName: 'menuParentId', // 自定义标识是否还有子节点的字段名称
|
||||
isPidData: true // 是否是pid形式数据
|
||||
},
|
||||
height: "full-98",
|
||||
cols: Menu.initColumn(),
|
||||
reqData: function (data, callback) {
|
||||
var request = new HttpRequest(Feng.ctxPath + '/sysMenu/layuiList', 'get', function (res) {
|
||||
callback(res.data);
|
||||
}, function (res) {
|
||||
Feng.error("删除失败!" + res.message + "!");
|
||||
});
|
||||
request.set(reqData);
|
||||
request.start();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 渲染表格
|
||||
Menu.treeTableInstance = Menu.initTable(Menu.tableId);
|
||||
|
||||
// 展开所有按钮
|
||||
$('#expandAll').click(function () {
|
||||
Menu.treeTableInstance.expandAll();
|
||||
});
|
||||
|
||||
// 折叠所有按钮
|
||||
$('#foldAll').click(function () {
|
||||
Menu.treeTableInstance.foldAll();
|
||||
});
|
||||
|
||||
// 搜索按钮点击事件
|
||||
$('#btnSearch').click(function () {
|
||||
Menu.search();
|
||||
});
|
||||
|
||||
// 添加按钮点击事件
|
||||
$('#btnAdd').click(function () {
|
||||
Menu.openAddMenu();
|
||||
});
|
||||
|
||||
// 工具条点击事件
|
||||
treeTable.on('tool(menuTable)', function (obj) {
|
||||
var data = obj.data;
|
||||
var layEvent = obj.event;
|
||||
|
||||
if (layEvent === 'edit') {
|
||||
Menu.onEditMenu(data);
|
||||
} else if (layEvent === 'delete') {
|
||||
Menu.onDeleteMenu(data);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
|
@ -8,9 +8,9 @@ var MenuInfoDlg = {
|
|||
}
|
||||
};
|
||||
|
||||
layui.use(['layer', 'form', 'admin', 'laydate', 'ax', 'iconPicker'], function () {
|
||||
layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'iconPicker'], function () {
|
||||
var $ = layui.jquery;
|
||||
var $ax = layui.ax;
|
||||
var HttpRequest = layui.HttpRequest;
|
||||
var form = layui.form;
|
||||
var admin = layui.admin;
|
||||
var laydate = layui.laydate;
|
||||
|
@ -85,4 +85,4 @@ layui.use(['layer', 'form', 'admin', 'laydate', 'ax', 'iconPicker'], function ()
|
|||
ajax.set("dictTypeCode", "SYSTEM_TYPE");
|
||||
ajax.start();
|
||||
|
||||
});
|
||||
});
|
|
@ -1,184 +0,0 @@
|
|||
layui.use(['layer', 'form', 'ztree', 'laydate', 'admin', 'ax', 'treeTable', 'func'], function () {
|
||||
var layer = layui.layer;
|
||||
var form = layui.form;
|
||||
var $ZTree = layui.ztree;
|
||||
var $ax = layui.ax;
|
||||
var laydate = layui.laydate;
|
||||
var admin = layui.admin;
|
||||
var treeTable = layui.treeTable;
|
||||
var func = layui.func;
|
||||
|
||||
//table的初始化实例
|
||||
var insTb;
|
||||
|
||||
/**
|
||||
* 系统管理--菜单管理
|
||||
*/
|
||||
var Menu = {
|
||||
tableId: "menuTable", //表格id
|
||||
condition: {
|
||||
menuId: "",
|
||||
menuName: "",
|
||||
level: ""
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 初始化表格的列
|
||||
*/
|
||||
Menu.initColumn = function () {
|
||||
return [
|
||||
{type: 'numbers'},
|
||||
{field: 'name', align: "left", sort: true, title: '菜单名称', minWidth: 240},
|
||||
{field: 'code', align: "center", sort: true, title: '菜单编号', minWidth: 120},
|
||||
{field: 'pcode', align: "center", sort: true, title: '菜单父编号'},
|
||||
{field: 'url', align: "center", sort: true, title: '请求地址'},
|
||||
{field: 'sort', align: "center", sort: true, title: '排序'},
|
||||
{field: 'levels', align: "center", sort: true, title: '层级'},
|
||||
{field: 'isMenuName', align: "center", sort: true, title: '是否是菜单'},
|
||||
{field: 'statusName', align: "center", sort: true, title: '状态'},
|
||||
{align: 'center', toolbar: '#menuTableBar', title: '操作', minWidth: 200}
|
||||
];
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击菜单树时
|
||||
*/
|
||||
Menu.onClickMenu = function (e, treeId, treeNode) {
|
||||
Menu.condition.menuId = treeNode.id;
|
||||
Menu.search();
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击查询按钮
|
||||
*/
|
||||
Menu.search = function () {
|
||||
var queryData = {};
|
||||
queryData['menuName'] = $("#menuName").val();
|
||||
queryData['level'] = $("#level").val();
|
||||
Menu.initTable(Menu.tableId, queryData);
|
||||
};
|
||||
|
||||
/**
|
||||
* 弹出添加菜单对话框
|
||||
*/
|
||||
Menu.openAddMenu = function () {
|
||||
func.open({
|
||||
height: 720,
|
||||
title: '添加菜单',
|
||||
content: Feng.ctxPath + '/menu/menu_add',
|
||||
tableId: Menu.tableId,
|
||||
endCallback: function () {
|
||||
Menu.initTable(Menu.tableId);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击编辑菜单按钮时
|
||||
*
|
||||
* @param data 点击按钮时候的行数据
|
||||
*/
|
||||
Menu.onEditMenu = function (data) {
|
||||
func.open({
|
||||
height: 720,
|
||||
title: '修改菜单',
|
||||
content: Feng.ctxPath + "/menu/menu_edit?menuId=" + data.menuId,
|
||||
tableId: Menu.tableId,
|
||||
endCallback: function () {
|
||||
Menu.initTable(Menu.tableId);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击删除菜单按钮
|
||||
*
|
||||
* @param data 点击按钮时候的行数据
|
||||
*/
|
||||
Menu.onDeleteMenu = function (data) {
|
||||
var operation = function () {
|
||||
var ajax = new $ax(Feng.ctxPath + "/menu/remove", function () {
|
||||
Feng.success("删除成功!");
|
||||
Menu.condition.menuId = "";
|
||||
Menu.initTable(Menu.tableId);
|
||||
}, function (xhr) {
|
||||
Feng.error("删除失败!" + xhr.responseJSON.message + "!");
|
||||
});
|
||||
ajax.set("menuId", data.menuId);
|
||||
ajax.start();
|
||||
};
|
||||
Feng.confirm("是否删除菜单" + data.name + "?", operation);
|
||||
};
|
||||
|
||||
/**
|
||||
* 初始化表格
|
||||
*/
|
||||
Menu.initTable = function (menuId, reqData) {
|
||||
return treeTable.render({
|
||||
elem: '#' + menuId,
|
||||
tree: {
|
||||
iconIndex: 1, // 折叠图标显示在第几列
|
||||
idName: 'code', // 自定义id字段的名称
|
||||
pidName: 'pcode', // 自定义标识是否还有子节点的字段名称
|
||||
haveChildName: 'haveChild', // 自定义标识是否还有子节点的字段名称
|
||||
isPidData: true // 是否是pid形式数据
|
||||
},
|
||||
height: "full-98",
|
||||
cols: Menu.initColumn(),
|
||||
reqData: function (data, callback) {
|
||||
var ajax = new $ax(Feng.ctxPath + '/menu/listTree', function (res) {
|
||||
callback(res.data);
|
||||
}, function (res) {
|
||||
Feng.error("删除失败!" + res.responseJSON.message + "!");
|
||||
});
|
||||
ajax.setData(reqData);
|
||||
ajax.start();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 渲染表格
|
||||
insTb = Menu.initTable(Menu.tableId);
|
||||
$('#expandAll').click(function () {
|
||||
insTb.expandAll();
|
||||
});
|
||||
$('#foldAll').click(function () {
|
||||
insTb.foldAll();
|
||||
});
|
||||
|
||||
//渲染时间选择框
|
||||
laydate.render({
|
||||
elem: '#timeLimit',
|
||||
range: true,
|
||||
max: Feng.currentDate()
|
||||
});
|
||||
|
||||
//初始化左侧部门树
|
||||
var ztree = new $ZTree("menuTree", "/menu/selectMenuTreeList");
|
||||
ztree.bindOnClick(Menu.onClickMenu);
|
||||
ztree.init();
|
||||
|
||||
// 搜索按钮点击事件
|
||||
$('#btnSearch').click(function () {
|
||||
Menu.search();
|
||||
});
|
||||
|
||||
// 添加按钮点击事件
|
||||
$('#btnAdd').click(function () {
|
||||
Menu.openAddMenu();
|
||||
});
|
||||
|
||||
// 工具条点击事件
|
||||
treeTable.on('tool(menuTable)', function (obj) {
|
||||
var data = obj.data;
|
||||
var layEvent = obj.event;
|
||||
|
||||
if (layEvent === 'edit') {
|
||||
Menu.onEditMenu(data);
|
||||
} else if (layEvent === 'delete') {
|
||||
Menu.onDeleteMenu(data);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
|
@ -1,4 +1,4 @@
|
|||
@layout("/layout/_container.html",{plugins:["ztree"],js:["/assets/modular/system/menu/menu.js"]}){
|
||||
@layout("/layout/_container.html",{plugins:["ztree"], js:["/assets/modular/auth/menu/menu.js"]}){
|
||||
|
||||
<div class="layui-body-header">
|
||||
<span class="layui-body-header-title">菜单管理</span>
|
||||
|
@ -12,16 +12,14 @@
|
|||
<div class="layui-form toolbar">
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-inline">
|
||||
<input id="menuName" class="layui-input" type="text" placeholder="菜单名称/编码"/>
|
||||
<input id="menuName" class="layui-input" type="text" placeholder="菜单名称"/>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<input id="level" class="layui-input" type="text" placeholder="层级"/>
|
||||
<input id="menuCode" class="layui-input" type="text" placeholder="菜单编码"/>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon"></i>搜索</button>
|
||||
@if(shiro.hasPermission("/menu/add")){
|
||||
<button id="btnAdd" class="layui-btn icon-btn"><i class="layui-icon"></i>添加</button>
|
||||
@}
|
||||
<button id="expandAll" class="layui-btn icon-btn"><i class="layui-icon"></i>展开所有</button>
|
||||
<button id="foldAll" class="layui-btn icon-btn"><i class="layui-icon"></i>折叠所有</button>
|
||||
</div>
|
||||
|
@ -35,12 +33,8 @@
|
|||
</div>
|
||||
|
||||
<script type="text/html" id="menuTableBar">
|
||||
@if(shiro.hasPermission("/menu/edit")){
|
||||
<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
|
||||
@}
|
||||
@if(shiro.hasPermission("/menu/remove")){
|
||||
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
|
||||
@}
|
||||
</script>
|
||||
|
||||
@}
|
||||
@}
|
|
@ -1,4 +1,4 @@
|
|||
@layout("/layout/_form.html",{js:["/assets/modular/system/menu/menu_add.js"]}){
|
||||
@layout("/layout/_form.html",{js:["/assets/modular/auth/menu/menu_add.js"]}){
|
||||
|
||||
<form class="layui-form" id="menuForm" lay-filter="menuForm">
|
||||
<div class="layui-fluid" style="padding-bottom: 75px;">
|
|
@ -1,4 +1,4 @@
|
|||
@layout("/layout/_form.html",{js:["/assets/modular/system/menu/menu_edit.js"]}){
|
||||
@layout("/layout/_form.html",{js:["/assets/modular/auth/menu/menu_edit.js"]}){
|
||||
|
||||
<form class="layui-form" id="menuForm" lay-filter="menuForm">
|
||||
<div class="layui-fluid" style="padding-bottom: 75px;">
|
Loading…
Reference in New Issue