Cards

Role-based access to your data 🃏
Component demo​
Purposes of the component
Display data;
Edit data (posting objects via multiple API-endpoints);
Support role-based access control.
Component Settings sections
​General. Settings like API-endpoint, title, page size.
​List. Settings of the list appearance view.
​Object. Settings of the object view.
​Actions. Settings of the component actions.
General cards view 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);
List appearance settings
Example of a grid view cards with picture (on the left option) and counter
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.
Card colour. Choose the field type of colour. There are following options of colouring the card:
No colouring;
Stripe on the left side;
Border;
Fill the whole card.
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).
Object view settings
Example of a card with two tabs and an action (form)
Here you can organise the fields in an object card using Tabs (Sections), fields order and fields settings.
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:
Example of a Card with fields available for writing
Remember, that you have to include ID field available both for reading and writing to make the object editable
Actions
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.
Automatic fields mapping
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)
Conditionals
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). You can list several roles (e.g. role1,role2), and if the user has at least one of them, conditional returns true.
Object field equals to a particular constant 
Linked object field equals to a particular constant — for actions called from linked cards.
 
Form
Table
Last modified 2yr ago