Vacation Request Workflow Tutorial

What are we going to build?

Vacation Request Workflow

A common example of a workflow is a vacation request workflow between an employee and his/her manager, where the employee requests vacation and the manager must either approve it, reject it or send it back to the employee for corrections. Typically, the process is paper or email-based. The employee fills out a paper form and hands it to the manager for a signature. The form is then faxed or delivered to HR where it is saved in a folder or scanned into the HR or document management system.

Using Live Forms, you can automate this workflow so that it is completely electronic and paperless.

The steps are as shown in the figure:

1. The employee goes to a web page that embeds the workflow. Live Forms makes this very easy to do.
2. The form is configured so that the employee only sees the relevant portion of the form, i.e. the employee does not see the Manager approval section.
3. The employee fills it in and clicks a Continue button.
4. frevvo puts the vacation request on the specific manager's task list, [optionally] notifies the manager by email and displays a confirmation message to the employee.
5. When the manager logs in, she visits a web page that displays an electronic task list.
6. All pending vacation requests will be displayed in the task list.
7. The manager performs each task. The manager-specific portions of the form are now visible. The data entered by the employee is automatically populated for the manager to review.
8. If the manager requires corrections, she can send the form back to the employee to make the changes.
9. Once she approves, she digitally signs the form and clicks Finish.
10. The form data along with a PDF/TIF image is sent electronically to the HR or document management system. The data can also optionally be saved in frevvo's submissions repository.

Setup users and roles in frevvo

This is a one-time setup that will have to be performed by an administrator.

View the SaaS Multi-tenant/Workflow Setup video to see details of setting up your tenant on frevvo's SaaS server.

View the In-house Multi-tenant/Workflow Setup video to see details of setting up your tenant if you are using the In-house version.

For our example, we will need to create a role 'manager'. To create these roles in frevvo:

1. Login to frevvo as the administrative user for your tenant.
2. Click the Manage link at the top right of the page.
3. On the page that is displayed, click the 'Manage Roles' link.
4. Click the [[Image:Add.png] icon and in the form that is displayed type in the desired role. Note that role names are case sensitive.

Creating the Vacation Request Form

Read the general frevvo documentation on designing forms for a detailed discussion of frevvo forms and their features.

In particular, make sure you understand the Name property of a control. You can find more information in the documentation

.

Employee Information

Vacation Request Form

1. Create a new form and drag and drop controls as desired.
2. In the Figure above, we have created a section with employee information. The employee ID, first name, last name, and email are automatically filled out using a business rule. As in the Figure above, the Name field for these controls must show EmployeeId, FirstName, LastName, and EmployeeEmail respectively.

The fields are automatically populated using the rule:

if (form.load) {
  // User Information
  EmployeeId.value = _data.getParameter('subject.id'); // Username
  FirstName.value = _data.getParameter('subject.first.name');
  LastName.value = _data.getParameter('subject.last.name');
  EmployeeEmail.value = _data.getParameter('subject.email');
}

The employee information is obtained from the currently logged-in user.

Manager Id

At this point, you'll have to

• Obtain the manager ID from your external system via a rule. Please see V4_Business_Rules#Dynamic_Content the documentation on dynamic content in business rules.
• Provide a drop down for the user to choose the manager. This involves creating the Manager as a required drop down control in the form and specifying the list of managers in the options for the drop down.
• Hard-code it in the business rule. This involves writing a business rule similar to the one shown below.

if (EmployeeId.value.length > 0) {
  if (EmployeeId.value == 'tom')
    ManagerId.value = 'jerry';
  else if (EmployeeId.value == 'jack')
    ManagerId.value = 'jill';
}

frevvo will shortly support the ability to specify the manager when creating the user or from your Active Directory/LDAP system.

Manager Approval

Vacation Request Form

1. We have also created a section for the Manager called Manager Approval.
2. Enabled digital signatures for this Section by clicking on the Section header and then on the Security Tab in the properties pane to the left. In the Security Tab, the Must Sign box is checked.
3. Assigned role 'Manager' to this Section. This ensures that the Section is only visible to logged in users with role 'Manager', i.e. employees without this role cannot see it.

Creating the Workflow

Read the general frevvo documentation on designing flows for a detailed discussion of frevvo workflows and their features.

1. Set the order of forms in your workflow

Vacation Request Workflow

1. Create a new flow by clicking on the Flows menu item and clicking the New button.
2. Drag and drop forms into the flow as desired. The palette will display the Forms in your application including the Vacation Request form we just created above.
3. In the Figure above, we have dragged & dropped the Vacation Request form twice into the workflow once for the employee and once for the manager.
4. Optionally, edit the form in the first step to remove the Manager Approval section. If you wish to edit the form, click the Activity and then click on the Edit icon as shown below. The Form Designer will be displayed. You can remove the Manager Approval section; it will only be removed from the form in this first step.

Edit form from first step

2. Setup Roles/User Id/Task Info/Pending Message

Set Manager role for second activity

1. Click on the first step (activity).
   1. Leave the Role blank. Any logged in user can perform this step.
   2. Set the Button Label for the first step to 'Request Vacation'.
2. Click on the second step (activity).
   1. Leave the Role blank.
   2. Set the User field to {ManagerId}. frevvo will resolve this to the value of the ManagerId field in the form. As described above, you will need to populate this field. This must resolve to the user ID (not email address) of an existing user in your tenant.
   3. Set the Task Info to 'Vacation Request for {LastName}'. This will be displayed in the Manager's task list. As mentioned before, this will only work if you have a control in the form with name LastName respectively.
   4. Set the Pending Msg to 'Your request has been sent to your manager ({ManagerId}) for approval.' This will be displayed on the employee's screen when he/she submit the vacation request for approval.

3. Notification Emails

You can configure email notifications for a particular activity. In this example, an email would notify the manager when a vacation request is pending for his/her approval.

1. Click on the second step (activity).
2. Click the 'Setup Task Notification Email' link.
3. In the wizard that is displayed, you can customize the subject as well as message content. You can use data from the flow by referring to controls in forms using templatized strings such as {FirstName}, {EmployeeEmail} etc.

4. Setup Actions

Configure form and document actions as desired. See the general flows documentation for more information. When the flow is completed by the manager, you can send emails to notify the employee, save the document in a document management system, send data via HTTP POST to your web application etc. You can also configure what the user sees in detail. We'll describe some of these in more detail below.

5. Flow Permissions

Click the toolbar at the top of the Flow Designer. In the Flow properties panel,

1. Give the workflow a name e.g. Vacation Request.
2. In the Navigation drop down, select None. We do not want to show a Navigation toolbar at the top of this flow.
3. In the Visibility drop down, select 'Public in Tenant'. This ensures that only users who are logged in to the same tenant will be allowed to use the workflow.

Finally, click the Finish button in the toolbar at the top.

Testing the Workflow

1. On the Flows page, click the Test button for your workflow. frevvo will display the first step in the workflow. This is the Vacation Request form to be filled in by the employee. The Employee Information section should be automatically populated.
2. Fill in the form and click the 'Request Vacation' button.
3. Since the second step in the flow was assigned to the user identified by the {ManagerId} field, frevvo will create a new task and put it on that user's task list.
4. frevvo will also notify that user that there is a new pending vacation request (these notifications can be turned on/off by individual users). The email address for the user is obtained from that user's profile.
5. Finally, frevvo will display the Pending Msg that was configured 'Your request has been sent to your manager ({ManagerId}) for approval.' on your screen. The templatized string {ManagerId} will be replaced by the value of that control in the form.

Task List

Read the task list documentation for a detailed discussion of task lists and their features.

Task list for Manager

frevvo includes a built-in Task List for every user. This task list displays all pending tasks (in our example, pending vacation requests) for the user. To access the task list:

1. Logout and login as the manager user ('jerry' in the Figure above).
2. You should see your Task List similar to the Figure above. If you do not see it, click the Tasks menu item to the left.
3. Click the + icon to expand Vacation Request.
4. You will see a task corresponding to the request we just submitted above. Notice that the Task List displays the message "Vacation Request for Cat" which is obtained from resolving the Task Info that we setup above.
5. You can view an audit trail, modify the task and perform it.
6. Click the Perform icon (left most icon).
7. The Vacation Request form will be displayed in a popup window.
8. The parts that were filled out by the employee will be automatically populated and the Manager-specific signature Section will now be visible.
9. After reviewing the information and making any changes, you must click the 'Sign this section' button to digitally sign the form.
10. Click Finish to complete the workflow: this will cause all Form and Document actions to be executed.

Sharing/Embedding the Workflow

The workflow can be easily shared or embedded in your web site. There are many flexible options for doing so. You can find instructions in the tutorial on embedding forms and workflows.