View components are used to display detailed business data. You can choose the appropriate view type based on the structure of your data and your business scenarios, helping members view and understand data more efficiently:

This article introduces the features of each view component and explains how to configure them.

Regardless of the view type, you first need to configure the data source. This includes selecting a data source and, optionally, configuring data filtering and sorting.

You can configure the following two types of data sources for a component:

After selecting a data source, you can apply filter conditions to limit the range of data displayed in the component.

You can configure sorting rules to display data in a specific order, making it easier for members to view.

The Data Table component can display associated data from related forms. When viewing data details, members can directly perform operations on the related form data, such as adding, exporting, and filtering records. Configure the component as follows:

After selecting a related form, add the fields you want to display. The field values from the related form will then be displayed in the component.

You can add sorting rules to display related form data in a specific order.

Supported field types include:

Admins can preset grouping rules for members by adding grouping fields. Data in the table will be grouped based on the values of these fields. Multiple grouping fields can be added, and their display order can also be configured. As shown below:

When viewing data, members can temporarily adjust the grouping rules as needed. Click Group in the upper-right corner of the component, then adjust the grouping fields and sorting order.

Admins can preset summary rules for members by adding summary fields and selecting summary methods. This allows values in a column to be summarized using methods such as Sum or Max.

When viewing data, members can temporarily adjust the summary rules as needed. Hover over the bottom of a field column, click Data Summary, and select the required summary method.

The Card List component displays related data in a card format, highlighting key content. It supports layouts such as single-column, multi-column, and mixed text-and-image layouts.

The component supports two layout options: List and Grid. In the grid layout, you can adjust the card density, including:

The component offers four card styles, including mixed text and images, plain text, and others, which can be selected as needed.

After configuring the layout, set the data displayed on each card and the order in which the cards are displayed.

1) Image (Optional)

When the card style includes images, you need to set the image source. You can choose an image field from the form and set the image display style, including:

2) Data Title

If you want to identify each card by a Data Title for easier recognition, you can enable the toggle after Data Title and display it on the card.
Additionally, you can click Set Data Title to adjust the title settings on the Extension page.

3) Display Fields

Add display fields as needed to show the data content in the cards.

The added display fields will show their field names by default for easier reference, and you can adjust the display position of the field name (top or to the left of the field). If you don’t want the field name displayed, uncheck Show Title.

4) Data Sorting

After setting up the card content, you can add sorting rules to display the cards in a specific order. Click Add Sorting Rule, select the field, and set it to either Ascending or Descending as needed:

The Hierarchical Table component displays data organized into a hierarchy using a Lookup field that relates records within the same form. It clearly presents parent-child relationships between business records. Members can also expand or collapse different levels of the hierarchy to view the data they need.

The hierarchy source is fixed to a Lookup field in the form and cannot be changed.

The system uses the Lookup field that relates records within the same form to identify the parent record of each record and generate the hierarchical structure accordingly.

For example, in a Subtasks form, the Lookup field used to relate records within the same form is Parent Task. The system uses this field to determine the parent task of each subtask. In this case, Hierarchy Source displays Parent Task. As shown below:

Under Display Fields, select the fields you want to display. Their field values will then be shown in the Hierarchical Table.

When viewing a Hierarchical Table, members can click Expand to Specific Level at the bottom of the table and select the number of levels to display. This makes it easier to view and manage data at different levels.

When viewing a Hierarchical Table, members can click Expand All or Collapse All to expand or collapse groups and records.

All view components support data operations.

For members who have data operation permissions, the toggles or check boxes under Data Operations can be used to control which operations are available within the component.

The following uses the Data Table component as an example.

1) Add / Import / Export

2) Batch Print

Members are allowed to perform batch printing. To enable this, toggle the "Batch Print" switch to ON, click the "Settings" button, and select the specific Custom Print Templates.

3) Custom Buttons

Allows custom buttons from the data source form to be displayed in the component for members to use.

Select the desired custom buttons from the dropdown list.
(Only buttons set in Grid View or Batch Operation Toolbar are supported.)

Click the "Manage" button to jump to the Custom Button Settings page. From there, administrative tasks such as editing, adding, or managing custom buttons can be performed.

When viewing data in the component, members can click the button

at the bottom of the page to automatically resize columns to an optimal width.