How do I display the data of two tables in one report component?
1. Usage scenarios
The two forms in the application are aggregated and displayed on the same report page to achieve the comparison effect, help customers view data more intuitively, and make accurate business judgments.
2. Procedure
This document displays the data in the two dimensions of "Project revenue" (income) and "Project salary" (expenditure) through the following two different processing schemes. In order to achieve the purpose of aggregation and comparison of data in two dimensions, it provides intuitive judgment assistance for managers to make business judgments.
2.1 Solution 1: The combination of the column component and the one-to-many filtering function
Use the column component to display "project staff salary" on the left and "Project revenue" on the right. The one-to-many filtering function is used to filter the two form data at the same time.
For more information about one-to-many filtering, see👉Implement one-to-many filtering on the report page
2.1.1 Step 1: Create and configure forms
(1) creation and configuration of project salary table
As the source of project salary data.
Procedure:
a. Create a common form named Project salary table 」;
B. Add a date component named "year and month" on the form editing page, and set the property-format on the right to year-month;
c. Add a single-line text component named "Project Name" and a numerical component named "Project salary;
d. Click save.
(The operation effect is shown in Figure 2.1-1)
Figure 2.1-1 project salary table effect diagram
(2) creation and configuration of project revenue table
As the source of project revenue data.
Procedure:
a. Create a common form named Project revenue table 」;
B. Add a date component named "date" on the form editing page, and set the property-format on the right to year-month;
c. Add a single-line text component named "Project Name" and a numerical component named "Project total amount;
d. Click save.
(The operation effect is shown in Figure 2.1-2)
Figure 2.1-2 project revenue table effect diagram
2.1.2 Step 2: Create and configure the report page
It is used to display the data of the above two forms.
Procedure:
a. Create a report page named "data analysis and display 」;
B. Select Layout> column at the top of the page to use the column component;
c. Select Table> basic table at the top of the page and place it on the left side of the column component;
d. Click the table generated in Step c, click the data-dataset-select dataset button on the right side of the page, and select "project salary table 」;
e. Drag the three fields of "month_Date", "project salary" and "project name" in the data-field on the right side of the page to the data-table column;
f. Repeat steps c, d, and e to display the project revenue table data to the right of the column component.
(The operation effect is shown in Figure 2.1-3)
Figure 2.1-3 column component placement table effect diagram
2.1.3 Step 3: merge column data
When there are two different data of the same project name in the same time period, you can use the merge cell function to merge cells.
For cells with merge requirements, drag the merged column to the front of the table. Otherwise, the merge fails.
Procedure:
a. Click to select the table that needs to merge cells, and here we select the project revenue table;
B. Place the date column in the front of the table for display;
c. Click style in the property configuration bar on the right and set the merge cell switch to the on state (the on state is green).
(The operation effect diagram is shown in Figure 2.1-4 and 2.1-5)
Figure 2.1-4 merge cells
Figure 2.1-5 effect display
2.1.4 Step 4: drag the indicator card component
Use the indicator card component to more intuitively display and calculate the total project salary and total project amount.
Procedure:
a. Drag the indicator card component to the left of the column layout and place it above the project salary table;
B. In the property configuration column on the right, select dataset> project salary table;
c. Click the project salary field and drag it to the indicator;
d. Repeat steps a, B, and c to display the total project amount of the project revenue table to the right of the column component.
(The operation effect diagram is shown in Figure 2.1-6)
Figure 2.1-6 setting indicator card components
2.1.5 Step 5: add a filter component
PassOne-to-many filteringThe control time filter component filters four components at the same time, as follows:
Procedure:
a. Drag and drop the filter> time filter component to the page header;
B. Click the style in the property configuration bar on the right and set the interval switch to the on state (the on state is green);
B. In the attribute configuration column, select dataset> project salary table;
c. Click the month_year field and drag it to the query field.
(The operation effect diagram is shown in Figure 2.1-7)
d. Select the table/indicator card with the data set as the project revenue Table> Click add filter> to select the local fields that need to match the same data.
(The operation effect diagram is shown in Figure 2.1-8)
Figure 2.1-7 select a dataset
Figure 2.1-8 add filter conditions
2.1.6 Effect display
Figure 2.1-9 effect display
2.2 Solution 2: View charts to show multi-table associations
2.2.1 Step 1: Create and configure charts
Procedure:
a. Click apply data at the top of the application page, and select dataset> create View chart> name it "data Test Table" (the operation effect diagram is shown in Figure 2.2-1);
B. In the data set on the right, select dataset> configure the main data table as project revenue Table> associate the data table as project salary table 」;
Figure 2.2-1 New View chart
2.2.2 Step 2: Select the association type
Select left Association (left Association applies to the situation where the information of the main table needs to be displayed even if the association relationship is not satisfied),How to Use view charts The Association types are described in detail in
Procedure:
a. Select the left Association for the association type, and configure the association relationship as the date field in the project revenue table. The Association data table is the year and month field in the project salary table;
B. Click confirm to save.
(The operation effect diagram is shown in Figure 2.2-2)
Figure 2.2-2 Association configuration
2.2.3 Step 3: Create a report page and configure
Procedure:
a. Create a report page named "data analysis and display 」;
B. Select Table> basic table at the top of the page and drag and drop it to the page;
c. Click the table generated in Step B, click data-dataset-select dataset on the right side of the page, and select data Test table 」;
d. Drag the three fields of "month_Date", "project Total amount" and "project name" in the data-field on the right side of the page to the data-table column;
(The operation effect is shown in Figure 2.2-3)
e. Use fx in the table column to calculate the total salary based on the year and month, and useSUMThe sum formula calculates the total salary. In this scheme, only the project salary needs to be calculated. Therefore, other fields that may interfere need to be excluded> Total project amount, project name, etc.
(The operation effect is shown in Figure 2.2-4)
Figure 2.2-3 select a dataset
Figure 2.2-4 add formula
2.2.4 Step 4: merge column data
It is the same as scheme 1. When two different data with the same project name exist in the same time period, you can use the merge cell function to merge cells.
For cells with merge requirements, drag the merged column to the front of the table. Otherwise, the merge fails.
Procedure:
a. Click to select the table to merge cells. Here, we choose data analysis and display;
B. Place the date column in the front of the table for display;
c. Click style in the property configuration bar on the right and set the merge cell switch to the on state (the on state is green).
(The operation effect is shown in Figure 2.2-5)
Figure 2.2-5 merge column data
2.2.5 effect display
Figure 2.2-6 effect display
3. Scheme comparison display
Figure 3-1 effect display
4. Try it online
YIDA in order to better optimize the content and quality of YIDA user manual, it takes you 3-5 minutes to fill in the document feedback questionnaire. The document feedback questionnaire is submitted anonymously, and the questionnaire information is only used for YIDA document experience feedback collection. Thank you for your support for YIDA!
-------------------- Get the latest information YIDA, welcome to follow US--------------------
