Dynamic List

A UI-Node to display a list of process instances or usertasks.

Usage

Query ProcessInstance or UserTask data from the process engine. Use a function node to transform the queried data into the required format for the dynamic-list node. The dyanmic-list node expects an array of objects as its messages payload. The expected schema of these objects is:

• title: string;
• progress?:
  • type: 'boolean' | 'percentage';
  • value: number; (value between 0 and 100)
• details?: string;
• state?:
  • text: string;
  • backgroundColor: string;
• assignee?: string;

Pipe the function nodes result into the dynamic-list node.

The nodes default output will be triggered each time a list entry was clicked. The payload property of the message that is ouput will be an object identifieng the clicked list entry. This object will exactly equal one of the objects that where used as an input for the dynamic-list node. Therefore, any amount of additional properties can be passed through this node, besides the ones used for displaying the list entry. I. e. a processInstanceId, flowNodeInstanceId or userTask. Each additional output, generated by actions, will behave in the same manner, but is only triggered when clicking onto the corresponding button.

Actions

This field is used for configuring additional actions for each list entry. Actions will be displayed as buttons at the end of each row.

Each action is defined by:

• Id: The Id of the action. This will be the name of the nodes output.
• Icon: An URL for an image, that should be displayed. This will be used as the src-Property of a HTML img-Element. Therefore DataURLs can be used to add images/svgs etc., that are not available online.

For each action configured, the node will gain a new output, that is named as the linked actions id.

Item hover effect

When not checked, all hover effects for the list entries will not be shown. Clicking the card will still trigger a message from the nodes first output.

Reference

https://docs.processcube.io/docs/lowcode