Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3
Section
Column

In this tutorial, we will go over the creation of an Expense Report Workflow, using . Using the "Flows" feature, we can create an online expense report workflow, where the employee can report his/her expenses, and a manager can approve of them, using the signatures feature in the form builder.

Before we begin, make sure you have ' license that includes Flows.

Column
width240px

On This Page:

Table of Contents
maxLevel1

...

  • A role system, assigning different parts of the flow to different users
  • Signatures, which will lock the information in place for security
  • Fully customizable options, such as buttons, email notifications, and displayed messages
  • Quick View feature so the manager/reviewer can quickly approve/reject the Expense Reports from their Task List
  • Synchronization with Google Docs, sending a .pdf into a pre-made folder for later access

We will also be using Business Rules, which require some knowledge of programming. For help on Business Rules, go to the Business Rules documentation.

Example Forms

Example forms are available for download through our site.

Step 1: Build a form

First, we'll put together a form to collect the employee and manager reviewer information.

Auto-filling

The first step in our form is to create an Identification area, which will collect the Id, the Name, and the Email Address of both of  the employee and the assigned managername of the assigned Reviewer for that employee. In our tenant, the two employees used are named Jack and Tom. The managers (Reviewers) are named, respectively, Jill and Jerry.

Image Removed

Using a simple business ruleImage Added

Using  Business Rules, we can autofill not only the employee text boxes, but also the corresponding manager boxesReviewer box and Report Date. The employee information is and the Reviewer name are automatically filled in using the credentials of the user who is logged in. In the rule below, we are simply hard-coding the manager information but in practice, the manager information would be retrieved from a back end system such as a database or an LDAP serverThe Report date will be filled in using a separate ruIe. The IRS Mileage Rate is a default value for that field.

Here is an example of a rule to fill in the current date using the frevvo.currentdate function. Refer to the Rule Validator documentation for help troubleshooting your rules.

Code Block
if (form.load ) { 
   var sidReportDate.value = _datafrevvo.getParameter('subject.id')
    if (EmployeeId.value.length == 0) {
        EmployeeId.value = sid;
     currentDate(form);
}

This rule will autofill the Employee Name, email and reviewer name from the user's credentials.

Code Block
if (form.load && EmployeeName.value === '') {
  EmployeeName.value = _data.getParameter('subject.first.name') + ' ' +
                      _data.getParameter('subject.last.name');
     
  EmployeeEmail.value = _data.getParameter ('subject.email');
  Reviewer.value = _data.getParameter("subject.reports.to");
} else {
        sid = EmployeeId.value;
    }
    if (sid == 'jack'

Expense Report Section (to be filled in by Employee)

Image Added

Create a section called Expense Report as shown above. Employees will fill in this section to calculate their expenses. Use the Table control to make your grid. You will find information about adding, removing and moving columns in a table here,

Add these rules to perform the calculations in the Expense Report::

To compute the Mileage Expense:

Code Block
for (var i = 0; i < MilesTraveled.value.length; i++) {
  if (MilesTraveled[i].value > 0) {
    MileageExpense[i].value = MilesTraveled[i].value * ManagerIdIRSMileageRate.value;
= 'jill'; }
}

To calculate the Day's Total:

Code Block
for (var i = 0; i < ManagerNameMisc.value = 'Jill Burns'.length; i++)
{
    DaysTotal[i].value = ManagerEmailMisc[i].value = 'jill@frevvo.org';
    } else if (sid == 'tom') {
        ManagerId.value = 'jerry';
        ManagerName.value = 'Jerry Mouse';
        ManagerEmail.value = 'jerry@frevvo.org';
    }
}

Expense Report Section (to be filled in by Employee)

Image Removed

Create a section called Expense Report as shown above. Employees will fill in this section to calculate their expenses.

+ Meals[i].value + Travel[i].value + MileageExpense[i].value;
}

And finally, to compute the Grand Total:

Code Block
var tot = 0;

for (var i = 0; i < DaysTotal.value.length; i++) {
  tot = tot + DaysTotal[i].value;
}
 
GrandTotal.value = tot;

if (ExpenseRepeat.itemRemoved) {var x;}

 

Approval Section (to be filled in by

...

the Reviewer)

Image RemovedImage Added

Create a section called Manager Approval as shown above. Managers Reviewers will approve or reject expenses using this part of the form. 

Roles on Sections

When an employee is using the form, we do not want the Manager Approval section to be visible.  includes the ability to assign Roles to certain sections. If a section has a Role, only authorized users (who have that Role) will be able to view the section. In our example form, the Expense Report section has not been assigned a role. This means that all users will be able to view it. In contrast, the Manager Approval section has been assigned the role Manager.  This means that only users with the role Manager will be able to view that section. This is similar to the common "For Office Use Only" sections of paper forms.

...

To assign a section to a role, select the section in question and go to the tab labeled Security in the properties panel. In the scrolling menu, select one or more roles. Assign the Manager role to the Manager Approval section in the Expense Report form.

Signatures

 supports the ability to digitally sign sections. To enable signatures, select the section (by clicking on its header) and in the properties panel, select the Security tab. Select Text/Signature Image or Wet Signature Image from the Signature dropdown to enable a digital signature for the section. You can select the Wet Signature type, if you prefer. Refer to Electronic Signatures for more information. If you also check Must Sign, then the form cannot be submitted unless the section is signed. The Lock Signed checkbox is checked by default - if checked, a signed section cannot be edited by a different user once the form is submitted. In this example, once the employee fills in expenses and forwards them to the manager reviewer for approval, the manager will not be able to edit the expenses. The digital signature guarantees that the data has not been tampered with. If you uncheck this box, then the signature can be removed by the manager reviewer who can then edit the Expenses section.

...

Begin editing your flow. In the palette in the upper-left, you will see available forms in that application.

Image Removed]Image Added

Simply drag the Expense Report form into the main flows window. For our expense report, which already has roles assigned within the form, we will simply drag and drop the same form twice. This means that the workflow consists of two steps: both steps are using the same form but it will look different depending on who is filling out the form as we will see in the next step. Rename the second form Manager Review.

Assign Roles

 Image RemovedImage Added

Select the first activity (first Expense Report form in this example), and view the properties window on the left. A scrolling menu listis lists the available roles. For the first form select the Employee role. This assignment makes the first step accessible only to logged in users with the Employee role.

For the second activity, we could simply assign the role Manager. However, we want each employee's expenses to be approved/rejected by his/her manager and not by any manager. If we simply assign the role MangerManager, this would put a notification in every manager's inbox as soon as any employee in the company filed an expense report. Instead of assigning a role, we will assign it to a specific user.  can dynamically determine which user the notification should go to. In the Expense Report Form, there is a text control named "ManagerIdReviewer." The Manager Id Reviewer is simply the username of the manager in question. We can use the information entered in that control to forward a notification to the right managerreviewer. In the Properties window, just below the Role menu, there is a text control labeled User (see the figure above). In that text control, type the following:

Code Block
{ManagerIdReviewer}

This is a template. At runtime,  will evaluate the value of the data item (ManagerIdReviewer), which is automatically filled in via a business rule above.  will then send a notification to that specific manager only which is exactly what is desired in this case.

Quick View Setup

The Reviewer can quickly accept/reject tasks by clicking the Image Added Quick View icon for a task when accessing the Task List. Set up this feature for the Manager Approval form in this flow. Click on the Manager Review form and then click the Setup Quick View link on the form Property pane. Be sure to check the Enable box and then compose a Summery of the task that will be seen on the Manager's Task List.

Image Added

Email Notification

You can customize/configure email notifications in .  In the properties window for an activity, there is a link at the bottom labeled Set Up Task Notification Email. When you click it, a dialog is displayed with a default email message. This default messages reads: "You can access your task list by clicking {task.list.url}." The template at the end provides a link (in the email) to the task list that the manager reviewer can use to go straight to his/her list of pending tasks.

...

This allows you to customize the label of the Continue button in a workflow. For our example, we'll set it to "Report ExpenseSubmit Expenses." Note that this applies to the current activity. In this case, we have set the button label for the first activity.

...

This allows you to customize the task description that appears in the managerreviewer's task list. Note that this applies to the current activity. We will need to set this property on the second activity (step) in the workflow since that is the step that gets put on the managerreviewer's task list. The task description can use templates. For example, we have chosen the task description:

...

Code Block
Your expense report has been submitted to {ManagerNameReviewer} for approval.

Flow Permissions

...

Login as an employee (tom in our example).  will display the first step in the workflow. This is just the Expense Report form except that the Manager Approval section is not visible.

Image RemovedImage Added

After completing the expense report and signing, the employee can submit it to the managerreviewer. The expense report information cannot be edited by the managerreviewer. After pressing the Continue button (which is labeled Report Expense Submit Expenses as we customized), the employee will see the customized display message. In our example tenant, when the employee Jack Johnson submits his expense report, he sees the message "Your expense has been submitted to Jill Burns for approval." If the employee Tom Cat submits his expense report, he sees the message "Your expense has been submitted to Jerry Mouse for approval."

Task List

Image RemovedImage Added

 includes a built-in Task List for every user. To access your Task List, login and click on the Tasks menu item on the left. This will display any Tasks that are pending in your inbox. You can perform tasks, modify them (abort or route to a different person) and view the history (audit trail) of a particular workflow.

...

In our example, when a manager (Jill or Jerry) logs in and views the task list, he/she will see any pending Expense Report approvals for their respective employees. The manager can then click the Perform this Task button.

Image RemovedImage Added

The manager will see the expense report information submitted and signed by the employee. It cannot be edited. However, because of the Role settings described earlier, the manager will also see the Approval section. He/She can approve or reject the expense report, enter any comments and Finish Approve the workflow.

Documents/Notifications

...