Sightly テンプレートを使用したインボックスデータの表示
Sightly テンプレートを使用すると、インボックス列に表示するデータの形式を設定できます。 この例では、「income」列の値に応じた coral-ui アイコンを表示します。 次のスクリーンショットは、「income」列でのアイコンの使用を示しています
カスタムの coral ui アイコンを表示するために使用される Sightly テンプレート は、この記事の一部として提供されています。
Sightly テンプレート
次に、Sightly テンプレートを示します。テンプレート内のコードには、収入に応じてアイコンが表示されます。 アイコンは、AEM に付属の coral ui アイコンライブラリの一部として利用できます。
<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>
サービスの実装
次のコードは、「income」列を表示するサービスの実装です。
行 12 は、列を 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;
}
}
サーバーでテストします
NOTE
- 管理者ユーザーとして crx にログインします
- Sightly テンプレートを読み込みます
- AEM Web コンソールにログインします
- インボックスカスタマイズバンドルをデプロイして開始します
- インボックスを開きます
- 「作成」ボタンの横のリスト表示をクリックして、管理コントロールを開きます。
- インボックスに「income」列を追加し、変更を保存します
- フォームをプレビューします
- 配偶者の有無 を選択し、フォームを送信します
- インボックスを表示します
フォームを送信するとワークフローがトリガーされ、タスクが「admin」ユーザーに割り当てられます。「収入」列の下に適切なアイコンが表示されます。
recommendation-more-help
8de24117-1378-413c-a581-01e660b7163e