activiti 5.22整合springboot 2.1项目+ activit网页流程设计器 整合(一)

activiti整合+ activit网页流程设计器 

 

1.需求

现在网上主流的是使用 thymeleaf + springboot的方式  ,   我也是参考这些案例实现了 springboot+vue的方式, 不适用 thymeleaf ,有所更改

项目中添加项目的activiti依赖 以及添加 activit网页流程设计器 

添加相关maven

 

        <!-- Activiti Start -->
        <dependency>
            <groupId>org.activiti</groupId>
            <artifactId>activiti-spring-boot-starter-basic</artifactId>
            <version>${activiti.version}</version>
            <exclusions>
                <exclusion>
                    <groupId>org.mybatis</groupId>
                    <artifactId>mybatis</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
        <dependency>
            <groupId>org.activiti</groupId>
            <artifactId>activiti-spring-boot-starter-rest-api</artifactId>
            <version>${activiti.version}</version>
        </dependency>
        <dependency>
            <groupId>org.activiti</groupId>
            <artifactId>activiti-spring-boot-starter-actuator</artifactId>
            <version>${activiti.version}</version>
        </dependency>
        <dependency>
            <groupId>org.activiti</groupId>
            <artifactId>activiti-explorer</artifactId>
            <version>${activiti.version}</version>
            <exclusions>
                <exclusion>
                    <groupId>com.vaadin</groupId>
                    <artifactId>vaadin</artifactId>
                </exclusion>
                <exclusion>
                    <groupId>org.vaadin.addons</groupId>
                    <artifactId>dcharts-widget</artifactId>
                </exclusion>
                <exclusion>
                    <groupId>activiti-simple-workflow</groupId>
                    <artifactId>org.activiti</artifactId>
                </exclusion>
                <exclusion>
                    <groupId>org.mybatis</groupId>
                    <artifactId>mybatis</artifactId>
                </exclusion>
                <exclusion>
                    <groupId>org.slf4j</groupId>
                    <artifactId>slf4j-log4j12</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-test</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-test</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
            <version>2.1.1.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-annotations</artifactId>
            <version>${jackson.version}</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>${jackson.version}</version>
        </dependency>
        <!-- Activiti End -->

activiti版本

<activiti.version>5.22.0</activiti.version>

jackson版本

 

<jackson.version>2.9.7</jackson.version>

 

springboot的版本

<version>2.1.1.RELEASE</version>

 

yml 配置文件

配置 activiti

spring:
    activiti:
        check-process-definitions: false #检查定义
        job-executor-activate: false #定时到数据库扫描没有执行系统的任务 进行执行
        async-executor-enabled: false
        async-executor-activate: false #启动将代替job-executor-activate
        database-schema-update: true #自动更新数据库结构
        database-schema: database_name #数据库名

 

与数据库的结合

 

由于activiti 要连接数据库所以要配置 数据库参数,网上的都是xml来配置的 我选择采用 springboot 对象方式配置数据库连接

 

package com.zg.project.provide.flow.config;
import org.activiti.spring.SpringAsyncExecutor;
import org.activiti.spring.SpringProcessEngineConfiguration;
import org.activiti.spring.boot.AbstractProcessEngineAutoConfiguration;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
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 org.springframework.context.annotation.Primary;
import org.springframework.stereotype.Component;
import org.springframework.transaction.PlatformTransactionManager;
import javax.sql.DataSource;
import java.io.IOException;
import java.util.ArrayList;

@Configuration//声名为配置类，继承Activiti抽象配置类
public class ActivitiConfig extends AbstractProcessEngineAutoConfiguration {
//这里的参数是直接从spring的数据库配置获取,应该会有更友好的方法
    @Value("${spring.datasource.dynamic.datasource.master.driver-class-name}")
    private String driverclassname;
    @Value("${spring.datasource.dynamic.datasource.master.jdbc}")
    private String url;
    @Value("${spring.datasource.dynamic.datasource.master.username}")
    private String username;
    @Value("${spring.datasource.dynamic.datasource.master.password}")
    private String password;
    @Bean
    @Primary
    @ConfigurationProperties(prefix = "datasource.activiti")
    public DataSource activitiDataSource() {
        return DataSourceBuilder.create()
                .url(url).username(username).driverClassName(driverclassname).password(password).build();
    }
    @Bean
    public SpringProcessEngineConfiguration springProcessEngineConfiguration(
            PlatformTransactionManager transactionManager,
            SpringAsyncExecutor springAsyncExecutor) throws IOException {
        return baseSpringProcessEngineConfiguration(
                activitiDataSource(),
                transactionManager,
                springAsyncExecutor);
    }
}

// spring 接管相关的  activiti 实体

package com.zg.project.provide.flow.config;
import org.activiti.engine.*;
import org.activiti.engine.impl.cfg.ProcessEngineConfigurationImpl;
import org.activiti.spring.ProcessEngineFactoryBean;
import org.activiti.spring.SpringProcessEngineConfiguration;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.transaction.PlatformTransactionManager;
import javax.sql.DataSource;
/**
 * @Classname Cfg_Activiti
 * @Description activiti工作流配置
 * @Author xiedong
 * @Date 2019/10/21 11:31
 * @Version 1.0
 **/
@Configuration
public class Cfg_Activiti {
    //流程配置，与spring整合采用SpringProcessEngineConfiguration这个实现
// @Bean
// public ProcessEngineConfiguration processEngineConfiguration(DataSource dataSource, PlatformTransactionManager transactionManager){
// SpringProcessEngineConfiguration processEngineConfiguration = new SpringProcessEngineConfiguration();
// processEngineConfiguration.setDataSource(dataSource);
// processEngineConfiguration.setDatabaseSchemaUpdate("true");
// processEngineConfiguration.setDatabaseType("mysql");
//
// processEngineConfiguration.setTransactionManager(transactionManager);
//
// //流程图字体
// processEngineConfiguration.setActivityFontName("宋体");
// processEngineConfiguration.setAnnotationFontName("宋体");
// processEngineConfiguration.setLabelFontName("宋体");
//
// return processEngineConfiguration;
// }
//
// //流程引擎，与spring整合使用factoryBean
// @Bean
// public ProcessEngineFactoryBean processEngine(ProcessEngineConfiguration processEngineConfiguration){
// ProcessEngineFactoryBean processEngineFactoryBean = new ProcessEngineFactoryBean();
// processEngineFactoryBean.setProcessEngineConfiguration((ProcessEngineConfigurationImpl) processEngineConfiguration);
// return processEngineFactoryBean;
// }
//八大接口
    @Bean
    public RepositoryService repositoryService(ProcessEngine processEngine){
        return processEngine.getRepositoryService();
    }
    @Bean
    public RuntimeService runtimeService(ProcessEngine processEngine){
        return processEngine.getRuntimeService();
    }
    @Bean
    public TaskService taskService(ProcessEngine processEngine){
        return processEngine.getTaskService();
    }
    @Bean
    public HistoryService historyService(ProcessEngine processEngine){
        return processEngine.getHistoryService();
    }
    @Bean
    public FormService formService(ProcessEngine processEngine){
        return processEngine.getFormService();
    }
    @Bean
    public IdentityService identityService(ProcessEngine processEngine){
        return processEngine.getIdentityService();
    }
    @Bean
    public ManagementService managementService(ProcessEngine processEngine){
        return processEngine.getManagementService();
    }
    @Bean
    public DynamicBpmnService dynamicBpmnService(ProcessEngine processEngine){
        return processEngine.getDynamicBpmnService();
    }
}

 

最后springboot 启动器上添加 注解

排除 自带的安全验证权限功能,

@SpringBootApplication(
        exclude ={
                DataSourceAutoConfiguration.class,
                org.activiti.spring.boot.SecurityAutoConfiguration.class,
                org.springframework.boot.autoconfigure.security.servlet.SecurityAutoConfiguration.class
        }
)

到这里 activiti 的配置参数就配置完了,可以启动了, 启动完成后,activiti就会创建相关的25张表

 

下面开始整合 activiti在线设计器

 

 

1.Activiti官网下载：https://www.activiti.org/get-started（我这里使用的是5.22.0版本）

　　解压：activiti-5.22.0\wars\activiti-explorer，如下图

　　

2.设计器前端部分

　　仅保留一些静态资源就行了，将这些文件放入项目的web目录下。

　　

　　在editor-app/app-cfg.js中配置一下项目url。这个url是编辑器相关的后台服务的url。(当然你也可以根据你的需求改动)

　　

 　　注：

　　　　①editor-app就是编辑器、modeler.html就是编辑器的入口页面

　　　　②diagram-viewer是流程跟踪插件

　　　　③界面组件：stencilset.json。本身是英文的，可以通过替换它来实现汉化的效果