黑马程序员Java最新AI+若依框架【基础篇】学习笔记

2402_87352060

1085人浏览 · 2025-11-25 23:59:17

2402_87352060 · 2025-11-25 23:59:17 发布

1.项目搭建

1.搭建前端项目注意事项?
#安装依赖时，使用国内镜像源

npm install--registr=https://registry.npmmirror.com

1.1拉取项目

https://gitee.com/y_project/RuoYi-Vue.git

1.2导入sql

1.3修改durid-yml配置

在ruoyi-admin模块下，编辑resources目录下的application-druid.yml，修改数据库连接

1.4安装node.js

安装zip,然后解压，再新建node_cache和node_global这两个文件夹，然后将其和解压文件夹一整个添加到系统环境变量的path目录下

再配置镜像，淘宝和国内的

1.5启动

后端，还有前端启动（在前端目录通过code ./文件名打开），再npm install安装相应的插件

再npm run dev，如果端口有问题，就要在对应的文件修改启动端口

2.入门案例

利用代码生成器，生成课程管理的前后端代码

2.1准备SQL并导入数据库

2.2配置代码生成信息

代码生成配置是在系统工具菜单栏下

然后将表导入，交给若依系统管理

接着最重要的一步，点击编辑

2.2.1基本信息-实体类名称

要将其前面的Db前缀去掉

2.2.2字段信息（最重要-决定最终页面生成效果）

复选框-影响增改查

id-因为自增，所以不需要勾选插入选项

然后注意字段列名和实体类的属性名相对应

2.2.3生成信息

改为course路径

2.3下载代码并导入目录

导入重启后端即可

此时我的课程管理出现在其他的栏目

依次点击：系统管理 → 菜单管理

在菜单列表中找到 “课程管理” 这一项，点击它对应的 “修改” 按钮

找到 “上级菜单” 这个下拉选项，选择 “系统管理”（即你想要将 “课程管理” 放入的父目录）

点击 “确定” 保存修改，然后刷新页面

如果 “课程管理” 是你通过代码生成工具自动生成的，生成后默认可能是一级菜单，只需按上述步骤调整其 “上级菜单” 即可完成层级调整，不需要修改前后端代码（若依的菜单结构是通过数据库配置动态加载的）

注意事项

1.

这个字段列名要和java属性对应

物理类型要和java类型（实体类属性）对应

字段描述要和前端页面显示对应

然后就是要结合页面原型确认哪些字段需要插入

3.功能详解

3.1系统管理

3.1.1权限控制

若依框架已经实现了权限控制这部分代码的编写，我们只需要简单的功能配置即可实现同样的效果

小知识：权限控制(RBAC)

RBAC（基于角色的访问控制）：

是一种广泛使用的访问控制模型，通过角色来分配和管理用户的菜单权限

实现需要5张表，多对多关系

若依除了提供5张表外，还提供部门表，岗位表等等，其为了实现更加强大的权限控制系统，支持粗粒度（即RBAC，根据不同的用户查看的菜单是有所区别的）和细粒度（员工根据部门和岗位的设定，登陆以后查看的数据是有所区别的）权限控制

以下是表关系说明

用户

创建用户，是登录的账户，属于哪个角色

角色

创建角色，拥有哪些权限

菜单

创建菜单，出现目录模块

部门

岗位

案例

创建菜单，创建角色，创建用户

验证：使用新创建的用户登录，可以验证权限控制

若依菜单级别：目录菜单页面菜单按钮菜单

3.1.2数据字典

若依内置的数据字典，用于维护系统中常见的静态数据（不经常变动的）。例如：性别、状态 …

然后数据字典就会把他存到数据库来进行维护

功能包括：字典类型管理、字典数据管理

将静态的数据交给数据字典来管理，就能实现数据的复用性，意味着可以在一个地方编写数据，然后在多个地方使用

功能

1）字典类型管理

对于数据字典的值，他的所属分类（eg:男女性别），就是字典类型

确定好数据字典类型后，就可以在该类型下添加它对应的字典值（eg:男、女、未知）

通过这两个部分，就可以实现数据字典的基本功能了

以后：

如果需要维护自己的静态数据的话，可以先创建字典类型，然后再去添加他的字典数据，这样我们的页面就可以使用数据字典来维护静态数据了

2）字典数据管理

案例

首先，创建学科数据字典类型，然后在该数据字典类型下创建数据字典值

然后在代码生成器部分中的：显示类型将文本框改为下拉框，字典类型改为创建的学科，下载代码，然后只需要修改前端的视图组件，因为该组件已经修改为下拉框，并且从数据字典加载这些数据字典类型的标签，更换前端的index

此时，课程学科那里改为了下拉框，显示的是字典标签，点击搜索是字典标签对应的字典值0，所以没有结果，还需要修改数据库的subject字段的值。

3.1.3其他功能

参数设置

参数设置：对系统中的参数进行动态维护

通知公告

通知公告：促进组织内部信息传递。

若依仅提供管理员录入的功能，对于通知的发布、查看需要我们在此基础上程序设计界面，并编写发送邮件的代码，实现功能完整性

日志管理

日志管理：轻松追踪用户行为和系统运行状况。

可以通过定时任务，定时导出日志

3.2系统监控

3.2.1监控相关

若依提供了一些列强大的监控工具，能够帮助开发者和运维快速了解应用程序的性能状态。

3.2.2定时任务

若依为定时任务功能提供方便友好的web界面，实现动态管理任务。

直接在界面设置是否要开启以及设置定时任务

案例：

每间隔5秒，输出当前系统时间

1）创建任务类，在quartz包下

2）添加任务规则

执行策略：

立即执行：即使宕机也会执行

执行一次：执行宕机最后一个失败的

放弃执行：宕机期间不执行（一般选这个）

事务并发：订单操作和退款操作不能并发，需要关闭

3）启动任务

3.3系统工具

3.3.1表单构建

表单构建工具，只需要开发者通过图形界面和拖拽等操作，可以快速构建复杂的表单。

用零编码的方式制作漂亮的表单页面，只需要配合一些js的代码就可以实现前后端的交互

案例

通过表单构建工具，单独制作一个添加课程的表单页面

步骤

①制作表单并导出

选择页面导出并根据需要进行改名

②复制到前端工程

要指定路径!!!(文件在course目录以及修改的文件名)

③创建动态菜单

路由地址：访问路径

组件路径：按照前端工程的目录进行存放（注意文件名）

3.3.2代码生成

需求为：

明确展示层级数据的表格，就可以选择面模板为树表

然后就会出现3个选项：

树编码字段：可以选择数表的主键

树父编码字段：外键

树名称字段：最终展示给用户的

3.3.3系统接口

提供了swagger文档

总结

权限控制：

不同角色登录看到的界面不同

数据字典：

将项目常用的具体数据交给数据字典管理和维护

定时任务：

可以动态修改并提供查看详细的日志，还可以设置开关

表单构建：

提供在线表单制作工具，无需编写前端代码即可实现复杂表单的创建

代码生成：
基于三种工具，单表、树表、主子表

生成各种业务场景的前后端基础代码

在此基础上我们再进行业务开发我们就会有质量飞跃

4.项目结构

后端

后端结构

1.ruoyi-admin（后台服务）

该模块主要用于项目的启动路口

web包-通用功能（后台登录相关的权限控制相关的数据字典相关的controller类->应用于接收前端的相关请求并做出响应）

两种项目启动类

RuoYiApplication.java

基于springboot内置tomcat直接运行

RuoYiServletInitializer.java

让springboot功能打成一个war包，使用外置的tomcat容器运行项目

2.ruoyi-common（通用工具）

config:读取项目配置文件信息

xss:防止跨站脚本工具

core:核心控制代码

3.ruoyi-framework（框架核心））

aspectj:AOP，方法增强使用，存放切面类

config:系统配置，springboot集成第三方项目以后指定的配置文件（redis、mabatis）

datasource:多数据源，项目需要连接多个数据库，可以在此配置和使用

inteceptor:拦截器

manager：异步处理（多线程技术）

security：权限控制（springsecurity+RABC实现粗粒度和细粒度）

web:前端控制（全局异常处理器+登录权限认证的一些业务）

4.ruoyi-generator（代码生成可移除）

5.ruoyi-quartz（定时任务可移除）

6.ruoyi-system（系统模块）

业务层，持久以及实体类和后台服务controller结合起来实现权限控制，后台登录等相关内容

7.ruoyi-ui(前端部分)

项目中的配置

1.配置文件-ruoyi-admin（主要在这里）

1）i18n包（国际化单词的缩写，主要用于对国际化支持的）

里面提示的信息都是中文的，如果把项目卖到国外，把提示信息改成对方国家的语言即可

2）META-INF（项目的元信息【描述数据的数据】，不用修改）

3）mybatis（mybatis的相关配置）

主配置放在这里

4)application

项目核心配置代码

5)application-druid

数据库连接配置

6)banner.txt

项目启动时控制台打印的图案信息

7)logback.xml

日志相关的配置文件

模块依赖关系

admin项目跑起来就会直接或间接依赖，所有模块就可以整合在一起，项目的整体功能我们就都可以使用

前端

1.vite.config.js（vue项目的配置信息）

如：前端的端口，向后端的代理转发等

一般项目搭建的时候是不会修改的

2.package.json（重要）

前端的项目配置文件，包括项目名、版本号、依赖包等（类似pom.xml）

也就是说，如果需要使用第三方依赖，想指定自己的版本信息，就需要在这个文件进行设置

3.node_modules（第三方依赖库）

之前完成环境搭建时，下载的前端第三方依赖包，放在这

4.src(前端最重要的一个目录)

源代码存放目录（以后写代码的文件夹）

后端工程师所要操作的就是

api

router(了解即可，前端视图组件之间路由相关的代码)

view

数据库表结构

5.源码阅读

前端代码分析

入门案例中，基于代码生成器生成前端代码（包含两份文件）

api/course/course.js

用于向后端发送ajax请求的api接口代码

代码介绍

views/course/course/index.vue（基于vue3+elementplus）

用于在浏览器展示课程管理的视图组件

标签	核心作用	关注点
`<template>`	定义视图结构与渲染逻辑	页面 “显示什么”“怎么显示”
`<script>`	定义数据与业务逻辑	页面 “如何工作”“数据管理”