技術情報ブログ
Power Platform
2022.03.16

Power Apps キャンバスアプリ:承認機能の設計方針

Power Apps キャンバスアプリ:承認機能の設計方針

こんにちは。アーティサン株式会社の小刀稱(ことね)です。

Power AppsやPower Automateを用いて申請・承認を行うアプリを作成したことはありますか?
弊社でも、申請・承認アプリは特に要望の多いアプリの1つです。

承認機能を実装する際には、Power Automateの承認アクションを用いることが一般的です。
一方で、お客様からは「Power Appsのアプリ上で承認したい」という要望を頂くことも多いです。

そこで、今回は承認機能の設計方針について説明いたします。
Power Apps キャンバスアプリを設計にする際に参考にしていただけますと幸いです。

内容としては、既にPower Apps・Power Automateでアプリを作成したことがある方に向けた記事です。

 

承認機能の設計方針

承認機能を実装するには、以下の方針が考えられます。

以下では、それぞれの方法について説明します。

 

Outlook/Teams上から承認/拒否を実施

Power Automateの承認アクションを用いる方法です。
※承認アクション:「開始して承認を待機」アクションや「承認を作成」アクションを指します。

Power Automateでの承認アクション
Power Automateでの承認アクション

この方法を用いると、OutlookやTeams上で承認/拒否を実施可能となります。
(承認アクションを1つ設定するだけで、Outlook・Teamsへ同時に通知されます。)

Outlook/Teams上での承認画面
承認画面(左:Teams、右:Outlook)

メリットとしては、Power Automateの標準機能を用いて構築するため、実装の難易度が低いことが挙げられます。
また、承認者が都度アプリを起動する必要がないため、承認処理の手間は小さくなります。

一方、デメリットとしては、Power Appsのアプリ上では承認処理を行うことはできないことです。
よって、承認者が自身の未承認一覧を把握し、承認を行いたい場合、 「OutlookやTeams上で未承認の通知を探し出し、承認作業を実施する」という作業が必要となります。

上記を手間を減らすためには、Power Automateが標準で提供している承認画面を用いる方法もあります。
※標準の承認画面は、アプリに関係なく、そのユーザーが対応すべき全ての申請情報が表示されています。

承認画面のURLは、Office 365へログインし、Power Automate → 実施項目 → 承認 → 受信済みと進んだ際の画面です。
この画面で、自分が承認処理の行う必要があるアイテム一覧を確認し、承認/拒否を実施することができます。

Power Automate_承認画面のURL
Power Automate_承認画面のURL

 

Power Apps キャンバスアプリ上から承認/拒否を実施

Power Automateの承認アクションを用いることなく、自力で承認処理を実装する方法です。
Power Apps キャンバスアプリのサンプル画面を以下に示します。

Power Apps キャンバスアプリ上での承認画面
Power Apps キャンバスアプリ上での承認画面

メリットとしては、Power Apps キャンバスアプリ上から承認/拒否を実施させることが可能である点です。
よって、承認者が自身の未承認一覧を把握し、承認を行いたい場合、「キャンバスアプリ上で未承認一覧を把握→そのまま承認を実施する」というシナリオが対応可能です。

また、自力で実装するため、承認画面や機能をある程度自由に設計できる点も挙げられます。
(例:拒否を行う場合は、コメントを必須とするなど)

一方、デメリットとしては、Outlook/Teams上から承認/拒否の実施はできないことです。
また、自力で承認処理を構築するため、実装の難易度は高くなります。

キャンバスアプリ構築のイメージとしては以下です。

  • 申請者が承認処理を実施すると、承認者へメールを送信する。

    Power Automateにて、「申請ボタンを押下した際、承認者へメールを送信する」フローを作成します。
    また、送信するメールの中に、キャンバスアプリのURLと申請ID値を記載します。

    Power Apps上で承認する際のメール画面
    Power Apps上で承認する際のメール画面
  • 承認者用のキャンバスアプリは、URLに申請ID値が含まれている場合は、対象の申請詳細画面を開くように実装する。

    param()関数を用いて実装します。
    詳細は以下をご参考にしてください。

    Power Apps の Launch および Param 関数

     

  • 承認者用のキャンバスアプリでは、画面上に承認/拒否ボタン及びコメント用のテキストボックスを追加する。

    Power Apps キャンバスアプリ上での承認画面詳細
    Power Apps キャンバスアプリ上での承認画面詳細

    実際の運用を行う際には、以下の機能も実装することをお勧めします。

    1. 自身が承認者となっていない場合は、承認/拒否ボタンを非活性させる。

    2. 他の承認者が先に承認した場合、レコードが上書きできないように、データの排他制御処理を行う。

    Power Automateの承認アクションは自動的に排他制御(他の人が承認したら、自身は承認できなくなる)が実装されていますが、このような機能も自力で実装していく必要があります。

 

まとめ

今回紹介した対応方針について、メリット・デメリットを以下にまとめました。

 

メリット

デメリット

Teams/Outlook上から承認/拒否を実施

・実装の難易度が低い

・通知の文面上で承認ができるため、承認処理の手間が比較的小さい

・未承認一覧から承認を行う場合、手間が大きい
※Power Automateの承認画面から一覧の把握は可能
・承認画面や機能は固定

Power Apps キャンバスアプリ上から承認/拒否を実施

・未承認一覧から承認を行う場合、手間が小さい

・承認画面や機能をある程度自由に設計できる

・実装の難易度が高い

・アプリを起動した後承認を行うため、承認処理の手間が比較的大きい

 

参考:Teams/Outlook上、かつPower Appsキャンバスアプリ上から承認/拒否を実施することはできるのか?

参考として、上記2つの方法の組み合わせた方法が実装できるのかについて検討します。

TeamsやOutlook上で承認/拒否を行うことが可能であり、かつPower Appsのキャンバスアプリ上からでも同様の処理ができるイメージです。
実装の難易度としては、非常に高くなることが考えられます。

理由としては、前項で説明したデータの排他制御に加え、Power Apps・Power Automate間で承認処理の同期をとる必要があるからです。
(Power Apps上で承認した場合は、Power Automateの承認アクションを終了させるなど)

アプリを利用するユーザーの立場から考えると、一番使いやすいアプリになるかもしれませんが、
実装の難易度が格段に高くなるため、アプリを提供するまでの期間が長くなることやバグが発生しやすくなることを考慮すると、 前述した2つの方法のどちらかで対応することを推奨いたします。

ローコードアプリを作成する際の設計思想については、以下をご参考にしてください。

本記事では、承認機能の設計方針について説明しました。
アプリを設計にする際に参考にしていただけますと幸いです。

Power Platform(SharePoint・Power Apps・Power Automate)に関する営業活動や設計、開発などを担当:小刀稱知哉

小刀稱知哉

大分県出身(温泉大好き)、現在は東京都在住

1990年生まれ

30才でメーカーの技術営業からIT業界にジョブチェンジ!!!

趣味は読書

Power Platform(SharePoint・Power Apps・Power Automate)に関する営業活動や設計、開発などを担当しております!

持ってる資格はPL-200/PL-300/PL-400/MS-700/AZ-104/AZ-305

シェアする
記事カテゴリ
最新記事
2024.06.05

【2024年6月更新】Power Automate 設計・構築時のTips集

2024.05.15

非エンジニア【(元)自治体職員】がローコード開発をして気が付いたこと コーディング規約とPower Platformプレミアムサンプルアプリ集

2024.05.01

Power Apps・Power Automateの勉強方法(2)

2024.04.17

Power Apps・Power Automateの勉強方法(1)

2024.04.03

非エンジニア【(元)自治体職員】が半年間ローコード開発をしてみたら

モデル駆動型アプリPower AppsPower PlatformSharePointExcelPower AutomateC#attributevalidationローコードAngularAccessInfoPathMatTableAngular Materialデータ構造SortByColumns関数TypeScriptHTMLEF CoreマイグレーションFramework CoreAttribute directivesO/Rマッパーazure sql databaseCase式HTTP RequestCSSxUnit.Net Core 3.1VSCode.Net Core Test ExplorerDataverse for Teamsitem関数Google MapsMarker ClustererRANK()関数Dynamics 365 SalesMicrosoft TranslatorマーカークラスタリングライブラリtailwindcssマルチテナントドロップダウンメニューBreakpointObserverメディアクエリスマホPCレスポンシブ入門初心者中級者キャンバスアプリDatePickerDropdownviewビューアクセス制限承認リマインドSetForAllUpdateContextロードマップ技術It情報技術メッセージIDメールfirst()関数nest入れ子動的リストcollectionコレクション複数の添付ファイル承認フローformエクスポートインポートカスタマイズcomponentダイアログコンポーネントdialogTips新機能変数検索Microsoft 365グループセキュリティグループ送信元メールの送信差出人インスタントクラウドフロー自動化したクラウドフロー委任VBAエラーエクセルerror復元restorePower BI個人列ユーザー列SharePoint Onlineリスト非表示アプリ[市民開発者構築自動化したクラウド フローフローの種類インスタント クラウド フロースケジュール済みクラウド フローレスポンシブ レイアウトresponsive layoutデータ行の制限引き継ぎ退職所有者を変更異動LoopMicrosoftdesignJSONデザインtemplateテンプレート運用選択肢列参照列ChatGPTOpenAIオープンAIチャットGPTgalleryギャラリースクロールコンテナショートカットキーshortcut keyconcat関数文字制限フロー実行開発環境環境本番環境ライセンス環境構築手順pipelineCI/CDパイプラインDevOpsMicrosoft 365簡易在庫管理時間外通知ファイルフィルター クエリドキュメント ライブラリfilter querysortソートmultiple item複数項目シェアポイント便利機能カレンダーCalendarTeamsローコード開発非エンジニア体験談勉強内製化
PageTop
ページトップに戻る