The following tutorial shows how to configure a simple workflow that provides Save as Draft capability as well as a single level approver.
- Create a new Project in FAB. Choose Workflow Mode – 'Enhanced'
- Press the Workflow Button
. The FAB Process Designer opens.
- Start by switching to the 'Levels' tab and add three levels, 'Start', 'Approve' and 'Complete'. Set the Status at each level to be 'blank', 'Approval' and 'Completed' respectively.
Note: The names of the levels and the status are arbitrary, but you should use meaningful names as these will be visible in the workflow and 'My Forms'.
- Switch to the Process Flow tab and notice how the flow is taking place. There are three levels shown in the diagram.
- Now add our first Task. Call it 'Start' (arbitrary). Ensure it is in the Level 'Start', and give it an Abbreviation 'START' (arbitrary)
- Assign a Role to this Task by pressing the 'Roles' button. Assign the Role 'Initiator' to this Task, as it will be the Initiator who will carry out this Task.
- Now add another Task called 'Draft'. It should also be in the 'Start' Level.
- Assign the Role 'Initiator' to this Task, as once again, it will be the Initiator who will be able to action this Task (ie, the initiator can save the document as 'Draft', and then later 'Submit' it)
- Check the Process Flow Diagram now. Notice the Start and Draft Tasks appear in the Start Level.
- Now add an Action to the 'Start' Task by pressing the 'Actions' button
- Add an Action with the Action Id 'DRAFT' (arbitrary), Action Text 'Draft' (arbitrary). (The Action Text will appear on the Footer Toolbar button at run-time)
- Choose an Icon for the Action. This will be the Icon that appears in the Footer Toolbar of the application at run-time. Choose the 'Save' icon (arbitrary).
- Choose the 'Button Type'. This a UI5-specific setting for the buttons; 'Transparent' will render the button without color or a border. This setting is arbitrary.
- Next, set the 'Behaviour' of the Action by pressing the 'Behaviour' button. For the 'DRAFT' Action, we just want the action to bypass any validations that may exist in the app (such as mandatory fields). We also do not tick 'Go Back' as we want the application to remain open when the user presses Draft so they can continue to edit and perhaps make further changes.
- Next we specify what will be the 'Outcome' of this Action by pressing the 'Outcomes' button. The Outcome of any Action is another Task. In this case the Outcome of the DRAFT Action is to move the application to the 'Draft' Task.
- Check the Process Flow Diagram now. Notice there is now a connection between the Start Task and the Draft Task
- Next, add another Task and give it the Task Id 'Approve' (arbitrary) and Abbreviation 'APPRV' (arbitrary). Ensure that this Task is the 'Approve' Level.
- Before we assign a Role to this Task, create a new Role in the Roles tab and call it 'Approver1' (arbitrary).
- Then assign this Role to the 'Approve' Task. This means that only a user with the 'Approve1' Role will be able to action this Task.
- So far we have defined the 'DRAFT' Action that moves the workflow from 'Start' to 'Draft'. Next we configure a 'SUBMIT' Action to move the workflow from 'Start' to 'Approve'
- Add a second action and give it the Action Id 'SUBMIT' (arbitrary), Action Text 'Submit' (arbitrary), Icon 'action' (arbitrary) and Button Type 'Accept' (arbitrary). (The 'Accept' button type will show the button as green in the toolbar)
- Configure the Behaviour of this Action. Here we want the app to 'go back' after pressing the Submit button, as the user has completed data entry and is submitting the Form for approval (ie there is no further editing required).
- Configure the Outcome of this Action, which is to move the workflow to the 'Approve' Task.
- Check the Process Flow Diagram again. See the 'Submit' Action takes the workflow to the 'Approve' Task.
- For the 'Draft' Task we want the same behaviour as the 'Start' Task. That is, the user can press either 'Draft' (and the workflow will stay in Task 'Draft') or they can press 'Submit' and move to the Approval Task.
Since the actions are identical for this Task, we can use the 'Copy Actions from another Task' button.
- Press the button and choose the 'Start' Task to copy the Actions from.
- The Actions will be copied.
- Check the Process Flow again and notice that 'Draft' also leads to 'Approve'
- Next we can to configure the Actions for the 'Approve' Task, but first we need a Task for the Outcome of that Action. Add a new Task 'Complete' (arbitrary) and ensure it is in the 'Complete' Level. Give the Abbreviation 'COMPL' (arbitrary).
- Check the Process Flow Diagram and notice the Complete Task has appeared in the Complete Level.
- Now configure the Actions for the 'Approve' Task. Add an Action Id 'APPROVE', Action Text 'Approve', Icon 'accept', Button Type 'Accept'.
- Configure the Behaviour to 'Completes Task' and 'Go Back'.
- Set the Outcome of the Action to the 'Complete' Task.
- Check the Process Flow again.
- We can also configure a 'REJECT' Action
- The Reject Action will 'Go Back', and the Outcome will be 'Start' (or 'Draft')
- The basic workflow is now complete. Press 'Save and Close' and return to the FAB Workbench. Save the Project. (it may be necessary to press 'Live View Reload' if using Live View). Notice now that the application has a footer toolbar with the appropriate actions (Draft and Submit)
