Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.


Page Properties
hiddentrue
idPROGRESS

Product Version
Report Note
Assignee

Resources & Remarks

Modification History

NameDateProduct VersionAction
Antje23 JUL 20212021 Autumncreated
Martin26 JUL 20212021 Autumn

draft

Bratislav29 JUL 20212021 Autumndraft
Antje29 JUL 20212021 Autumnformatting, published
Agnieszka25 AUG 20212021 AutumnrLANG
Martin24 SEP 20212021 WinterAdded the section for starting processes with a startform
Antje27 OCT 20212021 Winterclient-specific Flowable variables added
Christoph15 FEB 20222022 Springadded Custom Confirm Actions (DOKU-2347)



Excerpt

Use the BPM Engine for process and task management within your client.


Section
bordertrue


Column

Table of Contents

Table of Contents
exclude(Table of Contents|Read on|Another Tutorial|Another Concept Article|Another interesting Tutorial|Custom Client Build with Libraries|yuuvis\® client as reference implementation|Client Plugin API)


Introduction

The BPM Engine in yuuvis® Momentum is provided by the BPM-ENGINE service based on the workflow functionality of the open-source software Flowable. In yuuvis® client as reference implementation, it can be integrated in order to support process and task management via the browser application.

...

Column in yuuvis® clientCorresponding Counterpart in BPM EngineDescription

Description (not available anymore as of version 2021)

Process variable whatAboutThe description that was entered while creating the follow-up.
as of 2021 Winter: SubjectWeb-API Gateway parameter subject, represented as Flowable string variable subjectSet while creating the process.
Created onProcess parameter startTimeThe time the follow-up (process) was created.
Follow-up dateProcess variable expiryDateTimeThe due date that was entered while creating the follow-up.
StatusDerived from process parameters endTime and suspendedPossible values for Status are running, completed and suspended.

...

The twosteptest_proc process model has to be deployed to the Flowable BPM Engine.

yml
Code Block
language
titlePlug-in Configuration for an Example 'Two step pocess'
collapsetrue
{
  "disabled": false,
  "actions": [
    {
      "id": "yuv.custom.action.two.step.multi.label",
      "label": "yuv.custom.action.two.step.multi.label",
      "description": "yuv.custom.action.two.step.multi.description",
      "priority": 0,
      "icon": "<svg height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M0 0h24v24H0V0z\" fill=\"none\"></path> <path d=\"M4 10h12v2H4zM4 6h12v2H4zM4 14h8v2H4zM14 14v6l5-3z\"></path> </svg>",
      "group": "further",
      "range": "MULTI_SELECT",
      "isExecutable": "(item) => item.id",
      "run": "(selection) => this.http.post('/bpm/processes', {businessKey: selection[0].id, name: selection[0].title || selection[0].id, processDefinitionKey: 'twosteptest_proc', attachments: selection.map((s) => s.id), subject: selection[0].title, variables: [{ name: 'myVariable', type: 'string', value: 'Lorem ipsum' }]},'api-web').then(() => this.util.notifier.success(this.util.translate('yuv.custom.action.two.step.multi.success')))"
    },
    "yuv-download-action",
    "yuv-delete-action",
    "yuv-delete",
    "yuv-upload",
    "yuv-upload-action",
    "yuv-move-action",
    "yuv-move",
    "yuv-follow-up-action",
    "yuv-follow-up",
    "yuv-reference-action",
    "yuv-open-context-action",
    "yuv-open-versions-action",
    "yuv-clipboard-action",
    "yuv-clipboard-link-action"
  ],
  "translations": {
    "en": {
      "yuv.custom.action.two.step.multi.label": "Two step process",
      "yuv.custom.action.two.step.multi.description": "Starts simple process with two steps, also for many objects",
      "yuv.custom.action.two.step.multi.success": "Process has started"
    },
    "de": {
      "yuv.custom.action.two.step.multi.label": "Zweischritteprozess",
      "yuv.custom.action.two.step.multi.description": "Startet einen einfachen Prozess mit zwei Schritten, auch für mehrere Prozesse",
      "yuv.custom.action.two.step.multi.success": "Prozess wurde gestartet"
    }
  }
}

...

Code Block
titleExample Configuration
linenumberstrue
collapsetrue
{
  "name": "twosteptest_proc:1st_task",
  "situation": "EDIT",
  "script": "",
  "elements": [
    {
      "name": "core",
      "type": "o2mGroup",
      "elements": [
        {
          "type": "o2mGroup", 
          "layout": {
              "align": "row"
          },
          "elements": [
           {
              "type": "o2mGroup", 
              "name": "xyzSimplefields",
              "layout": {
                  "align": "column"
              },
              "elements": [
                {
                  "name": xyzDatetime",
                  "type": "datetime",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false
                },
                {
                  "name": "xyzDate",
                  "type": "datetime",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false,
                  "resolution": "date"
                },
                {
                  "name": "xyzInteger",
                  "type": "integer",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false                },
                {
                  "name": "xyzDecimal",
                  "type": "decimal",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false
                },
                {
                  "name": "xyzString",
                  "type": "string",
                  "required": false,
                  "rows": 1,
                  "readonly": false                },
                {
                  "name": "xyzStringmultirow",
                  "type": "string",
                  "required": false,
                  "rows": 3,
                  "readonly": false
                }
              ]
            },
            {
              "type": "o2mGroup", 
              "name": "xyzComplexfields", 
              "layout": {
                  "align": "column"
              },
              "elements": [
                {
                  "name": "xyzEmail",
                  "type": "string",
                  "cardinality": "single",
                  "readonly": false,
                  "classifications": ["email"]
                },
                {
                  "name": "xyzUrl",
                  "type": "string",
                  "required": false,
                  "readonly": false,
                  "classifications": ["url"]
                },
                {
                  "name": "xyzPhone",
                  "type": "string",
                  "required": false,
                  "readonly": false,
                  "classifications": ["phone"]
                },
                {
                  "name": "xyzUser",
                  "type": "string",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false,
                  "classifications": ["id:organization"]
                },
                {
                  "name": "xyzReference",
                  "type": "string",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false,
                  "classifications": ["id:reference[]"],
                  "label": "Reference"
                },
                {
                  "name": "xyzCatalogcustom",
                  "type": "string",
                  "required": false,
                  "cardinality": "single",
                  "readonly": false,
                  "classifications": ["custom:catalog[/api-web/api/dms/catalogs/tenMytenant:processstatus]"],
                  "label": "Catalog status"
                },
                {
                  "name": "xyzBroc:boolean",
                  "type": "boolean",
                  "required": false,
                  "readonly": false,
                  "label": "Boolean"
                }
              ]
            }
          ]
        },
        {
          "name": "xyzTest_table",
          "type": "table",
          "required": false,
          "readonly": false,
          "label": "Notices",
          "description": "List of notices",
          "classifications": "sortable",
          "elements": [
            {
              "name": "xyzColumn_string",
              "type": "string",
              "required": false,
              "cardinality": "single",
              "readonly": false,
              "label": "String"
            },
            {
              "name": "xyzColumn_date",
              "type": "datetime",
              "required": false,
              "cardinality": "single",
              "readonly": false,
              "label": "Date"
            },
            {
              "name": "xyzColumn_user",
              "type": "string",
              "required": false,
              "cardinality": "single",
              "classifications": ["id:organization"],
              "readonly": false,
              "label": "User"
            },
            {
              "name": "xyzColumn_boolean",
              "type": "boolean",
              "required": false,
              "cardinality": "single",
              "readonly": false,
              "label": "Boolean"
            }
          ]
        }
      ]
    },
    {
      "name": "data",
      "type": "o2mGroupStack",
      "elements": [],
          "layout": { "align": "column" },
          "label": "Table group"
    }
  ]
}

HintNote: the The key-value pair  "classifications": ["sortable"] allows the user to sort the table rows manually by drag & drop.

The following client-spezific specific Flowable variables are available:

...

As of version 2021 Winter, a plug-in action is available that allows to start a process via a start form as shown in the example screenshot. If all form fields are filled with valid values, the Start button is enabled. Both form fields User and Comment are required variables for starting a process. The code block below shows the corresponding plug-in configuration offering a start form with the name taskform in the object action view (displayed after a click on the object action Test process with role assignment).


language
Code Block
collapse
ymltitleExample Plugin Configuration Start Form
linenumberstruetrue
{ 
  "disabled": false,
  "actions": [
    {
      "id": "yuv.custom.action.userGroupAssignment.multi.label",
      "label": "yuv.custom.action.userGroupAssignment.multi.label",
      "description": "yuv.custom.action.userGroupAssignment.multi.description",
      "priority": 1,
      "icon": "<svg height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M0 0h24v24H0V0z\" fill=\"none\"></path> <path d=\"M4 10h12v2H4zM4 6h12v2H4zM4 14h8v2H4zM14 14v6l5-3z\"></path> </svg>",
      "group": "further",
      "range": "MULTI_SELECT",
      "isExecutable": "(item) => item.id",
      "buttons": {
        "finish": "yuv.custom.action.userGroupAssignment.multi.start"
      },
      "plugin": {
        "component": "yuv-object-form",
        "inputs": {
          "__initOptions": "this.http.get(`/resources/config/taskform`, 'api-web').then((res) => {component.cmp.options = {formModel: res.data.tenant, disabled: false}})",
          "__init": "() => parent.finished.subscribe((event) => { var selection = parent.selection; var cmp = component.cmp; this.http.post('/bpm/processes',{businessKey: selection[0].id,name: selection[0].title || selection[0].id,processDefinitionKey: 'userGroupAssignment',attachments: selection.map((s) => s.id),subject: selection[0].title,variables: [{ name: 'user', type: 'string', value: cmp.formData.user || '' },{ name: 'comment', type: 'string', value: cmp.formData.comment || '' },{ name: 'nextUserAssignee', type: 'string', value: 'fakeUserId' },{ name: 'nextGroupAssignee', type: 'string', value: 'YUUVIS_MANAGE_SETTINGS' }]},'api-web').then(() => this.util.notifier.success(this.util.translate('yuv.custom.action.userGroupAssignment.multi.success')))})"
        },
        "outputs": {
          "statusChanged": "(status) => { parent.disabled = status.invalid; }"
        }
      }
    },
    "*"
  ],
  "translations": {
    "en": {
      "yuv.custom.action.userGroupAssignment.multi.label": "Test process with role assignment",
      "yuv.custom.action.userGroupAssignment.multi.description": "Starts a process with two tasks. Second task assigned to YUUVIS_MANAGE_SETTINGS",
      "yuv.custom.action.userGroupAssignment.multi.success": "Process has started"
    }
  }
}

The following code block shows the form definition for the plug-in action example displayed above:

Code Block
languageyml
titleDefinition Example
linenumberstruecollapsetrue
 {
  "description": "This form is used during process start and both task of process userGroupAssignment",
  "name": "taskform",
  "situation": "EDIT",
  "elements": [
    {
      "name": "core",
      "type": "o2mGroup",
      "elements": [
        {
          "name": "user",
          "labelkey": "userGroupAssignment:user",
          "type": "string",
          "cardinality": "single",
          "required": true,
          "readonly": false,
          "classifications": ["id:organization"]
        },
        {
          "name": "comment",
          "labelkey": "userGroupAssignment:comment",
          "type": "string",
          "required": true,
          "readonly": false,
          "rows": 3
        }
      ],
      "layout": {
        "align": "column"
      }
    },
    {
      "name": "data",
      "label": "data",
      "type": "o2mGroupStack",
      "elements": []
    }
  ]
}

...

Custom Confirm Actions

As of version 2022 Spring, it is possible to configure custom confirm actions for a BPM task including an optional form that is offered after activation of the corresponding confirmation actionBPM tasks. These custom confirm actions trigger optional forms that give users the possibility to provide further data that is relevant only for this particular outcome. The so-called outcomes can be configured in the static BPM - form file files as well as in the dynamic one (internal: BUD-789)dynamic ones:

Code Block
titleoutcomes Outcomes configuration
{
  "model":
  {
    ...
  },
  "outcomes": [
    {
      "name": "taskflow_finish",
      "variable": "status",
      "value": "close"
    },
    {
      "name": "taskflow_forward",
      "secondary": true,
      "variable": "status",
      "value": "open",
      "model": "taskflow-form-forward"
    }
  ]
}

The outcomes list contains the custom task confirm actions visualized that will be displayed as buttons in the UI instead of the standard confirm button. The order of the buttons is from the right to the left. The buttons are shown displayed in the accent color per default. The outcomes section can be used in the dynamic action forms as well.

ParameterDescription
nameTechnical name of the custom confirm action that is used as label for the
confirm
button to be displayed in the client if not localized.
variable
Name

 The name of the Flowable variable for

which value should be set by the custom confirm action. This

which the specified value is saved after the user has clicked the button. The variable can be used to control the process flow.

value
Value for
The value of the Flowable
variable specified by
variable.
secondary

If false (default), the button is shown in the accent color.

If true, the button is NOT shown in the accent color.

model
This model is offered by clicking the action button the model is part of.

Specify the technical name of a defined BPM form or a complete valid form model. This form will only be shown if users click the corresponding custom confirm action.