1、之前在做 ITAEM团队 的官网,需要做一个用户端(对外宣传,要求极致),一个后台管理端(自己人用,要求不高)。
2、当初 Python 开发,选择 Django,因其自带后台管理系统,因此可以很愉快地省了一个端。
3、但现在业务主流还是用 Java,笔者就想 Java 也能实现,无独有偶,guns 就是其中之一,且秀上一百倍。
GitHub地址:https://github.com/stylefeng/Guns
码云地址:https://gitee.com/naan1993/guns
git clone https://github.com/stylefeng/Guns.git
建立一个 guns 数据库,执行官方sql:
https://github.com/stylefeng/Guns/blob/master/guns-admin/sql/guns.sql
修改其中的所有数据源为你的 —— url、username、password:
https://github.com/stylefeng/Guns/blob/master/guns-admin/src/main/resources/application.yml
如把所有的
url: jdbc:mysql://127.0.0.1:3306/guns?autoReconnect=true&useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=CONVERT_TO_NULL&useSSL=false&serverTimezone=UTC
username: root
password: root
改为
url: jdbc:mysql://121.79.167.130:3306/guns?autoReconnect=true&useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=CONVERT_TO_NULL&useSSL=false&serverTimezone=UTC
username: root
password: 123
其他不用改就可以正常启动项目
运行:
https://github.com/stylefeng/Guns/blob/master/guns-admin/src/main/java/com/stylefeng/guns/GunsApplication.java
用户名:admin
(超级用户)
密码:111111
(数据库中的password是md5加密的)
如笔者的文章中的 blog
SET FOREIGN_KEY_CHECKS=0;
DROP TABLE IF EXISTS `t_blog`;
CREATE TABLE `t_blog` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`author` varchar(200) COLLATE utf8_unicode_ci DEFAULT NULL,
`date` datetime DEFAULT NULL,
`link` varchar(1000) COLLATE utf8_unicode_ci DEFAULT NULL,
`tag` int(11) DEFAULT NULL,
`title` varchar(200) COLLATE utf8_unicode_ci DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=54 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
INSERT INTO `t_blog` VALUES ('49', '3456', '2018-08-29 19:09:57', '3456', '3546', '356354');
INSERT INTO `t_blog` VALUES ('50', 'tuyi', '2018-08-30 13:23:03', 'tui', '1', 'iuitu');
INSERT INTO `t_blog` VALUES ('52', 'wertwr', '2018-08-30 13:24:52', 'wertwert', '1', '52435');
点击左侧菜单栏【代码生成】,
填好:
①作者(注释用到)、
②业务名称(注释用到)、
③模块名称(包名、类名等用到)、
④父级菜单名称(菜单显示的位置,以后可以改)、
⑤数据库表(一张)、
⑥模板(一般选择所有)
点击图左边的【生成】
本项目是 git
命令下载下载的,具有 git
文件标识,红色的为新增
图中新增的有 service
、controller
,
这只是冰山一角,如 system 里边也有 dao
、model
执行上图中的 Blog.sql
,都是插入的,如其中的一条,
INSERT INTO `guns`.`sys_menu` (`id`, `code`, `pcode`, `pcodes`, `name`, `icon`, `url`, `num`, `levels`, `ismenu`, `tips`, `status`, `isopen`) VALUES ('1036451800774975495', 'blog_detail', 'blog', '[0],[blog],', '博客管理详情', '', '/blog/detail', '99', '2', '0', NULL, '1', '0');
推测为生成菜单项
点击【系统管理】->【菜单管理】
到最下面,可见有刚刚插入的记录生成的备用菜单
点击生成的【博客管理】,点击上方的【修改】,可以修改【父级编号】,可以修改其未来显示的位置
左边菜单栏【系统管理】->【角色管理】
选择用户,点击上面的【修改】,勾选可见菜单项,点击【保存】,刷新页面
效果如下
但是界面的数据项,CRUD时,都是没有 label 名称的,如绿色框中的
首先优化显示的所有数据,其他同理,以后其他项目的修改代码的位置,类似
位置:Guns\guns-admin\src\main\webapp\static\modular\blogmanage\blog\blog.js
/**
* 初始化表格的列
*/
Blog.initColumn = function () {
return [
{field: 'selectItem', radio: true},
{title: '', field: 'id', visible: true, align: 'center', valign: 'middle'},
{title: '', field: 'author', visible: true, align: 'center', valign: 'middle'},
{title: '', field: 'date', visible: true, align: 'center', valign: 'middle'},
{title: '', field: 'link', visible: true, align: 'center', valign: 'middle'},
{title: '', field: 'tag', visible: true, align: 'center', valign: 'middle'},
{title: '', field: 'title', visible: true, align: 'center', valign: 'middle'}
];
};
修改为如下,其实就是给个 title
值
/**
* 初始化表格的列
*/
Blog.initColumn = function () {
return [
{field: 'selectItem', radio: true},
{title: 'id', field: 'id', visible: true, align: 'center', valign: 'middle'},
{title: '作者', field: 'author', visible: true, align: 'center', valign: 'middle'},
{title: '日期', field: 'date', visible: true, align: 'center', valign: 'middle'},
{title: '链接', field: 'link', visible: true, align: 'center', valign: 'middle'},
{title: '1/0:显/否', field: 'tag', visible: true, align: 'center', valign: 'middle'},
{title: '标题', field: 'title', visible: true, align: 'center', valign: 'middle'}
];
};
位置:Guns\guns-admin\src\main\java\com\stylefeng\guns\modular\blogmanage\controller\BlogController.java
原代码
/**
* 获取博客管理列表
*/
@RequestMapping(value = "/list")
@ResponseBody
public Object list(String condition) {
return blogService.selectList(null);
}
改为(增加个条件利用)
/**
* 获取博客管理列表
*/
@RequestMapping(value = "/list")
@ResponseBody
public Object list(String condition) {
if(ToolUtil.isAllEmpty(condition)){
return blogService.selectList(null);
}
EntityWrapper blogEntityWrapper = new EntityWrapper();
Wrapper title = blogEntityWrapper.like("title", condition);
return blogService.selectList(title);
}
这里需要一定的 mybatis-plus 基础:在 SpringBoot 中引入 MyBatisPlus 之 常规操作
位置:Guns\guns-admin\src\main\webapp\WEB-INF\view\blogmanage\blog\blog_add.html
原码
<div class="row">
<div class="col-sm-6 b-r">
<#input id="id" name="" underline="true"/>
<#input id="author" name="" underline="true"/>
<#input id="date" name=""/>
div>
<div class="col-sm-6">
<#input id="link" name="" underline="true"/>
<#input id="tag" name="" underline="true"/>
<#input id="title" name="" underline="true"/>
div>
div>
改为(增加个name)
<div class="row">
<div class="col-sm-6 b-r">
<#input id="author" name="作者" underline="true"/>
<#input id="date" name="日期" type="date" underline="true" clickFun="laydate({istime:false,format:'YYYY-MM-DD'})" />
div>
<div class="col-sm-6">
<#input id="link" name="链接" underline="true"/>
<#input id="tag" name="显否:1/0" underline="true"/>
<#input id="title" name="标题" underline="true"/>
div>
div>
位置:Guns\guns-admin\src\main\webapp\WEB-INF\view\blogmanage\blog\blog_edit.html
<div class="row">
<div class="col-sm-6 b-r">
<#input id="id" name="" value="${item.id}" underline="true"/>
<#input id="author" name="" value="${item.author}" underline="true"/>
<#input id="date" name="" value="${item.date}" />
div>
<div class="col-sm-6">
<#input id="link" name="" value="${item.link}" underline="true"/>
<#input id="tag" name="" value="${item.tag}" underline="true"/>
<#input id="title" name="" value="${item.title}" />
div>
div>
改为(增加个name)
<div class="row">
<div class="col-sm-6 b-r">
<#input id="id" name="id" value="${item.id}" underline="true"/>
<#input id="author" name="作者" value="${item.author}" underline="true"/>
<#input id="date" name="日期" value="${item.date}" type="date" underline="true" clickFun="laydate({istime:false,format:'YYYY-MM-DD'})" />
div>
<div class="col-sm-6">
<#input id="link" name="链接" value="${item.link}" underline="true"/>
<#input id="tag" name="显否:1/0" value="${item.tag}" underline="true"/>
<#input id="title" name="标题" value="${item.title}" />
div>
div>
没有问题,不用改
SpringBoot
整合其他优秀的开源框架的案例,
如:mybatis-plus
、shiro
、beetl
等。(Guns v5.0 剔除了shiro)
①如:代码为 rest 风格
②如:配置 MySQL:各种参数,处理周到,值得借鉴
jdbc:mysql://127.0.0.1:3306/guns?autoReconnect=true&useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=CONVERT_TO_NULL&useSSL=false&serverTimezone=UTC
③如:guns 封装好的 web-upload-object.js
,
https://github.com/stylefeng/Guns/blob/master/guns-admin/src/main/webapp/static/js/common/web-upload-object.js
让图片的上传功能只须2行代码,我们大可复用 web-upload-object.js
到其他项目中。
var avatarUp = new $WebUpload("avatar");
avatarUp.init();
1、API文档:
github 上的试看版,点击进入,完整版是要收费的
2、使用版本注意:
目前码云上面的最新的版本是 V5.0
,pom 有问题
而GitHub上的最新的版本是 V4.2
,一切正常
3、或许现在觉得很麻烦,熟悉了这些常规操作,以后是分分钟钟的事情,令人大呼过瘾。