1. 项目拉取

1.1 介绍

该项目采用若依的脚手架搭建

官网地址:RuoYi 若依官方网站

前后端分离版Git地址:RuoYi-Vue

1.2 下载最新的发行版本

最新的发行版本是3.8.2

image-20220522154440613

1.3 目录结构如下

image-20220522154547873

2. 项目运行

2.1 准备数据库

  • 创建数据库

    create database tienchin;
    
  • 创建用户

    -- 创建用户tienchin,%代表任何IP都能连接到MySql服务器
    create user 'tienchin'@'%' identified by 'tienchin_hlh';
    -- 刷新权限
    flush privileges;
    
  • 赋予数据库权限

    //给用户tienchin权限
    //其中第一个*代表数据库通配符(如该用户只能操作数据库A,则修改为A.*),第二个*代表数据表通配符(如该用户只能操作数据库A中的a1表,则修改为A.a1)
    //with gran option表示该用户可给其它用户赋予权限,但不可能超过该用户已有的权限(比如test_user用户有select,insert权限,也可给其它用户赋权,但它不可能给其它用户赋delete权限,除了select,insert以外的都不能)
    //all privileges可换成select,update,insert,delete,drop,create等操作(grant select,insert,update,delete on *.* to 'test_user'@'%';)
    
    -- 不可以分配权限的
    grant select,update,insert,delete,create on tienchin.* to 'tienchin'@'%';
    -- 可以分配权限的
    grant select,update,insert,delete,create on tienchin.* to 'tienchin'@'%' with grant option;
    -- 刷新权限
    flush privileges;
    
  • 执行根目录下的sql/ry_20210908.sql文件

2.2 修改配置文件和日志文件

  • 修改配置文件中的src/main/resources/application.yml的redis配置和上传文件路径

    image-20220522161455686

    image-20230225220317689

  • 修改日志文件src/main/resources/logback.xml中的日志保存路径

    image-20220522161559291

2.3 启动后端项目

启动项目:src/main/java/com/ruoyi/RuoYiApplication.java

2.4 运行前段项目

前段项目:ruoyi-ui

安装项目依赖:npm install

运行项目:npm run dev

2.5 查看项目是否正常运行

image-20220522162206685

3. 修改公司规范

3.1 后端代码格式规范

若依内部的格式是格式有一部分不是通用的格式,一般建议针对整个项目的java文件格式化一下

在项目根目录上点击选中,使用快捷键Ctrl + Alt + L,选择格式化java文件

image-20220522162601929

3.2 项目结构大改造-后端

3.2.1 修改项目名称

修改项目名称和前段项目名称中的ruoyi -> tienchin

Shirft+F6修改所有的模块名 ruoyi --> tienchin

修改pom文件中的名称和所在组

修改版本为3.8.2 --> 1.0.0

3.2.2 修改包名 com.ruoyi -> cn.sea.clouds.tienchin

修改java类所在的包名:检查mapper文件

3.2.3 修改配置文件和启动类的名称

批量替换配置文件中的:com.ruoyi -> cn.sea.clouds.tienchin

修改启动类名称

修改配置类java中带Ruoyi的

3.2.4 修改作者名称

批量替换:@author ruoyi -> @author hlh

3.2.5 修改文件中的ruoyi

全部排查所有的文件中,带ruoyi的: ruoyi -> tienchin

全部排查所有的文件中,com.ruoyi --> cn.sea.clouds

3.2.6 全局查找替换:若依 --> TienChin健身

全局查找替换:若依 --> TienChin健身

3.2.7 修改端口

修改端口:8080 -> 10002

3.2.8 修改CaptchaConfig类中的KAPTCHA_TEXTPRODUCER_IMPL配置

cn.sea.clouds.tienchin.framework.config.CaptchaConfig中 79 行

properties.setProperty(KAPTCHA_TEXTPRODUCER_IMPL, "cn.sea.clouds.tienchin.framework.config.KaptchaTextCreator");

3.2.9 修改banner.txt

在网址:Spring Boot banner在线生成工具,制作下载banner.txt,修改替换banner.txt文字实现自定义,个性化启动banner-bootschool.net上可以自定义制作banner

3.3 项目结构大改造-前端

3.3.1 修改若依 -> TienChin健身

3.3.2 全局替换3.8.2 -> 1.0.0

3.3.3 全局替换ruoyi -> tienchin

3.3.4 全局替换RuoYi -> TienChin

3.3.5 修改后端的代理端口8080 -> 10002

3.3.6 修改前端运行端口80 -> 10001

3.3.7 尝试运行,解决错误

修改 src/utils/ruoyi.js -> tienchin.js

src/components/RuoYi -> TienChin

src/assets/styles/ruoyi.scss -> tienchin.scss

3.4 前后端运行,正常访问项目

image-20220524211536971

image-20220524211853085

4. 项目结构介绍

4.1 后端结构

com.ruoyi     
├── common            // 公共工具类
│       └── annotation                    // 自定义注解
│       └── config                        // 全局配置
│       └── constant                      // 通用常量
│       └── core                          // 核心控制
│       └── enums                         // 通用枚举
│       └── exception                     // 通用异常
│       └── filter                        // 过滤器处理
│       └── utils                         // 通用类处理
├── framework         // 框架核心 配置类,配置了系统的一些东西
│       └── aspectj                       // 注解实现
│       └── config                        // 系统配置
│       └── datasource                    // 数据权限
│       └── interceptor                   // 拦截器
│       └── manager                       // 异步处理
│       └── security                      // 权限控制
│       └── web                           // 前端控制
├── ruoyi-generator   // 代码生成(可移除)
├── ruoyi-quartz      // 定时任务(可移除)
├── ruoyi-system      // 系统代码
├── ruoyi-admin       // 后台服务
├── ruoyi-xxxxxx      // 其他模块

4.2 前端结构

├── build                      // 构建相关  
├── bin                        // 执行脚本
├── public                     // 公共文件
│   ├── favicon.ico            // favicon图标
│   └── index.html             // html模板
│   └── robots.txt             // 反爬虫
├── src                        // 源代码
│   ├── api                    // 所有请求
│   ├── assets                 // 主题 字体等静态资源
│   ├── components             // 全局公用组件
│   ├── directive              // 全局指令
│   ├── layout                 // 布局
│   ├── router                 // 路由
│   ├── store                  // 全局 store管理
│   ├── utils                  // 全局公用方法
│   ├── views                  // view
│   ├── App.vue                // 入口页面
│   ├── main.js                // 入口 加载组件 初始化等
│   ├── permission.js          // 权限管理
│   └── settings.js            // 系统配置
├── .editorconfig              // 编码格式
├── .env.development           // 开发环境配置
├── .env.production            // 生产环境配置
├── .env.staging               // 测试环境配置
├── .eslintignore              // 忽略语法检查
├── .eslintrc.js               // eslint 配置项
├── .gitignore                 // git 忽略项
├── babel.config.js            // babel.config.js
├── package.json               // package.json
└── vue.config.js              // vue.config.js

5. 接口响应结果分析

5.1 返回对象类

在若依框架中,返回对象主要封装为两个类:TableDataInfoAjaxResult

  • TableDataInfo:主要是用于标准的分页接口返回

    位于:cn.sea.clouds.tienchin.common.core.page.TableDataInfo

  • AjaxResult:主要用于其他接口的返回,除了code和msg之外,其他返回参数自定义

    位于:cn.sea.clouds.tienchin.common.core.domain.AjaxResult

5.1.1 TableDataInfo 标准分页列表接口返回对象

TableDataInfo返回体接口如下:(都是固定的key、value,不可以自定义)

image-20230226085053331

eg:岗位查询接口

image-20230226085448843

5.1.2 AjaxResult 自定义返回对象接口

AjaxResult结构如下:

​ 继承了HashMap<String, Object>,因此自由度更高,可以传递任何值,但是又固定了几个常用的key,code、msg、data

image-20230226085323574

eg:岗位查询单个的接口

image-20230226085507126

eg:用户查询单个接口,设计到用户的岗位和角色列表,返回数据自定义程度高

image-20230226085610834

5.2 返回code状态码

code状态码的定义位于:cn.sea.clouds.tienchin.common.constant.HttpStatus

Logo

快速构建 Web 应用程序

更多推荐