jeecg-boot

简介: JeecgBoot 是一个基于 Spring Boot 和 Vue3 的低代码开发平台,支持快速构建企业级应用。平台提供源码下载、技术架构清晰,涵盖前后端详细配置及代码生成指南。用户可通过 GitHub 获取源码,使用 IDEA 和 WebStorm 开发,结合 MySQL、Redis 等组件实现系统搭建。平台内置代码生成功能,支持表单开发、菜单配置与权限管理,便于快速实现增删改查等业务需求。

一、源码下载

二、技术架构


后端

  • IDE建议: IDEA (必须安装lombok插件 )
  • 语言:Java 8+ (支持17)
  • 依赖管理:Maven
  • 基础框架:Spring Boot 2.7.18
  • 微服务框架: Spring Cloud Alibaba 2021.0.1.0
  • 持久层框架:MybatisPlus 3.5.3.2
  • 报表工具: JimuReport 1.7.6
  • 安全框架:Apache Shiro 1.12.0,Jwt 3.11.0
  • 微服务技术栈:Spring Cloud Alibaba、Nacos、Gateway、Sentinel、Skywalking
  • 数据库连接池:阿里巴巴Druid 1.1.22
  • 日志打印:logback
  • 缓存:Redis
  • 其他:autopoi, fastjson,poi,Swagger-ui,quartz, lombok(简化代码)等。
  • 默认数据库脚本:MySQL5.7+
  • 其他数据库,需要自己转

前端

  • 前端IDE建议:WebStorm、Vscode
  • 采用 Vue3.0+TypeScript+Vite+Ant-Design-Vue等新技术方案,包括二次封装组件、utils、hooks、动态菜单、权限校验、按钮级别权限控制等功能
  • 最新技术栈:Vue3.0 + TypeScript + Vite5 + ant-design-vue4 + pinia + echarts + unocss + vxe-table + qiankun + es6
  • 依赖管理:node、npm、pnpm

注:node需要20版本的,其他版本可能会导致运行报错

开发可能需要用到的软件以及环境:百度网盘 请输入提取码 (baidu.com)

三、IDEA启动项目

采用IDEA启动前后端项目

前提: 后台开发环境 前端开发环境 都已经安搭建完成。

一、启动JAVA项目 jeecg-boot

1. 初始化数据库

要求 mysql5.7+

  • 执行Sql脚本: jeecg-boot/db/jeecgboot-mysql-5.7.sql
  • 脚本作用:会自动创建库jeecg-boot, 并初始化数据 。
  • 启动本地redis

2. 安装Maven依赖

  • 通过右侧父POM进行install(下载依赖和打包)

3. 修改配置文件

配置文件: jeecg-module-system/jeecg-system-start/src/main/resources/application-dev.yml

  • 数据库配置
  • redis配置

4. 启动项目

  • 右键执行下面类,启动项目
jeecg-system-start/src/main/java/org/jeecg/JeecgSystemApplication.java

5. 访问接口文档

http://localhost:8080/jeecg-boot/doc.html

二、启动Vue3前端 jeecgboot-vue3

1. 下载前端依赖

执行命令pnpm i 或者双击 pinstall或者使用yarn install

依赖安装成功提示

2. 配置后台接口

  • 修改接口地址 .env.development(可不改)
# 跨域代理,您可以配置多个, 请注意没有换行符
VITE_PROXY = [["/jeecgboot","http://localhost:8080/jeecg-boot"],["/upload","http://localhost:3300/upload"]]
#后台接口全路径地址(必填)
VITE_GLOB_DOMAIN_URL=http://localhost:8080/jeecg-boot

3.启动前端项目

点击命令 dev 启动项目或者使用npm run dev进行启动

4.访问系统

通过 http://localhost:3100 访问前端项目
默认账号密码: admin/123456

注:前端也可采用vscode进行启动看个人喜好。

四、简单的表单代码生成

1.在jeecgboot低代码平台的online表单开发功能处选择新增表单

2.输入参数并且添加属性

3.在页面属性这里将处理状态的控件类型选择为下拉框

4.在校验字段这为处理状态配置含有对应的下拉框内容的表单随后保存

5.勾选表单同步数据库并且生成代码

6.选择生成的代码位置,设置好表名,实体类名,跟包名。代码生成位置需要自己能够找到

五、生成代码放入前后端

1.代码文件夹讲解

根据生成代码的位置找到你设置好的包名,我这里是jeecg_boot_erp,打开它

其中vue3是前端代码,uniapp是小程序代码,其余的为后端代码,其中vue3内存放着表sql语句

2.后端代码放入

后端代码路径:

jeecgboootmuster\jeecg-boot\jeecg-module-demo\src\main\java\org\jeecg\modules\demo\

在这个路径新建文件夹(我这为willdo)存放后端代码,将前面文件夹中的后端代码全部copy到这个文件夹中

3.前端代码放入

代码路径:src\views\

在views下新建文件夹willdo,将前面vue3文件夹中的内容全部copy进来

注:这里的文件夹不能随意取名,需要打开生成的sql语句看要求

4.重新启动前后端

六、菜单管理与授权

1.菜单配置

重新启动项目后进入到系统管理中的菜单管理选择新增菜单

选择相关配置可以按个人喜好

其中的访问路径是需要跟你后端controller中的主路径一致

注:路径最好为"/"不要为"\"可能会导致报错

前端组件这是要找到你前端创建的文件夹中带有xxxList.vue的文件的相对路径,需要删除掉在你创建的文件夹前边的文件参数

例如我的相对路径为:src\views\willdo\AgencyList.vue

前端组件应该填入为:willdo/AgencyList

2.授权

保存好后进入角色管理菜单,找到管理员进行授权

将你创建的菜单全部勾上(我这里是代办列表),点保存,然后刷新就可以了。

七、需求测试

1.完成一个小功能,自定义一个代办列表:标题,内容,开始时间,结束时间,处理人,处理状态(下拉选项:0-未处理;1-已处理;2-作废)。
对列表的内容进行增删查改(其实就是平台的代码导出功能生成的代码功能),重点要求:在新增数据的时候,”标题“是由后台返回的系统时间,这就需要自定义接口去获取内容。日期需要前后端同时做校验,结束日期不能小于开始日期。(法本农商银行笔试题)

2.现有一张表,zhrj_scada_event(告警事件表)。表结构如下所示:

1:告警事件表(zhrj_scada_event

该表记录了一段时间内终端设备(RTU)及其通道的投入(在线)、退出(离线)状态数据。

需要实现的功能:

完成表单的在线创建,生成代码进行简单的增删改查。

相关文章
|
8天前
|
人工智能 运维 安全
|
6天前
|
人工智能 异构计算
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
|
7天前
|
机器学习/深度学习 人工智能 自然语言处理
B站开源IndexTTS2,用极致表现力颠覆听觉体验
在语音合成技术不断演进的背景下,早期版本的IndexTTS虽然在多场景应用中展现出良好的表现,但在情感表达的细腻度与时长控制的精准性方面仍存在提升空间。为了解决这些问题,并进一步推动零样本语音合成在实际场景中的落地能力,B站语音团队对模型架构与训练策略进行了深度优化,推出了全新一代语音合成模型——IndexTTS2 。
639 22
|
7天前
|
人工智能 测试技术 API
智能体(AI Agent)搭建全攻略:从概念到实践的终极指南
在人工智能浪潮中,智能体(AI Agent)正成为变革性技术。它们具备自主决策、环境感知、任务执行等能力,广泛应用于日常任务与商业流程。本文详解智能体概念、架构及七步搭建指南,助你打造专属智能体,迎接智能自动化新时代。
|
13天前
|
人工智能 JavaScript 测试技术
Qwen3-Coder入门教程|10分钟搞定安装配置
Qwen3-Coder 挑战赛简介:无论你是编程小白还是办公达人,都能通过本教程快速上手 Qwen-Code CLI,利用 AI 轻松实现代码编写、文档处理等任务。内容涵盖 API 配置、CLI 安装及多种实用案例,助你提升效率,体验智能编码的乐趣。
1041 110
人工智能 数据可视化 数据挖掘
231 0