

Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà.

# Come funziona
<a name="how-it-works"></a>

L’Esploratore di profili offre vari widget per visualizzare le informazioni sui clienti, i layout sono archiviati come definizioni JSON, che rappresentano la struttura e la configurazione complete della dashboard. Ogni widget e componente del layout visivo corrisponde a uno specifico blocco JSON all’interno di questa definizione.

## Componenti principali
<a name="core-components"></a>

Ogni componente della definizione del layout è composto da cinque elementi comuni:
+ **Tipo**
  + Definisce la categoria del componente
  + Determina il modo in cui il componente viene renderizzato
  + Esempi: BoardItem, Tabella, KeyValuePair
+ **Id**
  + Identificativo univoco per ogni componente
  + Utilizzato per il monitoraggio e l’aggiornamento dei componenti
  + Generato automaticamente quando i componenti vengono creati nel generatore
+ **Props**
  + Proprietà specifiche del componente
  + Controlla l’aspetto e il comportamento
  + Include le impostazioni di configurazione
+ **Bambini**
  + Componenti o contenuti annidati
  + Definisce le relazioni gerarchiche
  + Può contenere più sottocomponenti
+ **DataSource**
  + Specifica l’origine dei dati
  + Definisce i parametri di recupero dei dati
  + Controlla l’associazione dei dati per i componenti

## Esempio di definizione di un componente di layout
<a name="example-layout-component-definition"></a>

Di seguito è riportato un esempio di struttura JSON per un componente della tabella della dashboard:

```
{
    "Id": "unique-identifier",
    "Type": "BoardItem",
    "Props": {},
    "Children": [
        {
            "Id": "unique-identifier",
            "Type": "Table",
            "Props": {},
            "Children": [
                {
                    "Id": "unique-identifier",
                    "Type": "TextContent",
                    "Props": {},
                    "Children": ["string"]
                }
            ]
        }
    ],
    "DataSource": [
        {
            "Type": "source-type",
            "Params": {}
        }
    ]
}
```

## Configurazione dinamica dei dati
<a name="dynamic-data-configuration"></a>

L’Esploratore di profili utilizza espressioni modello per accedere e visualizzare i dati dei Profili dei clienti in modo dinamico all’interno dei componenti.

### Supporto a valore singolo
<a name="single-value-support"></a>

Per componenti come le Coppie chiave-valore e le Metriche chiave, puoi accedere a:

#### Informazioni di profilo standard
<a name="standard-profile-information"></a>

```
{{Customer.<StandardProfileInfo>}}
```

Esempio di utilizzo:
+ `{{Customer.FirstName}}`
+ `{{Customer.LastName}}`
+ `{{Customer.PhoneNumber}}`

#### Attributi calcolati
<a name="calculated-attributes"></a>

```
{{Customer.CalculatedAttributes.<attributeDefinitionName>}}
```

Esempio di utilizzo:
+ `{{Customer.CalculatedAttributes._cases_count}}`
+ `{{Customer.CalculatedAttributes._new_customer}}`

### Sintassi di supporto dei dati tabulari
<a name="tabular-data-support-syntax"></a>

#### Attributi calcolati
<a name="calculated-attributes-tabular"></a>

```
{{Customer.CalculatedAttributes.DisplayName}}
```

```
{{Customer.CalculatedAttributes.CalculatedAttributeDefinitionName}}
```

#### Segmenti
<a name="segments"></a>

```
{{Customer.CalculatedAttributes.DisplayName}}
```

```
{{Customer.CalculatedAttributes.SegmentDefinitionName}}
```

#### Oggetti profilo
<a name="profile-objects"></a>

```
{{Customer.ObjectAttributes.<objectTypeName>.<fieldName>}}
```

**Esempio di utilizzo**:
+ `{{Customer.ObjectAttributes.CTR.contactId}}`
+ `{{Customer.ObjectAttributes.Order.orderId}}`

### Esempi di implementazione
<a name="implementation-examples"></a>

#### Componente a valore singolo
<a name="single-value-component"></a>

```
{
    "Type": "KeyValuePair",
    "Props": {
        "Items": [
            {
                "Label": {
                    "Content": {
                        "Type": "TextContent",
                        "Children": ["Customer Name"]
                    }
                },
                "Value": {
                    "Content": {
                        "Type": "TextContent",
                        "Children": ["{{Customer.FirstName}}"]
                    }
                }
            }
        ]
    }
}
```

#### Componente tabulare
<a name="tabular-component"></a>

```
{
    "Type": "Table",
    "Props": {
        "ColumnDefinitions": [
            {
                "Cell": {
                    "Content": {
                        "Type": "TextContent",
                        "Children": ["{{Customer.ObjectAttributes.CTR.contactId}}"]
                    }
                },
                "Header": "Contact ID"
            }
        ]
    }
}
```

**Nota**  
Assicurati che gli attributi, gli oggetti e i segmenti a cui fai riferimento esistano nella configurazione dei Profili dei clienti prima di utilizzarli nel layout.