フィールド値に基づくパネルおよびサブビューの表示

フィールドの値に基づいて、様々なパネルのセット(および対応するサブビュー)を表示できます。

そのためには、パネル・レイアウトまたはサブビュー・レイアウトを作成し、フィールド値条件を追加します。レコードのフィールドが指定した値に一致した場合、関連付けられているレイアウトが表示されます。そうでない場合は、別のレイアウトが表示されます。

このトピックでは、アカウントのタイプ(顧客または見込み客)によって、アカウント詳細ページのパネルおよびサブビュー・レイアウトを変える方法について説明します。

前提条件

フィールド値を参照するレイアウト条件を作成するには、最初にこの機能を有効化し、ヘッダーの評価後にのみパネルおよびサブビューがページにロードされるようにします。

  1. Visual Builder Studioで、「アプリケーションUI」サイド・タブをクリックします。

  2. CX Sales > cx-sales > accounts > accounts-detailにナビゲートします。

  3. accounts-detailページで、「変数」サブタブをクリックします。

  4. 「定数」リージョンで、deferRelatedDataLoad定数をクリックします。

  5. 「プロパティ」ペインの「デフォルト値」フィールドで、「True」を選択します。

    パネルおよびサブビュー・コンテナ・レイアウトにフィールド値条件を追加する場合は、この値をtrueに設定する必要があります。

新しいパネル・レイアウトの作成

機能を有効にした後、フィールド値条件をパネル・レイアウトに追加できます。アカウント詳細ページに条件を追加します。

  1. アカウント・レコードからVisual Builder Studioにナビゲートします。

  2. accounts-detailページで、ページ・デザイナ・サブタブをクリックします。

  3. 構造パネルで、パネル・コンテナ・レイアウト・ノードをクリックします。

    これはパネル・コンテナ・レイアウト・ノードのスクリーンショットです。

  4. 「プロパティ」ペインで、Sales Admin Caseの横にある「複製」アイコンをクリックします。

    このスクリーンショットは、パネル・レイアウトの複製方法を示しています。

  5. Sales Admin Case (Copy)パネル・レイアウトの条件の横にある式エディタ・アイコンをクリックします。

    これは式エディタ・アイコンのスクリーンショットです。

  6. テストの目的で、式エディタ・ダイアログ内の既存の式を次の新しい式に置換します:

    $base.page.variables.row.Type=='ZCA_CUSTOMER'

  7. 「保存」をクリックします。

  8. 商談パネル・テンプレートを削除します。

    指定した前述のフィールド条件とあわせて、これにより顧客タイプのアカウントでは、アカウント詳細ページに「商談」パネルが表示されなくなります。

    このスクリーンショットは、パネル・レイアウトからパネルを削除する方法を示しています。

  9. この変更をテストしてみます。

    accounts-listページから「プレビュー」ボタンをクリックし、変更をランタイム・テスト環境で表示します。

    これは、Visual Builder Studioの「プレビュー」ボタンのスクリーンショットです。
  10. 結果のプレビュー・リンクは次のようになります:

    https://<servername>/fscmUI/redwood/cx-sales/accounts/accounts-list

  11. プレビュー・リンクを次のように変更します:

    https://<servername>/fscmUI/redwood/cx-sales/application/container/accounts/accounts-list

    ノート:

    プレビュー・リンクに/application/containerを追加する必要があります。

  12. 「自分のチームのアカウント」で、任意のアカウントをクリックします。

    • アカウント・タイプが「顧客」の場合、「商談」パネルは表示されません。

      このスクリーンショットは、アカウントが顧客である場合に、フィールド条件によって「商談」パネルが非表示になる様子を示しています。

    • アカウント・タイプが「見込み客」の場合、「商談」パネルが表示されます。

      このスクリーンショットは、アカウントが見込み客である場合に、フィールド条件によって「商談」パネルが表示される様子を示しています。

新しいサブビュー・レイアウトの作成

次に、フィールド条件をサブビュー・レイアウトにも追加します。フィールド条件をサブビュー・レイアウトにも追加することが重要です。そうしなかった場合、アカウントが顧客の場合でも、処理バーから「商談の表示」スマート処理が使用できる状態になります。

このスクリーンショットは、アカウントが顧客である場合に、フィールド条件によって「商談」パネルが非表示にされる様子を示しています。ただし、ここでは「商談」サブビューを開くスマート処理を処理バーから使用できます。

  1. アカウント・レコードの任意のパネルからナビゲートできる任意サブビュー・ページから、Visual Builder Studioにナビゲートします。

  2. accounts-detailページで、ページ・デザイナ・サブタブをクリックします。

  3. 構造パネルで、サブビュー・コンテナ・レイアウト・ノードをクリックします。

  4. 「プロパティ」ペインで、サブビュー・コンテナ・レイアウトの横にある「複製」アイコンをクリックします。

  5. サブビュー・コンテナ・レイアウト(コピー)サブビュー・レイアウトの条件の横にある式エディタ・アイコンをクリックします。

  6. 式エディタ・ダイアログで、次の式を追加します:

    $base.page.variables.row.Type=='ZCA_CUSTOMER'

  7. 「保存」をクリックします。

  8. 商談サブビュー・テンプレートを削除します。

    指定した前述のフィールド条件とあわせて、これにより顧客タイプのアカウントでは、アカウント詳細ページに「商談の表示」スマート処理が表示されなくなります。

  9. この変更をテストしてみます。

    accounts-listページから「プレビュー」ボタンをクリックし、変更をランタイム・テスト環境で表示します。

    これは、Visual Builder Studioの「プレビュー」ボタンのスクリーンショットです。
  10. 結果のプレビュー・リンクは次のようになります:

    https://<servername>/fscmUI/redwood/cx-sales/accounts/accounts-list

  11. プレビュー・リンクを次のように変更します:

    https://<servername>/fscmUI/redwood/cx-sales/application/container/accounts/accounts-list

    ノート:

    プレビュー・リンクに/application/containerを追加する必要があります。

  12. 「自分のチームのアカウント」ページで任意のアカウントをクリックし、アカウントが顧客タイプであることを確認します。「商談」パネルが表示されていないことを確認します。

    このスクリーンショットは、アカウントが顧客である場合に、フィールド条件によって「商談」パネルが非表示になる様子を示しています。

  13. サブビュー・レイアウトのフィールド条件をテストするため、「商談の表示」スマート処理が処理バーから使用できるかを確認します。顧客タイプのアカウントでは、これが表示されないはずです。

    このスクリーンショットは、アカウントが顧客である場合に、フィールド条件によって「商談の表示」スマート処理が非表示になる様子を示しています。