开发喵星球

前提：项目中已经创建了积木报表模块ruoyi-jimureport

1、 添加项目依赖

首先，在ruoyi-jimureport模块的pom.xml文件中添加积木报表的依赖：

<!-- JimuReport -->
<dependency>
    <groupId>org.jeecgframework.jimureport</groupId>
    <artifactId>jimureport-spring-boot-starter</artifactId>
    <version>1.5.6</version>
</dependency>

2、 执行初始化脚本

积木报表所需的数据库初始化脚本可以从以下地址下载并执行：

地址：JimuReport-db：https://github.com/jeecgboot/JimuReport/tree/master/db

3、 修改启动类，配置扫描路径

在报表微服务的启动类中，添加积木报表的扫描注解，配置所需的包路径：

package com.ruoyi.report;

import com.ruoyi.common.security.annotation.EnableCustomConfig;
import com.ruoyi.common.security.annotation.EnableRyFeignClients;
import com.ruoyi.common.swagger.annotation.EnableCustomSwagger2;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.autoconfigure.mongo.MongoAutoConfiguration;

@EnableCustomConfig
@EnableCustomSwagger2
@EnableRyFeignClients
@SpringBootApplication(exclude = {MongoAutoConfiguration.class},
        scanBasePackages = {"org.jeecg.modules.jmreport", "com.ruoyi.report"})
public class RuoyiJimuReportApplication {
    public static void main(String[] args) {
        SpringApplication.run(RuoyiJimuReportApplication.class, args);
        System.out.println("若依系统启动成功！");
    }
}

4、 数据源配置

通过代码方式手动配置积木报表的数据源：

package com.ruoyi.report.config;

import org.springframework.boot.context.properties.ConfigurationProperties;
import org.springframework.boot.jdbc.DataSourceBuilder;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import javax.sql.DataSource;

@Configuration
public class DataSourceConfig {
    @Bean(name="minidaoDataSource")
    @ConfigurationProperties(prefix = "jeecg.minidao-datasource")
    public DataSource dataSource() {
        return DataSourceBuilder.create().build();
    }
}

5、 配置报表微服务

在nacos中新建ruoyi-report-dev.yml配置文件，完整的配置示例如下：

# Redis配置
spring:
  redis:
    host: 127.0.0.1
    port: 6379
    password: 

# Minidao配置
minidao:
  base-package: org.jeecg.modules.jmreport.*

jeecg:
  minidao-datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    jdbc-url: jdbc:mysql://127.0.0.1:3306/ry-cloud?characterEncoding=UTF-8&autoReconnect=true&serverTimezone=GMT%2b8
    username: 
    password: 
    hikari:
      maximum-pool-size: 400
      minimum-idle: 20
      idle-timeout: 30000
      connection-timeout: 1800000
      max-lifetime: 1800000

# MyBatis配置
mybatis:
  typeAliasesPackage: com.ruoyi.report
  mapperLocations: classpath:mapper/**/*.xml

6、 配置网关服务

在ruoyi-gateway-dev.yml中为报表微服务设置路由规则：

routes:
    - id: ruoyi-report
      uri: lb://ruoyi-report
      predicates:
        - Path=/report/**
      filters:
        - StripPrefix=1

同时，添加积木报表相关的安全配置，确保报表模块能够正常访问而不受安全机制限制：

# 安全配置
security:
  ignore:
    whites:
      - /report/**

7、 扩展：Token 权限校验

为了确保用户的访问权限，可以实现自定义 Token 校验逻辑，代码示例如下：

package com.ruoyi.report.jimureport.service.impl;

import com.ruoyi.common.security.service.TokenService;
import com.ruoyi.system.api.model.LoginUser;
import org.jeecg.modules.jmreport.api.JmReportTokenServiceI;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpHeaders;
import org.springframework.stereotype.Component;

@Component
public class JimuReportTokenServiceImpl implements JmReportTokenServiceI {

    @Autowired
    private TokenService tokenService;

    @Override
    public String getToken(HttpServletRequest request) {
        String token = request.getParameter("token");
        if (token == null || token.isEmpty()) {
            token = request.getHeader("token");
        }
        LoginUser loginUser = tokenService.getLoginUser(token);
        return loginUser != null ? token : "";
    }

    @Override
    public Boolean verifyToken(String token) {
        return tokenService.getLoginUser(token) != null;
    }

    @Override
    public HttpHeaders customApiHeader() {
        HttpHeaders header = new HttpHeaders();
        header.add("X-Access-Token", SecurityUtils.getToken());
        return header;
    }
}

8、 前端页面配置

在前端项目中新建jimureport文件夹，包含如下vue文件：

• jmreport.vue

<template>
  <i-frame :src="openUrl" id="jimuReportFrame"></i-frame>
</template>

<script>
  import { getToken } from '@/utils/auth'
  import iFrame from '@/components/iFrame/index'

  export default {
    name: "jimu",
    components: {iFrame},
    data() {
      return {
        openUrl: "http://127.0.0.1:8080/report/jmreport/list?token=" + getToken(),
      };
    }
  };
</script>

• view.vue

<template>
  <i-frame :src="openUrl" />
</template>

<script>
import { getToken } from '@/utils/auth'
import iFrame from "@/components/iFrame/index";

export default {
  name: 'jimuview',
  components: { iFrame },
  props: {
    reportID: { type: String, default: '' },
  },
  data() {
    return {
      serverUrl: 'http://127.0.0.1:8080',
      openUrl: '',
    }
  },
  created() {
    this.openUrl = this.reportID ? `{this.serverUrl}/report/jmreport/view/{this.reportID}?token={getToken()}` : `{this.serverUrl}/report/jmreport/view/{this.route.path.split('/').pop()}?token=${getToken()}`
  }
}
</script>

9、 配置报表菜单

在若依管理系统中，新增目录并设置路由地址为jimu，在此目录下新增菜单，设置路由地址为design，组件路径为jimureport/jimu，并配置权限字符为report:jimu:list。

至此，若依微服务版中积木报表的集成已经完成！