SpringBoot 多模块 + Vue 的简洁版后台管理系统
接口链接：http://49.235.248.222:9090/doc.html/
超级管理员账号：nanjustar 密码：123456
普通管理员账号：admin 密码：123456
GitHub地址：https://github.com/duan-nan/nanjustar-template
Gitee地址： https://gitee.com/duan_nan/nanjustar-template
- 界面效果优化，使界面更加丝滑顺畅。（动画优化）
- 完成菜单管理界面部分功能（部分功能）
- 新增图标库到项目中（Elementui 图标）
- 新增日志管理记录（aop + 自定义注解）
- 新增在线预览
为什么要做这个项目呢？因为我主要是做java的，平时学习做项目过程中一直在开发后端接口🖌，枯燥的后端开发让我决定自己开发界面🧐。
vue 端学习一直顺风顺水🤗，直到我决定要自己去搭建后台。。我发现页面端布局、侧边菜单的布置、顶部历史菜单的设计 让我抱头痛哭😭，我开始转向了开源项目...
看着开源项目的预览，真的棒，我要用！！！👍 但是问题页随之而来 *npm install Error*是什么鬼👀？？ 经历了千辛万苦终于把依赖拉下来了！！😄 但是这这代码好多啊！这么多js！封装这么严重！看不懂啊🤔！！！ 最终你选择去寻找简洁版的后台管理界面！🥺
是的，我想说的就是 我就是你要找的简洁版后台管理界面😎。我们以及搭建好了侧边栏、面包屑、以及顶部历史菜单。 剩下了所有的界面都由你来设计🤠，来完成你自己的作品。
如果我的项目可以帮到你，请点亮一个小小的star 🌟🌟
项目地址：GItee: https://gitee.com/duan_nan/nanjustar-template
🌟🌟🌟nanjusatr-admin是我们的前端项目。🌟🌟🌟
⭐️⭐️⭐️nanjustar是我们的后端项目。⭐️⭐️⭐️
🌈🌈🌈nanjustar.sql 是我们需要使用到的数据库文件，数据库需要使用MySql 8以上的版本。🌈🌈🌈
☀️☀️☀️我们将项目直接拉取到本地之后，只需要进行简单的配置即可启动使用。☀️☀️☀️
数据库：
在本地中新建数据库 nanjustar（也可以根据自身需求进行更改名称），之后运行nanjustar.sql文件。后端配置：
1. 数据库配置
我们进入到 nanjustar-mapper 模块中，找到 application-mapper.yml 配置文件进行配置修改,修改数据库url至自己到数据库位置，修改username和password。
2. Redis配置
我们进入到 nanjustar-business 模块中，找到 application-bussiness.yml 配置文件进行配置修改，修改reids 到主机名称，修改至自己redis的即可。前端配置：
前端项目只需要执行 npm install 或 cnpm install 即可✨✨✨前后端项目启动之后，我们有两个用户 nanjustar/123456（超级管理员） 和 admin/123456 （管理员），超级管理员拥有权限管理目录的权限，而管理员并不拥有，所以他们的前端侧边栏菜单是不一样的。✨✨✨
后端项目结构：
├──nanjusatr -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar父工程
├── nanjustar-api -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar-api模块
├── src
├── java
├── moudle
├── security -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 权限模块
├── api -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 业务接口
├── dto -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- dto数据返回类
├── model -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 实体类
├── vo -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- vo参数接收类
├── resource
├── application-api.yml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- api模块配置文件
├── pom.xml
├── nanjustar-business -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar业务模块
├── src
├── java
├── business -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 业务实现类
├── config -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 配置类
├── filter -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 过滤器包
├── handler -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 处理器包
├── util -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 工具包
├── resource
├── application-business.yml -- -- -- -- -- -- -- -- -- -- -- -- -- business模块配置文件
├── pom.xml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar业务模块 Pom文件
├── nanjustar-common -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar共用模块
├── src
├── java
├── annotation -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 注解包
├── aop -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 切面包
├── config -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 配置包
├── constant -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 常量包
├── core -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 基础包
├── enums -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 枚举包
├── exception -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 自定义异常包
├── result -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 统一结果集包
├── utils -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 工具包
├── resource
├── application-common.yml
├── pom.xm -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar共用模块 Pom文件
├── nanjustar-mapper -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar数据模块
├── src
├── java
├── config -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 数据库配置
├── handler -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- handler处理器
├── mapper -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- *.Mapper接口
├── resource
├── mapper -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- mapper.xml 存放位置
├── application-mapper.yml - -- -- -- -- -- -- -- -- nanjustar数据模块 配置文件
├── pom.xml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar数据模块 Pom文件
├── nanjustar-web -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar-wen 模块
├── src
├── java
├── controller -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar controller
├── NanjustarApplication.java -- -- -- -- -- -- -- -- -- -- -- nanjustar主启动类
├── resource
├── application.yml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar-web 配置文件
├── application-dev.yml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar-web 配置文件
├── pom.xml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar-web Pom文件
├── pom.xml -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nanjustar父工程Pom文件
前端项目结构：
nanjustar-admin
├── public
├── js -- -- -- -- -- -- js文件夹
├── lottie.js -- -- -- -- -- -- 动画js
├── favicon.ico -- -- -- -- -- -- Logo 图标
├── index.html -- -- -- -- -- -- index.html
├── src
├── api -- -- -- -- -- -- api接口目录
├── assets -- -- -- -- -- -- 静态资源目录
├── component -- -- -- -- -- -- 组件目录
├── layout -- -- -- -- -- -- 布局目录
├── router -- -- -- -- -- -- 路由目录
├── store -- -- -- -- -- -- 缓存目录
├── utils -- -- -- -- -- -- 工具目录
├── views -- -- -- -- -- -- 界面目录
├── App.vue -- -- -- -- -- -- App.vue
├── main.js -- -- -- -- -- -- main.js
├── babel.config.js
├── package.json -- -- -- -- -- -- package.json
├── package-locak.json
├── vue.config.js -- -- -- -- -- -- vue.config.js
- 后端开发参考“若依开源项目”，“风宇个人博客”进行开发。
- 后台使用"element-ui"设计，侧边栏，历史标签，面包屑自动生成等。
- 前台菜单路由通过数据库查询，根据登陆用户的权限等级进行获取渲染，实现权限分级。
- 登陆界面采用 lottie 动画，极大的提升了项目的美观度。
- 后台界面仅开发欢迎界面，给使用者留下足够空间，便于进行二次开发。
- 前端代码层次简单，没有进行严重封装，便于后段开发者阅读扩展开发。
- 代码遵循阿里巴巴开发规范，代码整洁，便于进行二次开发。
| 开发工具 | 说明 |
|---|---|
| IDEA | Java开发工具IDE |
| WebStorm | Vue开发工具IDE |
| Navicat | MySQL远程连接工具 |
| Medis | Redis远程连接工具 |
| 开发环境 | 版本 |
|---|---|
| JDK | 1.8 |
| MySQL | 8.0.25 |
| spring-Redis | 2.5.5 |
| Vue | 2.6.11 |
| Vex | 3.4.0 |
