# Właściwości formularza

Zakładka **Właściwości** umożliwia konfigurację parametrów dotyczących zachowania, wyglądu i interakcji formularza w czasie jego działania.\
Parametry te wpływają na to, jak formularz jest prezentowany użytkownikowi, w jaki sposób komunikuje się z usługami oraz jakie elementy interfejsu są widoczne. Właściwości są pogrupowane w sekcje tematyczne.

![Ilustracja 1. Wygląd zakładki "Właściwości"](/files/b5c9879381ed29913fe0bf13098b5da7e5a2222b)

## **Sekcja "Ogólne"**

### **Opis wniosku**

Pole tekstowe pozwalające na dodanie krótkiego opisu lub komentarza do projektu formularza. Opis ten nie jest prezentowany użytkownikowi końcowemu, ale ułatwia identyfikację w repozytorium i w pracy zespołowej.

### **Serwisy wejścia**

W sekcji tej znajduje się lista usług, które są podpięte na wniosku jako serwisy startowe. Usługi te uruchomią się na początku życia wniosku, jeśli warunek aktywności jest spełniony. Usługi wejścia wykonywane są sekwencyjnie, zgodnie z kolejnością na liście. W trybie edycji istnieje możliwość dodania i usunięcia serwisu wejścia oraz zdefiniowania warunku uruchomienia usługi.

<figure><img src="/files/plhOJ0E9ZPtDQlj5h6t1" alt=""><figcaption><p><em><strong>Ilustracja 2.</strong> Sekcja "Serwisy wejścia" z dodanymi usługami</em></p></figcaption></figure>

### **Serwisy mapujące parametry wejścia**

{% hint style="info" %}
Dostępność funkcjonalności zależy od licencji i może nie być dostępna we wszystkich wdrożeniach.
{% endhint %}

Sekcja **Serwisy mapujące parametry wejścia** umożliwia podłączenie usług, których zadaniem jest **zasilenie pól formularza** danymi jeszcze przed jego uruchomieniem.\
Serwisy te uruchamiane są automatycznie **przy wejściu na wniosek** - zarówno podczas standardowego otwarcia formularza, jak i w przypadku jego **odparkowania** (wznowienia sesji).

Dzięki tym usługom można np. przekazać dane klienta z systemu zewnętrznego, ustawić wartości startowe pól lub otworzyć wniosek na określonej stronie.

#### **Cechy charakterystyczne serwisów mapujących**

* nie posiadają **parametrów wyjściowych**,
* wynik działania serwisu jest **bezpośrednio mapowany na pola formularza lub zmienne sesyjne**,
* mogą określać stronę, na której formularz ma się otworzyć,
* wykonują się **zawsze jako pierwsze** - jeszcze przed serwisami wejścia.

#### Przykład implementacji (ServiceProxy)

W celu zasilenia pola należy w usłudze zwrócić w mapie klucz, który będzie posiadał identyfikator pola na wniosku oraz wartość, która zostanie mu przypisana. Nie należy definiować **outputFields** dla pól zwracanych z metody callService(). Aby otworzyć wniosek na określonej stronie należy przekazać do wyjściowej mapy zmienną ***recentlyRequestedPageMid*** i przekazać do niej mid odpowiedniej strony.

{% code expandable="true" %}

```java
@Component
@Service(AbstractServiceProxy.class)
public class DemoMappingEntryService extends AbstractServiceProxy {

    private final static String TEXT_FIELD = "GesComplexComponent1.GesTextField1";
    private final static String PAGE_MID = "_recentlyRequestedPageMid";

    public DemoMappingEntryService() {
        this.name = "DemoMappingEntryService";
        this.description = "For test purposes ONLY!";
    }

    @Override
    public List<Map<String, String>> callService(Map<String, List<String>> map)
            throws ServiceProxyException {
        return Collections.singletonList(ImmutableMap.of(
                TEXT_FIELD, "Wartość przekazana z usługi DemoMappingEntryService",
                PAGE_MID, "Page2"));
    }
}

```

{% endcode %}

{% hint style="info" %}
Wniosek demo: demoSerwisMapujacyParametryWejscia
{% endhint %}

### **Serwisy wyjścia**

W sekcji tej znajduje się lista usług, które są podpięte na wniosku jako serwisy końcowe. Serwisy te uruchomią się przed końcem życia wniosku, jeśli warunek aktywności jest spełniony.

### **Statystyki**

W tej sekcji znajdują się opcje związane ze zbieraniem statystyk z wniosku. Dla każdego wniosku istnieje możliwość określenia, które statystyki mają być zbierane oraz z jaką częstotliwością.

#### Statystyki zewnętrzne

Dodatkowo w sekcji Statystyki można włączyć zrzucanie statystyk Google Tag Manager. O samej funkcjonalności można przeczytać w dokumentacji GTM: [Statystyki GTM](/budowanie-aplikacji/interfejs-uzytkownika/formularze/tworzenie-formularza/statystyki-gtm.md).

## **Sekcja "Wygląd"**

Sekcja ta odpowiada za konfigurację elementów interfejsu widocznych w trakcie wypełniania wniosku.

### **Panel boczny i dolny**

{% hint style="info" %}
Dostępność funkcjonalności zależy od licencji i może nie być dostępna we wszystkich wdrożeniach.
{% endhint %}

Pozwala włączyć lub wyłączyć widoczność dodatkowych paneli (np. menu bocznego z informacjami, powiadomieniami lub blokami treści). Panele mogą być wykorzystywane do prezentowania przydatnych linków czy elementów cross-sell.

Do paneli można podpinać artefakty typu [Treść (TextContent)](https://github.com/Consdata/eximee-docs/blob/main/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/tresc-textcontent/README.md), wybierane z repozytorium. Edycja panela (dodania warunku widoczności, nasłuchiwań, stylów czy wybranie slotu) wymaga kliknięcia ikony ołówka, a zapisanie zmian kliknięcia symbolu zapisu. O położeniu dodanej treści decyduje opcja **Slot**. Panele pozwalają na zdefiniowanie wielu treści, które będą wyświetlane jedna pod drugą.

<figure><img src="/files/CtWL5E1HB5cM1Y5QT4Un" alt=""><figcaption><p><em><strong>Ilustracja 3</strong></em><strong>.</strong> <em>Panel boczny i dolny - przykład definiowania treści</em></p></figcaption></figure>

<figure><img src="/files/3K0fnjoZFzZy07KIJ6kl" alt=""><figcaption><p><em><strong>Ilustracja 4.</strong> Przykładowy wygląd panelu bocznego na wniosku</em></p></figcaption></figure>

Treść panelu dolnego jest określana przez ustawienie opcji Slot na odpowiednią wartość, która jest zależna od wdrożenia.

<figure><img src="/files/PpdOgJQDwePYbLZojKOJ" alt=""><figcaption><p><em><strong>Ilustracja 5</strong></em><strong>.</strong> <em>Przykładowy wygląd panelu dolnego na wniosku</em></p></figcaption></figure>

### **Widoczność kroków**

Kontroluje wyświetlanie górnego poziomego paska postępu (tzw. [kroków formularza](/budowanie-aplikacji/interfejs-uzytkownika/formularze/tworzenie-formularza/kroki-i-strony-formularza.md)). Jego ukrycie może być stosowane we wnioskach jednostronicowych lub uproszczonych procesach.

W sekcji można określić warunek widoczności belki kroków oraz wskazać elementy, które wzbudzają tę zmianę (tzw. nasłuchiwanie na elementy).

<figure><img src="/files/hYGyuD1740sjgmHHIvVx" alt=""><figcaption><p><em><strong>Ilustracja 6</strong></em><strong>.</strong> <em>Przykład zdefiniowanego warunku</em> <em>widoczności belki kroków</em></p></figcaption></figure>

<figure><img src="/files/UHTW5sa56hODOPAmAEvH" alt=""><figcaption><p><em><strong>Ilustracja 7</strong></em><strong>.</strong> <em>Przykład kroków na wniosku</em></p></figcaption></figure>

### **Widoczność paska/przycisku nawigacji**

**Widoczność paska nawigacji** umożliwia określenie, czy dolny pasek nawigacyjny (z przyciskami Cofnij/Dalej/Wyślij) ma być widoczny. Natomiast w sekcji **Widoczność przycisku nawigacji** określa się tylko warunek pokazywania przycisku Dalej/Wyślij. W obu sekcjach należy też pamiętać o wskazaniu elementów wzbudzających daną zmianę (tzw. nasłuchiwanie).

<figure><img src="/files/fn2MN0aFyIQMOUm3b4d3" alt=""><figcaption><p><em><strong>Ilustracja 8.</strong></em> <em>Sekcja</em> "<em>Widoczność przycisku nawigacji"</em></p></figcaption></figure>

{% hint style="warning" %}
Zmienna currentPageId nie jest obsługiwana. Dla poprawnego działania widoczności przycisku nawigacji powinna zostać użyta zmienna currentPageMid
{% endhint %}

### **Widoczność dodatkowego elementu nagłówka**

{% hint style="info" %}
Dostępność funkcjonalności zależy od licencji i może nie być dostępna we wszystkich wdrożeniach.
{% endhint %}

Umożliwia wyświetlania dodatkowego elementu na pierwszej pozycji nagłówka strony (np. ikony, przycisku propagującego akcję). Rodzaj wyświetlanego elementu może się różnić w zależności od wdrożenia i nie jest gwarantowane jego wystąpienie we wszystkich implementacjach.

### **Bottom Bar**

{% hint style="info" %}
Dostępność funkcjonalności zależy od licencji i może nie być dostępna we wszystkich wdrożeniach.
{% endhint %}

Decyduje o tym czy stopka formularza ma być prezentowana użytkownikowi. Może być ukryta warunkowo – np. na stronach z informacjami lub podsumowaniem.

### **Panic Button (FAB)**

{% hint style="info" %}
Dostępność funkcjonalności zależy od licencji i może nie być dostępna we wszystkich wdrożeniach.
{% endhint %}

Określa, czy przycisk pływający na stronie wniosku, otwierający dodatkowe okno (FAB – *Floating Action Button*) ma być widoczny na formularzu.

#### **Widoczność**

Widoczność przycisku ustala się w podsekcji **Widoczność**, gdzie określa się warunek pokazania przycisku oraz element, który ma tę zmianę wywoływać (*nasłuchiwanie*). Dzięki temu przycisk może być widoczny tylko w określonych sytuacjach, np. po zaznaczeniu pola lub w danym kroku wniosku.

#### **Maskowanie numeru telefonu**

W sekcji **Maskowanie** można zdefiniować, czy numer telefonu w okienku przycisku ma być maskowany (np. częściowo ukryty). Widoczność numeru określa się za pomocą warunku i nasłuchiwania na element wzbudzający zmianę.

#### **Dodatkowe ustawienia**

W podsekcji **Dodatkowe dane** można wskazać komponenty formularza, których wartości zostaną przekazane do konfiguracji przycisku - numer telefonu, id czy wersję konfiguracji. Opcja ta dostępna jest tylko w wybranych wdrożeniach.

<figure><img src="/files/NlnyLIfTFgKD3VMk9osZ" alt=""><figcaption><p><em><strong>Ilustracja 9</strong></em><strong>.</strong> <em>Widoczność sekcji "Panic Button" z ustawionymi warunkami i parametrami</em></p></figcaption></figure>

#### **Konfiguracja techniczna**

Rozmiar oraz położenie okna przeglądarki, a także adres witryny, do którego prowadzi definiowane są dla danej instalacji w pliku konfiguracyjnym webforms.xml. Przykładowe wartości:

```xml
<floatingActionButton>
    <windowPositionX>100</windowPositionX>
    <windowPositionY>100</windowPositionY>
    <windowSizeX>100</windowSizeX>
    <windowSizeY>100</windowSizeY>
    <actionLink>http://consdata.pl</actionLink>
</floatingActionButton>
```

**Parametry konfiguracyjne:**

* *windowPositionX* – odległość okna od lewej krawędzi (px)
* *windowPositionY* – odległość okna od góry (px)
* *windowSizeX* – szerokość okna (px)
* *windowSizeY* – wysokość okna (px)
* *actionLink* – adres witryny otwieranej w nowym oknie; może zawierać zmienne formularza dostępne podczas uruchamiania wniosku, np.:

```
<actionLink>http://consdata.pl?nazwawniosku=${formId}&numerwniosku=${formInstanceNumber}</actionLink>
```

#### **Tłumaczenia i klucze tekstowe**

Napisy na komponencie można dostosować, dodając tłumaczenia w głównym szablonie formularza:

<table><thead><tr><th width="423">Klucz tłumaczenia</th><th>Opis</th><th>Domyślna treść</th></tr></thead><tbody><tr><td><code>iew.fab.need.help</code></td><td>tytuł w popupie startowym</td><td>„Potrzebujesz pomocy?”</td></tr><tr><td><code>iew.fab.well.call.up</code></td><td>opis w popupie startowym</td><td>„Oddzwonimy do Ciebie jak najszybciej…”</td></tr><tr><td><code>iew.fab.order.call</code></td><td>treść buttona w popupie startowym</td><td>„Zamów kontakt”</td></tr><tr><td><code>iew.fab.thank.you.title</code></td><td>tytuł w popupie podziękowania</td><td>„Wkrótce do Ciebie oddzwonimy”</td></tr><tr><td><code>iew.fab.thank.you.desc</code></td><td>opis w popupie podziękowania</td><td><em>""</em></td></tr><tr><td><code>iew.fab.error.could.not.order.conversation.title</code></td><td>tytuł w popupie błędu</td><td>„Nie udało się zamówić rozmowy”</td></tr><tr><td><code>iew.fab.error.try.again.desc</code></td><td>opis w popupie błędu</td><td>„Spróbuj ponownie za chwilę”</td></tr></tbody></table>

{% hint style="info" %}
Wnioski demo: demoFab, demoFabZmienioneLitera
{% endhint %}

### **Styl postępu ładowania**

Definiuje sposób prezentacji wskaźnika ładowania podczas inicjalizacji formularza. Domyślna wartość to "preloader". Dostępne style mogą się różnić w zależności od szaty graficznej (np. pasek postępu, spinner, animacja logo).

### **Warunkowe tytuły wniosku**

Umożliwia zdefiniowanie różnych tytułów wyświetlanych w nagłówku formularza w zależności od spełnienia określonych warunków. Każdy tytuł posiada przypisany **warunek widoczności** (np. zależny od danych), dzięki czemu można dynamicznie zmieniać nagłówek w zależności od etapu wniosku czy roli użytkownika.

#### **Definicja tytułów**

Każda definicja tytułu jest prezentowana w osobnym wierszu tabeli. Dany wiersz zawiera:

* **Klucz tytułu** – identyfikator tłumaczenia lub tekst stały wyświetlany w nagłówku formularza,
* **Warunek widoczności** – wyrażenie logiczne określające, kiedy tytuł ma być użyty,
* **Elementy wzbudzające zmianę (nasłuchiwanie)** – lista komponentów lub zmiennych (oddzielonych przecinkami), których zmiana powoduje ponowną ocenę warunku,
* **Przyciski edycji i usunięcia** – umożliwiają modyfikację lub usunięcie wiersza definicji tytułu,
* **Przycisk zapisu** – widoczny w trakcie edycji wiersza; zapisuje wprowadzone zmiany,
* **Uchwyt do zmiany kolejności** – pozwala przeciągnąć tytuł i ustawić jego priorytet (kolejność sprawdzania warunków).

{% hint style="info" %}
Wiersze są przetwarzane **od góry do dołu**, więc jeśli kilka warunków jest spełnionych, wyświetli się tytuł z najwyższego wiersza.
{% endhint %}

<figure><img src="/files/1Qm0BT4Ftc9CZIYhzNeh" alt=""><figcaption><p><em><strong>Ilustracja 10.</strong> Przykład zdefiniowanych czterech warunkowych tytułów</em></p></figcaption></figure>

{% hint style="warning" %}
Jeśli zmiana tytułu wniosku zależy od przejścia między stronami, to w warunku używamy zmiennej *currentPageMid*. Pozwoli to na zmianę tytułu zarówno przy przejściu do następnej strony, jak i przy cofaniu się.
{% endhint %}

{% hint style="info" %}
Wniosek demo: demoFormTitles
{% endhint %}

{% hint style="info" %}
Wniosek demo: demoWlasciwosciSzablonuWniosku
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.eximee.com/budowanie-aplikacji/interfejs-uzytkownika/formularze/tworzenie-formularza/wlasciwosci-formularza.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.