# JavaDesign
**Repository Path**: qlslylq/JavaDesign
## Basic Information
- **Project Name**: JavaDesign
- **Description**: JavaSSM后台管理系统基础框架。以JSP前后端不分离方式搭建，jQueryEasyUI作为前端展示，SSM提供后台服务。
框架基本功能：菜单管理，角色管理，权限管理，用户管理，日志管理。
- **Primary Language**: Java
- **License**: LGPL-3.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 6
- **Forks**: 0
- **Created**: 2020-09-14
- **Last Updated**: 2023-03-08
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
作者：qlslylq (浅蓝深蓝叶落秋，https://www.bmob.cn/shop/detail/396)
联系：13297089301 QQ：2939143482
QQ讨论群：326550832(AndroidDesign)
名下开源框架：
1.AndroidDesign(eclipse，in 2014)
2.AndroidDesign(AndroidStudio，in 2016)
3.AdmxSDK及AdmxSDK_v2(AndroidStudio，in 2017)
4.UnityDesign(VisualStudio,C#，in 2017)
5.FlutterDesign(AndroidStudio，in 2019)
6.JavaDesign(Intellij IDEA，in 2020)
名下SDK(合作加WX：13297089301)：
1.ad-design-native-android：[查看项目](https://gitee.com/any-design/ad-design-native-android)
2.ad-design-apicloud-android：[查看项目](https://gitee.com/any-design/ad-design-apicloud-android)
3.ad-design-flutter-android：[查看项目](https://gitee.com/any-design/ad-design-flutter-android)
名下开源项目：
1.AndroidDesignQtfy (https://www.bmob.cn/shop/detail/396)
2.UnityDesignEasyAR (AR纹理识别demo)
3.UnityDesignThreeInOne (三合一游戏demo)
友情推广：
华为云：[华为云](https://account.huaweicloud.com/obmgr/invitation/invitation.html?bpName=0000000100000002ABF750871AEB87720ACC40C42A118E856B76DBBE60DBB4ED2ECFD88225E0C039F3BBD11759B3040456E0549FE8AE1850DE1FFF37FEB043717008C92DE61831DD&inviteCode=00000001000000021FF7919C82835DD65B03AF77AA85B03EC3EC9E3489913E124D96066CF783EC39&bindType=1&isDefault=1)
# JavaDesign
#### 介绍
JavaSSM后台管理系统基础框架。以JSP前后端不分离方式搭建，jQueryEasyUI作为前端展示，SSM提供后台服务。
框架基本功能：菜单管理，角色管理，权限管理，用户管理，日志管理。
#### 详细介绍
系统登录：登录后，根据所属角色权限动态展示三级菜单树。
菜单管理：三级菜单的增删查改；远端分页，搜索。
角色管理：角色增删查改；远端分页，搜索。
权限管理：不同角色的菜单权限(三层权限)分配。
用户管理：用户的增删查改；头像的上传，进度监听及展示；修改密码；远端多字段排序，筛选，分页，搜索。
日志管理：提供埋点日志记录服务；远端多字段排序，分页，搜索。
#### 基本封装
后端Log类，StackTraceUtils类提供控制台日志点击自动跳转对应文件的行数功能，调用栈功能
后端BeanUtils，ELUtils，RedirectUtils，SessionUtils，SqlSessionFactoryUtils类提供对IOC，SpringEL，重定向，session操作，sql连接的基本封装
前端AjaxInterceptor，DialogUtil，ElementUtil，ExtendUtil，ImageUtil，LoadingUtil提供对全局ajax拦截(自动控制loading条显隐，并可单独修改文本)，dialog常规操作，元素常规操作，对象扩展，图片加载(两种加载模式CenterCrop与FitCenter，和三种加载形状矩形，圆角，圆形的封装)，loading常规操作的功能。
#### 参考演变
Log与StackTraceUtils的自动跳转文件与调用栈功能，参考了本人名下AndroidDesign中的Log与StackTraceUtils，演变而来，Java与Android两端通用；
ImageUtil的两种加载模式，三种形状加载方式，参考了本人名下AndroidDesign中的ImageUtils或GlideUtils；
menu[list.jsp],role[list.jsp],user[list.jsp]，参考了本人名下AndroidDesign中的窗口线及FreeApp中的窗口线写法；
SessionUtils，ELUtils，BeanUtils中的泛型去强转化写法，参考了本人名下AndroidDesign的BaseActivity中的findView泛型去强转化写法；
略。
#### 系统环境
开发工具：Intellij IDEA 2020.1
Java版本：JDK 1.8
编译：Gradle 5.4.1
服务器：Tomcat 7.0.96
数据库：MySQL 8.0.16
系统采用技术：Spring + SpringMVC + Mybatis + Redis +
html5 + css3 + javascript +
jQuery + jQueryEasyUI + ajax +
jsp + 面向过程 + 前后端不分离
#### 导入JavaDesign项目配置：
1.ProStructure-->project配置编译输出目录：...\JavaDesign\out
2.Settings-->gradle配置编译方式：IDEA
3.添加Tomcat[local]运行：
Server配置浏览器启动页：http://localhost:8080/javadesign/system/login
Deployment添加.war(exploded),ApplicationContext：/javadesign
根目录中的javax.el-3.0.0.jar移动到tomcat的lib目录下
4.新建数据库ssm并导入项目根目录ssm.sql文件中的结构及数据
5.文件resources/spring-mybatis/spring-mybatis.xml中配置数据库连接，并启动MySql数据库
#### 运行截图：
```
#### 代码示例：
#### 菜单列表前端：
/**
* @Description 菜单列表
* @Author https://gitee.com/qlslylq/UnityDesign
* @link https://gitee.com/qlslylq/FlutterDesign
* @link https://gitee.com/qlslylq/AndroidDesign
**/
$(document).ready(function () {
initElement();
initData();
initListener();
});
function initElement() {
initToolBarEle();
initGridEle();
}
function initData() {
}
function initListener() {
}
function onClick(ele) {
if (ele.id == "icon-add") {
openAddDialog();
} else if (ele.id == "icon-add-btn") {
openAddBtnDialog();
} else if (ele.id == "icon-edit") {
openEditDialog();
} else if (ele.id == "icon-remove") {
openDeleteDialog();
} else if (ele.id == "icon-reload") {
queryForAll();
} else if (ele.id == "icon-search") {
queryForSearchText();
} else if ($(ele).attr("iconCls") == "icon-add") {
openIconSelectDialog(ele);
} else if (ele.id == "img") {
selectElement(ele, "img-selected");
}
}
/**
* 初始化工具栏按钮
*/
function initToolBarEle() {
var roleThirdMenus = JSON.parse(sessionStorage.getItem('roleThirdMenus'));
for (var i = 0; i < roleThirdMenus.length; i++) {
var btnHtml = ' ' + roleThirdMenus[i].name + ' ';
$(".wu-toolbar-button").append(btnHtml);
$(".wu-toolbar-button [data-index=" + i + "]").linkbutton({
iconCls: roleThirdMenus[i].icon
});
}
}
/**
* 填充菜单数据
*/
function initGridEle() {
$('#grid').treegrid({
loadMsg: false,//网络层自定义控制loading显隐
url: '../menu/getList',
queryParams: {},
idField: 'id',
treeField: 'name',//从哪个Field开始展开树-->首个Field
// loadFilter: filterDataForPager,
loadFilter: function (data) {
return data.data;
},
rownumbers: false,
singleSelect: true,
pageNumber: 1,
pageSize: 100,
pageList: [10, 20, 50, 80, 100],
pagePosition: 'bottom',
pagination: true,
multiSort: true,
fitColumns: true,
fit: true,
columns: [
[{
checkbox: true
}, {
field: 'id',
title: 'ID',
width: 130,
sortable: true,
hidden: "true"
}, {
field: 'name',
title: '名称',
width: 130,
sortable: false
}, {
field: 'parent',
title: '父级菜单',
width: 130,
sortable: false,
formatter: function (value, row, index) {
if (row.parent) {
return row.parent.name;
} else {
return null;
}
}
}, {
field: 'icon',
title: '图标',
width: 130,
sortable: false,
formatter(value, row, index) {
var ele = ' ';
return ele + value;
}
}, {
field: 'link',
title: '链接',
width: 130,
sortable: false
},]
], onLoadSuccess: function () {//数据加载成功
$(this).treegrid('clearSelections');//选中即使刷新也会有选中缓存
}
});
}
/**
* 打开添加窗口
*/
function openAddDialog() {
showCustomDialog($("#dialog-add"), "添加菜单", false, function () {
if (add()) {
$("#dialog-add").dialog('close');
}
});
}
/**
* 打开添加按钮窗口
*/
function openAddBtnDialog() {
var item = $('#grid').treegrid('getSelected');
if (item == null) {
$.messager.warning("请先选择要绑定到的二级菜单~");
return;
}
if (item._parentId == 0 || item.parent._parentId != 0) {
$.messager.warning("请选择二级菜单~");
return;
}
showCustomDialog($("#dialog-add-btn"), "添加按钮", false, function () {
if (addBtn()) {
$("#dialog-add-btn").dialog('close');
}
}, function () {
$("#form-add-btn .easyui-combobox").combobox('setValue', item.id);
$("#form-add-btn .easyui-combobox").combobox('setText', item.name);
});
}
/**
* 打开修改一二三级菜单窗口
*/
function openEditDialog() {
var item = $('#grid').treegrid('getSelected');
if (item == null) {
$.messager.warning("请选择要修改的菜单项~");
return;
}
if (item._parentId == 0 || item.parent._parentId == 0) {//一二级菜单
showCustomDialog($("#dialog-edit"), "编辑菜单", false, function () {
if (edit()) {
$("#dialog-edit").dialog('close');
}
}, function () {
$("#form-edit input[type='hidden']").val(item.id);
$("#form-edit .easyui-combobox").combobox('setValue', item._parentId);
$("#form-edit .easyui-combobox").combobox('setText', item.parent ? item.parent.name : "顶级菜单");
$("#form-edit input[name='name']").val(item.name);
$("#form-edit input[name='icon']").val(item.icon);
$("#form-edit input[name='link']").val(item.link);
});
} else {//三级菜单
showCustomDialog($("#dialog-edit-btn"), "编辑按钮", false, function () {
if (editBtn()) {
$("#dialog-edit-btn").dialog('close');
}
}, function () {
$("#form-edit-btn input[type='hidden']").val(item.id);
$("#form-edit-btn .easyui-combobox").combobox('setValue', item._parentId);
$("#form-edit-btn .easyui-combobox").combobox('setText', item.parent.name);
$("#form-edit-btn input[name='name']").val(item.name);
$("#form-edit-btn input[name='icon']").val(item.icon);
$("#form-edit-btn input[name='link']").val(item.link);
});
}
}
/**
* 打开图标选择窗口
*/
function openIconSelectDialog(ele) {
if ($("#table").children().length == 0) {
$.post({
url: "../menu/getIconList",
async: false,
success: function (data) {
var list_icon = data.data;
var tbody = $("#table");
var content = '';
tbody.empty();
$.each(list_icon, function (i, item) {
var fileName = item.toString();
var iconName = fileName.substring(0, fileName.indexOf("."));
var iconClassName = "icon-" + iconName.replace(/_/g, "-");
var icon = '';
var tr_start = '';
var td = '| ' + icon + ' | ';
var tr_end = '
';
var cols = 10;
if (i % cols == 0) {
content += tr_start;
}
content += td;
if ((i + 1) % cols == 0 || i == list_icon.length - 1) {
content += tr_end;
}
});
tbody.append(content);
}
});
}
showCustomDialog($("#dialog-icon-select"), "选择图标", true, function () {
var imgClass = $(".img-selected").prop('class').split(" ")[0];
$("input[name='icon']", getParentUntil(ele, "form")).val(imgClass);
}, function () {
$(".img-selected").removeClass("img-selected");
});
}
/**
* 打开删除窗口
*/
function openDeleteDialog() {
var item = $('#grid').treegrid('getSelected');
if (item == null) {
$.messager.warning("请选择要删除的菜单项~");
return;
}
showDialog("删除菜单", "确定删除？", function () {
remove(item);
});
}
/**
* 添加记录
*/
function add() {
//校验表单
var validate = validateForm($("#form-add"));
if (!validate) {
$.messager.warning("请正确填写相关信息~");
return false;
}
//校验combobox
var validateParentId = validateCombobox($("#form-add .easyui-combobox"), "父级菜单无效~");
if (!validateParentId) {
return false;
}
//校验icon
var iconClass = $("#form-add input[name='icon']").val();
var validateIcon = iconClass.length > 0 ? $("." + iconClass).length > 0 : false;
if (!validateIcon) {
$.messager.warning("图标无效~");
return false;
}
var data = $("#form-add").serialize(); //www-form格式:k1=v1&k2=v2
$.post({
url: '../menu/add',
data: data,
success: function (data) {
$.messager.info('添加成功~');
queryForAll();
}
});
return true;
}
/**
* 添加三级菜单
*/
function addBtn() {
//校验表单
var validate = validateForm($("#form-add-btn"));
if (!validate) {
$.messager.warning("请正确填写相关信息~");
return false;
}
//校验icon
var iconClass = $("#form-add-btn input[name='icon']").val();
var validateIcon = iconClass.length > 0 ? $("." + iconClass).length > 0 : false;
if (!validateIcon) {
$.messager.warning("图标无效~");
return false;
}
var data = $("#form-add-btn").serialize(); //www-form格式:k1=v1&k2=v2
$.post({
url: '../menu/addBtn',
data: data,
success: function (data) {
$.messager.info('添加成功~');
queryForAll();
}
});
return true;
}
/**
* 修改记录
*/
function edit() {
//校验表单
var validate = validateForm($("#form-edit"));
if (!validate) {
$.messager.warning("请正确填写相关信息~");
return false;
}
//校验combobox (设定规则：编辑下，不可变更父子关系，后端不校验关系变更，前端防控)
var id = $("#form-edit input[type='hidden']").val();
var parentId = $("#form-edit .easyui-combobox").combobox('getValue');
if (id == parentId) {
$.messager.warning("父级菜单不能指定为自身~");
return false;
}
var validateParentId = validateCombobox($("#form-edit .easyui-combobox"), "父级菜单无效~");
if (!validateParentId) {
return false;
}
//校验icon
var iconClass = $("#form-edit input[name='icon']").val();
var validateIcon = iconClass.length > 0 ? $("." + iconClass).length > 0 : false;
if (!validateIcon) {
$.messager.warning("图标无效~");
return false;
}
var data = $("#form-edit").serialize(); //www-form格式:k1=v1&k2=v2
$.post({
url: '../menu/edit',
data: data,
success: function (data) {
$.messager.info('修改成功~');
queryForAll();
}
});
return true;
}
/**
* 修改三级菜单
*/
function editBtn() {
//校验表单
var validate = validateForm($("#form-edit-btn"));
if (!validate) {
$.messager.warning("请正确填写相关信息~");
return false;
}
//校验icon
var iconClass = $("#form-edit-btn input[name='icon']").val();
var validateIcon = iconClass.length > 0 ? $("." + iconClass).length > 0 : false;
if (!validateIcon) {
$.messager.warning("图标无效~");
return false;
}
var data = $("#form-edit-btn").serialize(); //www-form格式:k1=v1&k2=v2
$.post({
url: '../menu/editBtn',
data: data,
success: function (data) {
$.messager.info('修改成功~');
queryForAll();
}
});
return true;
}
/**
* 删除记录
*/
function remove(item) {
$.post({
url: '../menu/delete',
data: {
id: item.id
},
success: function (data) {
$.messager.info('删除成功~');
queryForAll();
}
});
}
/**
* 查询
*/
function queryForAll() {
$("#grid").treegrid('load', {
keyword: ""
});
$("#dialog-add .easyui-combobox").combobox('reload');
//设定规则：编辑下，不可变更父子关系
// $("#dialog-edit .easyui-combobox").combobox('reload');
}
/**
* 搜索(不支持二级搜索，因为_parentId有效，但无parent返回，如何显示一二级与如何返回一二级结构会比较尴尬，且需兼容非搜索)
*/
function queryForSearchText() {
$("#grid").treegrid('load', {
keyword: $("#input-search").val()
});
}
/**
* 按键监听
*/
function onkeyUp(event) {
if (event.key == "Enter") {
queryForSearchText();
}
}
#### 菜单列表后端：
package com.qlslylq.javadesign.controller;
import com.qlslylq.javadesign.enums.ErrorEnum;
import com.qlslylq.javadesign.mapper.service.MenuService;
import com.qlslylq.javadesign.model.Menu;
import com.qlslylq.javadesign.model.request.MenuEditReq;
import com.qlslylq.javadesign.pojo.Pager;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.util.ArrayList;
import java.util.LinkedHashMap;
import java.util.List;
import java.util.Map;
/**
* @Description 菜单控制器
* @Author https://gitee.com/qlslylq/UnityDesign
* @link https://gitee.com/qlslylq/FlutterDesign
* @link https://gitee.com/qlslylq/AndroidDesign
**/
@Controller
@RequestMapping(value = "/menu")
public class MenuController {
@Autowired
private MenuService menuService;
/**
* 菜单列表页
*/
@RequestMapping(value = "/list", method = RequestMethod.GET)
public ModelAndView list(ModelAndView mv) {
mv.setViewName("menu/list");
return mv;
}
/**
* 一级菜单列表页
*/
@RequestMapping(value = "/getTopList", method = RequestMethod.POST)
@ResponseBody
public List