Skip to content

Commit bfa84e4

Browse files
Dshcherbynaashvayka
authored andcommitted
new page added advanced entity table widget
1 parent 51d1738 commit bfa84e4

26 files changed

+145
-0
lines changed

_data/docs-home.yml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -253,6 +253,8 @@ toc:
253253
path: /docs/user-guide/ui/trip-animation-widget/
254254
- title: Widgets Library
255255
path: /docs/user-guide/ui/widget-library/
256+
- title: Advanced Settings of the Entity Table widget
257+
path: /docs/user-guide/ui/entity-table-widget/
256258
- title: Dashboards
257259
path: /docs/user-guide/ui/dashboards/
258260
- title: SMS Provider Settings
Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
---
2+
layout: docwithnav
3+
assignees:
4+
- ashvayka
5+
title: Advanced Settings of the Entities Table Widget
6+
description: Advanced Settings of the Entities Table Widget
7+
8+
---
9+
10+
* TOC
11+
{:toc}
12+
13+
## Introduction
14+
15+
Advanced Settings of the Entity Table widget allows:
16+
17+
- [Adjusting the Title of the widget](#the-table-title);
18+
- [Altering the columns](#the-column-settings);
19+
- [Setting up the pagination](#the-pagination);
20+
- [Configuring data sorting](#sorting-the-data-in-the-table-widget).
21+
22+
To enter the Advanced mode and start adjusting the settings above, you should start by clicking on the Pencil icon ("Enter edit mode") at the bottom right of the screen:
23+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/enter-the-advncd.png)
24+
25+
After, click on the Pencil icon ("Edit widget") at the upper right corner of the Entity Table widget itself:
26+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/pencil-edit-enter.png)
27+
28+
Then, go to the Advanced cell:
29+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/entitytable-advncd.png)
30+
31+
## 1. the Table Title
32+
33+
ThingsBoard doesn't have any restrictions associated with the name, both in symbols and character limit.
34+
Nevertheless, in case the title is too long, it won’t be shown completely on the Entity Table widget, but it will be finished with the three dots.
35+
However, after applying the changes and opening the widget in fullscreen mode, you will be able to see the full name of the widget.
36+
For example let’s use something simple for the title like “The Name of the Widget”.
37+
38+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/table-widgetname-advncd.png)
39+
40+
After clicking on the orange checkmark in the upper right corner, the changed title will become visible.
41+
42+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/namechanged-table-advncd.png)
43+
44+
## 2. The Columns Settings
45+
46+
These checkboxes allow you to customize the ability to search entities in the widget as well as the ability to select the columns you want to display,
47+
and the display of an entity name column.
48+
49+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/table-name-options.png)
50+
51+
### 2.1. Entity Column Title
52+
53+
You can change the title of the Column by inputting the text for it in the appropriate line:
54+
55+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/appropriate-line-clumn-title.png)
56+
57+
After clicking on the orange checkmark in the upper right corner, the changed Column Title will be seen.
58+
59+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/column-name-changed.png)
60+
61+
### 2.2. Displaying an entity label column
62+
63+
When the checkbox “Display entity label column” is checked, you are receiving an opportunity to add the label column and name it.
64+
65+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/lanelcolumn-name-input.png)
66+
67+
After clicking on the orange checkmark in the upper right corner, the label column with the custom name will appear in the widget.
68+
69+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/labelcolumn-added.png)
70+
71+
### 2.3. Displaying an entity type column
72+
73+
The checkbox "Displaying entity type column" is responsible for appearing/hiding the appropriate column.
74+
The Entity type column is shown by default, but you can disable this feature by unchecking the box, therefore it will be hidden.
75+
To apply changes click on the orange checkmark in the upper right corner.
76+
77+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/entitytypecolumn-notabletosee.png)
78+
79+
## 3. The Pagination
80+
81+
By default, the Widget shows how many items per page can be visible and how many pages there are in general.
82+
The displaying of this information is optional. It changes by checking/unchecking the box called “Display pagination”.
83+
If the box will be unchecked the information about items per page and number of pages won’t be displayed.
84+
To apply the changes click on the orange checkmark in the upper right corner.
85+
86+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/paggination-off.png)
87+
88+
89+
**Please, note:** to understand the next settings, we need to check the “Display pagination” box back to see the number of items per page.
90+
91+
### 3.1. The page size
92+
93+
The page size by default is set to 10 items per page.
94+
If you need to change this number you can type the digits manually or use the arrows at the end of the line to do it for you.
95+
To apply the changes click on the orange checkmark in the upper right corner. Now, there will be 15 items per page as is shown on our Table Widget.
96+
97+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/paggination15.png)
98+
99+
To apply the changes click on the orange checkmark in the upper right corner. Now, there are 15 items per page as it is shown on the Entity Table Widget.
100+
101+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/15done.png)
102+
103+
## 4. Sorting the data in the Table Widget
104+
105+
### 4.1. The default sorting order
106+
107+
The default sorting order for the data in the Table widget is ascending.
108+
If the values in the column are lowercase (for example entityName/entityType), then sorting will be done according to the rules of alphabetical order.
109+
110+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/sortingorder-name.png)
111+
112+
If you’d like to sort the data, for instance, by the telemetry data key type (temperature, humidity, etc.),
113+
you can do this by inputting the name of your value in the Default sort order line.
114+
In the example, the temperature is used, so it looks like this:
115+
116+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/temperature.png)
117+
118+
As was mentioned, the default sort order is ascending.
119+
120+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/ascendingorder.png)
121+
122+
### 4.2. The descending sorting order
123+
124+
If you need to make the sort order descending,
125+
you should type the **“-” (minus)** symbol in front of the data key name in the Default sort order line.
126+
127+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/descending-minus.png)
128+
129+
Be sure to click on the orange checkmark in the upper right corner to apply the changes to see the difference.
130+
Now, the telemetry data is sorted in the descending order we needed.
131+
132+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/descending-done.png)
133+
134+
135+
## Saving the changes
136+
137+
For the changes to be applied and saved, you necessarily need to click on the orange checkmark in the bottom right corner of the screen.
138+
139+
![image](/images/user-guide/ui/widgets/entitywidget-advanced/saving-changes.png)
140+
141+
After doing this, you can be positively sure that the changes to the Table Widget are applied and saved correctly.
142+
143+
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading

0 commit comments

Comments
 (0)