若依微服务版本集成积木报表

妖狐艹你老母 2024-03-17 12:59 108阅读 0赞

#### 一、项目结构 ####

新建报表微服务模块，这是我的项目结构图。

![e4bd9712d295bc1c3a1d21621a6fd49a.png][]

#### 二、执行初始化数据脚本 ####

运行积木报表的初始化脚本，创建相关表结构，github速度太慢，推荐使用 [gitee地址][gitee]。选择你要建表的数据库，我是跟业务库放到了一起，执行完后会新增以下这几张表。

![4687d3fb6985298401b6a1b122666f19.png][]

#### 三、pom中引入积木报表依赖 ####

在顶级父pom中声明积木报表的版本号：

在报表微服务模块添加积木报表的依赖：

<dependency>
        <groupId>org.jeecgframework.jimureport</groupId>
        <artifactId>jimureport-spring-boot-starter</artifactId>
        <version>${jeccg.jimureport.version}</version>
    </dependency>

#### 四、启动类添加积木扫描目录 ####

在报表微服务启动类上添加积木报表扫描注解，@SpringBootApplication(exclude = \{MongoAutoConfiguration.class\},  
scanBasePackages = \{"org.jeecg.modules.jmreport", "com.iotings.report"\})，下面是完整的启动类代码块：

package com.iotings.report;
    
    import com.iotings.common.security.annotation.EnableCustomConfig;
    import com.iotings.common.security.annotation.EnableRyFeignClients;
    import com.iotings.common.swagger.annotation.EnableCustomSwagger2;
    import org.springframework.boot.SpringApplication;
    import org.springframework.boot.autoconfigure.SpringBootApplication;
    import org.springframework.boot.autoconfigure.mongo.MongoAutoConfiguration;
    
    /**
     * @description: 报表中心模块
     * @author: wzlUp
     * @date: 2023/06/16 17:05
     * @motto: Done is better than perfect.
     */
    @EnableCustomConfig
    @EnableCustomSwagger2
    @EnableRyFeignClients
    @SpringBootApplication(exclude = {MongoAutoConfiguration.class},
            scanBasePackages = {"org.jeecg.modules.jmreport", "com.iotings.report"})
    public class IotingsReportApplication {
    
        public static void main(String[] args) {
            SpringApplication.run(IotingsReportApplication.class, args);
            System.out.println(
                    "  .------------------------------------. \n" +
                    " :     __                               :\n" +
                    " :  =='_))  __-:!:-                     :\n" +
                    " :    ,.' .'  ))-:!:-                   :\n" +
                    " :   ((_,'  .'-:!:-  - Report Started - :\n" +
                    " :  ~^~~~^~~^~~~^~                      :\n" +
                    "  `------------------------------------' ");
        }
    }

#### 五、配置积木报表数据源 ####

使用代码方式进行数据源的配置：

package com.iotings.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;
    /**
     * @description: 数据源配置类
     * @author: wzlUp
     * @date: 2023/06/25 16:17
     * @motto: Done is better than perfect.
     */
    @Configuration
    public class DataSourceConfig{
        /**
         *  1、bean的名称必须为minidaoDataSource，否则不生效
         *  2、jeecg.minidao-datasource对应的是yml中的jeecg下的minidao-datasource，可自定义
         */
        @Bean(name="minidaoDataSource")
        @ConfigurationProperties(prefix = "jeecg.minidao-datasource")
        public DataSource dataSource(){
            return DataSourceBuilder.create().build();
        }
    }

#### 六、报表微服务配置 ####

在 nacos 中新建 iotings-report-dev.yml 配置文件

![6d929b059af746cceda356eb355e8a24.png][]

以下是我的完整配置数据项：

# spring配置
    spring:
      redis:
        host: 127.0.0.1
        port: 6379
        password: 123456
      
    #Minidao配置
    minidao :
      base-package: org.jeecg.modules.jmreport.*  
    
    jeecg:
      minidao-datasource:
        jdbc-url: jdbc:mysql://127.0.0.1:3306/ry-cloud?allowMultiQueries=true&useUnicode=true&characterEncoding=UTF-8&autoReconnect=true&useSSL=false&serverTimezone=GMT%2b8
        username: root
        password: 123456
        driver-class-name: com.mysql.cj.jdbc.Driver
        hikari:
          # 连接池最大连接数
          maximum-pool-size: 400
          # 空闲时保持最小连接数
          minimum-idle: 20
          # 空闲连接存活时间
          idle-timeout: 30000
          # 连接超时时间
          connection-timeout: 1800000
          #池中连接最长生命周期
          max-lifetime: 1800000
      jmreport:
        #数据字典是否进行saas数据隔离(限制只能看自己的字典)
        saas: false
        #是否 禁用导出PDF和图片的按钮 默认为false
        exportDisabled: false
        #是否自动保存
        autoSave: false
        #自动保存间隔时间毫秒
        interval: 20000
        # 列索引
        col: 300
        #自定义项目前缀
        customPrePath: /report
        # 自定义API接口的前缀 #{api_base_path}的值
        # apiBasePath: http://10.10.0.138:83/
        #预览分页自定义
        pageSize:
          - 10
          - 20
          - 50
          - 100
        #打印纸张自定义
        printPaper:
          - title: 标签打印
            size:
              - 140
              - 100        
        #接口超时设置（毫秒）
        connect-timeout: 1800000
        #Excel导出模式(fast/快、primary/精致模式，默认fast)
        export-excel-pattern: fast
        #Excel导出数据每个sheet的行数,每个sheet最大1048576行
        page-size-number: 1048576
        #excel样式超过多少行显示默认样式（只在fast模式下有效）
        excel-style-row: 1048576
        #预览页面的工具条 是否显示 默认true
        viewToolbar: true
        #设计页面表格的线是否显示 默认true
        line: true
        #sql数据源不写字典下拉框显示条数 版本1.4.2之后被放弃
        select-show-total: 10  
    
    # mybatis配置
    mybatis:
        # 搜索指定包别名
        typeAliasesPackage: com.iotings.report
        # 配置mapper的扫描，找到所有的mapper.xml映射文件
        mapperLocations: classpath:mapper/**/*.xml
    
    # knife4j配置
    knife4j:
      enable: true
    #   basic:
    #     enable: true
    #     username: iotings
    #     password: iotings2023
    
    # swagger配置
    swagger:
      version: 1.0.0
      title: 报表中心接口文档
      basePackage: com.iotings.report
      termsOfServiceUrl: iotings-center
      description: 报表中心系统接口的说明文档
      contact:
        name: xxx

注意事项：

*  customPrePath路径配置：需要跟网关的断言【predicates】报表关键字保持一致，否则无法进行正确的路由

#### 七、网关微服务配置 ####

在 iotings-gateway-dev.yml 配置文件中添加报表微服务的路由：

routes:
        # 报表中心服务
        - id: iotings-report
          uri: lb://iotings-report
          predicates:
            - Path=/report/**
          filters:
            - StripPrefix=1

在 iotings-gateway-dev.yml 配置文件中添加积木报表的安全配置和不校验白名单：

# 安全配置
    security:
      # 验证码
      captcha:
        enabled: true
        type: math
      # 防止XSS攻击
      xss:
        enabled: true
        excludeUrls:
          - /system/notice
          - /report/jmreport/**
      # 不校验白名单
      ignore:
        whites:
          - /auth/logout
          - /auth/login
          - /auth/register
          - /*/v2/api-docs
          - /csrf
          - /message/websocket/**
          - /report/**

#### 八、扩展：Token权限控制 ####

package com.iotings.report.service.impl;
    
    import com.iotings.common.core.utils.DateUtils;
    import com.iotings.common.core.utils.StringUtils;
    import com.iotings.common.security.service.TokenService;
    import com.iotings.common.security.utils.SecurityUtils;
    import com.iotings.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;
    
    import javax.servlet.http.HttpServletRequest;
    import java.util.HashMap;
    import java.util.Map;
    
    /**
     * @description: 自定义报表鉴权(如果不进行自定义, 则所有请求不做权限控制)
     * @author: wzlUp
     * @date: 2023/06/25 16:37
     * @motto: Done is better than perfect.
     */
    @Component
    public class JimuReportTokenServiceImpl implements JmReportTokenServiceI {
    
        @Autowired
        private TokenService tokenService;
    
        /**
         * 通过请求获取Token
         */
        @Override
        public String getToken(HttpServletRequest request) {
            String token = request.getParameter("token");
            String jmToken = request.getHeader("token");
            if (token == null || token.length() == 0) {
                token = jmToken;
            }
            LoginUser loginUser = tokenService.getLoginUser(token);
            if (loginUser != null) {
                return token;
            }
            return "";
        }
    
        /**
         * 获取登录人用户名
         */
        @Override
        public String getUsername(String s) {
            LoginUser loginUser = tokenService.getLoginUser(s);
            return loginUser.getUsername();
        }
    
        /**
         * Token校验
         */
        @Override
        public Boolean verifyToken(String s) {
            if (s != null && s.length() > 0) {
                LoginUser loginUser = tokenService.getLoginUser(s);
                return loginUser != null;
            }
            return false;
        }
    
    
        /**
         *  自定义请求头
         */
        @Override
        public HttpHeaders customApiHeader() {
            HttpHeaders header = new HttpHeaders();
            header.add("X-Access-Token", SecurityUtils.getToken());
            return header;
        }
    
        /**
         * 获取多租户id
         * @return tenantId
         */
        public String getTenantId() {
            String token = SecurityUtils.getCurrentRequestInfo().getParameter("token");
            String header = SecurityUtils.getCurrentRequestInfo().getHeader("X-Access-Token");
            LoginUser loginUser = null;
            if (StringUtils.isNotBlank(token)) {
                loginUser = tokenService.getLoginUser(token);
            } else if (StringUtils.isNotBlank(header)) {
                loginUser = tokenService.getLoginUser(header);
            } else {
                //都不具备则不能访问
                return "NO";
            }
            //具备admin或者管理员权限才可访问所有报表
            if (SecurityUtils.isAdmin(loginUser.getUserid())
                    || loginUser.getRoles().contains("it")
                    || loginUser.getRoles().contains("manger")) {
                return "";
            }
            return loginUser.getUsername();
        }
    
        @Override
        public Map<String, Object> getUserInfo(String token) {
            // 将所有信息存放至map 解析sql会根据map的键值解析,可自定义其他值
            Map<String, Object> map = new HashMap<>(20);
            LoginUser loginUser = tokenService.getLoginUser(token);
            map.put("sysUserCode", loginUser.getUsername());
            //设置当前日期（年月日）
            map.put("sysData", DateUtils.getDate());
            //设置昨天日期（年月日）
            map.put("sysYesterDay", DateUtils.getYesterday());
            //设置当前登录用户昵称
            map.put("sysUserName", loginUser.getSysUser().getNickName());
            //设置当前登录用户部门ID
            map.put("deptId", loginUser.getSysUser().getDeptId());
            //设置当前登录用户描述
    //        map.put("describe", loginUser.getSysUser().getDept().getDescribes());
            map.put("describe", loginUser.getSysUser().getDept().getRemark());
            return map;
        }
    }

#### 九、前端页面配置 ####

在前端页面中新建 jimureport 文件夹，新建以下vue文件

##### 1、jimu.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(),
          };
        },
        mounted: function() {
    
        }
      };
    </script>

##### 2、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],
          required: false,
          default: ''
        },
      },
      data() {
        return {
          serverUrl: 'http://127.0.0.1:8080',
          openUrl: '',
        }
      },
      created() {
        if (this.reportID.length != 0) {
          this.openUrl = this.serverUrl + '/report/jmreport/view/' + this.reportID + '?token=' +  getToken()
        } else {
          this.openUrl = this.serverUrl + '/report/jmreport/view/' + this.$route.path.substring(this.$route.path.lastIndexOf("/") + 1) + '?token=' + getToken()
        }
        console.log(this.openUrl)
      }
    }
    </script>
    
    <style scoped>
    
    </style>

#### 十、配置报表菜单 ####

先新建一个主类目，我是建立了一个二级菜单，这个可以自定义，随意配置

![fca2b0324c7de1c5d14e9bd88217a55b.png][]

添加二级目录

![9a2a9a3857104723126b537fad651385.png][]

#### 十一、集成效果展示 ####

集成后的页面

![2ec79937a82a10f1d3e33117e8a6f24f.png][]

模板案例页面

![982944d1a4b6ab8fa58d28498833e48c.png][]

报表的设计页面

![45729a30d5dc620b65d22e6764589f71.png][]

预览页面

![1bfda0fb2142e52cc67bf264ce21538c.png][]

[e4bd9712d295bc1c3a1d21621a6fd49a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/7beb485bcfd44949b690074e86dd0ed3.png
[gitee]: https://gitee.com/jeecg/JimuReport/tree/master/db
[4687d3fb6985298401b6a1b122666f19.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/8e8e727ad84345d4a5d90a0db0aaa6b8.png
[6d929b059af746cceda356eb355e8a24.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/cd623d345abe4646927edf221af374ae.png
[fca2b0324c7de1c5d14e9bd88217a55b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/59025be256f04544845cdf1487a6cf62.png
[9a2a9a3857104723126b537fad651385.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/1c6730e9932843038b911c1864109bed.png
[2ec79937a82a10f1d3e33117e8a6f24f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/43b273f62d274914924b1c474f92abb0.png
[982944d1a4b6ab8fa58d28498833e48c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/50eb02aa4f64450ebdc5740ef3e41539.png
[45729a30d5dc620b65d22e6764589f71.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/dd0412eadf7a405b891a71f62a4a3658.png
[1bfda0fb2142e52cc67bf264ce21538c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/0aee61a8e92e4dc784cd0422e7a41d79.png