IT Hands-on Lab

小規模組織向けIT環境の構築・運用に役立つ情報を、ハンズオン形式で紹介しています。

【Power Apps】QRコード読込機能付き 備品管理アプリ1

PowerApps QRコード読込による棚卸機能付き備品管理アプリ1

Microsoft社が提供するローコード開発ツール「Power Platform」のアプリ機能(Power Apps)を使用した、QRコード読込による棚卸機能付き備品管理アプリの作成例を紹介します。
  • 操作環境:
    • OS:Windows 11
    • Webブラウザー:Edge
  • 使用プラン:Microsoft 365 Business Premium
  • アプリ使用環境:
    • OS:Android 14
    • アプリ:PowerApps

以前の記事でバーコード読込登録機能付き書籍管理アプリの作成例を紹介しました。
この記事の備品管理アプリもQRコード読込による棚卸機能があり似ていますが、こちらの方が業務用途がありそう、かつ、フロー呼出しがなく手を付けやすいので紹介します。

 

 

要件・処理の流れ・項目の整理

この例では、以下のような要件にもとづき、アプリを実装します。

  • 組織内で保有しているIT備品について、システム管理者がデータ登録・変更・削除を行えるようにする。
  • 組織内メンバーはIT備品の全データについて、照会と棚卸を行えるようにする。
    *システム管理者以外の組織内メンバーについては、本人が使用者もしくは本人の所属部署が使用部署になっているIT備品のみを照会・棚卸できるようにすべきですが、この例ではシンプルな要件としました
  • IT備品にはラベルプリンターで作成したQRコード付きラベルを貼り付け、これをアプリで読み込ませることで、棚卸を行えるようにする。
  • QRコード付きラベルの貼り付けが難しいIT備品も多くあるため、アプリでQRコードを使用せずとも一括棚卸を行えるようにする。

 

このアプリの処理の流れは以下の通りとします。
なお、このアプリはSharePointリストのデータを元に作成できるギャラリーアプリを使用します。ギャラリーアプリにQRコード読込による棚卸や一括棚卸機能を付加するという、手軽なアプリ作成のイメージとなります。

図表1-1 処理の流れ

図表1-1 処理の流れ

 

このアプリで扱う項目は以下の通りとします。

項目名(説明) データ種類 必須 初期値等 特記事項
equiment_code(備品コード) タイトル   QRコードの値として使用する
equiment_name(備品名) 一行テキスト    
category(カテゴリ) 選択肢(*1)   *1.アプリ上、選択肢の手動追加を可とする
maker(メーカー) 選択肢(*1)   *1.アプリ上、選択肢の手動追加を可とする
acquired_date(取得日) 日付    
user_name(使用者,組織名) 一行テキスト(*2) (*3) 本人 *2.アプリ上、Officeユーザーの表示名と所属組織の選択肢とする
*3.statusが使用中なら必須とする
place(使用場所) 選択肢(*1)   *1.アプリ上、選択肢の手動追加を可とする
status(ステータス) 選択肢 使用中 選択肢:使用中,遊休,故障中,処分済
is_fixed_assets(固定資産か) 選択肢 いいえ 選択肢:はい,いいえ
inventory_date(棚卸日) 日付      
disposed_date(処分日) 日付 (*4)   *4.statusが処分済なら必須とする
memo(メモ) 複数行テキスト      
ID 数値 (自動取得) 詳細&編集画面の見出しにラベル表示し、項目自体は非表示とする
登録日時 日時(時間含む) (自動取得)  
登録者 ユーザーとグループ (自動取得)  
更新日時 日時(時間含む) (自動取得)  
更新者 ユーザーとグループ (自動取得)  
図表1-2 取り扱い項目

 

アプリの完成イメージ

先にアプリの完成イメージを紹介します。
まずはQRコードによる棚卸を行ってみます。

図表2-1 完成イメージ(QRコード棚卸)

図表2-1 完成イメージ(QRコード棚卸)

 

書籍管理アプリの記事にも記載しましたが、二点補足します。

  • QRコードの読込はWebブラウザーやTeamsデスクトップアプリからのアプリ表示では機能しません。スマートフォンにPowerAppsアプリを導入して使用する形となります。
  • QRコードが読込中のままで備品データを取得できない場合、PowerAppsアプリ起動時の左上アイコンからメニューを開き、[キャッシュをクリア]を選択すると改善します。

 

今度は、一覧画面で一括棚卸を行ってみます(右の画面から)。

図表2-2 完成イメージ(QRコード棚卸の続き,一括棚卸へ)

図表2-2 完成イメージ(QRコード棚卸の続き,一括棚卸へ)

 

最後は、備品データの新規登録を行ってみます(右の画面から)。

図表2-3 完成イメージ(一括棚卸,新規登録へ)

図表2-3 完成イメージ(一括棚卸,新規登録へ)

 

なお、詳細画面はQRコードによる棚卸時と詳細表示時で共通のフォームを使用していますが、詳細表示時はQRコード読込ボタンが表示されないようにしています(右の画面の通り)。

図表2-4 完成イメージ(新規登録続き,詳細画面の補足)

図表2-4 完成イメージ(新規登録続き,詳細画面の補足)

 

SharePointリスト用意

この例では、既存の備品データ(Excelのテーブルとして用意)を元にSharePointリストを作成します。
この備品データにはdisposed_date列がありませんが、このExcelからSharePointリストを作成した後で列を追加します。

図表3-1 元データ(Excelテーブル)の用意

図表3-1 元データ(Excelテーブル)の用意

 

SharePointの任意のサイト(*)にアクセスし、左メニューの[サイトコンテンツ]を選択し、[新規>リスト]を選択します。

*アプリ使用者にSharePointリストを直接触らせたくない場合は、アプリの管理者のみアクセスできるサイトが望ましいです

図表3-2 SharePointリストの作成へ

図表3-2 SharePointリストの作成へ

 

[Excelから]を選択します。
[ファイルのアップロード]を選択し、図表3-1のExcelファイルを指定します。

図表3-3 SharePointリストの作成(Excelファイル選択)

図表3-3 SharePointリストの作成(Excelファイル選択)

 

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

図表3-4 SharePointリストの作成(テーブルと列の種類の選択)

図表3-4 SharePointリストの作成(テーブルと列の種類の選択)

 

必要に応じてSharePointリストの名前を調整し、[サイトナビゲーションに表示]のチェックを外し、[作成]を選択します。
SharePointリストが作成されたら、[タイトル>列の設定>名前の変更]を選択し、列名を[equipment_code]に変更します。

図表3-5 SharePointリスト名設定,タイトル列名変更

図表3-5 SharePointリスト名設定,タイトル列名変更

 

この記事の最初の方の表の要件に従い、各列の設定を調整します(各列名を選択し、[列の設定>編集]を選択)。
例として、備品名・メーカー・取得日の設定画面のイメージを掲載します。

図表3-6 SharePointリストの列の設定

図表3-6 SharePointリストの列の設定

 

SharePointリストの一番右にある[列の追加]を選択し、[disposed_date]を追加します。

図表3-7 SharePointリストへの列の追加・設定

図表3-7 SharePointリストへの列の追加・設定

 

こちらは対応必須ではありませんが、SharePointリストの一覧参照時に分かりやすいため設定します。
SharePointリストの一番右にある[列の追加]を選択し、[列の表示と非表示を切り替える]を選択します。
[ID][登録日時][登録者][更新日時][更新者]にチェックをつけ、[適用]を選択します。

図表3-8 SharePointリストの列の表示設定

図表3-8 SharePointリストの列の表示設定

 

ギャラリーアプリ作成

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

図表4-1 PowerAppsアプリの作成

図表4-1 PowerAppsアプリの作成

 

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

図表4-2 PowerAppsアプリのデータソース選択

図表4-2 PowerAppsアプリのデータソース選択

 

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

図表4-3 PowerAppsアプリの設定メニュー選択

図表4-3 PowerAppsアプリの設定メニュー選択

 

左メニューの[全般]設定において、アプリの名前、アイコン、色などを適宜調整します。
同じ画面の下の方にある、[データ行の制限]を500から2000に変更します。

図表4-4 PowerAppsアプリの設定メニュー変更

図表4-4 PowerAppsアプリの設定メニュー変更

 

ラベルプリンターによるQRコードつきラベル作成(参考)

参考情報として、ラベルプリンターでQRコードつきラベルを作成する方法を紹介します。
紹介するラベルプリンターはBrother社のPT-P900Wです。PCにラベルプリンターを接続し、公式サイトから統合インストーラー(ドライバー・ラベル作成アプリ等を含みます)をダウンロード・インストールしておきます。

図表5-1 ラベルプリンターのドライバー入手

図表5-1 ラベルプリンターのドライバー入手

 

統合インストーラーのインストール完了後、ラベル作成アプリ[P-touch Editor]を起動します(デスクトップにアイコンが追加されている筈ですが、ない場合はスタートメニューから選択します)。
この例ではテンプレートを元にラベルのレイアウトを設計します。
[新規作成]を選択し、[データベースを接続する]にチェックをつけ、[備品管理]を選択します。

図表5-2 ラベル作成アプリの起動,新規作成へ

図表5-2 ラベル作成アプリの起動,新規作成へ

 

QRコードのついたテンプレートのうち、保有しているP-touchテープのサイズに合うものを適宜選択します(この例では24mmのテンプレート)。

図表5-3 ラベルテンプレート選択

図表5-3 ラベルテンプレート選択

 

[データベースファイルに接続する]を選択し、[参照]ボタンから工程3の最初に用意したExcelファイルを選択します。
[先頭行をフィールド名として使用する]にチェックをつけ、[次へ]を選択します。

図表5-4 データベース(Excelファイル)接続設定

図表5-4 データベース(Excelファイル)接続設定

 

データベーステーブルとして、Excelファイルの対象のワークシートを選択し、[次へ]を選択します。
ラベルのレイアウトが表示されたら、[データベースフィールド]にExcelシートの対象列を割り当てます。QRコードは[equipment_code]を割り当てています。

図表5-5 ラベルレイアウト調整

図表5-5 ラベルレイアウト調整

 

画面下部にデータ、画面上部に対応するラベルのイメージが表示されます。画面左側のプロパティでフォントや配置等を調整します。
調整が済んだら、ラベルを発行したいデータ行にチェックをつけ、[印刷]を選択します。複数チェックをつければ、まとめて印刷もできます。

図表5-6 ラベル出力データ選択

図表5-6 ラベル出力データ選択

 

[印刷]を選択すると、このラベルが印刷されます。

図表5-7 ラベル出力実行

図表5-7 ラベル出力実行

 

次の記事に続きます(第2回はアプリの編集・詳細画面、第3回は一覧画面の作成)。

 

 

当ブログ内の連載記事

elmgrn.hatenablog.com

elmgrn.hatenablog.com

 

当ブログ内の関連記事

elmgrn.hatenablog.com