Procesní stepper

Procesní stepper zobrazující kroky procesu a aktuální stav položky.

Popis widgetu `stepper`

Procesní stepper ukazuje kroky procesu (například Návrh, Ke schválení, Schváleno, Dokončeno) a zvýrazní, ve kterém kroku se položka právě nachází. Aktuální krok se určuje podle hodnoty jednoho sloupce, nejčastěji výběru. Widget jen zobrazuje: stav nemění. Změnu stavu zajistí uživatel v poli nebo vlastní tlačítko. Je to virtuální widget, neukládá se do položky.

Nastavení widgetu Ukazatel procesu: řídicí sloupec stavu, orientace, nadpis a seznam kroků s popiskem a hodnotou

Přidání do formuláře

Na kartě Widgety vyberte Ukazatel procesu a přetáhněte ho do sekce.
V inspektoru zvolte Řídicí sloupec stavu.
Klikněte na Načíst kroky z voleb, aby se kroky vytvořily z voleb sloupce, nebo je přidejte ručně tlačítkem + Krok.

Nový widget obsahuje čtyři ukázkové kroky (Návrh, Ke schválení, Schváleno, Dokončeno) a je přes celou šířku sekce.

Nastavení v inspektoru

Volba	Vlastnost	Význam	Výchozí
Řídicí sloupec stavu	`stepperConfig.sourceField`	Interní název pole, podle jehož hodnoty se určuje aktuální krok. Nabízejí se pole typu text, výběr, vyhledávání, číslo a metadata (bez widgetů).	nevybráno
Načíst kroky z voleb (n)	`stepperConfig.steps`	Tlačítko, které nahradí všechny kroky volbami vybraného pole (popisek i hodnota = text volby). Zobrazí se, když pole má volby.
Orientace ukazatele	`stepperConfig.orientation`	`horizontal` (Horizontální) nebo `vertical` (Vertikální).	`horizontal`
Nadpis nad ukazatelem	`stepperConfig.title`	Volitelný nadpis, podporuje placeholdery, například `Průběh: [Title]`.	prázdný
Kroky	`stepperConfig.steps[]`	Seznam kroků. Každý má Popisek (`label`, text u bodu) a Hodnotu (`value`, hodnota sloupce odpovídající kroku). Prázdná hodnota znamená, že se porovnává popisek. Krok lze odebrat, přidat tlačítkem + Krok.	4 ukázkové kroky
Klikací kroky	`stepperConfig.interactive`	V režimu Úprava a Nový klik na krok zapíše jeho hodnotu (`value`, jinak `label`) do řídicího sloupce a označí formulář jako změněný. Změna se neukládá automaticky, uložíte ji běžně tlačítkem Uložit. V režimu zobrazení, u řídicího sloupce jen pro čtení (pravidlo `setReadOnly`, oprávnění, nenačtené pole) ani u samotného steppera jen pro čtení kroky klikací nejsou. Kroky jsou tlačítka ovladatelná klávesnicí (Tab, Enter, mezerník), aktuální krok má `aria-current`.	vypnuto
Vyžadovat potvrzení	`stepperConfig.confirmStepChange`, `stepperConfig.confirmMessage`	Před změnou kroku se zobrazí dialog s tlačítky Potvrdit a Zrušit. Text lze zadat (`{step}` se nahradí popiskem cílového kroku, text je překládatelný), jinak se použije výchozí „Změnit stav na „…“?“.	vypnuto
Šířka v sekci, Viditelné	`colSpan`, `defaultVisible`	Společné volby všech widgetů.	12, ano

Chování za běhu

Aktuální krok je ten, jehož value (nebo label, když je value prázdná) se shoduje s hodnotou řídicího pole. Porovnání nerozlišuje velká a malá písmena a ignoruje mezery na okrajích.
Dokončené kroky (před aktuálním) jsou zelené, aktuální je zvýrazněný modrým kroužkem, další jsou šedé. Spojnice mezi dokončenými kroky je zelená.
U pole typu výběr se porovnává text vybrané volby, u vyhledávání a metadat jejich popisek (případně ID).
Když hodnota žádnému kroku neodpovídá nebo je pole prázdné, všechny kroky jsou šedé.
Stepper reaguje živě: po změně pole ve formuláři se okamžitě přepne, bez uložení. Ve všech režimech (Nový, Úprava, Zobrazení) se chová stejně.
Bez kroků zobrazí widget nápovědu, že mají být kroky v nastavení přidány.

Překlady textů

Přeložit lze customLabel, stepperTitle, stepperConfirmMessage a popisky kroků v stepperSteps (klíčem je id kroku, hodnotou text nebo objekt s label). Hodnota kroku (value) se nepřekládá, protože se porovnává s daty. Viz Překlady a vícejazyčnost.

Pravidla a skripty

setVisible: zobrazí nebo skryje stepper.
Stav posouvejte měnící se hodnotou řídicího pole: pravidlem setValue, tlačítkem s akcí setValue nebo skriptem. Stepper se přepne sám.

Dva stepery vedle sebe, horizontální a vertikální, se třetím krokem jako aktuálním. Dokončené kroky zelené, aktuální modrý, ostatní šedé

Příklad konfigurace (JSON)

{
  "internalName": "widget_stepper_stav",
  "customLabel": "Průběh schvalování",
  "fieldType": "stepper",
  "colSpan": 12,
  "defaultVisible": true,
  "stepperConfig": {
    "sourceField": "Stav",
    "title": "Žádost: [Title]",
    "orientation": "horizontal",
    "steps": [
      { "id": "step_1", "label": "Návrh", "value": "Návrh" },
      { "id": "step_2", "label": "Ke schválení", "value": "Ke schválení" },
      { "id": "step_3", "label": "Schváleno", "value": "Schváleno" },
      { "id": "step_4", "label": "Dokončeno", "value": "Dokončeno" }
    ]
  }
}

Pole Stav je přitom běžné pole typu výběr s týmiž hodnotami.

Omezení a tipy

Kroky jsou jen lineární: widget neumí větvení ani vracení. Zamítnutou položku vyjádříte stavem, který žádný krok nemá, nebo samostatným bannerem.
Ve výchozím stavu stepper není ovládací prvek: kliknutím na krok stav neměníte. Zapněte Klikací kroky, pokud mají uživatelé stav posouvat přímo ve stepperu.
Klikací kroky fungují jen tehdy, když je řídicí sloupec ve formuláři editovatelný (od 1.32.0): sloupec musí být v rozložení aktuálního režimu (s ohledem na rozložení podle režimu; skrytý sloupec nevadí), nesmí mít v nastavení pole zapnuté Jen pro čtení (pokud ho pravidlo neodemkne) a nesmí být jen pro čtení v SharePointu (počítaný, systémový nebo nepodporovaný sloupec). Jinak se kroky zobrazí jen ke čtení. Návrhář na to upozorní v nastavení steppera.
Po přejmenování volby ve sloupci seznamu upravte i value kroku. Jinak se krok přestane shodovat. Tlačítkem Načíst kroky z voleb kroky vytvoříte znovu (přepíše ruční úpravy).
Ve vertikální variantě se hodí užší sekce, v horizontální při více než šesti krocích zkraťte popisky.