若依分离版集成积木报表(一)

1.项目后端结构如下

编辑

2.pom文件中引入积木报表最新依赖

编辑

此处引入的是1.6.0版本，如需要最新版本可以从 积木报表官网 - JimuReport报表,免费的企业级Web报表工具

3.执行初始化脚本，在项目的数据库中导入积木报表所需的公共表

下载链接：https://github.com/jeecgboot/JimuReport/tree/master/db

网盘链接：私信

在项目数据库中运行下载好的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/";
}

c.在若依管理后台菜单管理中配置菜单

编辑

d.后台菜单目录访问积木报表

编辑