ButtonView

Źródło: views/ButtonView.js

ButtonView

Widok przycisku z obsługą akcji onClick. Podczas wywołania callMethod automatycznie pokazuje spinner i blokuje przycisk na czas trwania operacji (nasłuchuje eventów callMethod:preCall i callMethod:afterCall).

Parametry

type - Typ widoku: "button"
id - Identyfikator widoku (opcjonalne)
label [template] - Tekst przycisku
variant - Wariant Tabler: primary, secondary, success, danger, warning, info (domyślnie: primary)
outline - Czy przycisk ma być typu outline (opcjonalne)
size - Rozmiar przycisku: sm, md, lg (opcjonalne)
icon - Ikona Tabler (opcjonalne)
title [template] - Podpowiedź (tooltip) — zalecana przy przyciskach z samą ikoną
disabled - Czy przycisk jest wyłączony (opcjonalne)
onClick [template] - Akcje (lub jedna akcja) wykonywane po kliknięciu
badge - Obiekt opisujący odznakę na przycisku (opcjonalne):
- content [template] - Treść odznaki (np. liczba powiadomień)
- position - inline (domyślnie) obok etykiety lub corner w rogu przycisku
- color - Kolor odznaki, np. red, blue, green (opcjonalne)
- light - Lekka wersja koloru (klasa -lt), domyślnie false
- pill - Zaokrąglone rogi (klasa badge-pill), domyślnie false
- srText - Tekst dla czytników ekranu, np. unread messages (opcjonalne)

Dostępne akcje onClick

Pole onClick obsługuje wszystkie akcje zdefiniowane w ActionHandler. Pełna dokumentacja: Dostępne Akcje (ActionHandler)

Przykład użycia

type: button
label: Zapisz
variant: primary
icon: device-floppy
onClick:
  action: callMethod
  module: core/orders
  method: create
  withData:
    - someInput001
    - $page.somePageVar
  then:
    action: closeModal
    target: addOrderModal

Przycisk z odznaką w rogu

type: button
label: Inbox
badge:
  content: "2"
  color: red
  position: corner
  srText: nieprzeczytane wiadomości

Przycisk z odznaką inline

type: button
label: Blue badge
badge:
  content: "2"
  color: blue