以前の記事で作成したリストを用いて営業支援アプリを作っていきます。
早速作っていきましょう！
目次
Power Apps 空のページから作成
Canvas app from blankから、タブレットサイズの画面を作成できます。
データソースを追加します。
今回SharePoint のため、SharePoint を検索してコネクターを追加します。
接続先のサイトを選択します。
とりあえず以下の項目があればアプリを作成することができます。
データソースの追加には少々時間がかかりますが、完了すると以下のように追加されたリストを確認できます。
画面の作成
以下のようにGalleryを追加して、営業案件のデータをまずは表示してみます。
初期画面では画像のあるテンプレートとなってしまいますので、これを書き換えます。
顧客名を表示させるようにします。Galleryの一つのレコードにおける変えてもいいテキストラベルを選択して、以下のように関数に入力します。
その後、このように右側にFormをInsertします。また、右上に更新アイコン、保存アイコンを置いてヘッダーを作っていきます。
色を背景に付けるには、テキストラベルを使います。
機能の作成
だいたい、画面をデザインした後一個一個の機能を作っていきます。
機能の作り方をいくつか紹介します。
選択したレコードをフォームに表示する
レコードの「>」アイコンを選択した際にそのデータを表示するようなロジックを設定します。
まずは、UpdateContext関数を用いて選択したレコードを変数SelectedItemに格納するようにします。
このタイミングで変数を同時に宣言しています。
このSelectedItem変数をFormのItemプロパティに設定することで連動して表示されるようになります。
選択したレコードをリセットするようにも設定します。更新アイコンをクリックするとレコードをリセットする、と言うように以下のように関数を設定します。
データを更新する機能を作成する
顧客を取引先企業リストから選択できるように、ドロップダウンリストを挿入し、Valueを名前とします。
ただ、取引先企業リストの中には顧客の他にパートナーや仕入れ先なども入っていますので、関係タイプでフィルターするようにします。
こんな感じになります。
パートナーも同様に設定します。
選択した値で更新するように、顧客カードをUpdateプロパティを設定します。
パートナーも同様に設定します。
保存アイコンをクリックしたらフォームごとSharePoint リストに送信して更新するように関数を設定します。
セミコロンで区切ってもう一つフォームをリセットする関数を設定しています。これはやらなくてもいいですし、例えば「更新が完了しました！」のような画面に遷移するように応用してもいいと思います。
フィルター機能の作成
Gallery に前方一致のフィルター機能をつけてみようと思います。
SearchBox1と言うinput textを追加して検索テキストを入力できるようにし、それを受け取ってフィルターするように関数を設定します。
今回は営業案件IDで検索できるようにします。
こんな感じになりました。
デモ
ここまでの操作で以下のようなアプリが作成できているかと思います。
本日はここまでです。
ご参考になりましたら幸いです。
関連記事
【O365ライセンス内でPowerApps開発】 Vol.8 営業支援アプリの作成（タブレットレイアウト）の新規レコード作成機能の追加
【O365ライセンス内でPowerApps開発】 Vol.8 営業支援アプリの作成（タブレットレイアウト）の新規レコード作成機能の追加