项目中要用到工作流,工作流引擎有很多,activity之前用过(仅仅用过)本来想在项目中集成activity,查了资料发现activity现在不维护了,之前开发activity的团队都离职跳到了flowable。很显然,flowable是activity的升级版,并且现在还在更新维护。从flowable官网(
https://flowable.com/open-source/
)可以直接下载。文档地址(
https://flowable.com/open-source/docs/bpmn/ch02-GettingStarted/
)从下载的zip包解压后会发现里面有wars目录(flowable-rest.war,flowable-ui.war)看到war大家都懂,扔到tomcat下直接运行打开浏览器访问对应的端口就可以自行创建流程等等。就这么简单?当然不可能!我们要在我们自己的项目中使用前端的画流程图肯定不能用flowable自带的来画,flowable提供了详细的后端流程文档,这里就不多说文档上都有也很详细。
解压flowable的文件:
要想使用flowable自带的ui来画流程图也不是不行,另创建一个服务实现跨域访问也能实现。最开始我是这么做的,后来不用了,太麻烦。那怎么办?主角bpmnjs(
https://bpmn.io/toolkit/bpmn-js/
)登场。下载bpmn源码,bpmn是一款轻量级的前端画流程图工具,使用非常方便(真的是这样就好了)。bpmnjs官网提供了前后分离版本,支持Vue,React。这就有点那个啥了,前后不分离版本没有。那是不是要说凉凉,我们前后不分离怎么办。
解压bpmnjs的文件:(执行安装打包命令的情况下没有node_modules,dist两个文件夹)
莫慌莫慌,困难总比办法多。不对,困难总比困难多。想办法解决,首先我们要有前后分离的环境,先下载node.js。不了解node的朋友可能要费劲了(现在得学起来了,要跟随时代的步伐)从官网下载node.js(
https://nodejs.org/zh-cn/
)。安装完成没问题了,接下来就开始怼bpmn了。(建议先安装cnpm,这样下载快)命令:$ npm install cnpm -g 或者淘宝镜像命令:$ npm install cnpm -g --registry=https://registry.npm.taobao.org
安装好cnpm后,就开始真正的对bpmnjs动手了。解压我们从bpmn官网下载的zip包,进入bpmn-js-develop文件夹下,在文件夹中打开cmd,执行命令:cnpm install 之后执行:cnpm run all 这时候会发现文件夹下多出来了个dist目录,拷贝dist目录下所有文件到自己的项目中即可。之后按照bpmnjs官网例子代码直接就能使用。
1、配置数据源
修改flow-front-rest模块下的resources配置文件application-local.properties
spring
.datasource.druid.url=jdbc:mysql://localhost:3306/flow?autoReconnect=t
RBAC(基于角色的访问控制)权限管理模型+数据看板+ 定制查询/自定义查询 + 教师信息管理 + 系统管理 +
flowable
工作流
等
教师信息管理又分为:教师基本信息管理 + 教师科研信息管理 + 教师教务信息管理
系统管理分为:用户管理 + 角色管理 + 部门管理 +菜单管理 + 数据字典管理 + 岗位管理
流程管理:流程部署 + 表单配置
任务管理:我的流程 + 待办任务 + 已办任务
系统工具:代码自动生成 + 表单构建 + Swagger接口文档
项目介绍:
QuickD是一个前后端
分离
快速开发平台,是基于
Spring
Boot
和 Vue 开发,整合
Flowable
工作流
、Shiro、Redis等,来帮助中小型企业及个人实现敏捷化的应用交付和运营管理,并提供代码生成器、通用
前端
等业务组件,来帮助开发者聚焦于业务,加速中小型企业数字化转型。
QuickD开发平台
采用前后端
分离
的模式,
前端
开源框架:quickd-ui (基于 Vue、Element-UI)
后端采用
Springboot
+Myba
< template>
<
bpmn
xss=removed xss=removed xss=removed xss=removed xss=removed xss=removed xss=removed>
</ div>
</ template>
< script >
第一个想法就是继承类
BPMN
DIExport,重写方法create
Bpmn
Shape,但此方法是静态的,并不能重写,如果完全重写
Bpmn
XMLConverter工作量太大了,放弃。改造xml了?对于convertToXML的结果,进行解析,在相应位置添加上属性isMarkerVisible="true"是不是就可以了。说干就干!!!
bpmn
-
js
流程设计器 与
flowable
/activiti 拓展的可行性研究前因先上效果图涉及技术引用
最近在准备开源一款流程引擎项目,主要包含 流程设计器 表单设计器 流程引擎,碰见了一个问题 开发过程中 经常需要拓展节点或节点元素,因为
bpmn
规范可能不满足实际项目需求。记录一下 解决思路。
先上效果图
前端
使用
bpmn
.
js
拓展
flowable
.
js
on或者 activiti.
js
on,新增我们 拓展的节点及元素。
"name": "
Flowable
",
一、
bpmn
.
js
官方例子有一个
bpmn
-
js
-examples/i18n专门讲了如何将
bpmn
-
js
中显示的字符转换为另一种语言的方案,本文根据官方的描述进行的实战。
二、原理:
bpmn
-
js
在实例化时,它把转换语言的功能(custom-translate)作为一个额外的配置模块,这样就覆盖了缺省的原来语言,在你
Bpmn
Modeler实例化的
js
文件中,加入以下代码:
var c...
bpmn
lint简介它根据一组已定义的规则来验证您的图表,并将其报告为错误或警告。它可以从命令行检查您的
BPMN
图,或者通过
bpmn
-
js
-
bpmn
lint将其集成到我们的
BPMN
建模器中:核心规则库的核心是用于检测
BPMN
图中某些模式的规则。每个规则都是由一段代码定义的,该代码可以检测并报告从丢失标签到检测到特定的易于出错的建模模式这一事实。为了让您更好地了解规则可能是什么,这是到今天...
前端
:vue+
bpmn
-
js
实现activiti的流程设计器,后端
Springboot
+Activiti开发
工作流
前端
:vue +
bpmn
-
js
项目,实现activiti设计器, 后端:
springboot
+ activiti鉴于广大程序员们开发设计器苦不堪言以及后端不知道怎么解析自定义属性,于是我就开发了这个基础版本的demo,供广大程序员们学习用,如果有问题请在issue中提问????????????项目...