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
icone di reddito

Questo articolo include il modello Sightly utilizzato per visualizzare le icone dell’interfaccia utente coral personalizzata.

Modello Sightly

Segue il modello Sightly. Il codice nel modello visualizza l'icona a seconda del reddito. Le icone sono disponibili come parte della libreria di icone dell'interfaccia utente coral che viene fornita 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

NOTA

Questo articolo presuppone che sia stato installato il flusso di lavoro di esempio e modulo di esempio da articolo precedente in questa serie.

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

In questa pagina