Utilizzo del modello Sightly per visualizzare i dati della casella in entrata

È possibile utilizzare un modello Sightly per formattare i dati da visualizzare nelle colonne della casella in entrata. In questo esempio verranno visualizzate le icone coral-ui a seconda del valore della colonna reddito . La schermata seguente mostra l'uso di icone nella colonna reddito

Modello a vista utilizzato per visualizzare le icone dell'interfaccia utente coral personalizzata è fornito come parte di questo articolo.

Modello Sightly

Segue il modello Sightly. Il codice nel modello visualizza l'icona a seconda del reddito. Le icone sono disponibili come parte del libreria di icone dell'interfaccia utente coral viene con AEM.

<template data-sly-template.incomeTemplate="${@ item}>">
    <td is="coral-table-cell" class="payload-income-cell">
         <div data-sly-test="${(item.workflowMetadata && item.workflowMetadata.income)}" data-sly-set.income ="${item.workflowMetadata.income}">
                 <coral-icon icon="confidenceOne" size="M" data-sly-test="${income >=0 && income <10000}"></coral-icon>
                 <coral-icon icon="confidenceTwo" size="M" data-sly-test="${income >=10000 && income <100000}"></coral-icon>
                 <coral-icon icon="confidenceThree" size="M" data-sly-test="${income >=100000 && income <500000}"></coral-icon>
                 <coral-icon icon="confidenceFour" size="M" data-sly-test="${income >=500000}"></coral-icon>
          </div>
    </td>
</template>

Implementazione del servizio

Il codice seguente è l'implementazione del servizio per la visualizzazione della colonna reddito .

La riga 12 associa la colonna al modello Sightly

import java.util.Map;
import org.osgi.service.component.annotations.Component;
import com.adobe.cq.inbox.ui.InboxItem;
import com.adobe.cq.inbox.ui.column.Column;
import com.adobe.cq.inbox.ui.column.provider.ColumnProvider;

@Component(service = ColumnProvider.class, immediate = true)
public class IncomeProvider implements ColumnProvider {
@Override
public Column getColumn() {

return new Column("income", "Income", String.class.getName(),"inbox/customization/column-templates.html", "incomeTemplate");
}

@Override
public Object getValue(InboxItem inboxItem) {
Object val = null;

Map workflowMetadata = inboxItem.getWorkflowMetadata();

if (workflowMetadata != null && workflowMetadata.containsKey("income"))
    val = workflowMetadata.get("income");

return val;
}
}

Test sul server

• Accedi a crx come utente amministratore
• modello Importazione guidata
• Accedi a AEM console Web
• Distribuzione e avvio del bundle di personalizzazione della casella in entrata
• Apri la inbox
• Apri Admin Control facendo clic su Vista a elenco accanto al pulsante Crea
• Aggiungi la colonna reddito alla casella in entrata e salva le modifiche
• Visualizzare l’anteprima del modulo
• Seleziona la stato civile e invia il modulo
• Visualizza casella in entrata

L’invio del modulo attiverà il flusso di lavoro e un’attività verrà assegnata all’utente "amministratore". Dovresti trovare l'icona appropriata nella colonna reddito

Risorse Business.Adobe.com