
- 操作環境:
- OS:Windows 11
- Webブラウザー:Edge
- 使用プラン:Microsoft 365 Business Premium
要件・処理の流れ・項目の整理
この例では、以下のような要件にもとづき、アプリを実装します。
- データはSharePointリストに格納し、契約先と取引先の2つのリストを使用する。
- アプリは上記SharePointリストを元に作成できる、モバイル向けギャラリーアプリ(一覧・詳細・編集の三画面構成)を元にする。
- アプリは法務担当が使用する前提とし、全契約書データの参照、新規登録・変更(無効化を含む)を可能とする。
- 無効化した契約書データは削除しないが、ステータスによりアプリに表示しないようにする。
- 一覧画面の検索結果はデータテーブルを使用する。
- 詳細画面・編集画面では、同じ取引先の他の契約書データをデータテーブルに表示する。
- 編集画面の要件は以下の通りとする。
- 契約開始日と契約終了日の整合性チェックを行う(両項目に値があり、開始日>終了日ならエラーメッセージを表示)。
- 新規登録時、契約書IDは自動採番とする。
- 新規登録時、同じ取引先の他の契約書データから複写できるようにする。
以前の記事で取り上げていなかった、データテーブルの扱いの紹介がこの記事の主旨となります。データテーブルは現状プレビュー機能ですが、ギャラリー画面の代わりに使用できますので、情報量の多いデータを扱うのに向いています。
処理の流れは以下の通りです。

このアプリで扱う契約書データの項目は以下の通りとします。
| 項目名 | データ種類 | 必須 | 一意 | 特記事項 |
|---|---|---|---|---|
| 契約書ID | 数値 | ○ | ○ | 新規登録時:自動採番 |
| 取引先名 | 一行テキスト | ○ | ||
| 契約区分 | 選択肢 | ○ | 準委任契約,請負契約,派遣契約,秘密保持契約,その他の契約 | |
| 契約書名 | 一行テキスト | ○ | ||
| 契約開始日 | 日付 | |||
| 契約終了日 | 日付 | |||
| ステータス | 選択肢 | ○ | 締結準備中(初期値),締結中,終了,キャンセル,無効 | |
| メモ | 複数行テキスト | |||
| 添付ファイル | 添付ファイル | 予め用意された項目を使用する | ||
| タイトル | タイトル | 使用しない |
このアプリで扱う取引先データの項目は以下の通りとします。契約書データ登録・変更時に、取引先名をリスト選択するだけのマスターのため、項目は少なめです。
| 項目名 | データ種類 | 必須 | 一意 | 特記事項 |
|---|---|---|---|---|
| 取引先ID | 数値 | ○ | ○ | |
| 取引先名 | 一行テキスト | ○ | ||
| 取引区分 | 選択肢 | ○ | 仕入先,販売先,その他 | |
| 法人番号 | 数値 | |||
| ステータス | 選択肢 | ○ | 使用可,使用不可 | |
| メモ | 複数行テキスト | |||
| 添付ファイル | 添付ファイル | 予め用意された項目を使用する | ||
| タイトル | タイトル | 使用しない |
アプリの完成イメージ
先にアプリの完成イメージを紹介します。
まずは一覧画面の紹介です。
- 上:アプリにアクセスすると、一覧画面にステータスが[締結準備中]の契約書データが表示されます。
- 中:画面左上のラジオボタンの[満了間近]を選択すると、ステータスが締結準備中か締結中で、契約終了日が90日以内の契約書データが表示されます。
- 下:画面左上のラジオボタンの[全データ]を選択すると、ステータスが無効でない契約書データが表示されます。画面右上の入力欄に取引先名のキーワードを入力すると、これに合致する契約書データに絞り込まれます。

次は編集画面の紹介です。
- 上:一覧画面右上の[追加]アイコンから開始します。
- 下:取引先名をリストから選択すると、画面下部にこの取引先の他の契約書データのテーブルが表示されます。通常の各項目への入力だけでなく、このデータテーブルから内容を複写することができます。複写したいデータを選択し、[選択データ複写]ボタンを押します。

- 上:画面上部の入力フォームに複写元データの値が反映されます(ただし、契約書IDと添付ファイルは複写しません)。
- 下:契約開始日と契約終了日の両項目に値があり、開始日>終了日の場合、エラーメッセージが表示され、新規登録・変更は拒否されます。

最後は詳細画面の紹介です。
- 上:一覧画面に戻り、画面下部の契約書データから、参照したいデータを選択します。
- 下:詳細画面に遷移します。右上のアイコンから、このデータの変更(編集画面に遷移)や無効化を行うことができます。ここでは削除アイコンから無効化を行ってみます。

- 上:無効化した契約書データは、アプリから参照できなくなります。
- 下:SharePointリスト上は無効化したデータは残っています。

SharePointリスト用意
この例では、既存の契約書・取引先データ(Excelのテーブルとして用意)を元にSharePointリストを作成します。
なお、この例ではタイトル列は使用しません。しかし、Excelテーブルを元にSharePointリストを作成する際、タイトル列の指定が必須ですので、ブランクのタイトル列を設けています。


図表3-2 Excelファイル用意(取引先)
日付データを扱うため、念のためSharePointリストを作成するサイトのタイムゾーンを確認しておきます。
右上の設定アイコンを選択し、[サイト情報]を選択します。
[すべてのサイト設定を表示]を選択します。

[サイトの管理]の[地域の設定]を選択します。
[タイムゾーン]が大阪、札幌、東京になっていない場合、変更しておきます。

SharePointサイトにて、左メニューの[サイトコンテンツ]を選択し、[新規>リスト]を選択します。
[インポート元]の[Excel]を選択します。

[ファイルのアップロード]を選択し、図表3-1,2で用意したExcelファイルを指定します。

まずは契約書データのSharePointリストを作成します。
Excelファイルのテーブル名を選択し、列の種類はこの記事の最初の方の表で整理した取扱い項目のデータ種類に沿って選択し、[次へ]を選択します。
リスト名を入力し、[作成]を選択します。

SharePointリストが作成されたら、一番右の[列の追加]を選択し、[列の表示と非表示を切り替える]を選択します。
[タイトル]のチェックボックスをOFFにし、[添付ファイル]のチェックボックスをONにし、[適用]を選択します。

各列の設定は以下の通りとします。


図表3-10 契約書データ各列の設定の続き

図表3-11 契約書データ各列の設定の続き
右上の設定アイコンを選択し、[リストの選択]を選択します。
[列の順序]を選択します。
タイトル列が一番最後になるよう並び順を変更し、[OK]を選択します。

取引先データも同じ要領で作成します。
Excelファイルのテーブル名を選択し、列の種類はこの記事の最初の方の表で整理した取扱い項目のデータ種類に沿って選択し、[次へ]を選択します。
リスト名を入力し、[作成]を選択します。

SharePointリストが作成されたら、一番右の[列の追加]を選択し、[列の表示と非表示を切り替える]を選択します。
[タイトル]のチェックボックスをOFFにし、[添付ファイル]のチェックボックスをONにし、[適用]を選択します。

各列の設定は以下の通りとします。


メモ列は契約書データ(図表3-11)と同じ設定なので割愛します。
右上の設定アイコンを選択し、[リストの選択]を選択します。
[列の順序]を選択します。
タイトル列が一番最後になるよう並び順を変更し、[OK]を選択します。

ギャラリーアプリ作成
Power Appsの画面にアクセスし、左メニューの[アプリ]を選択し、[新しいアプリ>アプリテンプレートで開始する]を選択します。
[データ中心のモバイルアプリ]の[SharePointから]を選択します。

前の工程で作成したSharePointリストがあるサイトを選択し(表示されない場合はURL指定)、対象のSharePointリスト(契約書管理)を選択し、[アプリを作成する]を選択します。

アプリの設計画面が表示されたら、上メニューの[・・・>設定]を選択します。

左メニューの[全般]設定において、アプリの名前、アイコン、自動保存のオフ/オン等を適宜調整します。
なお、[データ行の制限]は、上限値の2000に変更することをお奨めします。

アプリ実装:基本部分
この例ではデータテーブルによる一覧画面を使用するため、アプリの幅を広めに変更します。
左側[ツリービュー]で[App]を選択し、右側プロパティの[詳細設定]タブを選択し、[MinScreenWidth]の値を640から1920に変更します。

編集画面で取引先名を選択する際、工程3で作成した取引先データを参照しますので、データソースに追加します。
左端の[データ]アイコンを選択し、[データの追加]を選択し、[SharePoint]を検索し、表示されたらこれを選択します。
工程3でSharePointリストのあるサイトを選択します。
[取引先管理]にチェックをつけ、[接続]を選択します。
左側の[データ]に表示されたら追加完了です。

次の記事へ続きます。
当ブログ内の連載記事