mcpField
S
sap-fiori-tree-table

sap-fiori-tree-table

github.com/sap開発160250 回インストール今日更新
リポジトリ

sap-fiori-tree-table について

CAP または ABAP RAP を使う開発者向けに、SAP Fiori アプリで再帰的な階層ツリーテーブルを設定するスキルです。各バックエンドの方式を分け、前提条件、実装手順、トラブルシューティングを示します。

主な機能

  1. 01CAP の階層設定ガイド
  2. 02ABAP RAP の階層設定ガイド
  3. 03実装前の必須入力の確認
  4. 04ツリーテーブルの設定とテスト
  5. 05よくある問題のトラブルシューティング

活用シーン

  1. 01エンティティの親子データの表示
  2. 02組織階層ビューの構築
  3. 03Fiori でのカテゴリツリー設定

MCP 対応

Fiori アプリの生成と変更には Fiori MCP Server が必要です。CAP プロジェクトではモデル検索用の CDS MCP Server、ABAP RAP プロジェクトでは RAP 操作用の ADT MCP server も必要です。

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/sap/open-ux-tools --skill sap-fiori-tree-table

インストール後、Claude Code で/sap-fiori-tree-tableを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
cap-implementation.md
rap-editable-introduction.md
rap-editable-prerequisites.md
rap-editable-treeviews.md
rap-editable-with-generator.md
rap-generator-requirements.md
rap-implementation.md
rap-read-only-treeviews.md
rap-troubleshooting.md

詳細

SAP Fiori の再帰階層ツリーテーブル

目的

親子関係を再帰構造(組織階層、カテゴリツリー、ネストされたデータ)で表示する階層ツリーテーブルを設定します。

環境要件

CAP プロジェクト:

  • ✅ VS Code または SAP Business Application Studio (BAS) - どちらの環境にも対応しています
  • ✅ Fiori MCP Server - Fiori アプリの生成と変更に必要です(VS Code のみ)
  • ✅ CDS MCP Server - CDS モデルのクエリに必要です

ABAP RAP プロジェクト:

  • ✅ VS Code のみ - ABAP Development Tools 拡張機能は VS Code 専用です
  • ✅ Fiori MCP Server - Fiori アプリの生成と変更に必要です
  • ✅ ABAP Development Tools for VS Code 拡張機能 - バックエンド開発に必要です(RAP 操作用の ADT MCP サーバーを含みます)

必須:最初に必要な入力を収集する

プロンプトに不足している入力が1つでもある場合は、作業を中断し、以下のすべての入力をユーザーに確認してください。

ABAP RAP プロジェクトの場合:
  1. パッケージ名 - バックエンドの階層オブジェクトを作成または検索する場所(ローカルの場合は $TMP、または Z_MAINT のような特定のパッケージ)
  2. トランスポートの要否:パッケージの種類によって異なります($TMP のようなローカルパッケージの場合は不要、トランスポート可能なパッケージの場合は必要)
  3. エンティティ名 - 階層化するエンティティ(例:「Equipment」、「Category」、「FunctionalLocation」)
CAP プロジェクトの場合:
  1. エンティティ名 - 階層化するエンティティ(例:「Travel」、「Category」、「ProductCategory」)

すべての入力が確認されるまで、実装を進めないでください。


CAP の実装

📖 CAP 実装ガイド全文

概要:

  • 6 ステップのプロセス:エンティティの確認 → 関連付けの追加 → @hierarchy の追加 → manifest の設定 → データの作成 → テスト
  • UUID、String、Integer のキーに対応しています(単一キーのみ)
  • @sap/cds 9.6.0 以降と OData V4 が必要です
  • 編集する前に CDS MCP を使用してモデルを検索してください

ABAP RAP の実装

📖 RAP 実装ガイド全文

概要:

  • 4 ステップのプロセス:既存の階層を確認 → バックエンドを実装 → manifest を設定 → テスト
  • 選択が必要です: 読み取り専用(リストレポートのみ)か、編集可能(オブジェクトページあり)
  • バックエンド実装の詳細については、以下を参照してください:

よくある問題の簡単な対処方法

CAP でよくある問題
  • 「@hierarchy はサポートされていません」 → 管理対象の関連付けを使用してください(on 条件なし)
  • 「テーブルに列がありません」 → CSV では parent_ID(アンダースコアあり)を使用してください
  • 「TreeTable が描画されない」 → manifest の type: "TreeTable" と hierarchyQualifier を確認してください
ABAP RAP でよくある問題
  • 「要素は検索対象にできません」 → 階層プロジェクションビューから @Search アノテーションを削除してください
  • 「主キーが一致しません」 → 子テーブルには複合キー(子 UUID + 親 UUID)が必要です

📖 エラーの全一覧については、実装ガイドを参照してください


主な違い

CAP:

  • エンティティで管理対象の関連付けを使用
  • サービスに @hierarchy アノテーションを設定
  • parent_ID 列を含む CSV データ
  • テストについては、sap-fiori-app-development スキルの Application Preview Guidelines セクションを参照してください

ABAP RAP:

  • @OData.hierarchy.recursiveHierarchy を使用する CDS ビュー
  • メタデータでクオリファイアを指定
  • データベーステーブルにテストデータを用意
  • テストについては、sap-fiori-app-development スキルの Application Preview Guidelines セクションを参照してください

コメント