Podręcznik użytkownika systemu EZD RP

Formularze EZD RP

Formularze EZD RP to narzędzie, w którym projektuje się kanwę do zbierania informacji w procesie. To drugi, obok Diagramu BPMN, kluczowy i definiujący go element składowy schematu procesu.

Wskazane jest, aby konstruowanie formularza poprzedzone zostało analizą procesu. W szczególności warto zidentyfikować: kto uczestniczy w procesie, jakich informacji potrzebują jego uczestnicy, żeby zrealizować swoje zadania, jakie są kryteria warunkujące proces (progi kwotowe, decyzje itp.), czy używane w nim dane pochodzą z innych systemów IT, zbiorów danych itp., a także które z zestawów danych są lub powinny być odłożone jako słowniki w EZD RP. Wszystkie zdiagnozowane kwestie powinny znaleźć swoje odzwierciedlenie w formularzu.

W tym artykule omówione zostały wybrane funkcje Formularzy EZD RP. Więcej informacji na temat narzędzia Form.io, w oparciu o które zbudowane są formularze, dostępnych jest na stronie mu poświęconej.

Tworzenie nowego formularza

Funkcja formularzy EZD RP jest dostępna z poziomu modułu Administracja. Po wejściu w niego należy kliknąć kafelek Procesy zewnętrzne (BPMN), a następnie Formularze.

Po wybraniu tego kafelka w nowej karcie przeglądarki internetowej otworzy się okno aplikacji. Mamy w nim możliwość utworzenia nowego formularza lub pracy nad takim, który już wcześniej został utworzony i wgrany do systemu.

Nowy formularz tworzymy, klikając przycisk Nowy lub – jeśli otrzymaliśmy go jako plik w formacie JSON – poprzez przeciągnięcie go na wyszarzone pole albo wybranie Upuść tutaj (otworzy się okno eksploratora, w którym należy odnaleźć i wskazać właściwy plik).

Tworząc nowy formularz, należy nadać mu identyfikator i nazwę. Identyfikator formularza nie może zawierać znaków specjalnych (poza „-”), spacji, polskich liter itp. W przypadku nieprawidłowej konstrukcji identyfikatora podczas próby zapisu pojawi się komunikat o błędzie.

Informacja o sukcesie w zapisie formularza (jak i o błędzie) wyświetlana jest w formie komunikatu w lewym dolnym rogu okna przeglądarki.

Zapisany obiekt dostępny jest na liście formularzy. Z tego poziomu można wejść w tryb podglądu formularza (ikona z okiem), jego edycji (ikona z kartką papieru i długopisem), pobrać go jako plik JSON (ikona ze strzałką) oraz usunąć z EZD RP (ikona kosza).

Konfiguracja formularza

Okno edycji formularza składa się z dwóch części:

  • palety dostępnych do użycia w formularzu obiektów/elementów, pogrupowanych na typy: Basic, Advanced, Layout, Data, Premium,
  • okna tworzenia formularza.

Formularz tworzymy poprzez przeciąganie obiektów z palety do okna tworzenia formularza.

Po najechaniu kursorem na obiekt ukazują się narzędzia jego edycji: możliwość edycji parametrów obiektu (1), przesuwanie obiektu/zmiana kolejności – żeby przesunąć obiekt, należy złapać go lewym przyciskiem myszy i przeciągnąć w miejsce docelowe (2), kopiowanie obiektu (3), wklejanie obiektu – uaktywnia się dopiero, gdy jakiś obiekt zostanie skopiowany (4), usuwanie obiektu (5).

Typy obiektów dostępnych do użycia w formularzach

Obiekty dostępne w zakładce Layout

Zakładka zawiera funkcje, dzięki którym możliwe jest grupowanie obiektów i tworzenie uporządkowanych sekcji formularza.

Panel – opcja grupowania obiektów z możliwością nadawania im indywidualnego stylu i tytułu na górnej belce.

Po wejściu do zakładki Display, gdy znajdujemy się w opcji Panel, dostępna jest funkcja Columns. Służy ona do ustawiania elementów w układzie kolumnowym. Podczas edycji obiektu możliwe jest m.in. skonfigurowanie liczby i rozmiaru kolumn.

Przycisk Add Column pozwala na dodawanie kolumn, umieszczony po prawej stronie przycisk ze znakiem X – na ich usuwanie, natomiast w kolumnie Width można ustawić szerokość kolumn.

Liczba wierszy to liczba kolumn – istnieje możliwość ustawienia parametrów dla każdej z nich oddzielnie.

Na grafice zaprezentowany jest efekt powyższego ustawienia wypełniony częściowo obiektami.

Obiekty dostępne w zakładce Basic

W zakładce Basic dostępne są następujące elementy:

  • Text Field – krótkie pola tekstowe. Takie obiekty dają m.in. możliwość nadawania oczekiwanego formatu zapisu (np. jako numer telefonu).

    Maski tworzy się poprzez zastąpienie cyfr znakiem 9, wszystkich liter – literą a, natomiast dowolnych znaków alfanumerycznych – znakiem *.

    Pole typu Text Field pozwala też na wprowadzenie daty. Jej format wybieramy, zmieniając opcję Widget.

    W widoku formularza po kliknięciu pola z ikoną kalendarza pojawi możliwość szybkiego wskazania szukanej daty. Wyświetlony w polu Text Field zapis będzie zestandaryzowany.

  • Text Area – pole służące do wpisywania dłuższych wypowiedzi, uzasadnień, wyjaśnień itp.
  • Checkbox – pole oparte o logikę prawda – fałsz, do łatwego „odhaczania” przez użytkownika procesu.
  • Select – pole wyboru z listy rozwijanej, dostępny bogaty pakiet opcji, m.in. możliwość wielokrotnego wyboru oraz ustawienia różnych źródeł danych (więcej informacji w podrozdziale Data).
  • Radio – pole zapewniające możliwość jednokrotnego wyboru z listy poprzez zaznaczenie/odznaczenie „okienka”.
  • Button – obiekt umożliwiający m.in. wykonywanie akcji na formularzu. Domyślnie na formularzu pojawiają się dwa przyciski: Sprawdź (sprawdza spełnienie ustawionych wymagalności formularza) i Zapisz (wywołuje możliwość zapisu wersji roboczej bądź przekazania dalej), warunkiem jest brak wstawienia przez projektanta obiektu Button. Gdy na formularzu pojawi się ten obiekt – domyślne przyciski są dezaktywowane.

Obiekty dostępne w zakładce EZD RP

Zakładka gromadzi predefiniowane, specyficzne dla EZD RP obiekty (będzie sukcesywnie rozbudowywana o nowe pozycje). Są w niej dostępne astępujące elementy:

  • Użytkownik EZD-RP – specyficzne dla EZD RP pole formularza, dzięki któremu możliwe jest automatyczne podczytywanie wybranego użytkownika EZD RP. Wymagane jest wpisanie w polu wyboru co najmniej 3 znaków, a poniżej wyświetlą się propozycje użytkowników spełniających zadane kryterium. Wyboru dokonuje się poprzez zaznaczenie pasującego wariantu.
  • EZDRP Powiąż sprawę – pole zapewniające możliwość jednokrotnego wyboru z listy poprzez zaznaczenie/odznaczenie „okienka”.

Obiekty dostępne w zakładce Advanced

W zakładce Advanced dostępne są następujące elementy:

  • Date/Time – pole służące do operacji związanych z datami i godzinami. Zapewnia bardzo szerokie możliwości konfiguracyjne. Pozwala m.in. na ustawienie formatu wyświetlania daty/godziny.

    Dostępna jest też opcja włączenia/wyłączenia zakresu godzinowego (analogicznie w zakładce Date możliwe jest włączenie/wyłączenie zakresu dat). W zakładce Time można ustawić 12- lub 24-godzinny format danych. Należy w tym celu zaznaczyć pole wyboru przy opcji Enable Time Input.
  • Currency – pole obsługujące wartości walutowe. Dostępna jest opcja wyboru symbolu waluty.

Obiekty dostępne w zakładce Data

W zakładce Data można skorzystać z funkcji Data Grid. Jest to zaawansowane pole umożliwiające użytkownikom dynamiczne dodawanie kolejnych wierszy danych, zgodnie z zapotrzebowaniem.

W powyższym przykładzie pole typu Data Grid zostało wykorzystane do ewentualnej rozbudowy formularza zakupowego, zgodnie z zapotrzebowaniem na kolejne kryteria oceny ofert. Użytkownik ma możliwość dodawania kryteriów za pomocą przycisku Dodaj kolejne kryterium, usuwania ich przy pomocy znajdującej się po prawej stronie ikony ze znakiem X, możliwe jest też automatyczne sumowanie wartości z pól zawartych w Data Grid poprzez utworzenie kalkulacji w odrębnym polu.

Parametry pól

Po prawej stronie okna widoczny jest element o nazwie Preview – można tam zobaczyć podgląd efektów dokonywanych zmian.

Wyświetlane w górnej części okna zakładki Display, Data, Validation, API, Conditional, Logic służą natomiast do określania parametrów poszczególnych pól. Poniżej znajdują się informacje, jakie parametry można skonfigurować w każdej z nich.

Parametry dostępne w zakładce Display

W zakładce Display można ustawić następujące parametry:

  • Title – nazwa panelu;
  • Theme – style wyświetlania/kolor panelu;
  • Label – nagłówek obiektu;
  • Description – dodatkowy opis obiektu widoczny pod nim, np. podpowiedź dla użytkownika, informacja o oczekiwanym formacie daty itp.;
  • Tooltip – dodatkowy, ukryty opis obiektu umieszczony pod znacznikiem, np. podpowiedź dla użytkownika, informacja o oczekiwanym formacie daty itp.;
  • Hidden – ukrywanie pola z widoku;
  • Hide Label – ukrywanie nagłówka obiektu z widoku;
  • Disabled – blokowanie edycji obiektu przez użytkowników.
  • CSS – klasy CSS nie są zaimplementowane ze względów wydajnościowych, w związku z tym przygotowano dedykowane rozwiązanie do zarządzania kolorami. Możliwość dostosowania kolorów panelu, przycisków itp. obejmuje edycję tła oraz koloru czcionki tekstu. Kolory należy definiować za pomocą wartości RGB, gdzie wartość 0 oznacza brak udziału danej barwy, a 10 to pełne wysycenie. Wartości RGB należy wprowadzić zgodnie ze schematem zapisu widocznym w poniższym oknie (Custom CSS Class):

    Przykłady zastosowania:



    Ustawiona klasa CSS jest nadrzędna względem ustawionego theme (z theme pozostaje ramka w wybranym formacie)

Parametry dostępne w zakładce Data

W zakładce Data można ustawić następujące parametry:

  • Multiple Values – opcja wielokrotnego wyboru z list lub możliwości wprowadzania wielu wartości w pole;
  • Default Value – wartość domyślna pola;
  • Data Source Type – wskazanie źródła danych.

    Przykłady:

    1. Values – wartości zdefiniowane w obrębie danego pola (za pomocą przycisku Add another można dodać pozycję do listy, za pomocą ikony ze znakiem X usunąć ją z listy, wyświetlany też jest podgląd listy);

    2. URL – możliwość integracji z zewnętrznymi źródłami danych;
    3. Raw JSON – wykorzystanie wartości słownikowych (więcej informacji znajduje się w podrozdziale pt. API).

  • Calculated Value – możliwość ustawienia wartości pola zgodnie z kalkulacją opisaną JavaScript.

    Przykłady:

    1. Pole stanowiące wynik działania arytmetycznego.

    Na zaprezentowanym przykładzie zwracana wartość stanowi połowę wartości określonej w innym polu o nazwie API wartosc1.

    2. Pole przybiera wartość ID bieżącego zadania, na którym jest proces (User Task) – przydatne np. do tworzenia warunków edycji i widoczności pól.

    W zakładce API należy również nadać odpowiednią nazwę.

  • Specyficzne dla EZD-RP, Wyszukuj tylko pracowników tej samej jednostki – aktywne dla obiektu Użytkownik EZD-RP, możliwość ograniczenia wyświetlanych propozycji użytkowników EZD RP wyłącznie do pracowników komórki organizacyjnej właściwej dla bieżącego użytkownika procesu.

Parametry dostępne w zakładce Validation

W zakładce Validation można ustawić następujące parametry:

  • Required – ustawienie wymagalności pola;
  • Minimum/Maximum Length – ustawienie ograniczenia liczby znaków;
  • Error Label – ustawienie komunikatu o błędzie.

Parametry dostępne w zakładce API

Moduł procesowości działa w oparciu o wymianę danych z usługami API, zatem ważne, żeby nadawać obiektom unikalne nazwy API, które potem będą używane w innych elementach modułu.

Property Name – nazwa, po której następuje połączenie obiektów z formularza z obiektami innych elementów procesowości, np. z danymi zdefiniowanymi w słowniku czy warunkami na diagramie.

Przykłady zastosowania:

1. Automatyczne podczytanie użytkownika EZD RP, który jest wnioskującym.
Aby dodać pole do wyboru/wskazania osoby, która jest użytkownikiem EZD RP, należy wykorzystać typ pola Użytkownik EZD-RP z zakładki Advanced.

2. Wykorzystanie wartości słownikowych.
Wartości słownikowe można wykorzystać w obiekcie formularza (np. Select, Radio) dzięki usłudze API. W zakładce API definiuje się słownik, który będzie wykorzystywany przez formularz. Ponieważ API zwraca dane w formacie JSON, w zakładce Data należy dodatkowo skonfigurować odpowiednie parametry dostarczanych informacji.


Taka konfiguracja zapewnia uwidocznienie wybranej pozycji słownikowej w rejestrze (o ile taki jest założony i zmienna słownikowa z formularza jest przechwytywana do niego).

3. Odłożenie akcji dotyczącej wniosku w historii.
W historii procesu można uzyskać wpis odzwierciedlający podjętą przez użytkownika akcję (np. podjęcie decyzji poprzez wybór odpowiedniej wartości z listy słownikowej).

W tym celu należy przypisać polu z formularza pole akcji z historii w zakładce API w sekcji Custom Properties komponentu (ustawienie klucza ezdrp-history-key o wartości nazwaAkcji).

Parametry dostępne w zakładce Conditional

W zakładce Conditional można wykorzystać parametr Simple. Jest to możliwość ustawienia dynamicznego wyświetlania obiektów w uzależnieniu od wartości innego pola formularza.

Uwidacznianie uzyskuje się poprzez określenie warunku logicznego. W polu This component should be Display określa się, czy obiekt ma być wyświetlany (tak/nie). W polu When the form component wskazuje się obiekt, od którego ma być uzależnione wyświetlanie innego obiektu. W polu Has the value określa się oczekiwaną wartość obiektu, od którego uzależniamy wykonanie warunku.

Parametry dostępne w zakładce Logic

W zakładce Logic można ustawić parametr Advanced Logic. Służy on do tworzenia dynamicznych ustawień formularza uzależnionych np. od wartości pól czy od realizacji danego zadania użytkownika (User Task).

Przycisk Add Logic służy do dodawania nowej logiki, przycisk Edit do edycji już istniejącej, natomiast Delete – do usuwania.

W obrębie logiki poza warunkiem logicznym stanowiącym wyzwalacz dla działania ustawia się akcję, czyli działanie, jakiego wykonania oczekujemy. Zostało to zilustrowane na grafikach znajdujących się przy poniższych przykładach.

Przykłady:

1. Uzależnienie możliwości edycji panelu od realizacji danego zadania użytkownika (User Task).

W zakładce Display panel ma ustawioną edytowalność na zablokowaną (Disabled), zatem opisana tu logika i przypisana jej akcja polega na utworzeniu wyjątku dla tej sytuacji – edycja panelu możliwa jest, gdy ID User Task = Activity_1cc9ih9.

W tym przykładzie wykorzystano prostą (Simple) metodę tworzenia logiki.

2. Uzależnienie widoczności obiektu od złożonych kryteriów.

W tym przykładzie wykorzystano metodę tworzenia logiki poprzez opisanie kryteriów w JavaScript. Analogicznie jak w przykładzie wyżej akcja polega na obsłudze wyjątku – panel domyślnie ma ustawioną widoczność na ukryty, jednak w sytuacji gdy w polu decyzyjnym zostanie wybrana odpowiednia wartość (wniosek zaakceptowany) i również kwota zamówienia będzie miała odpowiednią wartość, w przypadku trzech aktywnych zadań użytkownika zostanie on uwidoczniony.

3. Wykonanie zmiany wartości pola w zależności od aktywnego zadania użytkownika.

Przykładowa logika ma zastosowanie w przypadku zwrotu wniosku po błędnej dekretacji – gdy wniosek wraca do zadania użytkownika dekretującego, konieczne jest automatyczne „odkliknięcie” pola wyboru o nazwie API zwrotDoKierPZIZ, tak, aby użytkownik mógł ponownie zadekretować dokument.