Tabela

Kliknij, aby skopiować

Element do wyświetlania rekordów z bazy danych


Ustawienie początkowe:

Model - model danych dla tabeli.
Endpoint - źródło danych dla tabeli.

table config


Ustawienia Look and Feel:

Title (nieobowiązkowe) - tytuł tabeli.

Width (obowiązkowo) - szerokość tabeli.

Style (obowiązkowo) - rozmiar wiersza tabeli.

Pagination (obowiązkowy) - włączanie i wyłączanie paginacji. Domyślnie włączona.

Page size (nie obowiązkowe) - wiersze na stronę.

Border (obowiązkowy) - obramowanie tabeli.

Name (obowiązkowy) - nazwa tabeli.

Visible (obowiązkowy) - sprawia, że tabela jest widoczna, jeśli jest włączona. Włączone domyślnie.

Table


Dane:

W tej sekcji możesz zarządzać kolumnami tabeli.

Table Data Settings


Wyzwalacze przepływu pracy:

  • onCreate - odpala się, gdy komponent jest tworzony na stronie;
  • onShow - wywołuje się, gdy komponent zmienia swój stan na widoczny (wyświetlany na stronie);
  • onHide - zostanie wywołany, gdy komponent zmieni swój stan na ukryty (przestanie być wyświetlany na stronie);
  • onDestroy - odpala się, gdy komponent jest niszczony;
  • onDataUpdate - odpala się przez blok Aktualizacja danych tabeli;
  • onRowClick - odpala się po kliknięciu na wiersz;
  • onRowDoubleClick - zostanie wywołany przez podwójne kliknięcie na wierszu;
  • onFilter - wywołuje się, gdy tabela jest paginowana;

Component Actions:

Table Get properties

Pobiera właściwości tabeli.

Parametrywejściowe :

  • Component Id [string] - identyfikator komponentu tabeli.

Parametrywyjściowe :

  • Title [string] - tytuł tabeli;
  • Style [enum] - styl tabeli;
  • Pagination [boolean] - stan paginacji;
  • Bordered [boolean] - stan obramowania;
  • Visible [boolean] - stan widoczności;
  • Loading [boolean] - stan załadowania;
  • Current page [integer] - bieżąca strona tabeli;
  • Records per page [integer] - liczba rekordów na stronie tabeli;
  • Total records [integer] - całkowita liczba rekordów w tabeli.

Table Get Properties

Table Set Properties

Ustawia właściwości tabeli.

Parametrywejściowe :

  • Component Id [string] - identyfikator komponentu tabeli;
  • Title [string] - tytuł tabeli;
  • Style [enum] - styl tabeli;
  • Pagination [boolean] - stan paginacji;
  • Bordered [boolean] - stan obramowania;
  • Visible [boolean] - stan widoczności;
  • Loading [boolean] - stan załadowania;
  • Current page [integer] - bieżąca strona tabeli;
  • Records per page [integer] - liczba rekordów na stronie tabeli;
  • Total records [integer] - całkowita liczba rekordów w tabeli.

Table Set Properties


Table Update Properties

Aktualizuje właściwości tabeli.

Parametrywejściowe :

  • Component Id [string] - identyfikator komponentu tabeli;
  • Title [string] - tytuł tabeli;
  • Style [enum] - styl tabeli;
  • Pagination [boolean] - stan paginacji;
  • Bordered [boolean] - stan obramowania;
  • Visible [boolean] - stan widoczności;
  • Loading [boolean] - stan załadowania;
  • Current page [integer] - bieżąca strona tabeli;
  • Records per page [integer] - liczba rekordów na stronie tabeli;
  • Total records [integer] - całkowita liczba rekordów w tabeli.


Table Update Properties

Table Get Data

Pobiera dane tabeli.

Parametrywejściowe :

  • Component Id [string] - identyfikator komponentu tabeli.

Parametrywyjściowe :

  • Records [integer] - liczba rekordów w tabeli;
  • Data [model] - dane z tabeli. Do pokazania w procesie biznesowym, gdy określony jest tylko identyfikator komponentu;


Table Get Data

Table Update Data

Uaktualnij dane tabeli

Parametrywejściowe :

  • Data [model] - dane z tabeli. Do pokazania w procesie biznesowym, gdy określony jest tylko ID komponentu;
  • Component Id [string] - identyfikator komponentu tabeli.
  • Total Records [integer] - liczba rekordów w tabeli.
  • _limit [integer] - maksymalna możliwa ilość wpisów w tabeli;
  • _offset [integer] - przesunięcie bieżącego rekordu względem pierwszego rekordu.

Table Update Data

Table Clear Data

Wyczyść dane tabeli

Parametrywejściowe :

  • Component Id [string] - Identyfikator komponentu tabeli.

Table Clear Data


Przykład użycia:

Getting data for a table

Advanced table design