目录

项目工作流基本需求

项目实现

Flowable交互设计实现

流程主要名词介绍

1.流程部署API

2.获取已经部署的流程API

3.获取已经部署的流程定义API

4.获取流程图片API

5.启动流程,获取实例API

6.获取流程图片(运行时)API

7.查询任务API

8.完成任务API

9.其他API,删除,查询历史等

10.如何知道流程开始和结束,可以使用监听器实现

前端页面实现


项目工作流基本需求

  1. 页面能够绘制工作流(CRUD)
  2. 页面能够执行工作流步奏(通过、拒绝)
  3. 能够获取工作流及时状态图

项目实现

  1. 使用前端bpmn.js插件或者flowable前端页面绘制流程图,导出bpmn格式文件;
  2. 启动Flowable流程引擎服务(需要修改删除权限相关的验证);
  3. 将bpmn格式文件导入Flowable流程引擎服务,Flowable流程引擎进行流程的执行;
  4. 以T2Admin项目开发工作流业务为例,T2Admin后端服务与Flowable交互,将操作及结果展现在T2Amin前端页面;

Flowable交互设计实现

流程主要名词介绍

  • 流程定义:创建完成一个流程(流程定义)并部署到flowable中就创建出一个持久化的流程定义(存储在数据库中);
  • 流程实例:现在可以使用在流程定义中定义的id(参见XML中的process元素)启动新流程实例。请注意这个id在Flowable术语中被称作key

 一个流程定义可以启动多个流程实例。

流程实例是动态的,流程定义是静态的。

  • 事件:如开始事件、结束事件、边界事件、中间捕获事件
  • 任务:“用户任务(user task)”用于对需要人工执行的任务进行建模。当流程执行到达用户任务时,会为指派至该任务的用户或组的任务列表创建一个新任务。

flowable的安装部署修改部分就不讲解了,这里有一份现成的供参考

:T2Admin/api/common-flowable at master · tangzhangss/T2Admin · GitHub

1.流程部署API

  将由前端创建好的.bpmn20.xml流程文件调用T2Admin的后端接口;

  T2Admin的后端接口调用Flowable服务部署流程并获取流程定义部署完成的ID。


导入同样的流程会更新版本,以流程定义为主,flowable会根据tenantId和流程的key去区分流程的版本+1, 仅支持部署以.bpmn20.xml结尾的流程文件;


@PostMapping("/deploy_process")
public Result deployProcess(@RequestParam(name = "file") MultipartFile file)

响应结果如下:【返回流程定义数据ProcessDefinition】

  • id为流程定义的Id,需要T2Admin记录该ID用于控制流程的执行,如:开始、结束、获取流程信息等;
  • deploymentId为部署记录的Id,也可以记录
  • 同时可记录流程主要信息供T2Admin页面展示,如:name、resurceName、key、tenantId(对应T2Admin的clientId)
  • id和key的区别是:id可以区别流程的版本,key可以作为同一个流程区分键
{
    "code": 200,
    "message": "OK",
    "data": {
        "isInserted": false,
        "suspensionState": 1,
        "derivedVersion": 0,
        "isUpdated": false,
        "resourceName": "Holiday_Request2.bpmn20.xml",
        "originalPersistentState": {
            "suspensionState": 1,
            "category": "http://www.flowable.org/processdef"
        },
        "isGraphicalNotationDefined": true,
        "version": 7,
        "revision": 1,
        "isDeleted": false,
        "diagramResourceName": "Holiday_Request2.holidayRequest.png",
        "deploymentId": "137501",
        "name": "Holiday Request",
        "tenantId": "-1",
        "id": "holidayRequest:7:137504",
        "category": "http://www.flowable.org/processdef",
        "hasStartFormKey": false,
        "key": "holidayRequest"
    }
}

2.获取已经部署的流程API

@GetMapping("/get_all_process_list")
public Result getAllProcessList()

响应结果如下:

{
    "code": 200,
    "message": "OK",
    "data": [
        {
            "isInserted": false,
            "parentDeploymentId": "130001",
            "isUpdated": false,
            "originalPersistentState": {
                "parentDeploymentId": "130001",
                "tenantId": "-1"
            },
            "isNew": false,
            "isDeleted": false,
            "name": "Holiday_Request2",
            "tenantId": "-1",
            "id": "130001",
            "deploymentTime": "2022-09-08T08:35:48.034+0800"
        }
    ]
}

3.获取已经部署的流程定义API

@ApiOperation("获取流程定义")
@GetMapping("/get_all_process_definition_list")

响应结果如下:

{
    "code": 200,
    "message": "OK",
    "data": [
        {
            "isInserted": false,
            "suspensionState": 1,
            "derivedVersion": 0,
            "isUpdated": false,
            "resourceName": "Holiday_Request2.bpmn20.xml",
            "originalPersistentState": {
                "suspensionState": 1,
                "category": "http://www.flowable.org/processdef"
            },
            "isGraphicalNotationDefined": true,
            "version": 1,
            "revision": 1,
            "isDeleted": false,
            "diagramResourceName": "Holiday_Request2.holidayRequest.png",
            "deploymentId": "130001",
            "name": "Holiday Request",
            "tenantId": "-1",
            "id": "holidayRequest:1:130004",
            "category": "http://www.flowable.org/processdef",
            "hasStartFormKey": false,
            "key": "holidayRequest"
        }
    ]
}

4.获取流程图片API

通过“部署流程接口”返回的流程定义[processDefinition]的id可以获取流程图片,即流程图。

@GetMapping("/get_process_diagram/{id}")
public void getProcessDiagram(@PathVariable("id") String id)

响应结果:

flowable启动流程如何绑定businesskey_API

5.启动流程,获取实例API

/**
 * 启动流程
 * 返回流程实例的id
 */
@ApiOperation(value = "启动流程")
@ApiImplicitParam(name = "variables",paramType = "body",dataType="json",value = "开始流程的启动参数,如:\n" +
        "{\n" +
        "    \"employee\":\"tangzhangss\",\n" +
        "    \"nrOfHolidays\":\"How many holidays do you want to request?\",\n" +
        "    \"description\":\"Why do you need them?\"\n" +
        "}")
@PutMapping("/start_process/{id}")
public Result startProcess(@PathVariable("id")String id, @RequestBody HashMap<String,Object> variables)

响应结果:

返回的是流程实例的ID,T2Admin需要记录此ID,后续流程的执行状态操作都需要此ID

{
    "code": 200,
    "message": "OK",
    "data": "137505"
}

6.获取流程图片(运行时)API

@GetMapping(value = "/get_process_diagram_activity/{processInstanceId}")
public Result getProcessDiagramActivity(@PathVariable("processInstanceId")String processInstanceId)

响应结果:

flowable启动流程如何绑定businesskey_前端_02

7.查询任务API

流程已经启动那么,再T2Admin系统中应有可以查询到自己的任务;

可以通过3个条件来查询任务,只会查询当前租户的任务信息,至于以下查询条件如何与flowable服务交互,依据业务而定。查询条件assignee和candidateGroup都是在流程配置中配置的(前端页面绘制流程图时设置)

@GetMapping("/find_task")
    public Result findTask(@RequestParam(required = false)String assignee,
                           @RequestParam(required = false)String id,
                           @RequestParam(required = false) String candidateGroup)

这里我们查询所有任务:

响应结果:

{
    "code": 200,
    "message": "OK",
    "data": [
        {
            "queryIdentityLinks": [],
            "isInserted": false,
            "suspensionState": 1,
            "processInstanceId": "137505",
            "processDefinitionId": "holidayRequest:7:137504",
            "isCanceled": false,
            "isUpdated": false,
            "usedVariablesCache": {},
            "originalPersistentState": {
                "processInstanceId": "137505",
                "processDefinitionId": "holidayRequest:7:137504",
                "suspensionState": 1,
                "priority": 50,
                "executionId": "137510",
                "taskDefinitionKey": "approveTask",
                "subTaskCount": 0,
                "createTime": "2022-09-08T09:34:13.975+0800",
                "name": "Approve or reject request",
                "isCountEnabled": true,
                "variableCount": 0,
                "identityLinkCount": 1
            },
            "priority": 50,
            "revision": 1,
            "executionId": "137510",
            "taskDefinitionKey": "approveTask",
            "subTaskCount": 0,
            "isDeleted": false,
            "createTime": "2022-09-08T09:34:13.975+0800",
            "name": "Approve or reject request",
            "isCountEnabled": true,
            "variableCount": 0,
            "tenantId": "-1",
            "identityLinkCount": 1,
            "id": "137514"
        }
    ]
}

8.完成任务API

如果上述任务是表单任务,获取需要页面的一些操作,这需要T2Admin自己定义相关的标识,弹出响应的任务输入框,将参数处理,传入完成任务接口;(处理任务这部分由T2Admin完成!)

@PutMapping("/complete_task/{id}")
public Result completeTask(@PathVariable("id")String id, @RequestBody HashMap<String,Object> variables)

完成任务的接口非常简单;

任务的请求参数注意,需要根据流程配置传入,比如该任务是一个同意或者不同意;

flowable启动流程如何绑定businesskey_javascript_03

响应结果:

{
     "code": 200,
     "message": "OK",
     "data": "null"
 }

执行完任务,再次查看流程图状态:

flowable启动流程如何绑定businesskey_vue.js_04

 再次完成任务

flowable启动流程如何绑定businesskey_javascript_05

9.其他API,删除,查询历史等

10.如何知道流程开始和结束,可以使用监听器实现

包括全局开始结束事件监听器。或者任务监听器。这部分比较复杂暂时未研究。

目前仅仅梳理如何集成到当前业务系统思路。

前端页面实现

前端页面实现目前想到两种方式;

我们只需要利用绘制.bpmn20.xml的工具绘制即可,其他的全部由T2Admin自定义实现;

  1. 使用vue bnpm.js实现,是否能实现还未研究
  2. 使用flowable自带的前端页面实现,需要想办法集成到T2Admin中

flowable启动流程如何绑定businesskey_vue.js_06

这是可以实现的,稍微改造一下前端页面,然后将设计器页面以“远程菜单“的方式集成到T2Admin即可。