若依框架，集成flowable工作流

flowable · 语雀

抄人家的代码:

https://gitee.com/tony2y/RuoYi-flowable.git

因为这是一个完整的项目，如果是空项目的话，直接下载就行了，已有项目移植。就可以往下看了，已调试通过。

效果：

或者：你可以看人家的演示系统：

若依管理系统

后端：创建一个ruoyi-flowable的包。原文件中部分domain mapper 在ruoyi-system下，为了方便管理，全部都给搞到ruoyi-flowable包下。最终结构如下。

需要移动的有

需要注意：

1.修改import 引用位置

2.修改mapper的命名空间

3.resource文件夹下，建立文件夹，必须一层一层建，先建mapper，再建flowable，不能直接mapper.flowable，会报错。

org.apache.ibatis.binding.BindingException: Invalid bound statement (not found): com.ruoyi.flowable.mapper.FlowDeployMapper.selectDeployList

4.改ruoyi-flowable的pom文件，更新一下maven

ruoyi com.ruoyi 3.8.3 4.0.0

ruoyi-flowable


    8
    8



    
        com.ruoyi
        ruoyi-framework
    
    
        com.ruoyi
        ruoyi-system
    
    
        com.ruoyi
        ruoyi-common
    

    
    
        org.apache.commons
        commons-lang3
    

    
    
        com.fasterxml.jackson.core
        jackson-databind
    
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

    
        com.alibaba
        fastjson
    

    
        org.projectlombok
        lombok
        true
    
    
        io.swagger
        swagger-annotations
        compile
    
    
        org.flowable
        flowable-engine
        compile
    

    
        org.flowable
        flowable-spring-boot-starter-basic
    

    
        
        org.springframework.boot
        spring-boot-starter-websocket
    
    
        com.googlecode.aviator
        aviator
        5.3.1
    
    
        io.swagger
        swagger-annotations
        1.6.2
        compile
    
    
        com.baomidou
        mybatis-plus-extension
        3.5.1
        compile
    
    
        com.alibaba
        fastjson
        1.2.83
        compile
    
    
        xerces
        xercesImpl
        2.12.0
    

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

二、建立数据库表

因为移动了文件位置，会有一堆报错，处理一下。大概都是domain和mapper位置不一致引起的。然后运行后端，会自动建立flowable的相关数据表。但是有三张表是作者自己加的，参考sql，自己建立一下。

三、前端

1.src/components文件夹下，放这几个文件夹

2.src/views文件夹下，放flowable文件夹 ，添加api

3.public文件夹下加libs

4.utils文件夹下,覆盖generator文件夹下内容，另外加入的有几个文件@/utils/db @/utils/generator/drawingDefalut @/utils/loadBeautifier @/utils/loadMonaco @/utils/loadTinymce

以上，除了views/flowable,其余基本上都是Form Generator表单设计器里需要的文件。

form-generator: Element UI表单设计及代码生成器

5.覆盖views/tool/build文件夹

6.有些位置有变动，需要修改

修改IconsDialog.vue（因为没有加入@icons 这个文件夹）

7.配置路由

8.npm install，然后npm run dev

看看需要哪些组件

提示，让install这些的

@/utils/db @/utils/generator/drawingDefalut @/utils/loadBeautifier @/utils/loadMonaco @/utils/loadTinymce

一看，这些位置有没有这个文件，二检查哪些文件Improt引用了之些文件，可能引用位置需要修改。

例如，下面这里（都在VUE文件里，没几个，好找）。

另外，需要Npm install vkbeautify。会有提示，缺少什么安装什么。

9.跑起来以后。增加菜单（参考 sql中的写，或者参照演示系统的）

​​​​​​​

INSERT INTO sys_menu VALUES (2020, ‘流程管理’, 0, 6, ‘flowable’, NULL, 1, 0, ‘M’, ‘0’, ‘0’, NULL, ‘cascader’, ‘tony’, ‘2021-03-25 11:35:09’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2022, ‘流程定义’, 2020, 2, ‘definition’, ‘flowable/definition/index’, 1, 0, ‘C’, ‘0’, ‘0’, ‘’, ‘job’, ‘tony’, ‘2021-03-25 13:53:55’, ‘admin’, ‘2021-03-29 09:39:07’, ‘’);
INSERT INTO sys_menu VALUES (2023, ‘任务管理’, 0, 7, ‘task’, NULL, 1, 0, ‘M’, ‘0’, ‘0’, ‘’, ‘dict’, ‘tony’, ‘2021-03-26 10:53:10’, ‘admin’, ‘2021-03-29 09:37:40’, ‘’);
INSERT INTO sys_menu VALUES (2024, ‘待办任务’, 2023, 2, ‘todo’, ‘flowable/task/todo/index’, 1, 1, ‘C’, ‘0’, ‘0’, ‘’, ‘cascader’, ‘admin’, ‘2021-03-26 10:55:52’, ‘admin’, ‘2021-03-30 09:26:36’, ‘’);
INSERT INTO sys_menu VALUES (2025, ‘已办任务’, 2023, 3, ‘finished’, ‘flowable/task/finished/index’, 1, 1, ‘C’, ‘0’, ‘0’, ‘’, ‘time-range’, ‘admin’, ‘2021-03-26 10:57:54’, ‘admin’, ‘2021-03-30 09:26:50’, ‘’);
INSERT INTO sys_menu VALUES (2026, ‘我的流程’, 2023, 1, ‘process’, ‘flowable/task/process/index’, 1, 1, ‘C’, ‘0’, ‘0’, NULL, ‘guide’, ‘admin’, ‘2021-03-30 09:26:23’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2027, ‘表单配置’, 2020, 2, ‘form’, ‘flowable/task/form/index’, 1, 0, ‘C’, ‘0’, ‘0’, ‘flowable:form:list’, ‘form’, ‘admin’, ‘2021-03-30 22:55:12’, ‘admin’, ‘2021-04-03 18:50:54’, ‘’);
INSERT INTO sys_menu VALUES (2028, ‘新增’, 2027, 1, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘flowable:form:add’, ‘#’, ‘admin’, ‘2021-07-07 14:23:37’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2029, ‘删除’, 2027, 3, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘flowable:form:remove’, ‘#’, ‘admin’, ‘2021-07-07 14:24:10’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2030, ‘编辑’, 2027, 2, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘flowable:form:edit’, ‘#’, ‘admin’, ‘2021-07-07 14:24:31’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2031, ‘新增’, 2026, 1, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘system:deployment:add’, ‘#’, ‘admin’, ‘2021-07-07 14:25:22’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2032, ‘编辑’, 2026, 2, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘system:deployment:edit’, ‘#’, ‘admin’, ‘2021-07-07 14:25:47’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2033, ‘删除’, 2026, 3, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘system:deployment:remove’, ‘#’, ‘admin’, ‘2021-07-07 14:26:02’, ‘’, NULL, ‘’);
INSERT INTO sys_menu VALUES (2034, ‘查询’, 2027, 4, ‘’, NULL, 1, 0, ‘F’, ‘0’, ‘0’, ‘flowable:form:query’, ‘#’, ‘admin’, ‘2021-07-08 14:05:22’, ‘’, NULL, ‘’);
10.如果报404错误，比如点击按钮时。可能是router/index.js没有配置路由。或者是按钮的push与配置的路由不对应。这个看你自己的定义。

11.语法修改。报错如下、

看源文件，版本问题。

需要改成

同理，confirm，notify

同

可以搜索，批量替换。

查看Json,资源初始化中。报错

缺少了这个组件

表单配置，编辑器不显示

解决方案：下载表单设计器源码。用这个config文件覆盖

form-generator: Element UI表单设计及代码生成器

这里我使用了wangEditor，比较简单，另外以前搞过，不想再费事。效果如下

这个我已经修改了文件上传，基本继承了原来的quill Editor。你需要使用哪个组件，直接修改config配置就行。可以看我的另一篇集成wangEditor富文本的文章。

这里改成Editor,因为我已将原来的Editor替换成wangEditor，并全局挂载
文章转自：若依框架，集成flowable工作流_Java-答学网

作者：答学网，转载请注明原文链接：http://www.dxzl8.com/