Component demo
Display data;
Edit data (posting objects via multiple API-endpoints);
Support role-based access control.
General. Settings like API-endpoint, title, page size or Hidden flag.
List. Settings of the list appearance view.
Object. Settings of the object view.
Actions. Settings of the component actions.
Remember, that you have to click Save button to update the component settings.
API-endpoint. (Main one) That defines the objects to display in the component. There could be additional API-endpoints for posting objects via Actions
List title;
Page size (10 by default);
Card header. You can't choose the header from here, because throughout the system the structure visible name plays role of the object title. You can configure it from data structure configuration.
Card header comment. The subheader in the card. Any field (available for reading in API-endpoint) type of string, number, email, date, link, arrayLink.
Card text. The text in the card. Any field (available for reading in API-endpoint) type of string, number, email.
Show counter on the card (OFF
by default).
Counter field (type of number);
Counter text (e.g. 5 requests)
Layout: grid
view or list
view (grid
by default).
Include picture to the card (OFF
by default).
Picture URL (if you turn ON
the option of including picture to the card). Any field type of file, available for reading.
Place to display the picture in the card:
No picture;
On the left (the option picture size is available);
On the top (the option picture size is available);
On the left, circled (the option picture size is available);
As a background.
Picture size (100px
by default).
Here you can organise the fields in an object card using Tabs, fields order and fields settings.
Settings depend on the field type:
string
display as:
plain text,
markdown,
hint (coloured text box)
alarm color (orange)
OK color (green)
error colour (red)
web-link
link text (optional)
file
display as a picture
picture form: circle or square;
picture size
json
the same as in Form
date
date only
date + time
link/arrayLink
clickable objects (only at the first level of cards);
linked card header (in addition to an object visible name)
configuring linked card fields.
quick search option (for fields available for writing). Same mechanism as in Form
A field can be one of these:
Read only
Write only
Read and write
Those options depend on your API-endpoint details. If there are fields available for writing, the user will se them as inputs and will be able to edit and save them:
Remember, that you have to include ID
field available both for reading and writing to make the object editable
Using Actions you can:
Update current object
Update linked objects
Create new objects
There are two types of actions:
Button (if it uses the main API-endpoint, it can be included into dropdown menu)
Form
You also can turn on closing a popup when performing an action.
Hint: use synchronic scenarios and option 'Close popup at clicking' if you want your data be updated online.
Next, you choose an API-endpoint for writing data. It can be main one, or the other. You will choose fields from that API-endpoint (available for writing) setting up form and automatic mapping.
And you can choose wether to call action from main object card or from linked object card.
On the left side we choose fields to be filled (from chosen API-endpoint).
On the right side we choose one of the following options:
Constant. (e.g. true
or 12
)
Object card. Fields from object we've opened.
User ID. If user is authorised. Remember, you can make users log in for accessing the page.
Linked card. Fields from linked object. Available only if we put action in the linked card (link or arrayLink field)
The actions may be conditionally displayed depending on user role or current field values.
There are following options for conditionals:
User's ID
equals a constant value;
User's ID
equals to object field value (or to linked object field value, if an action is called from it);
User role
contains some value (e.g. role = admin,manager
contains admin
)
Object field
equals to a particular constant
Linked object field
equals to a particular constant
— for actions called from linked cards.