aneQa

ProcessMaker 3 Advanced Architect Course

Content

1. Introduction ......................................................................................................................... 3

2.0 Modelling a Process .......................................................................................................... 11

3.0 Dynaforms ........................................................................................................................ 25

4.0 Multilanguage Support ..................................................................................................... 53

5.0 Users, Groups, Departments and Roles .............................................................................. 60

6.0 PM Tables and Dynaforms ................................................................................................. 74

7.0 Reports SLA ...................................................................................................................... 89

8.0 Data Reporting Tools ......................................................................................................... 91

9.0 Input and Output Documents .......................................................................................... 101

10.0 JavaScript in Dynaforms ................................................................................................ 117

11.0 Triggers ......................................................................................................................... 123

12.0 Configuring an Invoice Approval Process ........................................................................ 134

13.0 Running an Invoice Approval Process ............................................................................. 144

14.0 Custom Case List Builder ............................................................................................... 155

15.0 Web Entries and Case ................................................................................................... 160

16.0 Sub-processes ............................................................................................................... 169

17.0 Enhanced Login ............................................................................................................. 195

18.0 External Registration Wizard ......................................................................................... 209

19.0 Actions by Email ............................................................................................................ 214

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 2
ProcessMaker 3 Advanced Architect Course

1. Introduction
1.1 Introduction a BPM
What is BPM (Business Process Management)?
BPM can be applied to large and small organizations alike.

The goal - the improvement of business performance and agility by applying one or all of the following:

A comprehensive, well understood and documented set of standardized processes – typically

defined within a process framework to drive transparency and efficiency -aka BPM
An approach to process improvement, including an approach to measuring and monitoring day to
day business processes for continuous improvement and efficiency- aka BPI/BPM
Use of information technology/software, including process modeling, process simulation,
process repositories, workflow, integration, reporting and other technologies to facilitate bullets 1
and 2, as well asautomate and further optimize processes - aka BPMS/SOA/BI

The following defines a few basic terms before we delve further into the topic.
Definition of a Business Process
A business process can be anything from processing a customer order, to opening a new account or on-
boarding a new employee. It is the set of steps taken in our day to day work activities performed to
accomplish a desired outcome.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 3
ProcessMaker 3 Advanced Architect Course

Types of Business Processes

There are different levels or types of business processes. Types of processes are referred to here as
'Super processes' (including management processes, operational processes and supporting processes).
Operational processes – also considered 'core value streams' or 'primary processes' - are those processes
that are central to the design, production and delivery of a company’s products and services. The top
chart includes some examples of these super business processes. A key concept in BPM is to focus on
optimizing the “value stream”, or the processes that collectively deliver value to the customer.

Super processes are generally broken down into high level business processes or groups. For example, if
we look at the Employee Lifecycle Management super process in more detail, it can be unpacked into

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 4
ProcessMaker 3 Advanced Architect Course

several business processes such as Recruiting, Employee On-boarding, Benefits Management,

Performance Reviews and Employee Exit.
These high level business processes in turn can be broken down into workflow level processes, which are
the detailed activities and tasks performed to complete each process as depicted by the Performance
Reviews workflow to the right. Understanding how day to day work activities ultimately roll-up to high
level processes and super processes is fundamental to the establishment of metrics and alignment of work
activities to strategic goals and business objectives.
Click here to learn more about process frameworks, or for industry standard process frameworks with
defined process categories and breakdowns by industry, visit APQC.
Process Improvement
There are many workforce and business system inefficiencies today that lead to poor quality of service,
unnecessary costs as well as customer and employee satisfaction issues. These and other problems can
often be tied to poor understanding, measurement and control of day-to-day work activities (AKA
business processes).
Another major aspect of BPM is to better understand processes through techniques such as
mapping/documenting processes and workflows, and looking for waste and ways to improve processes.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 5
ProcessMaker 3 Advanced Architect Course

The example on the left depicts a workflow level HR process and tries to show the relatively chaotic
mechanisms that we are probably all too familiar with. When there is little formalization or concentration
given to process improvement, everyone may know what the end goal is, but it may seem like it's handled
differently every time. When everyone talks about how 'broken' a process is, you probably have a good
process candidate for BPM improvement initiative. Using a variety of BPM methodologies and analysis
techniques that we cover in the How To section, you probably have a very good shot at improving your
business from the institution of improved processes.
Process Automation
Some processes but not all processes can also benefit from the use of BPMS Business Process
Management Software) or other forms of technology. A combination of workflow automation,
integration, monitoring and management tools, BPMS platforms can offer very significant benefits. They
can automate workflow and orchestrate processes, reduce risk of errors, provide metrics and visibility into

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 6
ProcessMaker 3 Advanced Architect Course

status; enforce deadlines; validate, properly route and synchronize data; reduce training costs and provide
other benefits as well. These improvements can add up to a very serious positive impact on a business's
bottom line.
The case for BPMS can be seductive, but the effort to implement these systems should be carefully
considered. What might appear at first to be a simple process may in fact have so many 'hidden'
exceptions that an automation effort becomes a much more extensive and expensive project than
originally estimated.

With some of these elements defined, let's get back to the question - what is BPM?

Business Process Management (BPM) is:

A holistic perspective of BPM includes all three of the following components.

- A Management Approach/Philosophy led by a company's management team that places emphasis on
understanding and optimizing business processes. By defining business processes, establishing
measurements to track their performance in alignment with business goals, implementing improvements
and monitoring processes, companies can not only innovate faster to meet changing market demands,
they can deliver the best quality products and services in the fastest and most cost effective way to both
internal and external customers. Change Management and Performance Management are key aspects of
BPM.
- A Methodology for instituting a continuous process improvement lifecycle. Methodologies provide
specific guidance in the form of phases, activities and techniques business teams can use to continuously
improve a business process.

- Technology is typically used to help perform the activities of the methodology as well as enforce its
execution. BPM software can help with mapping and documenting business processes to aid
communication by analyzing processes to identify inefficiencies. Any inefficiencies can be solved through

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 7
ProcessMaker 3 Advanced Architect Course

controlling workflow, automatic activities and monitoring both business activities and performance, as
well as augmenting and enhancing current computing systems to optimize workforce.
The Benefits of BPM
The benefits of BPM are both qualitative and quantitative; there is not an industry segment that cannot
benefit from BPM. Both top line and bottom line benefits have been proven time and time again - from
increasing revenues by speeding time to market, improving customer service or improving product and
service quality, to lowering costs through workforce and business systems optimization.

What's Involved in Implementing BPM?

Below are 7 factors and related considerations for implementing BPM. Once you determine scope and
goals, method can be derived. Once you determine the method, then skills, tools, investments and
sponsorship can be determined.

1.2 What is ProcessMaker

ProcessMaker is a cost effective and easy to use open source business process management (BPM) and
workflow software application. Workflow software such as ProcessMaker can assist organizations of any
size with designing, automating and deploying business processes or workflows of various kinds.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 8
ProcessMaker 3 Advanced Architect Course

ProcessMaker workflow software features an extensive toolbox that provides the ability to easily create
responsive dynamic forms and map out fully functioning workflows. The software is completely web based
and accessed via any web browser, making it simple to manage and coordinate workflows throughout an
entire organization - including user groups and departments. ProcessMaker workflow software can also
interact with other applications and systems such as ERP, business intelligence, CRM and document
management.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 9
ProcessMaker 3 Advanced Architect Course

Subject matter experts and business analysts choose ProcessMaker as their workflow software solution
because they can accomplish more and communicate with their technical teams more efficiently. System
administrators select ProcessMaker as a workflow software solution because they don't have to spend a
lot of time programming, thanks to its intuitive point and click interface. End users prefer ProcessMaker
because it is so easy to use.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 10
ProcessMaker 3 Advanced Architect Course

2.0 Modelling a Process

We are going to begin by creating a new process, an Invoice Approval Process. After logging into
ProcessMaker, click on the Designer option to open the Designer interface:

In the designer interface, you will find all the necessary tools you need in order to create your process.
In order to create a new process using the ProcessMaker BPMN 2.0 Designer, click on the New button at
the top left-hand side of the screen, below the main menu.

A pop-up window will let you enter information about your new process:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 11
ProcessMaker 3 Advanced Architect Course

Let's define our Invoice Approval process:

Title Invoice Approval Process

Description This process allows a company to route received invoices

to the appropriate employee for approval.

Category Finance

Finally, click on the Create button to create your first process.

The BPMN 2.0 Process Designer

Immediately after creating your process, you will see a blank process map. ProcessMaker provides an
intuitive layout of the objects in the process map. The graphical drag-and-drop interface allows elements
to be easily added, deleted and rearranged:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 12
ProcessMaker 3 Advanced Architect Course

About the process designer elements:

Top toolbar: The top toolbar displays the title of the project and a group of options to modify the
behavior of the process map: Full screen, Undo, Redo, Zoom, etc.
Shapes toolbox: The Shapes toolbox is located at the top of the screen. It includes process design
elements such as: Tasks, Sub-processes, Gateways, Events, Artifacts, among others.
Main toolbox: This toolbox includes basic process design elements like: Variables, Dynaforms,
Input Documents, etc.
Quick toolbar: This small toolbar is located on the right side of any task, gateway, event, etc.

Finally, right click on the start event and delete it. This will make our design space clear.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 13
ProcessMaker 3 Advanced Architect Course

Adding a New Pool to Your Process Design

What is a pool? A pool is an organizational boundary that encompasses all the elements of a single
process. Inside a pool, the elements in a process can be divided up using lanes.
From the Shapes toolbox, select a Pool element.

Drag it onto the process map.

A new pool titled "Pool 1" will be added to the process map.

Enter "Invoice Approval Process" as the pool title, and press Enter when finished. You should get
something like:

Adding a New Lane

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 14
ProcessMaker 3 Advanced Architect Course

What is a lane? Lanes are used to divide up a pool into sections. They can be used to indicate different
departments or offices, geographical regions, conceptual differences, etc.
Select a lane from the Shapes toolbox, and drag it onto the recently added pool.

As soon as you add a new lane to your process map, you will be able to define its text label.

Enter "Employee" as the new lane title and press Enter when finished.

Easy?
Well, now try to add the following lanes to your design: "Supervisor" and "Finance and Treasury".
Now, your process design should look similar to:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 15
ProcessMaker 3 Advanced Architect Course

Before adding tasks to your process, you should have a good idea of what the purpose of your process is,
the sequence of tasks and the connections between those tasks, etc. This will save you a lot of time in the
design phase of your process.
At ProcessMaker, we always recommend creating a detailed Statement of Work before beginning to
design any process.
If you want to know more about the ProcessMaker methodology and how we define a Statement of Work,
just ask your ProcessMaker Instructor and he/she will be more than happy to talk to you about it.
In order to add a task to your process, select the Task icon from the shapes toolbox:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 16
ProcessMaker 3 Advanced Architect Course

and drag it onto the "Employee" lane.

A rounded rectangular shaped object labeled "Task 1" will appear on your process map. Enter "Receive
Invoice" as task title and press Enter when finished.

Now, your process map should look something like this:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 17
ProcessMaker 3 Advanced Architect Course

After editing the label of our first task, which we called "Receive Invoice", define its type by right-clicking
on the task and then hovering over the Task Type option and then selecting User Task from the sub-
menu.

Now that we have defined the type of task that the "Receive Invoice" task will use, it should look like the
image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 18
ProcessMaker 3 Advanced Architect Course

Easy peasy, right?

Try it yourself. Add the following two tasks to your process:

Start & End Events

Now that we have our tasks for the process created and positioned, we have to tell the workflow engine
which task the process should start from. So, select the Start Event icon from the shapes toolbox on top of
the process map:

Drag it onto the "Employee" lane and place it right before the "Receive Invoice" task, on the left side, as
shown below:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 19
ProcessMaker 3 Advanced Architect Course

We also need to define where the workflow will end, therefore we also have to add an End Event to the
process. So, select the End Event icon from the shapes toolbox at the top of the process map:

Drag it onto the right side of the "Pay Invoice" task as seen below:

After you have added the End Event, it should automatically ask you to enter a label for it. If it does not
ask you for the label, just double-click on the End Event icon and enter the text "Invoice Paid" and
press Enter when finished.

Adding a New Gateway

Gateways are elements used to control the flow among elements of the design. Select the Exclusive
Gateway from the Shapes toolbox at the top of the process map:

Drag it onto the right side of the "Approve Invoice" task.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 20
ProcessMaker 3 Advanced Architect Course

After you have added the gateway, it should automatically ask you to enter a label for it. If it does not ask
you for the label, just double-click on the Gateway icon and enter "Execute Payment?" as text label. Press
Enter when finished. At this point your process should look similar to:

Connecting Process Elements

In order to connect two process elements:

1. Select any element and click on the connector of its Quick Toolbar.
2. Drag this connector to the next task or object.
3. Drop it when finished.

Try connecting the rest of the process elements as below:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 21
ProcessMaker 3 Advanced Architect Course

Finally, add connection labels to the gateways by double clicking on the arrow heads:

This is the design of your Invoice Approval Process. Cool! Right?

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 22
ProcessMaker 3 Advanced Architect Course

This is the final design of the Invoice Approval Process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 23
ProcessMaker 3 Advanced Architect Course

ProcessMaker will periodically save your process while you are working, but you make it save now by
clicking on Save.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 24
ProcessMaker 3 Advanced Architect Course

3.0 Dynaforms

Global Variables

What's a global variable?

Let's create the necessary variables for our Invoice Approval Process. In the main toolbox, click on
the Create button next to Variables.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 25
ProcessMaker 3 Advanced Architect Course

A pop up window will let you enter information about your new variable:

Let's create our first variable. Enter the following characteristics:

Variable Name name

Variable Type String

Click on Save when finished.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 26
ProcessMaker 3 Advanced Architect Course

The variable list will be updated. Here, you can create new variables, as well as edit or delete existing
ones.

Now you create the following variables:

Variable Type

address string

emailAddress string

grid grid

invoiceApproved string

invoiceCopy multiplefile

invoiceDate datetime

invoiceSubtype string

invoiceType string

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 27
ProcessMaker 3 Advanced Architect Course

Your variable list should look like:

Variables with Static Options

In this part of the laboratory, we will learn how to create variables with static options. Such features are
used in dropdowns, radio button groups and checkboxes. Create a new variable with the following
characteristics:

Variable Name terms

Variable Type String

In the variable creation pop up window, check the "Define accepted variable values" checkbox:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 28
ProcessMaker 3 Advanced Architect Course

When this checkbox is clicked, new fields will be shown. Here the user must input static options.This
interface will allow you to define your variable options (Key | Label):

Add the following information and click on Create when finished:

Key 1

Label Due on Receipt

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 29
ProcessMaker 3 Advanced Architect Course

When created, the information will be listed below.

Add the following options shown in the image below.

Click on the Save button at the bottom right corner of the pop-up screen. Following the same procedure,
edit the "invoiceApproved" variable.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 30
ProcessMaker 3 Advanced Architect Course

Change the "invoiceApproved" variable as shown in the image below. Notice that the process is similar to
the "terms" variable.

Take a look at the complete list of variables:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 31
ProcessMaker 3 Advanced Architect Course

At this point, you must be an expert in adding variables. Close the variable list when you're done.

Creating a Basic Dynaform

Let's create a Dynaform for our Invoice Approval Process. The ProcessMaker Responsive/HTML5
Dynaform Designer provides a drag-and-drop multi-column form builder that is based on jQuery, CSS3 and
HTML5.
From the main toolbox, click on the Create button next to Dynaforms:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 32
ProcessMaker 3 Advanced Architect Course

Now, let's describe the new Dynaform we are creating:

Title Report Form

Description This form will allow users to submit personal information, invoice details,
and a description of each item included in the invoice.

The description summarizes the information we are trying to get from this form. In order to create this
Dynaform and start working on it right away click on Save & Open.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 33
ProcessMaker 3 Advanced Architect Course

This is the ProcessMaker Responsive/HTML5 Dynaform Designer. Cool, right? Here, you will find all the
necessary tools to design interactive, dynamic, responsive forms for your business processes.

As you can see, there is a complete set of web controls you can use in your Dynaforms.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 34
ProcessMaker 3 Advanced Architect Course

Adding Fields

Let's divide the Dynaform design into three subsections: User Details (which includes three web controls),
Invoice Details (which includes four web controls) and Line Items (which includes a grid control).

User Details
Let's start by adding a title to our "Report Form". Expand the Web Controls section, drag a title web
control and drop it onto the Dynaform design.

Select the recently added title by clicking on it to see its properties in the sidebar. Then, change its label to
"Invoice Information":

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 35
ProcessMaker 3 Advanced Architect Course

A great start! Let's add a subtitle. Drag a subtitle web control from the Web Controls panel, and drop it
on the empty row below the Dynaform title.

Then, select the recently added subtitle and go to its properties in the sidebar to change its label to "User
Details".

Subtitles are commonly used to divide Dynaforms into subsections. Below this subtitle, we will add all of
the user information fields.
Dynaforms are 12 columns wide. By default, when a control is added to a Dynaform it will occupy the full
12 columns, filling an entire row. However, it is possible to define rows that hold multiple controls by
defining the number of columns available in the col-span property. For example, a row could have one
control with 3 columns of width, a second control with 5 columns and a third with 4 columns, so that they
add up to 12 columns..

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 36
ProcessMaker 3 Advanced Architect Course

For the next row, divide it into two 6-column wide sections. To do this, click on the next blank row to
access its properties. Erase the number "12" set by default in the col-span property, and set it to "6 6"
(make sure there is a space between the two numbers) and press Enter. Now the row has been separated
into two sections of the same size that can hold a separate control.

There you go: two columns in a blink of an eye. Let's add a text control by dragging and dropping
a textbox control onto the left column:

After the textbox has been added, a new pop up window will be displayed allowing us to assign a variable
to this web control. Click on the Select variable radio button and assign the "name" variable by selecting it
from the list.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 37
ProcessMaker 3 Advanced Architect Course

Select the textbox control in order to see its properties. Then, change its label to "Name", and mark it as a
required field.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 38
ProcessMaker 3 Advanced Architect Course

As you can see, text controls contain more properties than titles or subtitles. Having this number of
configuration options allows us to be very specific about the text field behavior we want to set . Many of
these same options can be found in the other web controls.
Try adding a text control labeled "Email Address" to your form and associate it with the
"emailAddress" variable in the right column. This web control must be a required field.

Add a new textarea web control to the row below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 39
ProcessMaker 3 Advanced Architect Course

Then, assign the "address" variable to it.

Use the properties section to change its label to "Address".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 40
ProcessMaker 3 Advanced Architect Course

Set the following hint for it: "Please enter your full address".

Really simple, isn't it? At this point, your Dynaform should look something like this:

For the entire Dynaform design, remember that every control needs to have a variable if you want to save
the values entered into the control.

Invoice Details
Now, add a subtitle control labeled "Invoice Details" and divide the next row into two columns.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 41
ProcessMaker 3 Advanced Architect Course

Add a dropdown control associated with the "invoiceType" variable to the left column, below "Invoice
Details". Label this new control as "Invoice Type".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 42
ProcessMaker 3 Advanced Architect Course

Try adding a datetime control. When assigning a variable, the list of variables will only show variables with
the datetime type because this web control only works with this type of variable.

Label it as "Invoice Date".

To complete the next row, divide it into two parts using the col-span property. Finally, add two new
controls with the specifications in the table below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 43
ProcessMaker 3 Advanced Architect Course

Web Control Label Associated Variable

dropdown Invoice Subtype invoiceSubtype

radio Terms terms

Easy? Continue to the next step to see how to add a grid control.
Grid Controls

Line Items
Do you remember the grid variable we created? In this section of the laboratory, we will work with grid
design in Dynaforms. A grid presents data in a format of a table consisting of columns and rows. For
programmers, this information is saved in an associative array.
Let's add a grid control to list the line items included in the reported invoice. From the Web
Controls panel, drag a Grid control to the empty row at the bottom of your Dynaform.

Associate it with the "grid" variable, and change its title to "Items":

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 44
ProcessMaker 3 Advanced Architect Course

Adding New Columns to a Grid

You just need to drag and drop controls on your grid in order to add new columns.
Drag a textbox control onto the grid.

Change its id and label, using the properties section as shown below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 45
ProcessMaker 3 Advanced Architect Course

Adding columns is so easy! Add three new columns by dragging and dropping the following web controls
onto the grid.

Type id Label

textbox description Description

textbox unitCost Unit Cost

textbox total Total

When done, your grid should look similar to:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 46
ProcessMaker 3 Advanced Architect Course

Once the four web controls are configured, set each column width to 25, which is the percent of space it
will occupy in a row. Four web controls add up to a total of 100, which represents the full 100% of a row's
width.

Select the "Total" grid column and set a formula as shown below:

Formula

quantity * unitCost

After saving this formula, set a "sum" function for the same column.

Let's add a subtitle labeled "Line Items" to the empty row at the bottom of the Dynaform in order to keep
it properly organized.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 47
ProcessMaker 3 Advanced Architect Course

Moving Complete Rows

In order to move a complete row:

1. Select the row by clicking on its white frame.

2. Use the crosssed arrows icon to drag it to the desired position (in this case, above the recently
added grid).

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 48
ProcessMaker 3 Advanced Architect Course

3. Drop it.

Finally, add a Submit button from the Web Controls section to the bottom of your Dynaform.

Now, change its id to "submit" and its label to "Submit", as shown below.

The submit button saves your data before continuing to the next step.
That's it! Your "Report Form" is ready, click on the Preview option at the top to see how this Dynaform is
going to be displayed to end users.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 49
ProcessMaker 3 Advanced Architect Course

See the preview.

Don't forget to save your Dynaform!

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 50
ProcessMaker 3 Advanced Architect Course

Dynaform Preview

Let's take a closer look at our Dynaform preview. Notice that a fully functional Dynaform version is being
displayed for you to review and test it.

Required Fields

Hints

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 51
ProcessMaker 3 Advanced Architect Course

Date Pickers

Grids

You can even select whether you want to generate a responsive preview for a desktop machine, a tablet,
or a smartphone!

Now tell me, how amazing is this?

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 52
ProcessMaker 3 Advanced Architect Course

4.0 Multilanguage Support

Dynaforms: Multi-language Support

Multi-Language Support is a feature that allows translation files to switch the language of the Dynaform
according to your needs. In this laboratory, the "Report Form" Dynaform will be translated.
Go to the "Report Form" Dynaform and click on the language button.

After clicking this button, a list of translation files will appear. Click on the English file to download it.

Once the file is downloaded, open it in an editor.

The file opened can now be edited. In this document, there are two strings for each web control: "msgid"
and "msgstr". For the translation, the "msgstr" will be modified.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 53
ProcessMaker 3 Advanced Architect Course

Translate the "msgstr" string of each web control in the file into Spanish (or another language you know).
Each "msgstr" represents a label.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 54
ProcessMaker 3 Advanced Architect Course

In the screen above, the "msgstr" strings have been translated. Additionally, there have been some edits
marked by the first red rectangle. These are important for the file name and identification. The fully
translated file can be downloaded here.
Once the file is fully translated, save it as processmaker.es.po, because if the translated file is imported
with the same name it will overwrite the current one. This name of the file will be different depending on
the language; if it is Italian, the name will be processmaker.it.po. Why? The ISO codes are used for
indicating the language; further information about ISO codes can be found at this website.
Next, go to the list of translation files in the Dynaform and click on Choose File to import a file.

Select the file recently translated and import it.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 55
ProcessMaker 3 Advanced Architect Course

After the file is selected, it will appear in the list of translation files as shown below. Close the Languages
list.

Then, the new file added to the list will appear in the language dropdown option in the Dynaform
properties. Click on the gray border of the Dynaform to display its properties as shown in the image
below.

From the properties section, select the Spanish (es) option from the language dropdown.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 56
ProcessMaker 3 Advanced Architect Course

After changing the language, save the Dynaform. Check the preview.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 57
ProcessMaker 3 Advanced Architect Course

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 58
ProcessMaker 3 Advanced Architect Course

Change the language back to English.

Don't forget to save your Dynaform!

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 59
ProcessMaker 3 Advanced Architect Course

5.0 Users, Groups, Departments and Roles

Creating New Users

Now that we have designed a basic workflow for our Invoice Approval Process, let's check how
ProcessMaker manages its users, groups, departments and roles. This part of the laboratory explores a
single option which includes a vast amount of possibilities. [Further information on user's management
can be found in our wiki page].
Open the Administration Interface by selecting the "ADMIN" tab from the main menu:

The Administration Interface allows you to configure the environment of your ProcessMaker instance. [For
more information about environment settings, visit our wiki page].
Once in the Administration Interface, click on the "Users" tab to list all the existing users in your
workspace.

Let's create a new user. Click on "New" button at the top left corner of the users list:

Now, you have to define the basic information about your new user. You can even upload an avatar!

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 60
ProcessMaker 3 Advanced Architect Course

Let's fill out this form using a fictional person's information. This user will take part in the Invoice Approval
Process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 61
ProcessMaker 3 Advanced Architect Course

Finally, click on the "Save" button to create this user.

When the user is created, it is possible to search for it by writing user's name in the "Search" box located
in the upper right corner, as shown in the image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 62
ProcessMaker 3 Advanced Architect Course

Finally, create the following user:

First Name Last Name Username Email Password

User Webservice ws_user [email protected] admin

Additional information about this user is up to you.

Creating a New User Group

Now that we have created a ProcessMaker User, let's create a ProcessMaker User Group. Select "Groups"
from the left sidebar to list all the available groups in your workspace:

To create a new user group, click on the "New" button at the top left corner of the list of groups.

Now, we can enter information about the new user group:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 63
ProcessMaker 3 Advanced Architect Course

Let's create an active user group called "Finance and Treasury":

Group Name Finance and Treasury

Status ACTIVE

Now that the new user group has been created, it needs just one more detail to be ready: Users.

Select the new user group from the list of groups and click on the "Users" button:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 64
ProcessMaker 3 Advanced Architect Course

All the users assigned to this group will be listed. Of course, this group is new, so it doesn't yet have any
assigned users.
Let's assign some users by clicking on the "Assign Users" button:

Now, you will see two columns of users: On the left, all the users available to be assigned to this particular
group; on the right, all of the users currently assigned to the "Finance and Treasury" group.

You can select one or more users by holding down the Ctrl key while selecting them.
You can move them from one column to the other using the "<" and ">" buttons.
You can move all users from one column to the other, using the "<<" and ">>" buttons.
Additionally, another way, you can drag the users from one column and drop them in the other.

Now, let's assign the user we have just created (John) to this group.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 65
ProcessMaker 3 Advanced Architect Course

That's it. You have created a group of users called "Finance and Treasury". Later, we will use this group in
our Invoice Approval Process.
Creating a New Department

Now that we have created both Users and Groups, let's create a Department. Select "Departments" from
the left menu in order to list all departments in your workspace.

Departments are supposed to represent the hierarchical structure of your organization. Users can only be
members of one department, whereas they can belong to many groups. In order to create a new
Department, click on the "New" button on the top left corner of the list of Departments:

Let's create a "Treasury and Accounts" Department. Just enter the name of the new Department and click
on "Save":

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 66
ProcessMaker 3 Advanced Architect Course

Now, it will appear in the list of Departments as seen below:

Now, let's create a "Treasury" Sub-department. Select the "Treasury and Accounts" department from the
list of departments, and click on the "New Sub-Department" button:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 67
ProcessMaker 3 Advanced Architect Course

Enter "Treasury" as the name of the new Sub-Department and click on "Save".

You will find the process of assigning users to a Department very familiar, in relation to what we did while
working with Groups. Select the new Sub-Department, and click on the "Users" button:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 68
ProcessMaker 3 Advanced Architect Course

Click on "Assign Users":

Only users that don't belong to any department will be listed as available, since a user can only belong to
one department. Assign the recently created user, by selecting him from the list and clicking on ">":

By default, ProcessMaker sets the first user you assign to a group as the Department Manager. You may
manually set the Manager of a Department by selecting a user and clicking on the "Set Manager" button:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 69
ProcessMaker 3 Advanced Architect Course

Later on, we will show how this functionality is utilized in the process we are designing.
Creating a New Role

ProcessMaker is an application based on Role Based Access Control (RBAC), which means that users'
actions are restricted in accordance to the permissions in their role. Let's take a look at how roles work in
ProcessMaker.
Select Roles from the left menu in order to list all available user roles in your workspace.

Let's create a custom role for our process architects. Click on the New button on the top left corner of the
list of roles:

Enter the information about the new role:

Code Name Status

PM_ARCHITECT Process Architect Active

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 70
ProcessMaker 3 Advanced Architect Course

Click on Save.

Select your new role and click on the Permissions button.

You will notice that this role does not yet have any assigned permissions. Assign some by clicking on
the Edit Permissions button.

In accordance with process architects' requirements, assign the following permissions to the
PM_ARCHITECT role:

PM_LOGIN: Allows users to log into a ProcessMaker instance.

PM_FACTORY: Allows users to create new processes and manage existing processes in a
workspace.
PM_CASES: Allows users to start new cases and manage cases assigned to them.
REPORT_USER: Allows users to access reports in the Data Reporting Tools option.

To select multiple permissions, hold down on the CTRL key while selecting them. Then, click on > to assign
these permissions to the role.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 71
ProcessMaker 3 Advanced Architect Course

In the image above, we have assigned only three of the four required permissions. Now, we need to assign
the last permission: REPORT_USER. In the list of available permissions, use the search box to look for the
"REPORT_USER" permission, as shown below. Press Enter to display results.

Next, left click on the permission and assign it to the current role.

Finally, the permission has been assigned and the PM_ARCHITECT role has its four permissions.

Let's assign this new role to our recently created user. Select Users from the left sidebar and search for
the new created user in the Search box

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 72
ProcessMaker 3 Advanced Architect Course

Then select the newly created user and click on the Edit button.

Look for the Role field and select our newly created role: Process Architect.

Click on the Save button.

We have just assigned John as our first process architect!
If you log in using his account, you will see the assigned permissions in action:

This is simple yet powerful user management. Don't forget to log back in as the Administrator user for the
next lab.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 73
ProcessMaker 3 Advanced Architect Course

6.0 PM Tables and Dynaforms

PM Tables

PM Tables are designed for users who do not wish to go through the hassle of maintaining an external
database. The data in PM Tables is stored in the MySQL database wf_<WORKSPACE> (which is, by default,
wf_workflow), so the data could theoretically be accessed by any external program. Nonetheless, it is
recommended you only use PM Tables for data which will be used inside ProcessMaker
Let's create a new PM Table for our Invoice Approval Process.
From the Administration interface, open the "Settings" tab and select "PM Tables".

Click on the "New" button and select "New PM Table".

Enter the following configuration:

Table Name INV_SUBTYPE

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 74
ProcessMaker 3 Advanced Architect Course

Table Name INV_SUBTYPE

Description Invoice subtypes

Note: ProcessMaker will automatically convert the table name to uppercase and add a "PMT_" prefix, thus
this PM Table will be created as PMT_INV_SUBTYPE.
Let's add a new field to the PM Table by clicking on the "Add field" button.

The new field will have the following configuration:

Auto
Field Name Field Label Type Size Null Primary Key Increment Index

ID Invoice Subtype ID INTEGER 11 No Yes Yes No

Click on "Update".

Now you add two new fields as shown below:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 75
ProcessMaker 3 Advanced Architect Course

Auto
Field Name Field Label Type Size Null Primary Key Increment Index

TYPE_ID Invoice Type ID INTEGER 11 No No No No

DESCRIPTION Invoice Subtype Description VARCHAR 30 No No No No

Your PM Table now should look something like this:

Finally, click on the "Create" button at the bottom on the right corner.
Now, select the recently created PM Table and click on the "Data" button.

Here, you can manage your PM Table data. Let's add a new row of data by clicking on the "Add Row"
button.

Enter the following information in each field.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 76
ProcessMaker 3 Advanced Architect Course

Type ID 1

Description Food

The Subtype ID will automatically update to 1 because it is the first row, for the next row this field will be
updated to 2 and so on.
Then click on Update.

Now, try adding the following rows to your PM Table:

Being able to manage data tables from ProcessMaker is great, isn't it? Now, create a PM Table called:
"INV_TYPE", according to the instructions below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 77
 ProcessMaker 3 Advanced Architect Course

Table Name INV_TYPE

Description Invoice types

Fields:

Field Name Field Label Type Size Null Primary Key Auto Increment Index

ID Invoice Type ID INTEGER 11 No Yes Yes No

DESCRIPTION Invoice Type Description VARCHAR 30 No No No No

Data:

Invoice Type ID Invoice Type Description

1 Goods

2 Services

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 78
ProcessMaker 3 Advanced Architect Course

That's it, we are going to use both PM tables - PMT_INV_SUBTYPE and PMT_INV_TYPE - to populate
dropdown controls in our Report Form.
Populating Dropdowns (SQL Queries) and Creating Dependent Fields

Populating Dropdown Controls

Go back to the Designer Interface; and open the Invoice Approval Process that we have been designing, by
double clicking on its title.

Open the "Report Form" Dynaform. We will apply some changes to populate both dropdown fields.

Now, we need to set a SQL query on both dropdown controls. Click on the "Invoice Type" dropdown and
click on the ellipsis (...) beside its "sql" property.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 79
ProcessMaker 3 Advanced Architect Course

Next, include the following script to populate our dropdown:

SELECT ID, DESCRIPTION FROM PMT_INV_TYPE

Save settings.
Follow the same procedure in order to add a SQL query to the "Invoice Subtype" field. Use the script
below for this purpose:
SELECT ID, DESCRIPTION FROM PMT_INV_SUBTYPE

Finally, save settings and test both controls in the Dynaform preview.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 80
ProcessMaker 3 Advanced Architect Course

Notice how we reference the PMT_INV_TYPE and PMT_INV_SUBTYPE PM Tables in the SQL queries for
populating both dropdown controls respectively.

Dependent Fields
When both dropdown controls are populated, they display options independently. Thus, we need to
create a connection between them. With this aim, close the Dynaform preview, and select the "Invoice
Subtype" control to edit its "sql" property.

as shown below, dependency between "Invoice Type" and "Invoice Subtype" is set by adding a "WHERE"
statement to the SQL query.
SELECT ID, DESCRIPTION FROM PMT_INV_SUBTYPE WHERE TYPE_ID = @@invoiceType

Notice how we refer to the "invoiceType" control for this configuration.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 81
ProcessMaker 3 Advanced Architect Course

Save settings and open the Dynaform preview.

Now, the group of available Invoice Subtype options, directly depends on the Invoice Type selected.
Cloning a Dynaform

Now that you have a great "Report Form", let's make a copy of it. We will use this copy to allow the
supervisor to review, and approve or reject the reported invoice. Open your "Report Form" Dynaform and
export it, by clicking on the "Export" icon.

Right after, a JSON file will be generated. This file contains the complete Dynaform design and
configuration. Remember where it gets downloaded to, because we will need it in a moment.

Close the "Report Form" and from the Main toolbox, create a new Dynaform with the following
characteristics:

Title Approve Report Form

Description A supervisor reviews the invoice details and a description of each

item included in the invoice in order to approve or reject the
reported invoice.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 82
ProcessMaker 3 Advanced Architect Course

Click on "Save & Open".

Then click on the "Import" icon from the Dynaform designer.

Look for the JSON file recently generated, and select it.

This action will add the same set of fields included in the "Report Form" to the current Dynaform.
Now that we have an exact copy of the "Report Form", let's add a new subsection to this Dynaform by
adding a new Subtitle labeled "Response", above the submit button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 83
ProcessMaker 3 Advanced Architect Course

Add a dropdown control with the "invoiceApproved" variable assigned. Label this control as "Approve
Invoice?".

Don't forget to select the "edit" display mode for this web control.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 84
ProcessMaker 3 Advanced Architect Course

Since this Dynaform will be used only for supervisor approval purposes, we must set the entire form in
disabled display mode. For such task, click on the gray border as shown in the image below.

Next, select "disabled" from the display mode dropdown. This action will disable changes in Dynaform
fields.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 85
ProcessMaker 3 Advanced Architect Course

At this point, your Approve Report Form preview should look similar to:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 86
ProcessMaker 3 Advanced Architect Course

In the image above, all fields are in a disabled display mode except for the "Invoice Approved" dropdown.
Save and close this Dynaform.
Report Tables

The information entered into Dynaform fields and case variables is stored as serialized strings, which are
not easy to access using database queries. Report Tables are designed to export data from the
ProcessMaker database, with the aim of making data accessible by standard SQL queries and external
applications.
Let's create a Report Table for the Invoice Approval Process.
Go to the Main toolbox and click on the "Create" option for Report Tables.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 87
ProcessMaker 3 Advanced Architect Course

Configure this table as follows:

Table Name INVOICE_REPORT

Description Invoice Approval Report

Now, it's time to add variables - which will be added as columns - to this report. In order to add all of
them, just click on the double right arrow ">>" button.

When done, click on the "Create" button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 88
ProcessMaker 3 Advanced Architect Course

7.0 Reports SLA

Creating SLA reports

The SLA (Service Level Agreement) Reporter offers a new level of control over unfinished tasks and
processes. The SLA Reporter can provide information about execution delays and penalties for cases that
are executed after it's defined deadline. The SLA Reporter is a feature which can be activated in the
Enterprise Plugin Manager located in the Admin menu section.
To create an SLA report, go to Admin>Plugins and select the SLA menu item.

Then, click on New to create a new SLA report.

Next, fill out all the fields in the form as shown below.

Process Invoice Approval Process

Name Invoice Approval Process

Description This SLA report will offer control over Invoice

Approval Process delays and penalties

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 89
ProcessMaker 3 Advanced Architect Course

The fields shown above are grouped into three sections: SLA Information, SLA Type and Penalty.
In the SLA Information section, there are four fields: Process, Name, Description and Status.

Process: process in which the SLA will be applied.

Name: name of the SLA.
Description: a description of the purpose of this SLA.
Status: the status of the SLA.

In the SLA Type section, there are three fields: Type, Duration and Condition.

Type: this field indicates the SLA type. There are three types: Entire Process, Multiple Tasks and
Task. When Entire Process is selected, the SLA will be applied for the entire process. When selecting
Multiple Tasks, it is possible to choose a range of tasks in which the SLA will be applied. When Task is
selected, the SLA will be applied for that particular task.
Duration: this field defines the maximum duration of the SLA. This is expressed in days and hours.
Condition: a condition that must be accomplished to have the SLA executed. This can be used as a
filter to only apply the SLA to specific cases.

In the Active penalty section, when clicked, there is one field: Penalty.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 90
ProcessMaker 3 Advanced Architect Course

Penalty: this field calculates the penalty. Penalties are calculated with two variables: money and
time.

Now, save the configuration of the SLA report. In the last section of the Advanced Architect course, new
settings will be added to make this report work.

8.0 Data Reporting Tools

Scope Configuration

Data Reporting Tools is a feature where users can customize reports. This customization functionality
integrates tasks such as defining, editing and designing custom reports using report scopes. In this
laboratory, we will customize a report.
Go to Home in the top menu.

Once in the Home interface, select the Scope option under Data Reporting Tools in the left menu.

Note: Take into account that the Scope and Import-Export options will only be enabled if the current user
has the REPORT_ADMINISTRATOR permission assigned to its role. Further information can be found at
this page.
The scope of our report will be the subset of data stored in the Report Tables chosen by the Report
Administrator. For this reason, the report scope creation requires the table where the data will be
obtained from to be selected. Click on the Create button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 91
ProcessMaker 3 Advanced Architect Course

Then, define the Scope Name and the Scope Description. Click on Next.

Scope Name Invoice Approval Process Report

Scope This scope is part of the customized Invoice Approval Process

Description Report.

In the Tables tab, select the "PMT_INVOICE_REPORT", which is where the data will be obtained.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 92
ProcessMaker 3 Advanced Architect Course

Below this dropdown control, check all checkboxes. These checkboxes represent fields with data obtained
from the "PMT_INVOICE_REPORT" table that will be used in the customized report.

Then, it is possible to add some filters to add some features to your report. Click on Add Filter as shown
below.

In the Filter window, there are four fields: Table, Column, Condition and Value. Fill in these fields with the
following values: PMT_INVOICE_REPORT, INVOICEAPPROVED_LABEL, (=) EQUAL and Yes. This
configuration means that all invoices that have the "Yes" value in the INVOICE_APPROVED_LABEL column
will be selected.
Click on Save.

Click on Next.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 93
ProcessMaker 3 Advanced Architect Course

Report Users is a group or user who will have access to the final report. In this case, the information is
only available for users from the "Finance and Treasury" group. Thus, assign the "Finance and Treasury"
group as shown in the image below.

Click on Next.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 94
ProcessMaker 3 Advanced Architect Course

Report Designers is a group or user who will have access to design the final report. In this case, the
"admin" user can design the final report. Thus, assign the "admin" user as shown below.

Click on Finish.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 95
ProcessMaker 3 Advanced Architect Course

The following scope configuration will appear in the list of scopes after clicking on Finish.

Report Designer Configuration

Go to the next option for configuration: Report Designer under the Data Reporting Tools option in the
left menu.

Note: Take into account that the Report Designer option will only be enabled if the current user has the
REPORT_DESIGNER permission assigned to its role. Further information can be found at this page.
Click on Create.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 96
ProcessMaker 3 Advanced Architect Course

Next, enter the report scope, the report name and the report description. Click on the Next button.

Report Scope Invoice Approval Process Report

Report Name Invoice Approval Process Report

Report description This report is focused on showing data obtained

from the Invoice Approval Process.

In the table below, click on the columns shown below and enter the alias for each column.

Column Alias

PMT_INVOICE_REPORT.APP_NUMBER Case Number

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 97
ProcessMaker 3 Advanced Architect Course

Column Alias

PMT_INVOICE_REPORT.ADDRESS_LABEL Address

PMT_INVOICE_REPORT.APP_EMAILADDRESS_LABEL Email Address

PMT_INVOICE__REPORT.INVOICETYPE_LABEL Invoice Type

PMT_INVOICE__REPORT.TERMS_LABEL Terms

PMT_INVOICE__REPORT.INVOICEDATE_LABEL Invoice Date

PMT_INVOICE__REPORT.NAME_LABEL Name

PMT_INVOICE__REPORT.INVOICESUBTYPE_LABEL Invoice Subtype

PMT_INVOICE__REPORT.INVOICEAPPROVED_LABEL Approved?

Notice we use "_LABEL" columns because they display data in a more readable way for humans.
Next, create a filter. Click on the Add Filter button as shown in the image.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 98
ProcessMaker 3 Advanced Architect Course

In the form below there are three fields: Columns, Condition and Value. Fill in with the following values:
PMT_INVOICE_REPORT.INVOICETYPE_LABEL, (=) EQUAL and Goods. The input configuration means that all
invoices with the type "Goods" will be selected. Click on Save.

Click on Next.

In the Report Users tab, assign the only available group: "Finance and Treasury".

In the Report Users tab, we can select a Report Manager. Users can only see reports about the cases that
they have participated in. If a user wants to see additional cases, this user can be selected as Report
Manager. A Report Manager is able to view cases that they have participated in, plus all cases belonging to

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 99
ProcessMaker 3 Advanced Architect Course

an assigned group. In this case, we have selected the "Finance and Treasury" group, which has one user;
therefore, there is no need to select a Report Manager.
Click on Finish.

This configuration will appear in your list.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 100
ProcessMaker 3 Advanced Architect Course

9.0 Input and Output Documents

Setting up a New Input Document

An Input Document will hold a file or files associated with a particular case. These files can be text
documents, spreadsheets, images or any other kind of file. An Input Document can be a hard copy (which
has been printed out and stored in a filing cabinet), a digital file which is uploaded to the case, or both.
Let's set up a new Input Document, which will allow users to upload a digital copy of the invoice they are
reporting.
First, go to the Designer interface.

After entering to that menu, double click on the "Invoice Approval Process".

Click on the Input Documents button on the main toolbox:

As you might expect, there are no Input Documents to list. Click on "Create" to create a new one:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 101
ProcessMaker 3 Advanced Architect Course

Configuring Input Documents is quite simple.

Configure the new Input Document as shown below:

Title Copy of Invoice

Document Type Digital

Description Invoice digital copy

Enable Versioning NO

Destination Path ReportedInvoices/

Tags INPUT

Allowed file extensions .*(any type of document)

Maximum file size 10

Unit MB

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 102
ProcessMaker 3 Advanced Architect Course

Click on the Save button when finished.

That's it, you just set up a new Input Document for your Invoice Approval process. Don't forget to close
your Input Documents list by clicking on the "X" at the top right corner of the pop up window.

Multiple File Uploader Configuration

The Multiple File Uploader is a feature that makes possible to upload many files in the same case. In this
section of laboratory, we will learn how to integrate a Dynaform with a laboratory .
Click on Dynaforms in the main toolbox as shown in the image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 103
ProcessMaker 3 Advanced Architect Course

After clicking on Dynaforms, the list of Dynaforms will be displayed. Click on the Edit button for the
"Report Form".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 104
ProcessMaker 3 Advanced Architect Course

In the Dynaform designer, drag and drop a title web control above the "Submit" button.

Label this web control as "Attached Files".

Below this title web control, add a fileupload control as shown in the image below.

In the top radio button, select the Select variable option.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 105
ProcessMaker 3 Advanced Architect Course

The multipleFile web control demands to have only multipleFile type variables. Select the unique variable
that matches this criterion.

Label the multipleFile web control as "Attach Invoice Copy".

Then, click on the Input Document property below label as shown in the image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 106
ProcessMaker 3 Advanced Architect Course

Select the Input Document element that will be associated to this web control.

Finally, save the "Report Form" Dynaform.

Close the Dynaform.

Creating a New Output Document

Output Documents are files generated while running a case, which are meant to be printed out or stored
digitally outside ProcessMaker.
You will notice that creating Output Documents is almost as easy as setting up Input Documents. Click on
the "Output Documents" button on the Main toolbox:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 107
ProcessMaker 3 Advanced Architect Course

Click on "Create" to create a new Output Document:

This Output Document will mention and state the reported invoice as paid. Thus, it will have the following
characteristics:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 108
ProcessMaker 3 Advanced Architect Course

Title Proof of Payment

Filename generated Proof_of_payment_@#USR_NAME

Description Invoice mentioned as paid.

Report Generator TCPDF

Media Letter

Orientation Portrait

Margin 20 20 20 20

Output Document to Generate BOTH

PDF Security Disabled

Enable Versioning Yes

Destination Path Proof_of_payment/

Tags OUTPUT

By clicking on the generated file link Download the file

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 109
ProcessMaker 3 Advanced Architect Course

Some notes about the configuration:

About the "Filename generated", @#USR_NAME will be used to generate the file name e.g. if the
current user's name is "John", the file will be generated as "Proof_of_payment_John".
About the "Destination Path", ProcessMaker will store all of the "Proof of payment" generated
files into a folder called "Proof _of_payment".

Click on "Save" when Finished.

There you go, you have created a new Output Document. However, we still have to design its
content. From the Output Documents list, click on "Open Editor" on the right-hand side of your new
Output Document.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 110
ProcessMaker 3 Advanced Architect Course

This action will open the Output Document designer, which is very similar to a regular text editor. Here,
you will find all of the necessary tools to design the content of your Output documents.

Use tools from the toolbar to design a proof of payment template similar to the following one:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 111
ProcessMaker 3 Advanced Architect Course

Alternatively, enter the following HTML code (using the "HTML" button):

Click on the "HTML " button in the toolbar:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 112
ProcessMaker 3 Advanced Architect Course

Copy & paste the following HTML code:

1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2. <html>
3. <head>
4. </head>
5. <body>
6. <div style="font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif; font-size: 13px;">
7. <p><img src="/images/processmaker.logo.png"/></p>
8. <p style="color: #009; font-weight: bold;">NEW YORK Brooklyn, NY, 11238, USA</p>
9. <p style="text-align: center; text-decoration: underline; font-size: 20px;">PROOF OF
PAYMENT</p>
10. <p>Sent by: </p>
11. <p>Email: </p>
12. <p>Address: </p>
13. <p>Invoice date: </p>
14. <p>Status: Approved</p>
15. </div>
16. </body>
17. </html>

Click on the "Update" button on the bottom left corner, when finished

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 113
ProcessMaker 3 Advanced Architect Course

In order to insert a variable from the current case in your Output Document, you can use the variable
picker.

Place the cursor beside "Sent by:"

Click on the "pmVariablePicker" button from the toolbar:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 114
ProcessMaker 3 Advanced Architect Course

Change the prefix from "@@" to "@#" - to get the value without quotation marks - and double
click on the "@#name" variable, which represents the name of the employee, who has reported this
invoice:

You will get something like:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 115
ProcessMaker 3 Advanced Architect Course

Note: You can insert as many variables as you need in your design.
Follow the same procedure to add variables and to replicate the following design:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 116
ProcessMaker 3 Advanced Architect Course

Your "Proof of Payment" Output Document template is ready. Click on "Save" and close the Output
Document list by clicking on the "X" on the top right corner of the pop up window.

10.0 JavaScript in Dynaforms

Simple Form Validation Using JavaScript

Custom JavaScript code can be used to customize the behavior of Dynaforms. Having jQuery included
automatically in ProcessMaker version 3.0 facilitates the use of less code in the development of
customized JavaScript for Dynaforms.
Let's add some custom JavaScript code to our "Report Form" to validate user input.
From the Dynaform list, open your Report Form for editing:

Click on the gray frame to select the Dynaform itself.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 117
ProcessMaker 3 Advanced Architect Course

Then, click on the "edit..." button in the "Properties" section, to edit the JavaScript associated with this
Dynaform.

An empty pop-up window will allow you to add customized JavaScript code.
Enter the following JavaScript code to this window:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 118
ProcessMaker 3 Advanced Architect Course

1. function validate_email() {
2. if( $('#emailAddress').getValue().indexOf("@") < 0){
3. $('#emailAddress').addClass("has-error");
4. if( confirm("Note: If you don't provide a valid email address, you won't be able to receive
notifications about this case. Continue to the next step?") ){
5. return true;
6. } else {
7. document.getElementById('form[emailAddress]').focus();
8. return false;
9. }
10. }
11. };
12.
13. $('#submit').click( function () {
14. validate_email();
15. });

About this piece of code:

This function "validate_email()" will be executed every time the "submit" button is clicked. It will verify if
the user has provided a "valid" email address. If the email address is invalid, a message will remind him
that they will not be able to receive notifications. Moreover, it will ask the user if they want to continue to
the next step. Depending on the answer - "OK" or "Cancel" - the case will continue to the next step, or
stay in the current step and let the user enter a "valid" email address.
Use the Dynaform "Preview" to test your JavaScript code:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 119
ProcessMaker 3 Advanced Architect Course

This is a very easy example of how you can use JavaScript to validate user input. Let's try another exercise.
Grid Functions

We already saw how to select a field from our Dynaform to obtain its value. But, what if we want to obtain
the value of all fields inside a Grid control? Let's use the getValue() function to select a field from a Grid,
and getNumberRows() to get the number of rows in the same Grid.
First, let's remove the validate_email() function - line 14 - from the "submit" click event handler.

As a consequence, validate_email() will not be executed on the "submit" button click event anymore. But
don't worry, we will call this function from another JavaScript function called confirm_data().
Right after the validate_email() function ends on line 11, enter the following code onto line 13, pushing
the "submit" click event handler to line 29:

1. function confirm_data(){
2. var message = "You are about to submit the following data:\n\n";
3. var rows = $("#grid").getNumberRows();
4. for( var i = 1 ; i<=rows ; i++ ){
5. message += $("#grid").getValue(i,1) + " -- " +
6. $("#grid").getValue(i,2) + " -- $" +
7. $("#grid").getValue(i,4);
8. message += "\n";
9. }
10. message += "\nContinue?"

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 120
ProcessMaker 3 Advanced Architect Course

11. var r = confirm(message);

12. if(r)
13. validate_email();
14. return r;
15. }

At this point, your JavaScript custom code should look similar to:

Finally, add confirm_data(), to be executed on the "submit" click event handler (line 30):

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 121
ProcessMaker 3 Advanced Architect Course

Save code modifications.

About the Code

We are putting together a confirmation message that will display the content of the grid, so users can
review the data and confirm its submission. In order to select a field from a grid, we use getValue() to
reference a specific row and column inside the grid - $("#grid").getValue(row,col). This validation is
executed before submitting the form. Notice how the getNumberRows() and getValue() functions work
together in order to get the value of each field in the Grid, row by row. The validate_email() function will
be executed as a second validation.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 122
ProcessMaker 3 Advanced Architect Course

These examples are just a taste of what you can achieve using JavaScript in your Dynaforms. Try adding
your own code.

11.0 Triggers
Creating Your First Trigger

A Trigger is a piece of PHP code that can be inserted into a process. Triggers provide a way to perform
complex calculations and add additional functionality to processes.

Obtain User Details Trigger

Let's begin. Open your "Report Form" and take a look at the "User Details" subsection:

If we give it some thought, the best way to obtain a user's name, address, and email address is consulting
their personal profile, right? Then, let me show you how to easily use triggers to accomplish this task.
Close your "Report Form" and from the Process Map, click on the "Triggers" button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 123
ProcessMaker 3 Advanced Architect Course

Click on "Create" from the pop up window.

Enter the following properties for this trigger:

Title Obtain User Details

Description Obtain the current user's name, address and email address.

Then, enter the following PHP code:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 124
ProcessMaker 3 Advanced Architect Course

1. $user_info = userInfo(@@USER_LOGGED);
2. @@name = $user_info['firstname'].' '.$user_info['lastname'];
3. @@address = $user_info['address'];
4. @@emailAddress = $user_info['mail'];
5. @@requester = @@USER_LOGGED;

Remember that you can always use the "@@" button to insert system and process variables.

About the Code

The userInfo() function returns an array with information about a particular registered user in
ProcessMaker, and the @@USER_LOGGED system variable returns the current user's ID. Once we have
obtained the current user's information, we display his name, address and email Address in our Dynaform
fields: @@name, @@address and @@emailAddress.
Additionally, the fifth line of code adds a new variable @@requester; this variable has a value assigned
@@USER_LOGGED. This will help reasign the case to the same user when a group is assigned, if the case is
returned to in the future. This topic will be explained in detail in the next laboratory about configurations.
Click on "Save" and close the Triggers list.
Now that our "name", "address" and "emailAddress" fields will be automatically populated, we should set
them to "View" mode, so users won't be able to edit their values. Select "Dynaforms" from the right
menu.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 125
ProcessMaker 3 Advanced Architect Course

Then, go to the Report Form by clicking on the "Edit" button.

Edit the mode of the "name" field as shown in the picture below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 126
ProcessMaker 3 Advanced Architect Course

Follow the same procedure to set the "address" and "emailAddress" controls to view mode as well.
Now, your Dynaform should look something like:

Save and close this Dynaform.

Triggers and Databases

You will need the credentials to access your MySQL server in order to continue this lab. Ask your trainer
how to access this interface.
For this lab, we're going to use the "transactions" database:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 127
ProcessMaker 3 Advanced Architect Course

Note: In the event that you don't have this database already created in your database server, you'll have
to manually create it.
We will store all the line items in this table. As you can imagine, we will use a trigger to perform queries
to this table from ProcessMaker.
Back in ProcessMaker, we have to first create a new Database Connection. Click on the "Database
Connections" button from the Main toolbox.

Click on "Create" to set up a new Database Connection for this process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 128
ProcessMaker 3 Advanced Architect Course

Let's setup the Database Connection to access an external database.

E. g:

Engine MySQL

Encode utf8 - UTF-8 Unicode

Server processmaker

Database Name transactions

Username root

Password ProcessMaker

Port 3306

(Ask your trainer for help if you are not sure about this configuration):

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 129
ProcessMaker 3 Advanced Architect Course

Test your Database Connection configuration by clicking on the "Test Connection" button. You will see
something like this:

Click on "Save" to create the Database Connection.

Now, display the properties of this Database Connection by clicking on "Show ID".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 130
ProcessMaker 3 Advanced Architect Course

You are going to need this unique identifier (UID) later, so enter it in a text file.

Click on "Ok" and close the Database Connection list.

Now, create a "Custom Trigger" with the following properties:

Title Submit invoice items

Description Store invoice items using an external

database connection.

Open the complete Trigger editor by clicking on "Open Editor".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 131
ProcessMaker 3 Advanced Architect Course

Enter the following PHP code:

Important: Remember to replace "5122070315563894b8d87e9033240140" with your recently created
Database Connection ID.

1. $connection = "5122070315563894b8d87e9033240140";
2. $grid = @=grid;
3. $rows = count($grid);
4. for($i=1; $i<=$rows; $i++)
5. {
6. $quantity = $grid[$i]["quantity"];
7. $description = $grid[$i]["description"];
8. $price = $grid[$i]["unitCost"];
9. $query = "INSERT INTO reported_invoice_item (
10. QUANTITY,
11. DESCRIPTION,
12. UNIT_PRICE
13. ) VALUES(
14. '".$quantity."',
15. '".$description."',
16. '".$price."'
17. )";
18. executeQuery($query, $connection);
19. }

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 132
ProcessMaker 3 Advanced Architect Course

About the Code

We are basically getting the data from the "grid" in our Report Form, and then inserting each row as a
record in an external database with a little help from our recently created Database Connection and
the executeQuery() function. Click on "Apply" followed by "Save" to create this Trigger, and close the
Trigger list.
In the next lab, you will see these Triggers in action while working on cases.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 133
ProcessMaker 3 Advanced Architect Course

12.0 Configuring an Invoice Approval Process

Configuring Your Invoice Approval Process

First, you have to assign steps and users to your tasks. Every task features a set of steps, which users need
either to work on or to review. Dynaforms, Output Documents, and Input Documents can be assigned as
steps to a task.

Receive Invoice Task Configuration

In the "Receive Invoice" task, an employee will submit all the invoice details, in addition to a digital copy of
the document. In order to assign users to this task, right click on it and select "Assignment Rules".

In this interface, you will be able to define an assignment rule and assign users to this task.
The user who starts the case will automatically be assigned to work on the first task in the case. Only users
in the starting task's assignment pool may start the case.
Below, the Value Based Assignment rule is used to assign the case if the workflow loops back to the first
task, which is "Receive Invoice". Cyclical Assignment cycles through all the users in the assignment pool
when selecting the user to assign to the task, but Value Based Assignment will reassign the case to the
user whose ID is stored in the variable selected for this assignment rule. In this example, the ID of the user
who started the case is stored in the @@requester variable.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 134
ProcessMaker 3 Advanced Architect Course

Any employee should be able to report an invoice for approval, so we're going to assign this task to the
whole "employees" group.
In the "Users" tab below, click on "View groups" and look for "employees". Drag and drop this element
onto the right column.

Don't forget to save these changes.

Now, we need to assign steps to this task. Right click on this task in the process map and select "Steps"
from the context menu.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 135
ProcessMaker 3 Advanced Architect Course

A pop up window will allow you to assign steps to this task. Each element listed on the left column
represents a step option. When assigned, they will determine a sequence of events to complete this task.
Take a look at the "Available Elements" list. You just have to drag the element you want to assign as a
step, and drop it anywhere on the right column. Try assigning the Report Form as the first step:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 136
ProcessMaker 3 Advanced Architect Course

After assigning the "Report Form" Dynaform, let's continue with the assignment of triggers. To assign
them, click on the arrow as shown in the image below.

Clicking on the arrow on each element will display the available time intervals for executing triggers. These
intervals have the message "No records found".

Now, how to select the proper execution point for your Triggers?
For example, we have a Trigger called "Obtain User Details", which is supposed to populate a few fields on
our "Report Form" before displaying it. Thus, before the "Report Form" is the perfect time, right?
Drag and drop the "Obtain User Details" trigger onto the "Before Dynaform" time interval.

To close the time intervals of the "Report Form" Dynaform, click again on the arrow.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 137
ProcessMaker 3 Advanced Architect Course

Additionally, we want the "Submit invoice items" Trigger to store all the invoice item details in an external
database after routing to the next task. Click on the right arrow next to "3. Routing", to display the
routing step time intervals and assign the trigger.

Finally, drag and drop the "Submit invoice items" trigger onto the "After Routing" time interval.

Great! We now have users and steps for our "Receive Invoice" task ready. Close the Step for task form.

Approve Invoice Task Configuration

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 138
ProcessMaker 3 Advanced Architect Course

In the "Approve Invoice" task, the supervisor will review the submitted invoice details, which include a
digital copy, to decide whether the invoice will be approved or rejected. Thus, open the task assignment
rules.

Then, select the "Reports to" assignment rule.

This configuration will automatically assign this task to the current user's supervisor. So, manual user
assignment is not necessary for this task.
For example, observe the hierarchical structure in the image below.

In this example, if Julian Dribin reports an invoice, the approval task will be automatically assigned to his
supervisor (Ian Barret).
Now, let's assign steps to the "Approve Invoice" task.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 139
ProcessMaker 3 Advanced Architect Course

Assign the "Copy of Invoice" Input Document as the first step of this task.

Now, assign the "Approve Report Form" as the second step.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 140
ProcessMaker 3 Advanced Architect Course

Exit this pop-up window.

Pay Invoice Task Configuration

In the "Pay Invoice" task, a member of the "Finance and Treasury" user group will pay the invoice,
generating a "Proof of Payment" document. Thus, assign the "Finance and Treasury" user group to this
task.

Then, assign the "Proof of Payment" Output Document as the only step of the "Pay Invoice" task.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 141
ProcessMaker 3 Advanced Architect Course

Gateway Configuration
Finally, set up the proper logic conditions for your Exclusive Gateway by right-clicking on it and selecting
"Properties":

If the reported invoice has been approved, we should route the workflow to the "Pay Invoice" task;
otherwise, it should return to the "Receive Invoice" task, allowing the employee to modify the report, if
necessary.
To better understand this configuration, take a look at the values of the "invoiceApproved" variable.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 142
ProcessMaker 3 Advanced Architect Course

Then, set up the following logic conditions for your Evaluation routing rule:

Receive Invoice @@invoiceApproved == 0

Pay Invoice @@invoiceApproved == 1

Click on "Save" when you're done.

That's it, we put together all the process components we have been designing during previous hands-on
labs. Your "Invoice Approval Process" is ready to run.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 143
ProcessMaker 3 Advanced Architect Course

13.0 Running an Invoice Approval Process

Starting New Cases

Let's simulate an invoice report case from our Operation and Business Department:

Log out and log in again as Julian Dribin using the following credentials:

username julian

password sample

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 144
ProcessMaker 3 Advanced Architect Course

Once in the Home interface, select "New case" from the left side menu.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 145
ProcessMaker 3 Advanced Architect Course

Here, you will find all the starting tasks that Julian is assigned to.
Look for the "Invoice Approval Process (Receive Invoice)" starting task in the "Finance" process category,
and double click on it.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 146
ProcessMaker 3 Advanced Architect Course

As an employee, Julian will report an invoice with the following characteristics.

At the bottom of the form, attach the copy of invoice as shown in the image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 147
ProcessMaker 3 Advanced Architect Course

After you have uploaded a file, click on the "Next Step" button.
As you can see, the case is about to be routed to Ian Barrett (Julian's supervisor).

Click on "Continue" to route the case.

Notice that all the line items have been stored in your "reported_invoice_item" external data table:

Log in as Ian Barrett using the following credentials:

username ian

password sample

In Ian's Inbox, open the case by double clicking on it.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 148
ProcessMaker 3 Advanced Architect Course

As a supervisor, Ian is able to download the digital copy of the reported invoice (previously attached by
Julian).

In the next step, Ian is able to review the "Report Form" data in order to approve or reject Julian's
reported invoice.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 149
ProcessMaker 3 Advanced Architect Course

Approve the reported invoice and click on "submit" to continue.

Notice the case is about to be routed to John Smith (the user we created during the "User Management"
lab). Click on "Continue" to route the case, and then log in as John Smith with these credentials:

username john

password admin

Finally, in John's Inbox, open the case by double clicking on it.

In this task, John Smith will take care of the invoice payment and generate a "Proof of Payment"
document.

Take a look at this version:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 150
ProcessMaker 3 Advanced Architect Course

Click on "Next Step" to continue.

We have reached the end of the process. Click on "Finish" to be redirected to John's inbox list.
Viewing Your Report: Data Reporting Tools

In this part of the laboratory, we will view the reports created in the Data Reporting Tools feature. Click
on Report User under Data Reporting Tools in the left menu.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 151
ProcessMaker 3 Advanced Architect Course

Note: Take into account that the Report User option will only be enabled if the current user has the
REPORT_USER permission assigned to its role. Further information can be found at this page.
Next, click on the View Report button as shown in the image below.

Grouping Data in Final Reports

In order to group invoice data by the submitter name. You just need to drag the "Name" column:

And drop it onto the Drag a column header and drop it here to group by that column section, as shown
below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 152
ProcessMaker 3 Advanced Architect Course

Right after this action, the invoice data will be grouped by the submitter name.

Additionally, the columns shown in the final report can be sorted, ordered, and filtered as shown at this
page.

Exporting Your Report as a PDF File

Click on the PDF option in order to generate a PDF file containing your report data.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 153
ProcessMaker 3 Advanced Architect Course

Download and open the generated file.

Reports can also be exported as Excel and/or CSV files, as shown on this page.

Viewing your Reports: SLA

Once a case is run, you will be able to access the reports associated to the case. To see this information,
take a look at Reports in the Home interface. Here, it is possible to find the historical record of these cases
from the SLA configured in the laboratory "SLAs".

SLAs
For SLA reports, click on the option SLA Report. A set of options will be displayed; select the features you
need to generate your report as shown in the image below.

Once the report is generated, the summary of cases will be displayed.

To obtain more detailed information about each case, double click on the row of the "Invoice Approval
Process" SLA.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 154
ProcessMaker 3 Advanced Architect Course

After clicking on this SLA, a more detailed report for each case will be displayed. This will reveal delays and
penalties for each case run.

Clicking on each row will show the details of each case. The red square in the image below highlights the
menus of SLA when moving forward. If you need to move to previous interfaces, click on one of these four
options.

Finally, it is possible to export the reports generated in SLA by clicking on the icon in the top right corner.
These reports can be exported in .xls and .pdf extensions.

14.0 Custom Case List Builder

Custom Case List Builder

In this laboratory, we will see how to customize the fields shown in each folder of the Home interface.
Organizing columns in the ProcessMaker case list can be tiring when you do not use the appropriate tool.
Therefore, ProcessMaker features the Custom Case List Builder tool, which makes the identification of
each case listed easier.
First, we need to take a look at the original set of fields in the inbox.

Above, we can see the default fields used in the inbox folder. To customize these columns, it is necessary
to use the Custom Case List Builder.
Using The Custom Case List Builder
Go to Admin in the top menu.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 155
ProcessMaker 3 Advanced Architect Course

In the Settings tab, go to Custom Cases Lists.

The following interface will be displayed.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 156
ProcessMaker 3 Advanced Architect Course

There are four sections marked in red in this form:

1) Folders: The user can select any folder to be customized. Each folder represents a list of cases.
2) PM Table: This option is used when we need to import more fields from a PM Table.
3) Available Fields: When a PM table is imported, or not all of the fields are added to the right column. It
is possible to include these fields by dragging and dropping them into the "Cases List Fields" column.
4)Cases List Fields: The group of fields included in the current folder's case list. It is possible to remove
fields from this list, depending on what is needed.

Using the Custom Case List Builder With a Report Table

Go to the Inbox tab to customize the columns in the folder.

We will use the "PMT_INVOICE_REPORT" report table to add extra fields to our customized case list. In
the PM Table dropdown, select the "PMT_INVOICE_REPORT" option.

From the report table selected, select the "TERMS_LABEL" and "INVOICEAPPROVED_LABEL" fields.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 157
ProcessMaker 3 Advanced Architect Course

Drag and drop the selected fields to the right side as shown in the image below.

Then, double click on the Label column in each field of the selected columns.

Change the label from "TERMS_LABEL" to "Terms".

For the next row, change the label from "INVOICEAPPROVED_LABEL to "Invoice Approved?".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 158
ProcessMaker 3 Advanced Architect Course

Once the changes are done, click on the Apply Changes option in the right bottom corner.

Once the changes are applied, go to Home.

As you can see below, it is possible to find the new fields added to the Inbox with the corresponding labels
and alignments.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 159
ProcessMaker 3 Advanced Architect Course

15.0 Web Entries and Case

Configuring a Web Entry

Until now, our Invoice Approval Process allows ProcessMaker users to report their invoices using the
automated workflow we have been designing in previous labs. But, what if we want external users (users
not registered in our ProcessMaker server) to be able to use this automated process too?
Well, ProcessMaker features two useful tools that will enable external users to create and to track cases in
ProcessMaker:

Web Entries
A Web Entry is a public form that will allow external users to initiate new cases from an external web
page, without the necessity of manually logging into ProcessMaker.
Let's configure a Web Entry for our Invoice Approval Process.
From the Designer interface, open the "Invoice Approval Process". Then, right click on the start event and
select "Web Entry".

Now, you have to select a Dynaform to create cases externally and a user who will be considered the
creator of each new case when using this Web Entry. We will use a user named "ws_user" which we
created in the "Lab: Users, Groups, Departments and Roles" laboratory.
Let's select the "Report Form" Dynaform and the "ws_user" user. Click on Generate Link when done.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 160
ProcessMaker 3 Advanced Architect Course

Now you have a URL for an external form, which can be sent via email to your users/customers, or even
embedded in a page on your web site.
Click on the green Save button to save the configuration of your web entry.

Each externally created case follows the regular "Invoice Approval Process" workflow in ProcessMaker.
Configuring Case Tracking for Our Process

Now that we have enabled external users to report their invoices using our automated process, don't you
think that they should be able to track the status of their invoices as well?
Case Tracking

In addition to Web Entries, ProcessMaker features a Case Tracker, which allows external users to obtain
detailed information about a specific case.
To open the Case Tracker, click on the Case Tracker menu item in the main toolbox.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 161
ProcessMaker 3 Advanced Architect Course

Below you will find an example of the default configuration for the case tracker:

Here you can select a group of process elements from the left menu to be shared with external users.
Let's leave all the display options enabled, and assign the "Report Form" Dynaform as a shared object. All
you have to do is drag and drop it onto the right column.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 162
ProcessMaker 3 Advanced Architect Course

In order to enable external users to access the ProcessMaker Case Tracker, you must provide them with
the following details:

Case number

Case PIN (4-digit code)

Don't forget to save changes.

Getting a Case PIN Code

From the Designer interface, enable the ProcessMaker Debugger for your "Invoice Approval Process" by
right-clicking on its title, and selecting Enable Debug Mode.

Log out and log in again as Julian Dribin in order to create a new case in the "Invoice Approval Process".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 163
ProcessMaker 3 Advanced Architect Course

This time you'll see the ProcessMaker Debugger enabled, where you'll be able to find the required details
about this case.

Fill out the form as usual, and continue the process until assigning the case to the next user.
Now that we have all the information we need:

Case number 14

Case PIN 6FO2

Let's access to the ProcessMaker Case Tracker in order to take a look at the case details available to
external users.

How to Access the ProcessMaker Case Tracker

In order to access the Case Tracker, you just have to change the last part of the URL address to
"/tracker/login" as shown below:
http://<SERVER_ADDRESS>/sys<WORKSPACE>/en/neoclassic/tracker/login
In this case:
http://processmaker/sysworkflow/en/neoclassic/tracker/login
This particular login window will be displayed:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 164
ProcessMaker 3 Advanced Architect Course

As you can see, you must provide a case number and a PIN code to access the case tracker. Use the case
details you just obtained from the ProcessMaker Debugger.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 165
ProcessMaker 3 Advanced Architect Course

The first thing you'll see is the process map. You will notice that the process map is color coded according
to where it is in the workflow.

Click on My Case Forms And Documents to list the shared process objects. Click on View to open any of
them.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 166
ProcessMaker 3 Advanced Architect Course

Dynaforms are displayed in view mode.

You can also view a detailed routing history by clicking on My Case History.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 167
ProcessMaker 3 Advanced Architect Course

My History Messages lists all outgoing email notifications related to this case. In this specific example, no
notifications have been sent.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 168
ProcessMaker 3 Advanced Architect Course

16.0 Sub-processes

Configuring Sub-Processes

A sub-process is a separate process that is embedded within another process. It is highly recommended to
break up a process into small units for better process management, for which the use of sub-processes
can contribute to the organization of business processes. In this laboratory, a synchronous sub-process
will be embedded and configured in the "Invoice Approval Process".
Importing the Sub-Process
In this example, "Payment Order Creation" will be the process used as a sub-process. This process consists
of two tasks and its purpose is to create the register of payments for the Accounting Department.

Sub-processes are created from the Designer menu like any other process. Go to the process list in
the Designer menu and then click on the Import button.

Then import the "Payment Order Creation" process to your list of processes.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 169
ProcessMaker 3 Advanced Architect Course

After clicking on the Upload button, select the first option to create a new UID for this process.

Next, select the second option to merge the imported groups with the other groups in ProcessMaker.

Finally, this process will appear in the list of processes.

Preliminary Configurations of the Main Process: Invoice Approval Process

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 170
ProcessMaker 3 Advanced Architect Course

After importing this process, some modifications are necessary for the "Invoice Approval Process" to work
with sub-processes. Select the connector between the "Execute Payment?" gateway and the "Pay Invoice"
task. When selecting, the connector will be marked with yellow dots.

Once selected, erase the connector "Yes" from the gateway by pressing the Delete button on the
keyboard.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 171
ProcessMaker 3 Advanced Architect Course

Next, select a sub-process element from your Shapes toolbox.

Add it to your "Invoice Approval Process" and label it "Payment Order Creation". Your main process should
look like the image below. The "Pay Invoice" task and the "Invoice Paid" end event will be re-arranged on
the right side.

Connect the sub-process, and label the connector that goes from the gateway to the sub-process as "Yes".
Take a look at the picture below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 172
ProcessMaker 3 Advanced Architect Course

Then, right click on the gateway and select Properties from the menu.

Set the Routing Rules as shown below:

Save the gateway configuration.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 173
ProcessMaker 3 Advanced Architect Course

Variable Creation
Go to the Main Toolbox and click on the Create button for Variables.

Then, create the following variable as shown in the picture below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 174
ProcessMaker 3 Advanced Architect Course

Variable Name total

Variable Type string

Click on Save.

Close the list of variables as shown in picture below.

Trigger Configuration
Create a trigger with the following parameters and code:

Title: Values Summary

Description: This trigger obtains the summary of all values from the "Total" column in the grid.

1. $grid = @=grid;
2. $rows = sizeof($grid);
3. for($i=1; $i<=$rows; $i++)
4. {

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 175
ProcessMaker 3 Advanced Architect Course

5. $total += $grid[$i]["total"];
6. }
7. @@total = $total;

This trigger adds up all the values in the "Total" column in the grid, which was added in
the Dynaforms laboratory. Click on Save.
Assign this trigger to the first task, which is named "Receive Invoice", as shown in the picture below.

Close the Assignment Steps window.

Editing the Output Document
To edit the Output Document, go to the Main toolbox and click on the option Output Documents as
shown below. This will display the list of created Output Documents.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 176
ProcessMaker 3 Advanced Architect Course

Then, click on Open Editor to start editing the output document.

When editing the Output Document, press the Enter button to create a new empty line between "Invoice
date: @#invoiceDate" and "Status: Approved".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 177
ProcessMaker 3 Advanced Architect Course

Then, enter this other line: "Amount paid: @#total".

The @@total variable (which is a string in ProcessMaker) comes from the "Value Summary" trigger. The
prefix is "@#", because we do not require the value to be placed inside quotation marks. @@ is a prefix
for a string that is enclosed in double quotation marks. The amount of the total will be less because of the
tax recovery calculated in the sub-process. Save your changes.

In the image above, it is possible to see the changes marked by a red rectangle. Save changes and close
the list of Output Documents.
Sub-Process Configuration

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 178
ProcessMaker 3 Advanced Architect Course

Right-click on the sub-process and select Properties in the menu. In this option, two actions will be done:
Entering the name and features of the sub-process, and variable configuration.

After choosing this option, a form will be displayed to configure the sub-process.

In the image above, the Sub-process Properties form is divided into two parts to better explain how to fill
out this form. The first image includes the fields that will be used to enter the name and features of the
sub-process. The second image is used for variable configuration between the main process "Invoice
Approval Process" and the sub-process "Payment Order Creation".
Filling out the Form
Fill out the first part of the form as shown below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 179
ProcessMaker 3 Advanced Architect Course

In the screen shot above, four fields have been filled out: Sub-Process name, Process, Starting task, and
Type.

Sub-Process name: Enter a name for the sub-process that will serve as the label.
Process: Select the process that will function as a sub-process.
Starting task: Select the starting task of the sub-process.
Type: Select the type, "synchronous" or "asynchronous".

When the type of sub-process is synchronous, it means that the parent process will pause and wait for the
sub-process to finish; once the sub-process is finished, the parent process will continue on its course.
When the type selected is asynchronous, the parent process will not wait and will continue its course
straight away after firing off the sub-process. Then, both the parent process and sub-process will run
independently.
Variables Out Configuration
Now, let's continue with the variable configuration. When filling out the variable configuration, it is
necessary to select variables in both fields: Origin and Select Target Process.
To add variables to each of these fields, click on the variable picker @@.
In the origin field, click on the @@ button to find the variable you wish to pass from the parent process.
In the Select Target Process field, click on the @@ button to find the variable you wish to add to the sub-
process.
In the picture below, we have two variables: "@@APP_NUMBER" and "@@number". "@@APP_NUMBER"
cannot be picked up from the @@ button, it must be typed; the rest of the variables can be picked up
from the @@ button.
Once you have completed the mapping from the parent process to the sub process, click on
the Add button to add the variable mapping configuration to the process configuration.

For this example, please configure your Variable In to reflect the screenshot below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 180
ProcessMaker 3 Advanced Architect Course

Variables In Configuration
For mapping the variables from the sub-process back to the parent process, the process is reversed. The
origin variable is the variable in the sub-process and the target variable is the variable in the parent
process.
Please configure your Variables In to reflect the below screenshot.

In the screenshot of variable configuration, both the Variables Out and Variables In sections have been
filled out.

Variable Out: This section is where the values passed from the main process variables to the sub-
process variables are configured. In other words, the sub-process variables will receive their values
from the main process.
Variables In: This section is where the values passed from the sub-process variables to the main
process variables are configured. In other words, the main process variables will receive their values
from the sub-process.

Save all configurations.

Running a Case

In this part of the laboratory, a case will be run to check the configuration of the sub-process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 181
ProcessMaker 3 Advanced Architect Course

Log in as Julian using the credentials below and create a new case in the "Invoice Approval Process".

username julian

password sample

Click on New Case, and double-click on the Invoice Approval Process (Receive Invoice) option to start a
new case.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 182
ProcessMaker 3 Advanced Architect Course

Let's begin with the "Receive Invoice" task. Fill out the form as shown in the image below.

Click on Submit. Next, attach a file in the Input Document step.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 183
ProcessMaker 3 Advanced Architect Course

After attaching the file, click on Next Step to finish the task. Then, a new message will appear showing the
next task and its assigned user.

Click on Continue.
Now, log in as Ian Barret, using the following credentials:

username ian

password sample

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 184
ProcessMaker 3 Advanced Architect Course

Once logged in, search for the recently created case and open it by double-clicking on it.

Continue with the first step of the "Approve Invoice" task, which is the "Copy of Invoice" input document.
In this step, it is possible to download the attached file. Click on Next Step to continue.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 185
ProcessMaker 3 Advanced Architect Course

Then, approve the form by using the Invoice Approved? dropdown and click on Submit, as shown in the
image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 186
ProcessMaker 3 Advanced Architect Course

After approving the form, a message will appear mentioning the next task and its assigned user.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 187
ProcessMaker 3 Advanced Architect Course

Notice that the "Review Accounting" task belongs to the "Payment Order Creation" process (in
parenthesis).
Note: Remember that a sub-process works exactly like a typical process. In other words, both sub-process
and main process cases will be run as usual.
Running the Sub-process Case
Log in as John Smith using the credentials below:

username john

password admin

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 188
ProcessMaker 3 Advanced Architect Course

Once logged in, the case will be found in John Smith's inbox as shown in the image below.

Note: In this example, case #25 has been created, and it is the sub-process case. The case belonging to the
main process is case #24.
Let's work on the first form of the sub-process case.
Double click on the case to open it. You should see a form similar to what is shown below:

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 189
ProcessMaker 3 Advanced Architect Course

How Does the Variable Out Configuration Work?

In the image above, the populated fields are related to the Variable Out Configuration section in the
previous page. To better understand how the mapping that we did earlier works, you can see how the
relationship is correlated in the screenshot below:

At the beginning of this laboratory, "Julian Dribin" was stored in the main process variable "@@name".
This value was transferred to a sub-process variable called @@responsible.
Click on Submit and continue with the final step of the sub-process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 190
ProcessMaker 3 Advanced Architect Course

After left clicking on Continue in the message above, the case will be transferred to the inbox. Open the
case by double clicking on it.

Approve the final form of the sub-process, as shown below:

When done, click on Submit. The amount will be calculated without taxes due to a value added tax (VAT)
reduction.
Finally, a message titled "End of process" will indicate the end of the sub-process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 191
ProcessMaker 3 Advanced Architect Course

After clicking on Finish, the main case will appear again in the inbox, because John Smith has been
assigned to last task in the main process.

Open the case by double clicking on it.

In the first step of the last task, download the Output Document as shown below by clicking on Open.

Note: Both versions are available for downloading: (.doc) and (.pdf).
You will notice that the new total shows a different amount based on the calculation done in the sub-
process.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 192
ProcessMaker 3 Advanced Architect Course

How Does Variable In Configuration Work?

See the image below to better understand how the configuration of Variables In works.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 193
ProcessMaker 3 Advanced Architect Course

In the image above, the @@amount variable in the sub-process stores a value, which will be transferred
to the @@total variable in the main process. In other words, it is passing the data back to the main
process.
You may now continue by clicking on the Next Step button.

Finally, click on Finish to end the case.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 194
ProcessMaker 3 Advanced Architect Course

17.0 Enhanced Login

Verification Type

Security is an important issue among developers and users. In some cases, alternatives such as setting a
maximum number of password attempts, or generating tokens can be applied as access control resources.
In fact, ProcessMaker possesses tools to restrict access to some users and control failed attempts when
logging in. Among these options, Enhanced login has a vast amount of features to customize the access
security to ProcessMaker.

Preliminary Settings
To begin with this laboratory, go to the Admin menu.

Then, go to the Users tab and select Users.

Once the user list is displayed, go to the Search box and write "Joseph".

Once the user is found, select it by left clicking.

We will use the account of "Joseph Parks", and we will need to change his email to our email in the next
step. Click on the Edit button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 195
ProcessMaker 3 Advanced Architect Course

Write your email in Joseph's profile as shown in the picture below.

Save this setting.

Verification Type Creation

Matrix
After saving this setting, go to the Enhanced Login tab and click on the 2 Step Verification option.

"Enhanced Login" features three options:

2 Step Verification: This option allows administrators to add a second login step, where users will
be asked to provide a verification code in addition to their regular credentials, to restrict access and
make it more rigorous. When using this alternative, it is possible to generate a single token or a matrix
of tokens.
Session Control: This option allows the administrator to restrict the number of sessions a user has
opened at once.
Password Policy: This alternative allows administrators to enable new password policies, such as
requesting the inclusion of numeric characters, uppercase characters, or special characters.

In this laboratory, we will learn how to use 2 Step Verification.

In 2 Step Verification, click on Token Provider Setup.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 196
ProcessMaker 3 Advanced Architect Course

After Token Provider Setup is selected, we can select one of the two options below:

Matrix: This option sends an email with a set of tokens arranged in a matrix.
Email:This option sends an email with a token that can be entered when logging in.

First, we will select Matrix.

Fill in the fields as shown in the image below.

In this form:

Matrix size: The size of the square matrix. Here, the number four means a matrix with sixteen
elements.
Token length: The number of characters in each token.
Token type: Each token will be alphabetic in this case. Other types are numeric and alphanumeric.
Generate Matrix: The number four represents that in a period of four days, this matrix will be
regenerated.
Usage Time: This radio button confirms the regeneration of the matrix.

Save your settings.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 197
ProcessMaker 3 Advanced Architect Course

Email
After saving, click on Email next to Matrix.

Fill in the form as shown in the image below.

The following fields are filled in to generate an email token.

Radio button (Enabled/Disabled): This radio button activates or inactivates the token generation.
PP token length: In this field, enter the length of the token.
PP email type: The type of token generated.

Save settings.

Selecting the Verification Type

Once both options are configured, go to the Users tab in the same screen.

Select the user "Joseph".

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 198
ProcessMaker 3 Advanced Architect Course

Matrix
Click on Verification Type to select the TWOSTEP_VERIFICATION_MATRIX type of verification.

Press ENTER. Log out from ProcessMaker.

Log in as Joseph with the following credentials.

User joseph

Password sample

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 199
ProcessMaker 3 Advanced Architect Course

After logging in, a new screen will ask you for a specific token, indicated by the coordinates sent in the
email.

Look for the code in the matrix using the coordinates provided by the email.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 200
ProcessMaker 3 Advanced Architect Course

Email
Log in again as the "admin" user.

Go to Admin.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 201
ProcessMaker 3 Advanced Architect Course

Go to the Enhanced Login tab.

Go to the Users tab in the same screen.

Select the user "Joseph".

Click on Verification Type to select the TWOSTEP_VERIFICATION_EMAIL type of verification.

Press ENTER. Log out from ProcessMaker.

Log in as Joseph with the following credentials.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 202
ProcessMaker 3 Advanced Architect Course

After logging in, a new screen will ask you for a specific token, which is the string sent in the email.

The code is the string of letters sent in the email.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 203
ProcessMaker 3 Advanced Architect Course

Password Policy

Log into ProcessMaker with the following credentials:

User admin

Password admin

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 204
ProcessMaker 3 Advanced Architect Course

Go to the Admin in the top menu.

Next, click on the Enhanced Login tab and select the Password Policy option.

After clicking on that option, the Password Policy form is displayed. Fill in the data as shown in the picture
below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 205
ProcessMaker 3 Advanced Architect Course

Minimum length 5

Maximum length 8

Password Expiration in (days) 90

Logins failed 3

In the form above, we clicked in three checkboxes:

Numerical Character is required

Uppercase Character is required
Special Character is required

These three options form the policy of the password construction, and indicate that the password string
must include numerical, upper case and special characters. Below, we can define the minimum and
maximum lengths, the password expiration and the inclusion of special characters. Click on Save Settings.

By saving these policies, any password created or modified will follow the criteria of the password policy.

Testing Password Policies

Go to the Users option under the Users tab.

Once the user list is displayed, search for "joseph" in the Search box as shown below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 206
ProcessMaker 3 Advanced Architect Course

Once the user is found, select it by left clicking. Click on Edit.

Then, the Personal Information form will be displayed. Here, go to the Change Password section.

In this section, we will test the password policies. First, write the following passwords in both fields New
Password and Confirm Password.

New Password sample

Confirm Password sample

When the password entered does not comply with the password policy, the following message in red will
appear.

The red message above indicates which password policy was not complied with, which in our case is all of
the policies. If we use the following passwords, a different message will appear:

New Password Sampl3/

Confirm Password Sampl3/

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 207
ProcessMaker 3 Advanced Architect Course

At last!!! Our password complies the policies, as confirmed by the green message.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 208
ProcessMaker 3 Advanced Architect Course

18.0 External Registration Wizard

External Registration Wizard

The External Registration Wizard publishes a link to create users via an external registration form. For
example, this feature can be applied when registering new students for a college using the published link
included on the university campus website.
In the Admin menu, go to the Plugins tab.

Click on the External Registration option.

Click on the New External Registration Form button.

Fill in the fields of the New External Registration Form as shown in the image below.

Where:
General,

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 209
ProcessMaker 3 Advanced Architect Course

Title: Here we enter the title of the external registration form.

Use the resources from the process: Select the process where we will obtain the Dynaform.
E-mail Template: Choose the template that will be sent in the e-mail.
Select the Dynaform from the process.

Actions After Registration,

Assign User To: In this option we can assign a user to a task, group or department.
Name/Title: Depending on the option selected in the previous field, the options in this dropdown
will change to the names of tasks, groups or departments to select.
Start a Case on Task: Here we select the task where the case will be started.
Trigger to Execute: This is the trigger that will be executed after the user is registered.

After filling in this form, save the settings.

Creating a User Account

Click on View Form to obtain the link for external registration.

After cliking on View Form, the form for registration will be displayed along with the first Dynaform of the
process we selected. Fill in the Create an Account form as shown in the image below.

First Name Albert

Last Name Camus

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 210
ProcessMaker 3 Advanced Architect Course

First Name Albert

E-Mail [email protected]

User Name camus

Password sample

Confirm Password sample

Note: Enter your email address to receive the confirmation message.

After filling in the first fields, fill in the rest of the Dynaform. By filling out this Report Invoice Dynaform,
we start a new case in the "Invoice Approval Process", as configured before.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 211
ProcessMaker 3 Advanced Architect Course

Submit the complete form.

After submitting this form, an e-mail is sent.

Click on the last link to activate your account.

When clicked, a message will be displayed announcing the activation of the account. Click on Log in.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 212
ProcessMaker 3 Advanced Architect Course

Log in with the credentials of the new user.

user camus

password sample

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 213
ProcessMaker 3 Advanced Architect Course

After logging in, the new case will be in the new user's inbox.

19.0 Actions by Email

Actions By Email: Link to Fill a Form

Actions by Email is a feature that allows users to receive an email where they can send information to
ProcessMaker cases and also route those cases onto the next task. Further information about this feature
can be found at this link.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 214
ProcessMaker 3 Advanced Architect Course

In this laboratory, we will explore the application of this feature by running a case where after the first
task is completed, an email will be sent to the user assigned to the second task, and the second task will
be completed through email sent. To see how this works, we will change Ian Barrett 's email in his profile.
We will test two types of actions done by this feature: Link to Fill a Form and Custom Actions.
Let's first set the required configuration.

User Email Account

Log in with the "admin" user credentials.

Click on the Admin menu.

Go to the Users tab and select the Users option under the same tab.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 215
ProcessMaker 3 Advanced Architect Course

Once the user list is displayed, go to the Search box and write "ian".

Once the user is found, left click on it (the user will be marked in orange) and click on Edit.

In Ian's profile, change the current email to your email.

Save the changes.

The reason why we change the email for this profile is because Ian Barrett is assigned to the second task
"Approve Invoice". This task will be configured using the Actions by Email option available in its properties.
We need to use an active email account to receive the sent message when running the case. In this
example, we will first run the first task and the second task will be done through an email. Let's configure
the second task of the "Invoice Approval Process".

Actions by Email Configuration

Go to the Designer menu.

Open the "Invoice Approval Process" to edit it.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 216
ProcessMaker 3 Advanced Architect Course

After entering to the process map, right click on the "Approve Invoice" task and select
the Properties menu.

In Properties, select the Actions by Email option.

Fill in the form displayed as shown in the image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 217
ProcessMaker 3 Advanced Architect Course

Type Link to fill a form

Email template actionsByEmail.html

Dynaform Approve Report Form

Subject by email A new invoice has been reported for

approval

Email variable (If blank it uses the assigned user email

account)

Email From Email Account Settings

Format

Where:

Type: This is the type of action that can be done.

Email Template: This is the template used for the email.
Dynaform: Select the Dynaform to use for the link.
Subject by email: This is the subject of the email.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 218
ProcessMaker 3 Advanced Architect Course

Email variable: Enter a variable here that will store the email. If blank, it uses the current assigned
user email.
Email Account Settings: By selecting this option, the sender email will be email default server.

The checkboxes below are optional. For this example, we will not check them.
Click on the Save button.

Once all settings are saved, log out from ProcessMaker.

Log in as Julian Dribin.

User Julian

Password sample

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 219
ProcessMaker 3 Advanced Architect Course

Click on New Case.

Select and double click on the "Invoice Approval Process".

Fill in the form as shown below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 220
ProcessMaker 3 Advanced Architect Course

Click on the Continue button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 221
ProcessMaker 3 Advanced Architect Course

Once the first task is finished and the case is routed, an email is is sent to the email adress you entered in
Ian Barrett's user profile on the previous page. Go to your email and open the email that was sent by the
task. This email has been sent because we configured the Actions by Email feature for the second task.

Click on the Please complete this form link to complete the form.

This link will send you to the Dynaform in the second task: "Approve Invoice Report". For the second user
who received this email, Ian Barrett, there is no need to enter to the ProcessMaker server for the
approval. Select "No" in the "Approve Invoice?" dropdown and click on Submit.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 222
ProcessMaker 3 Advanced Architect Course

After the form has been submitted through email, a message will confirm the action.

Actions by Email: Custom Actions

To complete this second exercise using Custom Actions from Actions by Email, we need to login with the
"admin" user credentials. We will use Actions by Email Feature to make an approval using an email
template.

User admin

Password admin

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 223
ProcessMaker 3 Advanced Architect Course

Click on Designer in the top menu.

Next, open the "Invoice Approval Process" by double clicking on it.

In the process map, right click on the "Approve Invoice" task and select Properties.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 224
ProcessMaker 3 Advanced Architect Course

In the Activity Properties menu, select Actions by Email.

When this option is selected, a form will be displayed to define what type of action can be done. Fill in the
fields as shown in the image below.

Type Custom Actions

Email from Email Accounts Settings

Format

Email Variable (if blank it will use the assigned user's

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 225
ProcessMaker 3 Advanced Architect Course

account)

Subject by email A new invoice has been reported for

approval

Email Template actionsByEmail.html

Store Result in @@invoiceApproved

Where:

Type: Type of action that will be done with Actions by Email. In this case, it will be Custom Actions.
Email from Format: This is the sender email set in the Email Account settings.
Email variable: The recipient email. If blank, it will use the assigned user's email account.
Subject by email: This is the title of the subject of the email.
Email template: In this dropdown, we choose the template for the email.
Store Result in: In this field, we enter a variable where to store the result of action done in the
email.

Below there are two checkboxes:

Register a Case Note when the recipient submits the Response: Check this option if you want to
register a Case Note after the action has been executed.
For user login: When this checkbox is marked, users must log in to submit actions.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 226
ProcessMaker 3 Advanced Architect Course

At the bottom of this form, we can create the button for approval and rejection, which will be used in the
email. Enter the following values:

Value 1

Label Yes

For the CSS format, enter the following code:

1. background: #096309;
2. background-image: -webkit-linear-gradient(top, #096309, #08752b);
3. background-image: -moz-linear-gradient(top, #096309, #08752b);
4. background-image: -ms-linear-gradient(top, #096309, #08752b);
5. background-image: -o-linear-gradient(top, #096309, #08752b);
6. background-image: linear-gradient(to bottom, #096309, #08752b);
7. -webkit-border-radius: 28;
8. -moz-border-radius: 28;
9. border-radius: 28px;
10. font-family: Georgia;
11. color: #ffffff;
12. font-size: 20px;
13. padding: 10px 20px 10px 20px;
14. text-decoration: none;

Click on Save.

After saving these changes, this button will be added to the list of buttons as shown in the image below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 227
ProcessMaker 3 Advanced Architect Course

For the next button, we will follow the same procedure. We need to enter the value, label and the css
code.

Value 0

Label No

CSS:

1. background: #eb0505;
2. background-image: -webkit-linear-gradient(top, #eb0505, #b82b2b);
3. background-image: -moz-linear-gradient(top, #eb0505, #b82b2b);
4. background-image: -ms-linear-gradient(top, #eb0505, #b82b2b);
5. background-image: -o-linear-gradient(top, #eb0505, #b82b2b);
6. background-image: linear-gradient(to bottom, #eb0505, #b82b2b);
7. -webkit-border-radius: 28;
8. -moz-border-radius: 28;
9. border-radius: 28px;
10. font-family: Georgia;
11. color: #ffffff;
12. font-size: 20px;
13. padding: 10px 20px 10px 20px;
14. text-decoration: none;

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 228
ProcessMaker 3 Advanced Architect Course

Click on the Save button.

Now, both buttons are part of the list.

Click on Save.

After saving these settings for both butttons, go to Templates in the main toolbox by clicking on it.

After clicking on it, the template list will be displayed. Click on Edit for the "ActionsByEmail.html"
template.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 229
ProcessMaker 3 Advanced Architect Course

In the template designer, click on the HTML button.

In the HTML Source Editor, clear the screen and then paste the code below.

1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2. <html>
3. <head>
4. </head>
5. <body>
6. <table style="font-family: Arial, Helvetica, sans-serif; color: black; font-size: 11px; text-align: left;
width: 100%; background-color: white;" cellpadding="10" cellspacing="0">
7. <tbody>
8. <tr>
9. <td style="font-size: 14px;"><b>ACTIONS BY EMAIL</b></td>
10. </tr>
11. <tr>
12. <td style="vertical-align: middle;"><hr />
13. <p><font size="3"><b>User Details</b></font></p>
14. <p><font size="2">Name: @#name </font></p>
15. <p><font size="2">Email Address: @#emailAddress</font></p>
16. <p><font size="2">Address: @#address</font></p>
17. <p><font size="3"><b>Invoice Details</b></font></p>
18. <p><font size="2">Invoice Type: @#invoiceType_label </font></p>
19. <p><font size="2">Invoice Subtype: @#invoiceSubtype_label </font></p>
20. <p><font size="2"><span>Invoice Date: @#invoiceDate</span></font></p>
21. <p><font size="2"><span><span>Terms: @#terms_label</span></span></font></p>
22. <center>
23. <table border="1" cellspacing="0">

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 230
ProcessMaker 3 Advanced Architect Course

24. <tbody>
25. <tr><th><font size="2">Quantity</font></th><th><font size="2">Description</font></th><th><f
ontsize="2">Unit Cost</font></th><th><font size="2">Total</font></th></tr>
26. <!--@>grid-->
27. <tr>
28. <td><font size="2">@#quantity</font></td>
29. <td><font size="2">@#description</font></td>
30. <td><font size="2">@#unitCost</font></td>
31. <td><font size="2">@#total</font></td>
32. </tr>
33. <!--@<grid--></tbody>
34. </table>
35. </center>
36. <p><br /> @#__ABE__</p>
37. <hr /><b>This Business Process is powered by
ProcessMaker.<b> <br /> <a href="http://www.processmaker.com"style="color:
#c40000;">www.processmaker.com</a> <br /> </b></b></td>
38. </tr>
39. </tbody>
40. </table>
41. </body>
42. </html>

Click on the Update button.

Click on the Save button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 231
ProcessMaker 3 Advanced Architect Course

Close the list of templates.

The Custom Actions configuration is ready. Let's run a case to see what happens!
Running a Case: Custom Actions

Log in as Julian Dribin.

User Julian

Password sample

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 232
ProcessMaker 3 Advanced Architect Course

Click on New Case.

Select and double click on the "Invoice Approval Process".

Fill in the form as shown below.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 233
ProcessMaker 3 Advanced Architect Course

Click on the Continue button.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 234
ProcessMaker 3 Advanced Architect Course

Once the case is in the next task, you will receive an email. Click on Yes.

After clicking on the Yes button, a message will confirm your approval.

© Copyright 2000-2017 ProcessMaker Inc. All rights reserved.

www.processmaker.com 235