# Configurare servizi a più fasi

La piattaforma consente la configurazione di servizi digitali suddivisi in più fasi, tipicamente due. In questa modalità, la seconda istanza del servizio è in grado di recuperare e riutilizzare i dati inseriti nella prima fase, favorendo la continuità del processo e la gestione da parte degli operatori.

In questo capitolo viene illustrato, a scopo esemplificativo, il caso di un servizio di iscrizione all’asilo nido, strutturato in due pratiche distinte:

* una prima pratica di **richiesta di iscrizione**;
* una seconda pratica di **conferma dell’iscrizione**, che recupera in automatico alcuni dei dati forniti durante la prima fase.

{% hint style="info" %}
Per servizi di questo tipo, consigliamo l'uso di [componente "Select](https://docs.opencityitalia.it/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/i-componenti/la-select)" in entrambe le istanze.
{% endhint %}

## Inserisci un campo "Select"

Trascina all'interno del modulo un [componente "Select"](https://docs.opencityitalia.it/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/i-componenti/la-select) e nella sezione "Data" inserisci l'opzione "URL" nel campo "Data Source Type"

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FrPcHNk2lQiAsXxobbfKt%2Fimage.png?alt=media&#x26;token=d76f412f-a84c-43f6-8d93-eff1caf7b59e" alt=""><figcaption></figcaption></figure>

Successivamente, inserisci l'[endpoint API](https://docs.opencityitalia.it/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/popolare-un-form-con-dati-provenienti-da-api#api-non-protette-da-autenticazione) da utilizzare nella voce "Data Source URL".

{% hint style="info" %}
Assicurati se l'API utilizzata sia o meno [protetta da autenticazione](https://docs.opencityitalia.it/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/popolare-un-form-con-dati-provenienti-da-api#api-non-protette-da-autenticazione).
{% endhint %}

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FXAIiglxfUZFVqP9bAhs5%2Fimage.png?alt=media&#x26;token=8b4730b1-7b8d-4c62-a51e-0a8bb163b310" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Nell'esempio riportato, la select è stata configurata in modo tale da recuperare dal tenant corrente ([data.base\_url](#imposta-lorigine-della-url)) tutte le pratiche accettate (status=7000) di un servizio di iscrizione (service\_identifier=oc-pnrr-2):&#x20;

{{data.base\_url}}/lang/api/applications?version=2\&status=7000\&service\_identifier=oc-pnrr-2
{% endhint %}

Nel campo "Request headers" compila la colonna "Key" con "Authorization" e la colonna "Value" con "Bearer [{{data.token}}"](#configura-il-token)

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FHDFhviLG2BpEkvCrj8qw%2Fimage.png?alt=media&#x26;token=4fe7efb8-47e8-4b9f-b753-e785d98d7205" alt=""><figcaption></figcaption></figure>

Compila il campo "Data Path" con il valore "data" (1) e seleziona la voce "Autotype" nel campo "Storage Type" (2)

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FnvNenA9iU4TxISHlrFSJ%2Fimage.png?alt=media&#x26;token=7f6a7b9a-08d6-4d44-bcd7-4048f62fa13e" alt=""><figcaption></figcaption></figure>

Infine, scegli il valore da mostrare alla voce "Item template".

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FutbuYoTwfRz75AYF5LsG%2Fimage.png?alt=media&#x26;token=264d4446-380a-4c0a-b151-38bbac286bcc" alt=""><figcaption><p>Nell'immagine, il campo è stato impostato in modo tale da recuperare il nome (given_name) e il cognome (family_name) di un minore, inseriti in una pratica precedente e selezionati da una select dedicata (item.data ["select_child"])</p></figcaption></figure>

## Configura il *token*

Aggiungi al modulo un componente di [tipo Hidden](https://docs.opencityitalia.it/admins/creare-un-servizio/le-funzioni/nascondere-i-componenti#usare-il-componente-hidden) e, nella sezione "Data", configura il campo "Calculated Value" inserendo il codice JavaScript dedicato alla chiamata API.

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FsDqslASlnEBJptp4Rl9D%2Fimage.png?alt=media&#x26;token=aa9d68bc-98cc-4fe3-9044-ad6d47078371" alt=""><figcaption></figcaption></figure>

```javascript
async function get_data() {
  window.FormioHelper.authenticatedCall("session-auth")
  .then(
    function(promise) {
      console.log(promise)
      instance.setValue(promise.token)
    })
}

if (!data.token) {
  get_data()
}

console.log(value)

```

## Imposta l'origine della URL

Aggiungi al modulo un campo di [tipo Hidden](https://docs.opencityitalia.it/admins/creare-un-servizio/le-funzioni/nascondere-i-componenti#usare-il-componente-hidden) e, nella sezione "Data", configura il campo "Calculated Value" inserendo il codice JavaScript dedicato.

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FllBxpFW9bwzyyPWvw9ZV%2Fimage.png?alt=media&#x26;token=3552bad9-9473-49f6-979d-e4526262e00a" alt=""><figcaption></figcaption></figure>

```javascript
value = window.location.origin
```

## Bonus track: attivare la fascicolazione

{% hint style="info" %}
La fascicolazione definisce un rapporto di dipendenza (padre-figlio) tra le pratiche di un servizio a più fasi: la pratica di conferma dell'iscrizione al nido, ad esempio, sarà figlia della pratica di richiesta iscrizione.

La fascicolazione **non incide sulla protocollazione** e **non corrisponde** all'inserimento della pratica figlia nello stesso fascicolo della pratica madre in fase di protocollazione.
{% endhint %}

Per configurare la fascicolazione, accedi al modulo della seconda fase del servizio e inserisci un componente '[hidden](https://docs.opencityitalia.it/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/nascondere-i-componenti#usare-il-componente-hidden)'.

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FBxIu6mtWIzCg2yYeGsMZ%2FScreen%20recording%202025-10-30%2015.34.07.gif?alt=media&#x26;token=1c896a0b-b90f-45aa-897e-1d5db5b6c243" alt=""><figcaption></figcaption></figure>

Una volta inserito, nella sezione "API" del componente inserisci il property name "related\_applications".

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FugdcbVI0kTs5ZQMQuTdj%2Fimage.png?alt=media&#x26;token=77e3a0b1-22b5-4ed0-9a9a-bcdb5ae6049c" alt=""><figcaption></figcaption></figure>

Successivamente, collocati nella sezione "Data" del componente e inserisci il codice JavaScript `instance.setValue(data.choose_application.id)`

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FhF2ek3wzTuGto8wQO8Sq%2Fimage.png?alt=media&#x26;token=09bff30f-2437-45a4-86d0-4b95ee0d366d" alt=""><figcaption></figcaption></figure>

Una volta attivata la fascicolazione, le pratiche correlate (padre e figlia) saranno raggruppate sotto la voce '**Pratiche collegate**'.&#x20;

Questa sezione sarà visibile in entrambe le interfacce: sia in [Area Personale del cittadino](https://docs.opencityitalia.it/operatori/che-cose-e-come-attivare-un-servizio-pubblico-digitale/accedere-alle-pratiche-inviate-in-precedenza), sia [in fase di lavorazione](https://docs.opencityitalia.it/operatori/gestione-delle-pratiche/gestire-le-pratiche-online/prendi-in-carico-una-pratica) dell'operatore.

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FUflmnTGN9ymnLm1IRdWs%2Fimage.png?alt=media&#x26;token=a90b4a1d-7b31-4c6c-845e-2538fcba6c27" alt=""><figcaption></figcaption></figure>