ブログ


【上級者向け】SharePoint × Power Apps × Power Automate で自動化した予約フォームを作成する

SharePoint のリストによる予約管理は、他の Microsoft 製品である Power Apps や Power Automate と組み合わせることでより利便性を高められます。
SharePoint の標準入力フォームではわかりにくかったり、使いづらかったりすることもありますが、Power Apps を活用すれば、予約の入力フォームを自由にカスタマイズすることで、よりユーザビリティの高い貸出台帳に仕上げられます。さらに、Power Automate を活用すれば、自動化されたシステム上でダブルブッキングを防止するなどの付加価値を加えられます。


Microsoft 製品でつくる予約システム

SharePoint では、会議室などの施設やパソコンなどの備品の台帳管理が可能です。
SharePoint のみで施設や備品の予約フォームを作成した場合、承認作業は、手作業で SharePoint 上で行いますが、バージョン管理や権限設定などにより従来の管理業務より、管理者の負担は軽減するのではないでしょうか。

Microsoft 製品でつくる予約システム


自動予約フォームを作成する

SharePoint のみの管理だけでも、十分に管理者の負担は軽減しますが、さらに、軽減を可能にするために、承認作業を自動化してみましょう。
イメージは、下図になります。

自動予約アプリを作成する

SharePoint で施設・備品予約フォームのベースをつくる

まずは、SharePoint で、登録する施設・備品情報に関する「施設・備品マスタ」と、登録者が具体的に「何を」、「いつ」予約し、返却するかに関するリスト「貸出予約フォーム」の2種類を作成します。
リストの作成方法は、下記のブログの「SharePointリスト作成(SharePoint Lists)」でご紹介しています。ご参照ください。
また、こちらでは、「チームサイト」で作成しています。人数の多い大規模な企業やより細かい権限設定をする場合は「コミュニケーションサイト」での作成をおすすめします。

Power Apps でフォームをカスタマイズする

ここでは、 「【初心者向け】SharePoint で施設・備品の予約!業務改善の仕組みづくりを解説」 で作成した SharePoint のリスト「貸出予約フォーム」の予約登録フォームを Power Apps でカスタマイズしていきます。他のユーザーが、「何を」「いつ」予約しているのかを、登録する時に可視化が可能になり、ダブルブッキングを防ぐことができます。

1. SharePoint のリスト「貸出予約フォーム」画面の上部メニューの「統合」から「Power Apps」(図中①)にマウスを合わせると、表示された「フォームのカスタマイズ」(図中②)をクリックします。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

2. 画面が切り替わり、Power Apps が起動します。
表示される初期画面は、SharePoint で作成した登録フォームの画面が自動的に表示されます。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

3. 上部メニュー「挿入」(図中①)をクリックします。
次に、2段目の上部メニューより「データテーブル」(図中②)をクリックし、次に「ラベル」(図中③)をクリックします。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

4. フォームのレイアウトを整えます。
挿入した「データテーブル」と「ラベル」はフォームの下部に配置します。

 フォーム項目の削除方法
画面左側のツリービュー「SharePointForm1」(図①)をクリックし、画面右側の「フィールドの編集」(図②)をクリック、もしくは選択されていることが確認できたら、「プロパティの編集」(図③)をクリックします。左側へスライド表示された「フィールド」で削除したい項目にマウスを合わせると「・・・」(図④)が表示されるのでクリックします。ここでは「添付ファイル」にマウスを合わせて、プルダウン表示された「削除」を選択します。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

 フォーム項目の追加
削除の時と同様に、左側へスライド表示された「フィールド」の「+フィールドの追加」(図①)をクリックします。プルダウン表示された「フィールドの選択」(図②)から、追加したい項目の左側にあるチェックボックスにチェックを入れて「追加」をクリックすると、追加されます。ここでは、「登録者」「コンテンツの承認状態」「このリスト アイテムのコンテンツの承認に関連付けられているコメント」を追加します。追加された項目は、「フィールド」の一番下に追加されます。項目の順番を変更する場合は、項目をドラッグ&ドロップで移動ができ、移動したい場所へ変更ができます。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

 フォーム自体のサイズの変更
デフォルトのフォームの横幅は、スマートフォン用に設計されているため、「444px」に設定されています。
フォームの入力項目が多い場合、下部に配置した「データテーブル」や「ラベル」が邪魔となり、入力項目のスペースが狭くなります。ユーザーが予約登録する時、パソコンからの入力がしづらかったり、入力漏れが発生したりなどすれば、結局、Excel で管理した方がいいとなり、管理者の負担が軽減しません。運用する上で、ユーザーは使いやすく、管理者は管理しやすいことを考慮して設計しましょう。
ここでは、パソコンやタブレットで使いやすい「800px」に変更します。

上部メニュー「ファイル」をクリックします。左メニューの「設定」をクリックします。
ポップアップ画面の左メニュー「表示」(図①)を選択します。「サイズ」(図②)を選択しプルダウンで「カスタム」をクリックします。サイズの幅を「800」(図③)と入力します。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

 フォームの列数の変更
フォームの列の数を変更するこも可能です。
デフォルトは、1カラムとなっているため、横の幅を広くした時は、こちらの変更をおすすめします。
変更を設定する場所は、「プロパティ」(図①)を選択し、「列へのスナップ」の「列」(図②)の部分で変更が可能です。ここでは3列に変更しましょう。

フォームの列数の変更

カードのサイズを変更する場合は、変更したいカードを選択し、囲みの部分を横にドラッグしてサイズを変更します。

フォームの列数の変更

———————————————————————————————————————————————————————————————————————

5. レイアウトが整いましたら、「データテーブル」に SharePoint を呼び出します。
左側アイコンの「データ」(図①)をクリックします。すぐ右側に「データ」が表示されるので、予約フォームの SharePoint が表示されていれば、Power Apps と SharePoint が紐づいていることになります。
また、ない場合は、「+データの追加」→「コネクタ」→「 SharePoint 」をクリックして、紐づけたい SharePoint リストを選択してください。

「データテーブル」(図③)を選択し、右側の詳細情報の「データソース」(図④)から予約フォームの SharePoint リストを選択すると、予約登録したすべてのデータが「データテーブル」に表示されます。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

6. 「データテーブル」から、予約済みの日時や承認状況などのデータを呼び出し絞り込みをする仕組みを作っていきます。
まず、データを呼び出すために、画面左側のツリービュー(図①)から「SharePointForm1」を展開して、個別のデータ名を変更します。
データ名を変更する項目は、下記となります。

 貸出日(変更後の名前:貸出日入力)
 返却日(変更後の名前:返却日入力)
 施設・備品(変更後の名前:項目入力)

変更方法は、呼び出したいデータをダブルクリックします。例として、「貸出日」日付部分(図②)をダブルクリックすると、ツリービューの該当する場所が反転(図③)します。その場所をダブルクリックすると編集が可能になります。名前は任意ですので、わかりやすい名前を入力しましょう。
また、右側の詳細情報の名前部分(図④)をクリックして変更することもできます。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

7. 「データテーブル」に条件の絞り込みを行う動的な関数を入れます。
「データテーブル」(図①)をクリックして、詳細情報の「詳細設定」(図②)を選択します。
すぐ下の「Item」(図③)に、以下の関数を入力します。
※下記の関数をそのままコピーをするとエラーが発生します。文頭にキーボードの「Tab」を押してスペース入力してください。

Filter(
「Tab」 貸出予約フォーム,
「Tab」 (貸出日入力.SelectedDate <= 返却日)And
「Tab」(返却日入力.SelectedDate >= 貸出日)And
「Tab」 (項目入力.Selected.Value = ‘施設・備品’.Value)And
「Tab」 (SharePointIntegration.SelectedListItemID <> ID)
)

また、この関数に当てはまらない時は、誰も予約がされていないことになるため、フォームの「データテーブル」の部分は、空欄とります。
任意ですが、「NoDataText」(図④)にコメントを入れて、登録するユーザーに予約されていないことを知らせましょう。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

8. フォームの「データテーブル」を見やすいように、表示項目やレイアウトを整えます。
表示項目の追加や削除の方法は、基本的に入力フォームの項目追加と削除の方法と同じです。ツリービューの「DataTable」(図①)をクリックし、画面右側「詳細情報」の「プロパティ」(図②)を選択して、「フィールドの編集」(図③)で「+フィールドの追加」(図④)から追加ができます。削除は、項目を選択して「・・・」(図⑤)から削除ができます。
必要な情報は、以下となります。

 目的
 貸出日
 開始時間
 返却日
 終了時間
 登録者
 承認状態

Power Apps でフォームをカスタマイズする

フォームの「データテーブル」の列の幅は、SharePoint の列の幅の変更と同様に「データテーブル」上で調整ができるので、それぞれ項目に合わせて適切な幅にしましょう。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

9. フォーム項目の「承認状態」は、デフォルトで英語表記になるため、わかりやすいように日本語表示に関数を使って変更していきます。
「データテーブル」に追加した「承認状態」にも同様の関数を入力します。
関数は、以下となります。
※下記の関数をそのままコピーをするとエラーが発生します。文頭にキーボードの「Tab」を押してスペース入力してください。

Switch(
「Tab」ThisItem.コンテンツの承認状態,
「Tab」“Approved”,”承認済み”,
「Tab」“Pending”,”承認待ち”,
「Tab」“Denied”,”却下”,
「Tab」ThisItem.コンテンツの承認状態
)

「承認状態」の全体(図①)を選択します。「Default」(図2)に上書きで入力します。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

同じく、フォームの「データテーブル」「承認状態」の全体(図①)を選択します。「Text」(図2)に上書きで入力します。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

10. フォームの「貸出日」と「返却日」の開始日を今日にする関数を入力します。
SharePoint でも設定ができますが、Power Apps 側にその設定は引き継がれません。改めて、Power Apps 側に設定します。
「貸出日」と「返却日」それぞれに入力します。関数は、以下となります。

 貸出日
If(SharePointForm1.Mode=FormMode.New, Today(),ThisItem.貸出日)

 返却日
If(SharePointForm1.Mode=FormMode.New, Today(),ThisItem.返却日)

「貸出日」(図①)の全体に選択します。次に「Default」(図②)の部分に、上記の関数を入力します。難しい場合は、ツリービュー(図③)からも選択が可能です。 

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

11. 以上で、Power Apps を活用したカスタマイズは、終了です。
上部メニュー「ファイル」から「保存」をして「SharePoint に公開」をクリックします。再度、ポップアップ表示されますので、「SharePoint に公開」をクリックします。
Power Apps は、 SharePoint ​と同様にバージョン管理があり、前に保存したバージョンから復元が可能です。細目に保存をすることをおすすめします。
最後に、SharePoint に反映されているか確認します。

Power Apps でフォームをカスタマイズする

———————————————————————————————————————————————————————————————————————

ここまでの承認作業は、管理者が SharePoint 上で手作業で行います。
しかし、予約登録フォームに予約状態を可視化できる仕組みによって、ユーザーがすでに登録されている施設・備品を安易に確認でき、予約することの負荷が減るのではないでしょうか。
また、ここでは、貸出時間や返却時間を絞り込む関数は、かなり高度な技術が必要となるため採用していません。そのため、予約した日に既に予約が入っている場合は、ユーザーは、フォームに表示された時間を確認して空いた時間を選択するか、前後の登録者と直接調整してもらう必要があります。予約ルールを決めて円滑に運用しましょう。

Power Automate で「承認」を自動化する

SharePoint の予約フォームで登録した施設・備品を Power Automate で「承認待ち」から「承認済み」へ自動的に変更する仕組みを作成します。

1.  Microsoft Office ホームから、Power Automate を起動します。

2. 「マイフロー」(図①)をクリックして、「+新規」(図②)をクリック、プルダウンで表示された「自動化したクラウドフロー」(図②)を選択します。

Power Automate で「承認」を自動化する
———————————————————————————————————————————————————————————————————————

3. 「フロー名」(図①)にフローの名前を入力します。任意ですので、覚えやすい名前にしましょう。
続いて、フローのトリガーから「アイテムが作成または変更されたとき」(図②)を選択します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

4. フローの作成画面が表示されます。
「サイトのアドレス」(図①)をクリックすると、プルダウンで一覧が表示されるので、SharePoint で作成した予約フォームを選択します。直接URLを入力することも可能です。
「リスト名」(図②)も同様にクリックし、予約フォームのリストを選択します。続いて、「次のステップ」(図③)をクリックします。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

5. 「検索窓」(図①)に「SharePoint」と入力します。
「コンテンツの承認状態を設定します」(図②)を選択します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

6. 各項目の入力欄に情報を入力していきます。
各項目の入力内容は、以下となります。

 サイトのアドレス:SharePoint で作成した予約フォーム(※入力欄をクリックすると、選択ができます。)
 ライブラリ名:予約フォームのリスト(※入力欄をクリックすると、選択ができます。)
 ID:ID(※入力欄をクリックすると、選択ができます。)
 操作:Approve(※日本語で「承認」という意味です)
 コメント(※コメントは任意ですので、入れなくても大丈夫です。)

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

7. フローの特性上、無限ループが発生してしまうため、ステップの間に条件を追加していきます。
ステップの間にある矢印にカーソル合わせると、丸の中に+の入ったアイコン(図①)が表示されますのでクリックします。
プルダウン表示された「アクションの追加」(図②)を選択します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

8. 「条件」(図①)をクリックすると、下に一覧が表示されます。「条件」(図②)を選択します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

9. 「値の選択」(図①)をクリックし右下にプルダウン表示されますので、「コンテンツの承認状態」(図②)を選択します。
「次の値に等しい」(図③)をクリックし「次の値に等しい」を選択。「値の選択」(図④)に「Pending」と入力します。
※Pending は「承認待ち」のことです。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

10. 「はい」と「いいえ」の横2列に表示されました。
ここでは、「いいえ」の方だけ「終了」の設定をします。「はい」は、次のステップに進むため、何も設定はしません。
検索窓に、「終了」(図①)と入力し、下に表示された「終了」(図②)を選択します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

「状態」の入力欄(図①)をクリックするとプルダウン表示された「成功」を選択します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

11. 同じようにもう一つ条件を追加します。
こちらは、すでに承認済みとなった予約を登録者がキャンセルをした際に、フォームの承認状態を「却下」にするためです。

条件を設定する値は、以下となります。

 値の選択:キャンセル(※ SharePoint の列名を選択してください。)
 次の値に等しい:次の値に等しい
 値の選択:true(※入力欄をクリックし、「式」を選択し「true」と入力欄に記入)

今回は、「はい」の方に設定します。「いいえ」は次のステップに進むので、何も設定はしません。
設定するアクションは、「コンテンツの承認状態を設定します」になりますので、検索窓に「SharePoint」と入力して該当のアクションを選択してください。
入力する項目は、ほとんど変わりません。相違点は「操作」の部分を「Reject」を選択します。この値は、「却下」の意味になります。
こちらも任意ですが、予約がキャンセルされたための却下であるとコメントを入力しておくといいでしょう。

同じ「はい」の中に、次のアクションを追加します。キャンセルをしたユーザーに「却下 = キャンセルが承認された」というメールを自動で送信します。
検索窓で「Outlook」と入力し「メールの送信(V2)」を選択します。
メール送信の設定は、以下となります。

 宛先:登録者Email(※入力欄をクリックし、SharePoint の列名を選択してください。)
 件名:【貸出予約フォーム】予約キャンセル結果(※共通で使用可能な件名を入力してください)
 本文:設備・備品Value の予約をキャンセル処理されました。(※入力欄をクリックし、SharePoint の列名を選択してください。)

今回は、設定していませんが、詳細のオプションから「cc」に管理者のアドレスの追加や添付ファイルの送付が可能です。
さらに、次のアクションを追加しフローの終了の値を設定します。

Power Automate で「承認」を自動化する

———————————————————————————————————————————————————————————————————————

12. 上記で設定したメール設定と同様に、一番最後のステップの後ろにステップを追加してメール送信の設定をしましょう。
こちらは、予約した施設や備品が無事に「承認」されましたということをユーザーへ通知します。
設定方法は、先述した通りですので、件名や本文の文章を変えるだけ大丈夫です。

すべてのステップの設定が終了したら、一番下の「保存」をクリックして、SharePoint で確認しましょう。


まとめ

いかがでしょうか?
SharePoint のリスト管理だけでなく、Microsoft 製品の Power Apps でフォームをカスタマイズし、Power Automate で「承認」フローを自動化することにより、日々の忙しい管理業務を少しでも軽減するのではないでしょうか?
さらに、もっと高度な技術を使えば、より業務の効率化が図れます。ぜひ、挑戦してみてください。
弊社では、SharePoint のみで簡単に予約管理を可能にした「ez 備品予約・施設予約」という商品をご提供しています。
ご興味がある方は、ぜひ、下記よりお問い合わせください。


ez office の関連サービス

ez office では、SharePoint をはじめとした Microsoft 製品を活用したいお客様に対して、業務改善・効率化のお手伝いが可能なサービスを提供しております。


私たちも、 Microsoft 365 のユーザです。
貴社と同じ悩みを抱え、それを解決するための独自のソリューションを提供します。

  • ポータルサイト
  • 情報発信
  • 情報共有
  • 申請・承認 (ワークフロー)
  • スケジュール
  • 備品管理

どんな些細なことでも、お気軽にご質問・ご相談ください。

お問い合わせ

一覧に戻る

ランキング