Dashboard Settings
View video

General Overview

The Dashboard application is focused on creating components where you can visualize several applications at the same time.

With the dashboard application, it is possible to create, for example, a screen to visualize several graphs, and also, with the addition of the Index Widget create comparisons, show sum of values, among other functionalities.

On the home screen, you can also configure where the Widgets will be displayed, they can be easily dragged and mounted according to the user’s need.

Initial

At the homepage you can see the Widgets and some options.

This is the option to create a link widget

This is the option for creating an index widget

This is the option for creating an Diveder widget

And within these, there are the options for:

Pencil

Used to edit Widget settings.

Trash

Used to Delete a Widget.

Besides that when the mouse is over the Widget, we can see a button Size to change the size of it.

Add Link Widget

This option allows any application that exists in the project to be added to a Widget.

General link widget

Link

To create the link enter the Widget and the application, it is necessary only to click on the field “Connection”, then it will be shown a list with all the applications existing in the project.

Link Widget List

Toolbar

In the toolbar settings, it is possible to configure the buttons that will appear in the toolbar of the application that is configured in connection.

The toolbar options will be displayed according to the application being connected, that is, according to the toolbar of each application.

Toolbar

Add Index Widget

This option allows you to add to an Index Widget based on a database table.

General index widget

Index

To create an Index Widget you need to make a few settings.

Widget Index

Display Mode

The display mode defines how the index information will be displayed. Available options include: Summary Function and Simple Card

Note: When the “Summary Function” display mode is selected, the Trend Icon option becomes available.

Title

This option allows you to define a title for the widget to better visualize what you want to display.

Caption

Allows you to add a caption to the information displayed in the widgets to better visualize what you want to display.

Connection

This option allows you to choose which connection will be used in the index widget; each widget can be configured with different connections.

Data Retrieval Method

Determines the method used to retrieve information from the database.

The options are:

Table: allows you to select a table directly to read the data.
SQL Command: can allow retrieval of custom data through the Select command.

If the select command option is selected, the Table Name, Period Field, Metric Field, and Metric Function fields will be hidden, and a field for building the select command will be displayed.

Trend Icon

When enabled, this option adds a visual trend icon (e.g., up/down arrow) next to the index value, representing growth, decline, or stability compared to a previous value.

The “Hide Trend Icon” checkbox can be selected if you do not want to display this indicator in the widget.

Table Name

This option allows you to select which table will be used in the Index Widget.

Period Field

This option allows you to select a field from the table so that the data selected in the previous option can be compared.

Metric Field

This option allows you to select a table field to create a metric, similar to the chart application. However, you can perform some comparisons based on the period defined in the next option.

Metric Function

Defines the metric function. The available functions are: Sum, Average, Max, Min, Count, and Distinct Count.

Display as

This option allows you to choose how the value will be displayed. You can choose between: Percentage Difference, Difference, and Value.

Period Function

This option allows you to configure the index by defining a function for a specific period. These functions are defined by a period of time, such as: Full Date, Year, Month, Day, Half-Year, etc.

Display values of

This option allows you to display values for:

Both periods
Current period
Last period
None

Layout

widget_layout

Alignment

Allows you to set the horizontal alignment of the content within the widget. Options typically include:

Left: aligns the content to the left margin.
Center: centers the content horizontally.
Right: aligns the content to the right margin.

Vertical Alignment

Controls the vertical positioning of the information within the widget. Can be set to:

Top: positions the content at the top of the widget.
Center: positions the content in the vertical center.
Below: positions the content at the bottom.

Icon Type

Allows you to choose the type of icons that will be used in the widget. Options include:

Icon: With this option selected, the icon field will be displayed so you can choose an icon directly from the image manager.
FontAwesome: With this option set, you will see a series of fields available for configuring the FontAwesome icon.

fontawesome_options

Title Icon Position

Defines where the title icon will be displayed in relation to the text. Available options include:

Above
Left of the title
Right of the title
Left
Right

Chart

Graphic Widget

Chart Type

This option enables chart display in indexes. You can choose from three chart types: Line, Area, and Column.

If you don’t want to display the chart, simply select “None.”

Here’s an example of a line chart added to the widget: grafico_widget

Chart Width

Allows you to set a percentage value for the chart width.

Chart Height

Allows you to set a value for the chart height.

Chart Color

Allows you to choose the chart color.

Formatting

In this option you can configure the formatting of the metric and period that will be shown in the execution of the filter.

Widget Formation

Metric Formatting

Metric Formatting as

Allows you to define the type of data that the metric will be shown, there are three options:

Internal: The index metric will be shown as a value of integer type. Decimal: The index metric will be shown as a value of type Decimal. Currency: The metric of the index will be shown as a value of type Modal.

Use regional settings

Lets you define whether the metric will follow the settings that were defined in the Regional Settings.

Decimals

Allows you to set how many decimal places will be in the metric index, however this will only be available when the metric format is Decimal or Currency.

Complete with zeros

Allows you to set whether the value will be completed with zeros when set to Decimal or Currency.

Format the value in scales

Lets you set whether the number in the index will appear in a scale or the whole number. If Yes is chosen, the number instead of 10.000 will appear with 10 k value.

Period Formatting

The options are shown according to the setting in Feed Function which is set to Index, so the setting can vary between:

Use regional settings

Allows you to set whether the period will follow the settings that were set in the regional settings.

Display the name of the month

Lets you to set whether to display the name of the month.

Prefix for semester, four-month, quarter, two-month, week.

Lets you inform a lang or a title that the developer wants to appear.

Display name of the day

Lets you set whether to show the name of the day.

Filter

Allows you to perform the filter configuration that will be displayed when the Index Widget is running.

Filter

Metric filter

Filter conditions

In this option we can define the condition of the filter so that the information regarding that metric is shown, and it is not possible to change that at run time.

Period Filter

Date Ranges

In this option we can define the condition of the filter so that the information regarding that period is shown, and it is not possible to change at run time.

Relative period

We must define which periods are available for use in the filter.

Another option referring only to the relative period is the possibility of creating conditions with relative periods customized directly within the filter interface.

The available values are separated by tabs:

Year: Sets the year used in the filter. Quarter: Defines the quarters used in the filter. Month: Sets the usage of the months of the year. Week: Sets the use of the weeks of the year. Day: Sets the use of the days of the month.

Use field table filter

Allows you to create filters from table fields.

Field Tables

Field and Colors

In this option you can configure the layout of the map that will appear in the Widget.

Layout

Index background

It allows you to set a background color for the widget content.

Boder Color

It allows you to set a color for the widget border

Title font

Allows you to configure the font to be displayed in the index title, in this option there are four more options:

Visual