Process Progress Bar
A UI-Node to display a step-by-step progress bar, tracking the progress of a process.
Usage
After configuring the node, use a usertask-event-listener node and direct all new and finished events for the tracked process into the ui-process-progress-bar node.
It will automatically update, when UserTasks are started or finished.
The output of a usertask-input node can also be used as an input, when using the Result type Send First Task.
This node can display 0-1 active steps and all steps before the running step are always displayed as finished.
Title
Will be displayed above the progress bar. It can also be set dynamically by setting msg.payload.title.
Steps
This field is used for configuring the steps of the progress bar.
Each step is defined by:
- Label: The text displayed for the progress bar step
- FlownodeId: The Id of the Flownode, that needs to be active/finished to start/fullfill this step.
- Icon (optional): An URL for an image, that should be displayed in addition to the label. 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.
- Icon finished (optional): An URL for an image, that should be displayed in addition to the label, after the step has been finished. 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.
Color
Will be used as the outline/fill/text color for the steps.
Reference
https://processcube.io/docs/solutions/node-red