1.项目后端结构如下
2.pom文件中引入积木报表最新依赖
此处引入的是1.6.0版本,如需要最新版本可以从 积木报表官网 - JimuReport报表,免费的企业级Web报表工具 中查询到
3.执行初始化脚本,在项目的数据库中导入积木报表所需的公共表
下载链接:https://github.com/jeecgboot/JimuReport/tree/master/db
网盘链接:链接:https://pan.baidu.com/s/1TJQuB8YRel1uyUp55gPRkg
提取码:jmdt
在项目数据库中运行下载好的sql文件即可
4.在RuoYiApplication主程序中添加积木扫描目录
@SpringBootApplication(exclude = { DataSourceAutoConfiguration.class },scanBasePackages = {"org.jeecg.modules.jmreport","com.hotspot"})
注:根据自己项目的包名调整代码,我自己的是com.hotspot,默认是com.ruoyi
5.项目若没有加入Token机制,则需要SecurityConfig进行拦截排除
添加:
.antMatchers("/jmreport/**").anonymous()
6.启动项目访问
若依默认端口是8848
积木报表访问地址:http://localhost:8848/jmreport/list
7.集成积木报表访问地址到若依系统里面(如集成到菜单)
a.创建前端页面
<template> <div v-loading="loading" :style="'height:'+ height"> <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" /> </div> </template> <script> import { getToken } from '@/utils/auth' import { indexUrl } from '@/api/report/jimu' export default { name: "Ureport", data() { return { src: "", height: document.documentElement.clientHeight - 94.5 + "px;", loading: true, }; }, created() { indexUrl().then(res => { this.src =this.global.baseURL + res + "?token=Bearer " + getToken(); }) }, mounted: function() { setTimeout(() => { this.loading = false; }, 230); const that = this; window.onresize = function temp() { that.height = document.documentElement.clientHeight - 94.5 + "px;"; }; } }; </script>
import request from '@/utils/request' export function indexUrl() { return request({ url: '/system/report/getReport', method: 'get' }) }
b.编写后台访问接口
@PreAuthorize("@ss.hasPermi('system:report:index')") @GetMapping(value = "/getReport") public String getReport(){ return "/jmreport/list/"; }