2017.05.23

SuPICEで作る!Lightning アクション


こんにちは、いかがお過ごしでしょうか。
私事ですが先日、風邪を引き会社を一日休ませていただきました。

自分は風邪を引いたときにはチョットで終わること事しかやりたくありません。
だからこういうときにSalesforceの項目を見ると
項目いっぱいあって、困るなぁと思います。(๑•̀д•́๑)キリッ

そんなとき、チョットの項目を表示し編集するのに役立つのがLightningアクションです♪
今回はLightningアクションをSuPICEで活用する方法についてご紹介します!

はじめに、Lightning ExperienceにおいてのSalesforceの標準アクションとLightningアクションの違いについて説明します!

  • Salesforceの標準アクション

少ないクリックで項目の作成や編集を行うためのアクションです。標準オブジェクトの場合、便利なアクションが利用できます♪

  • Lightningアクション

ユーザーが独自の機能を拡張することができるアクションです。
作成したLightningコンポーネントを配置できるため、より自由な機能拡張ができます。
また、カスタムオブジェクトに対しても拡張が可能です♪♪

では、例としてリードオブジェクトの作成済みのリードに対して説明を記載するというシナリオでコンポーネントを作って見ましょう♪♪

Lightningコンポーネントを作成する。


まずはSuPICEで目的となるLightningコンポーネントを作成しましょう。

1. SuPICEで"プロジェクトの新規作成"を押し、オブジェクトにリードを選択する。

SuPICEでリードを設定しているところ.png

2. ユニットを配置する

入力項目ユニットを選び、"説明"項目を配置しましょう。

SuPICEでコンポーネント配置ずみ.png

今回はチョットした項目を確認するため、"詳細の表示切り替え"ボタンを押すと年間売上、作成日、役職などを表示するようにしました。

押すたびに切り替わる.png

3. インタラクションを設定します。

  • SAVEボタンを押したらデータを保存するようにインタラクションを設定する。

インタラクション1.png

  • "詳細の表示切り替え"ボタンを押すと詳細な項目を表示するようにする。

インタラクション3.png

  • CLOSEボタンを押すとLightningアクションを閉じるように設定する。

インタラクション2.png

4. デプロイを行います

SuPICEデプロイ.png


作成したLightningコンポーネントをLightning アクションで利用できるようにする

SuPICEで作成したLightningコンポーネントをLightning アクションで利用できるように設定しましょう。
Lightning アクションの適用方法につきましてはTrailheadの"グローバルクイックアクションの作成" で詳しく書かれているためここではポイントのみ説明します!


グローバルクイックアクションの作成

1. Lightning アクションにSuPICEで作成したコンポーネントを指定する。

オブジェクトマネージャSalesforce.png

2. リードのページレイアウトに作成したLightning Actionを割り当てる。

ページレイアウトの編集__Lead_Layout___Salesforce_-_Developer_Edition___Salesforce_1.pngページレイアウトの編集__Lead_Layout___Salesforce_-_Developer_Edition___Salesforce.png

使用してみる

設定したLightning アクションを動かして見ましょう♪

1. リードオブジェクトのメニューバーから作成したLightning アクションを呼び出す。

LightningActionの実行メニュー.png

2. 登録済みのリードに対して、素早く説明を入力できます。

説明の入力コンポーネントで記載.png

ちなみにモバイルのSalesforce1でも同様に表示できます♪

モバイルでの表示.png

SuPICEで作成したLightningアクションは以下のような便利点がありますね。

  • 横3列以上表示できる

  • 入力項目以外も好きな部品が配置できる

  • 複雑なレイアウトが可能
  • インタラクションを活用すれば普段は利用しない項目を非表示にしておける

説明の入力コンポーネントで詳細表示.png



SuPICEなら普段はシンプルにLightningアクションを利用したいという利点を生かしつつ、項目の詳細もその画面にいながらにして確認できます!

今回はLightningアクションとSuPICEで作成したコンポーネントを組み合わせることで
ちょっとの編集に役立つコンポーネントを作成しました。

皆様も風邪にはお気をつけてSuPICEでLightningアクションを作って見てください(^ ^)

1 件
     
  • banner
  • banner

関連する記事