RuoYi-Vue-Pro 文档

Appearance

2026-06-11
1371
5.8m

大屏设计器 ​

数据可视化，一般可以通过报表设计器、或者大屏设计器来实现。本小节，我们来讲解大屏设计器的功能开启。 大屏设计器，指的是通过拖拽图表或页面元素，无需编写代码即可制作数据大屏。如下图所示： 大屏设计器 在项目中，通过集成市面上的报表引擎，实现了大屏设计器的能力。目前使用如下：

是否集成是否开源
AJ-Report已经开源
Go-View已集成开源
JimuReport已集成不开源

# 1. 功能开启 ​

yudao-module-report 也实现了大屏设计器的能力，考虑到编译速度，默认是关闭的。开启步骤如下：

  • 第一步，开启 yudao-report-report 模块
  • 第二步，导入报表的 SQL 数据库脚本
  • 第三步，启动后端项目，确认功能是否生效
  • 第四步，启动大屏设计器的前端项目

# 1.1 第一步，开启模块 ​

① 修改根目录的 pom.xml 文件，取消 yudao-module-report 模块的注释。 引入 模块 ② 修改 yudao-server 目录的 pom.xml 文件，引入 yudao-module-report 模块。如下图所示： 引入 依赖 ③ 点击 IDEA 右上角的【Reload All Maven Projects】，刷新 Maven 依赖。如下图所示： 刷新 Maven 依赖

# 1.2 第二步，导入 SQL ​

① （如果使用 Go-View 的话）下载 go-view.sql 脚本，并导入数据库，初始化 Go-View 相关的表结构和数据。 友情提示：↑↑↑ go-view.sql 是可以点击下载的！ ↑↑↑ 导入 SQL 脚本 ② （如果使用 JimuReport 的话）下载 jimureport.mysql5.7.create.sql 脚本，并导入数据库，初始化 JimuReport 相关的表结构和数据。如果你是 Oracle、PostgreSQL 等其它数据库，需要自己使用 Navicat 进行转换。 友情提示：↑↑↑ jimureport.mysql5.7.create.sql 是可以点击下载的！ ↑↑↑

# 1.3 第三步，启动后端项目 ​

启动后端项目，看到 "Init JimuReport Config [ 线程池 ] " 说明开启成功。

# 1.4 第四步，启动前端项目（AJ-Report） ​

TODO 开发中，预计 4 月份左右。

# 1.4 第四步，启动前端项目（Go-View） ​

① 克隆 yudao-ui-go-view 项目，执行如下命令进行启动：

安装 pnpm，提升依赖的安装速度 ​

npm config set registry https://registry.npmmirror.com npm install -g pnpm

安装依赖 ​

pnpm install

启动服务 ​

npm run dev ② 启动完成后，浏览器会自动打开 http://127.0.0.1:3000 地址，可以看到前端界面。 前端界面 ③ 访问 [报表管理 -> 大屏设计器] 菜单，可以查看对应的功能。如下图所示： 前端界面

# 1.5 第四步，启动前端项目（JimuReport） ​

① 它的前端，已经内嵌到了后端项目中，所以无需启动。 ② 访问 [报表管理 -> BI 设计器] 菜单，可以查看对应的功能。如下图所示： 前端界面 ps：目前 JimuReport 有个报错，需要等 1.9.5 版本全量发布！！！

# 2. 如何使用？ ​

# 2.1 AJ-Report 大屏设计器 ​

TODO 开发中，预计 4 月份左右。

# 2.2 Go-View 大屏设计器 ​

可以查看 Go-View 的官方文档，主要是：

# 2.3 JimuReport 仪表盘设计器 ​

可以查看 JimuReport 的官方文档，主要是：

最近更新