cancel
Showing results for 
Search instead for 
Did you mean: 

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

0 Kudos

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

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での挙動

gregorw
Active Contributor
0 Kudos

I think you will get more responses if you post the language in english. Please check the SAPUI5 Documentation on List Report and Object Page.

masa_139
Product and Topic Expert
Product and Topic Expert
0 Kudos

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

Accepted Solutions (0)

Answers (1)

Answers (1)

masa_139
Product and Topic Expert
Product and Topic Expert
0 Kudos

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"}


0 Kudos

sekihara-san

返答ありがとうございます。

アドバイスを受けて、社内のS4/HANAの一般仕訳転記を解析したところ、Smart templateを使っており、それで動的に表示を変更しているようですね。(今はFiori Elementを指しているという理解です)

Developing Apps with Smart Templates

Chromeのデベロッパーツールで解析すると、metadata内に下記の Smart templateを使っている痕跡がありました

<Property Name="GLACCT" Type="Edm.String" Nullable="false" MaxLength="10" sap:display-format="UpperCase" sap:label="G/L 勘定"/>

ただ、SAP CP内ですとSmart templateは使えないので、ご指摘の様にUI5のフラグメントやtemplateを使わないと実装出来なさそうですね。

UI Adaptation at Runtime

masa_139
Product and Topic Expert
Product and Topic Expert
0 Kudos

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

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

標準と似たようなアプリを開発するのであれば、標準のアプリを拡張して使った方が、開発コストとメンテナンスコストを抑えられます。

Smart Form

0 Kudos

sekihara-san,

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

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

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

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

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