flowableUI源码分析（二）

比眉伴天荒 2023-10-01 21:44 2阅读 0赞

#### 3.编辑BPM流程图 ####

**保存接口参照2.1**

##### 3.1前端框架生成流程图数据 #####

保存流程图后，前端框架生成**json\_xml**数据传递给后端。

![在这里插入图片描述][watermark_type_d3F5LXplbmhlaQ_shadow_50_text_Q1NETiBA5a2m5Lmg5omN6IO95Y-Y5b6X5by65aSn_size_20_color_FFFFFF_t_70_g_se_x_16]

##### 3.2任务节点节点解析 #####

BPM流程图关联两张表单。

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uvceg5cW-1650786151879)(..\\mark\\img\\flowable\\form\_two\_bpm.png)\]][img-Uvceg5cW-1650786151879_.._mark_img_flowable_form_two_bpm.png]

##### 3.3.JSON数据解析 #####

*  resourceId，任务节点ID
 *  outgoing，流转下一个节点ID
 *  bounds，BPM图中，定位坐标
 *  properties，属性，其中“formreference”关联表单属性

{
        
    		"resourceId": "5423e83a-c397-11ec-a0fb-005056c00008",
    		"properties": {
        
    			"overrideid": "",
    			"name": "第一次请假表单申请",
    			"documentation": "",
    			"asynchronousdefinition": "false",
    			"exclusivedefinition": "false",
    			"executionlisteners": "",
    			"multiinstance_type": "None",
    			"multiinstance_variableaggregations": "",
    			"multiinstance_cardinality": "",
    			"multiinstance_collection": "",
    			"multiinstance_variable": "",
    			"multiinstance_condition": "",
    			"isforcompensation": "false",
    			"usertaskassignment": "",
    			"formkeydefinition": "",
    			"formreference": {
        
    				"id": "b6d3a70a-bb04-11ec-82e1-005056c00008",
    				"name": "请假申请流程单",
    				"key": "holiday-form"
    			},
    			"formfieldvalidation": true,
    			"duedatedefinition": "",
    			"prioritydefinition": "",
    			"formproperties": "",
    			"tasklisteners": "",
    			"skipexpression": "",
    			"categorydefinition": "",
    			"taskidvariablename": ""
    		},
    		"stencil": {
        
    			"id": "UserTask"
    		},
    		"childShapes": [],
    		"outgoing": [{
        
    			"resourceId": "sid-25AD7465-7395-434A-81B0-1B3D7FED1B00"
    		}],
    		"bounds": {
        
    			"lowerRight": {
        
    				"x": 371,
    				"y": 198
    			},
    			"upperLeft": {
        
    				"x": 271,
    				"y": 118
    			}
    		},
    		"dockers": []
    	},

保存BPM图过程中， 2.处理表单关联关系

if ((model.getModelType() == null || model.getModelType().intValue() == Model.MODEL_TYPE_BPMN)) {
        
    
                    // 1.创建缩略图
                    byte[] thumbnail = modelImageService.generateThumbnailImage(model, jsonNode);
                    if (thumbnail != null) {
        
                        model.setThumbnail(thumbnail);
                    }
    
                    modelRepository.save(model);
    
                    // 2.处理表单关联关系
                    handleBpmnProcessFormModelRelations(model, jsonNode);
                    handleBpmnProcessDecisionTaskModelRelations(model, jsonNode);
    
                }

##### 3.4入库处理 #####

BPM流程ID为，5423e83a-c397-11ec-a0fb-005056c00008

表单1的ID，b6d3a70a-bb04-11ec-82e1-005056c00008

表单2的ID，da810f33-c394-11ec-a0fb-005056c00008

INSERT INTO `project_flowable`.`act_de_model_relation` (`id`, `parent_model_id`, `model_id`, `relation_type`) VALUES ('22cf0d8b-c399-11ec-a0fb-005056c00008', '5423e83a-c397-11ec-a0fb-005056c00008', 'da810f33-c394-11ec-a0fb-005056c00008', 'form-model');
    INSERT INTO `project_flowable`.`act_de_model_relation` (`id`, `parent_model_id`, `model_id`, `relation_type`) VALUES ('232bac7c-c399-11ec-a0fb-005056c00008', '5423e83a-c397-11ec-a0fb-005056c00008', 'b6d3a70a-bb04-11ec-82e1-005056c00008', 'form-model');

/**
         * 维护form和bpm图的关系，入库act_de_model_relation表操作
         *  Generic handling of model relations: deleting/adding where needed.
         */
        protected void handleModelRelations(AbstractModel bpmnProcessModel, Set<String> idsReferencedInJson,
            String relationshipType) {
        
    
            // Find existing persisted relations
            List<ModelRelation> persistedModelRelations =
                modelRelationRepository.findByParentModelIdAndType(bpmnProcessModel.getId(), relationshipType);
    
            // if no ids referenced now, just delete them all
            if (idsReferencedInJson == null || idsReferencedInJson.size() == 0) {
        
                for (ModelRelation modelRelation : persistedModelRelations) {
        
                    modelRelationRepository.delete(modelRelation);
                }
                return;
            }
    
            Set<String> alreadyPersistedModelIds = new HashSet<>(persistedModelRelations.size());
            for (ModelRelation persistedModelRelation : persistedModelRelations) {
        
                if (!idsReferencedInJson.contains(persistedModelRelation.getModelId())) {
        
                    // model used to be referenced, but not anymore. Delete it.
                    modelRelationRepository.delete(persistedModelRelation);
                } else {
        
                    alreadyPersistedModelIds.add(persistedModelRelation.getModelId());
                }
            }
            // 表单管理关系入库处理
            // Loop over all referenced ids and see which one are new
            for (String idReferencedInJson : idsReferencedInJson) {
        
    
                // if model is referenced, but it is not yet persisted = create it
                if (!alreadyPersistedModelIds.contains(idReferencedInJson)) {
        
    
                    // Check if model actually still exists. Don't create the relationship if it doesn't exist. The client
                    // UI will have cope with this too.
                    if (modelRepository.get(idReferencedInJson) != null) {
        
                        modelRelationRepository.save(new ModelRelation(bpmnProcessModel.getId(), idReferencedInJson, relationshipType));
                    }
                }
            }
        }

#### 3 . 创建与更新应用 ####

模型表中modelType =3 为app应用。该模型属于为发布应用。

在flowableAdmin的“应用程序”界面创建应用程序

首先在flowableAdmin的“应用程序”界面创建应用程序（流程定义创建不能添加bpm关系，只能在编辑界面关联），然后在编辑界面绑定bpm流程图。

##### 3.1 创建应用模型 #####

创建应用JSON数据

{
        
      "name": "创建流程定义1",
      "key": "creat_1",
      "description": "111",
      "modelType": 3
    }

/**
     * 创建流程定义、BPM流程图
     * 
     * @param modelRepresentation
     * @return
     */
    @PostMapping(value = "/rest/models", produces = "application/json")
    public ModelRepresentation createModel(@RequestBody ModelRepresentation modelRepresentation) {
        
        modelRepresentation.setKey(modelRepresentation.getKey().replaceAll(" ", ""));
        checkForDuplicateKey(modelRepresentation);
    
        String json = modelService.createModelJson(modelRepresentation);
    
        Model newModel = modelService.createModel(modelRepresentation, json, SecurityUtils.getCurrentUserId());
        return new ModelRepresentation(newModel);
    }

##### 3.2 更新接口 #####

/**
     * 更新流程定义
     * 
     * @param modelId
     * @param updatedModel
     * @return
     */
    @PutMapping(value = "/rest/app-definitions/{modelId}", produces = "application/json")
    public AppDefinitionUpdateResultRepresentation updateAppDefinition(@PathVariable("modelId") String modelId,
        @RequestBody AppDefinitionSaveRepresentation updatedModel) {
        
        AppDefinitionUpdateResultRepresentation resultRepresentation = null;
        try {
        
            resultRepresentation = appDefinitionService.updateAppDefinition(modelId, updatedModel);
        } catch (Exception ex) {
        
            resultRepresentation = new AppDefinitionUpdateResultRepresentation();
            resultRepresentation.setError(true);
            resultRepresentation.setErrorDescription(ex.getMessage());
        }
        return resultRepresentation;
    }

传递关键JSON数据

ID，5423e83a-c397-11ec-a0fb-005056c00008。为act\_de\_model表中 app模型。

ID，5423e83a-c397-11ec-a0fb-005056c00008。为act\_de\_model表中 流程图模型。

{
        
      "id": "5423e83a-c397-11ec-a0fb-005056c0000",
      "name": "创建流程定义1",
      "key": "creat_1",
      "description": "111",
      "version": 1,
      "created": 1650785164627,
      "definition": {
        
        "theme": "theme-1",
        "icon": "glyphicon-asterisk",
        "models": [
          {
        
            "id": "5423e83a-c397-11ec-a0fb-005056c00008",
            "name": "t流程2",
            "version": 1,
            "modelType": 0,
            "description": "2",
            "createdBy": "xiaoming",
            "lastUpdatedBy": "xiaoming",
            "lastUpdated": 1650781946792
          }
        ]
      }
    }

##### 3.2 持久化关系 #####

act\_de\_model表更新MODEL\_TYPE\_APP = 3的数据

因为关联了BPM流程图

*  act\_de\_model更新model模型
 *  act\_de\_model\_relation关系表新增BPM模型和流程定义之间的关系

调用1.1 持久化业务代码逻辑

// 持久化代码
    else if (model.getModelType().intValue() == Model.MODEL_TYPE_APP) {
        
    			  // act_de_model更新
                    modelRepository.save(model);
        			// act_de_model_relation更新
                    handleAppModelProcessRelations(model, jsonNode);
                }

#### 4. 小结 ####

对于flowableUI，把bpm流程图、app应用、form表单，都装载到`act_de_model`表中维护记录。

*  bpm流程图与form表单在act\_de\_model\_relation关联维护，用relation\_type=form-model维护
 *  app应用与把bpm流程图在act\_de\_model\_relation关联维护，用relation\_type=process-model维护

[watermark_type_d3F5LXplbmhlaQ_shadow_50_text_Q1NETiBA5a2m5Lmg5omN6IO95Y-Y5b6X5by65aSn_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/983b780ee8294e7daab9e6c2f61f3db6.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5a2m5Lmg5omN6IO95Y-Y5b6X5by65aSn,size_20,color_FFFFFF,t_70,g_se,x_16
[img-Uvceg5cW-1650786151879_.._mark_img_flowable_form_two_bpm.png]: https://img-blog.csdnimg.cn/08e09b86d8844439a4b1512a7dc4685e.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5a2m5Lmg5omN6IO95Y-Y5b6X5by65aSn,size_20,color_FFFFFF,t_70,g_se,x_16