Skip to Content

【ご相談】SAP UI5 on SAP CPで動的に画面表示の項目を変更する方法について

お世話になります。クニエ大野と申します。

SAP CP上で基幹システム刷新のアーキテクチャを検討しています。

SAP Fiori on SAP CPにて以下の質問があります。良いアドバイスあればご教授頂けると幸いです。

//質問

添付のS4/HANAのFioriの挙動の様に、

特定の入力値に応じて、関連する入力項目の表示・非表示を動的に変更する方法はSAP UI5 on SAP CPにありますでしょうか?

例)添付の様に勘定科目に応じて、入力項目が動的変更する(S/4HANAですと可能と把握しております)

経緯はSAP ERP内の項目ステータスの設定をSAP CP側と連携させて、

SAP CP上のUI5で構築した画面で、勘定科目に応じて入力項目の表示・非表示を動的に変更する方法を模索しています。

Fiori及びUI5で良い実装方法をご存じでしたらアドバイス頂けると幸いです。

// S4/HANAでの挙動

ws000001.jpg (83.9 kB)
ws000002.jpg (78.0 kB)
ws000003.jpg (97.2 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

1 Answer

  • May 03 at 04:37 AM

    The question was " how to set a fragments/view dynamically based on G/L account selection" like the screenshots.

    I recommend getting the definition from backend is better implementation.


    Fragments を利用していると思いますが、ロジックでゴリゴリ書く、Template を読み込むなど方法はいくつかあるので、どれがいいのか検討する必要があります。XML view の visible に condition を付けて表示/非表示する制御もありですが、勘定科目は数多くあり、ビジネスの変化に応じて変更、追加されますので、ハードコードするのはお勧めしません。バックエンド側で勘定科目によってどの項目が必要か定義されているはずなので、メンテナンスを考えると標準と同じようにその定義を読み込んで設定するようにすれば、バックエンド側の変更があっても対応できスマートな構築だと思います。

    https://<host>:<port>/sap/opu/odata/sap/FAC_GL_DOCUMENT_POST_SRV/
    FinsPostingGLItems(AccountingDocumentItemRef='0000001001',TmpId='YBZC7F4W1C',TmpIdType='T')",

    "type":"FAC_FINANCIALS_POSTING_SRV.FinsPostingGLItem"},"GLAccount":"11001020"}

    Fragments 参考リンク

    Reusing UI Parts: Fragments

    SAPUI5 Tutorial - Fragments

    dynamically selecting fragment


    標準のアプリの参照方法:

    A: アプリを動かして Tool で解析する

    Chrome ブラウザの Developer Tool と UI5 Inspector が便利です

    Debug Tools

    B: コードをインポートして見てみる

    1. Fiori Apps library でアプリを特定する

    Fiori Apps Reference Library #/detail/Apps('F0718')/S10OP

    ここでアプリのタイプを確認する。 SAPUI5 なのか Fiori Elements なのか

    2. SAP Web IDE Full-Stack でアプリをインポートしてコードを参照する。
    FIN_GLDOCPOST、FIN_GL_POST_LIB、FIN_ACC_LIB_CB

    Cloud Connector の設定は必要です。

    明細の勘定コード入力は

    View fin.gl.documentpost.view.Posting

    それに対応する動的な部分は

    View sap.fin.acc.lib.codingblock.component.view.CodingBlockForm

    バックエンドの設定を読み込んで設定しているようです。

    https://<host>:<port>/sap/opu/odata/sap/FAC_GL_DOCUMENT_POST_SRV/
    FinsPostingGLItems(AccountingDocumentItemRef='0000001001',TmpId='YBZC7F4W1C',TmpIdType='T')",

    "type":"FAC_FINANCIALS_POSTING_SRV.FinsPostingGLItem"},"GLAccount":"11001020"}


    Add comment
    10|10000 characters needed characters exceeded

    • sekihara-san,

      アドバイスありがとうございます。

      >SAP Cloud Platform でも Smart Form は使えますので確認してください。

      >FIN_ACC_LIB_CB -> Components -> view -> CodingBlockForm.controller.js および view.xml を参照してください。

      Fiori Apps libraryから上記を調査するのも有用と理解しました。

      開発チーム内で共有させていただきます。