Clay Management Toolbar
管理ツールバーを使用すると、管理者はアプリ内の検索コンテナの結果を制御できます。 検索結果のビュータイプをフィルタリング、並べ替え、選択できるため、ドキュメント、Webコンテンツ、アセットエントリーなど、探しているものをすばやく特定できます。 管理ツールバーは完全にカスタマイズ可能であるため、すべてのコントロールまたはアプリに必要なコントロールのみを実装できます。
管理ツールバーを作成するには、clay:management-toolbar taglibを使用します。 ツールバーには、いくつかの重要なセクションが含まれています。 各セクションは、さまざまな属性を使用してグループ化および構成されます。 これらの属性について、以下で詳しく説明します。
表示コンテキストを使用した管理ツールバーの構成
表示コンテキスト（管理ツールバーの表示オプションを構成するための別個のクラス）を使用している場合、ツールバーの構成オプションのすべてまたは一部を定義するために、displayContext属性を使用して表示コンテキストを指定できます。 例を以下に示します。
<clay:management-toolbar
displayContext="<%= viewUADEntitiesManagementToolbarDisplayContext %>"
/>
表示コンテキストの使用例については、「 管理ツールバーを使用したアイテムのフィルタリングと並べ替え」をご覧ください。 管理ツールバーの構成には、表示コンテキストは必要ありません。 表示コンテキストを介して、管理ツールバーの構成オプションを必要なだけ指定できます。
チェックボックスとアクション
actionDropdownItems、 itemsTotal、 searchContainerId、および selectable 属性を使用すると、ツールバーにチェックボックスを追加して、すべての検索コンテナの結果を選択し、それらに対して一括アクションを実行できます。 アクションとアイテムの総数は、個々の結果がオンになっている場合、またはツールバーのマスターチェックボックスがオンになっている場合に表示されます。
actionDropdownItems: 結果がチェックされているか、管理ツールバーのマスターチェックボックスがチェックされているときに表示されるドロップダウン項目のリスト。 ページ間で複数の結果を選択できます。 管理ツールバーは、選択された結果の数を記録します。
itemsTotal: ページ区切り全体のアイテムの合計数。 この番号は、1 つまたは複数の項目が選択されたときに表示されます。
searchContainerId：管理ツールバーに接続されている検索コンテナのID
selectable：管理ツールバーにチェックボックスを含めるかどうか
以下に構成例を示します。
actionDropdownItems="<%=
new JSPDropdownItemList(pageContext) {
{
add(
dropdownItem -> {
dropdownItem.setHref("#edit");
dropdownItem.setLabel("Edit");
});
add(
dropdownItem -> {
dropdownItem.setHref("#download");
dropdownItem.setIcon("download");
dropdownItem.setLabel("Download");
dropdownItem.setQuickAction(true);
});
add(
dropdownItem -> {
dropdownItem.setHref("#delete");
dropdownItem.setLabel("Delete");
dropdownItem.setIcon("trash");
dropdownItem.setQuickAction(true);
});
}
}
%>"
アクションアイテムは、ページネーション全体で選択されたアイテムの数とともに、［Actions］メニューに一覧表示されます。
上記の例の削除アクションやダウンロードアクションなど、アクションにアイコンが指定されている場合は、アクションメニューの横にもアイコンが表示されます。
検索結果のフィルタリングとソート
filterItems、sortingOrder、およびsortingURL属性を使用すると、検索コンテナの結果をフィルタリングしたりソートしたりできます。 フィルタリングとソートは、1つの便利なドロップダウンメニューにグループ化されています。
filterItems：検索コンテナのフィルタリングオプションを設定します。 このフィルターは、すべてのコントロールパネルアプリケーションに含まれている必要があります。 フィルタリングオプションには、ソート条件、ソート順序などを含めることができます。
filterLabelItems：表示する検索コンテナのフィルターラベルを設定します。 これにより、ユーザーは現在適用されているフィルターを把握できます。
sortingOrder：現在のソート順序（昇順または降順）。
sortingURL：ソート順を変更するURL
次の例では、2つのフィルターオプションと2つのソートオプションを追加しています。
filterItems="<%=
new DropdownItemList(_request) {
{
addGroup(
dropdownGroupItem -> {
dropdownGroupItem.setDropdownItemList(
new DropdownItemList(_request) {
{
add(
dropdownItem -> {
dropdownItem.setHref("#1");
dropdownItem.setLabel("Filter 1");
});
add(
dropdownItem -> {
dropdownItem.setHref("#2");
dropdownItem.setLabel("Filter 2");
});
}
}
);
dropdownGroupItem.setLabel("Filter By");
});
addGroup(
dropdownGroupItem -> {
dropdownGroupItem.setDropdownItemList(
new DropdownItemList(_request) {
{
add(
dropdownItem -> {
dropdownItem.setHref("#3");
dropdownItem.setLabel("Order 1");
});
add(
dropdownItem -> {
dropdownItem.setHref("#4");
dropdownItem.setLabel("Order 2");
});
}
}
);
dropdownGroupItem.setLabel("Order By");
});
}
}
%>"
filterLabelItems="<%=
new LabelItemList() {
{
add(
labelItem -> {
labelItem.setLabel("Filter 1");
});
add(
labelItem -> {
labelItem.setLabel("Filter 2");
});
}
};
%>"
検索フォーム
clearResultsURL、searchActionURL、searchFormName、searchInputName、およびsearchValue属性を使用すると、検索フォームを構成できます。 管理ツールバーの主要部分は、検索フォーム用に予約されています。
clearResultsURL：検索をリセットするためのURL
searchActionURL：検索フォームを送信するアクションURL
searchFormName：検索フォームの名前
searchInputName：検索入力の名前
searchValue：検索入力の値
以下に構成例を示します。
<clay:management-toolbar
clearResultsURL="<%= searchURL %>"
disabled="<%= isDisabled %>"
itemsTotal="<%= itemsTotal %>"
namespace="<%= renderResponse.getNamespace() %>"
searchActionURL="<%= searchURL %>"
searchFormName="fm"
searchInputName="<%= DisplayTerms.KEYWORDS %>"
searchValue="<%= ParamUtil.getString(request, searchInputName) %>"
selectable="<%= false %>"
/>
情報パネル
infoPanelId属性とshowInfoButton属性を使用すると、検索コンテナの結果に関連する追加情報を表示する格納式のサイドバーパネルを追加できます。
infoPanelId：切り替える情報パネルのID
showInfoButton：情報ボタンを表示するかどうか
以下の構成例では、 showInfoButton 属性が、 displayContext 属性—で指定された Display Context—に提供され、 infoPanelId が JSP で明示的に設定されています。
<clay:management-toolbar
displayContext="<%= journalDisplayContext %>"
infoPanelId="infoPanelId"
namespace="<%= renderResponse.getNamespace() %>"
searchContainerId="<=% searchContainerId %>"
/>
表示タイプ
viewTypes属性は、検索コンテナの結果の表示オプションを指定します。 選択できる表示オプションは3つあります。
カード： 横型または縦型のカードに検索結果の列を表示します。
リスト： 検索結果の列に関する詳細な説明と要約された詳細を表示します。
テーブル: デフォルトのビュー。 検索結果の列を左から右に一覧表示します。
以下に構成例を示します。
viewTypes="<%=
new JSPViewTypeItemList(pageContext, baseURL, selectedType) {
{
addCardViewTypeItem(
viewTypeItem -> {
viewTypeItem.setActive(true);
viewTypeItem.setLabel("Card");
});
addListViewTypeItem(
viewTypeItem -> {
viewTypeItem.setLabel("List");
});
addTableViewTypeItem(
viewTypeItem -> {
viewTypeItem.setLabel("Table");
});
}
}
%>"
上記の例では、JSP でビュー タイプを構成する方法を示していますが、 各ビュー タイプをいつ使用するかを指定する必要もあります。
作成メニュー
creationMenu属性は、1つまたは複数のアイテムに対し［メニューを追加］ボタンを作成します。 これは、新しいエンティティ（新しいブログエントリなど）を作成するために使用されます。
addPrimaryDropdownItem()メソッドを使用して一番上のレベルのアイテムをドロップダウンメニューに追加するか、addFavoriteDropdownItem()メソッドを使用してセカンダリアイテムをドロップダウンメニューに追加します。
以下の構成例では、2つのプライマリ作成メニュー項目と2つのセカンダリ作成メニュー項目が追加されています。
creationMenu="<%=
new JSPCreationMenu(pageContext) {
{
addPrimaryDropdownItem(
dropdownItem -> {
dropdownItem.setHref("#1");
dropdownItem.setLabel("Sample 1");
});
addPrimaryDropdownItem(
dropdownItem -> {
dropdownItem.setHref("#2");
dropdownItem.setLabel("Sample 2");
});
addFavoriteDropdownItem(
dropdownItem -> {
dropdownItem.setHref("#3");
dropdownItem.setLabel("Favorite 1");
});
addFavoriteDropdownItem(
dropdownItem -> {
dropdownItem.setHref("#4");
dropdownItem.setLabel("Other item");
});
}
};
%>"
