今回の記事では、前の質問に応じて回答が変更される動的なフォームを作成します。一番簡単な実現方法はAppsとの連携が簡単なData Serviceの機能を利用することです。ただ今回はExcelをデータテーブルにして実現します。
前回の記事でも同様にAppsとStudio Webを使ってExcelをデータテーブルにした自動化を実現しているのでぜひ参考にしてください！
開発環境
ワークフロートリガーを利用するため、23.10以上のStudioがあれば本記事で行った開発を実施することができます。また、記事内でご紹介したStudioの式生成機能を利用する場合にはStudio24.10以上のStudioを用意してください。今回作成するもの
今回はオフィス用品を発注するためのフォームを作成します。分類と商品名の項目があり、分類の選択結果に応じて商品名のプルダウンの選択肢が変わる仕組みです。
今回は前回と異なり ワークフロートリガー の機能を使ってStudioで作成したワークフローを呼び出します。
[ワークフローをトリガー] の機能はボタンをクリックしたときにあらかじめ作成したプロセスを呼び出し、結果を取得してアプリの画面に即時に反映させることができます。この機能を用いて、動的に変化するフォームを作成しましょう！
事前準備
以下のテキストをコピーしてオフィス用品リストという名前のExcelをデスクトップに作成しておいてください。
| 商品名 | 分類 | 単価 |
|---|---|---|
| 文具 | ボールペン | 100 |
| 文具 | ノート | 200 |
| 文具 | ホッチキス | 300 |
| 文具 | 蛍光ペン | 150 |
| 文具 | 消しゴム | 50 |
| PC周辺機器 | マウスパッド | 500 |
| PC周辺機器 | USBメモリ | 1000 |
| PC周辺機器 | ヘッドセット | 3000 |
| PC周辺機器 | LANケーブル | 800 |
| PC周辺機器 | マウス | 1500 |
| 紙製品 | コピー用紙 | 1000 |
| 紙製品 | 付箋 | 200 |
| 紙製品 | メモ帳 | 150 |
| 紙製品 | ファイル | 300 |
| 紙製品 | クリアファイル | 100 |
| オフィス家具 | デスクライト | 3000 |
| オフィス家具 | デスクトレー | 1000 |
| オフィス家具 | ペン立て | 500 |
| オフィス家具 | ゴミ箱 | 1000 |
| オフィス家具 | カレンダー | 800 |
表示画面の編集
Appsからタイトルをつけてアプリを作成します。
今回も前回同様、テンプレートのフォームDを選択しました。入力項目にはプルダウンが2つだけが残るようにします。表示名に合わせて項目名もそれぞれCategory、Itemに変更しておいてください。
オートメーションの構築
表示画面ができたので次は裏で動くワークフローを作成します。1．テンプレートを利用
あらかじめ用意されているテンプレートを使用して開発を進めます。Studioのトップ画面からテンプレートに進み、Appsと検索してください。Apps-Workflow communicationというテンプレートが出てくるのでそれを利用していきます。
もし検索しても出てこない方はMarketplaceより取得して利用してください。
ワークフローの名前はRetrieveExcelDataとします。
2．Excelデータ取得ワークフロー
Excelのデータを読み込む1つ目のワークフロー、01_ReadExcelData.xaml を作ります。
Studioの画面左上から[新規]をクリックし、新しいシーケンスを作り名前を付けます。作成したら左のプロジェクトパネル上で表示されるので、後でわかりやすいようにInvokedWorkflowsのフォルダに移動させます。またファイルを右クリックして、[エントリ ポイントを有効化] をクリックしてください。この工程を忘れると後でAppsで参照できません。
先に引数を二つ作ります。
| 引数名 | 方向 | 引数の型 |
|---|---|---|
| outDataTable | Out | System.Data.DataTable |
| outCategoryList | Out | System.Collections.Generic.List |
続いて[Excelファイルを使用]と[範囲を読み込み]の二つのアクティビティを配置して、Excelのデータを読み込みます。読み込まれたデータテーブルは先ほど作成した引数に保存します。
Excelプロセススコープのプロパティから[Excelウィンドウを表示]の設定をオフにすることでワークフローを呼び出し時にExcelが開かれず、より高速に通信できます。
次にプルダウンに分類の一覧を表示させるためにExcelの2列目をリスト型として出力します。[代入アクティビティ] を配置し、左辺には先ほど作成したoutCategoryListを使用します。右辺を設定するために式エディターを開きます。
1列目をリスト形式で出力する式は複雑なため、生成AIに式を作ってもらいましょう。
outDataTableの1列目をリスト形式に変換して
これだけで十分な式を作ってくれました。素晴らしい！
ただこのリストのままでは分類が複数含まれてしまいます。
| 分類 |
|---|
| 文具 |
| 文具 |
| 文具 |
| 文具 |
| 文具 |
| PC周辺機器 |
| PC周辺機器 |
| PC周辺機器 |
| PC周辺機器 |
| PC周辺機器 |
| 紙製品 |
| 紙製品 |
| 紙製品 |
| 紙製品 |
| 紙製品 |
| オフィス家具 |
| オフィス家具 |
| オフィス家具 |
| オフィス家具 |
| オフィス家具 |
一意の値だけ取得できるように追加のプロンプトを渡します。
これも自然言語で式を指定するとうまく一意の値だけ取れました！
| 分類 |
|---|
| 文具 |
| PC周辺機器 |
| 紙製品 |
| オフィス家具 |
保存して1つ目のワークフローは完成です。
3．データテーブルのフィルターワークフロー
1つ目のプルダウンでは分類を選択しました。次は1つ目の分類の選択結果に応じて、2つ目のプルダウンの選択肢を変えるためのワークフロー、 02_FilterTable.xaml を作成します。先ほどと同様にシーケンスを作成してエントリポイントを有効化 してください。
引数は3つです。
先ほど読み込んだテーブルと1つ目のプルダウンで選んだ選択肢を引数として渡し、その分類と一致するアイテム名を出力します。
| 引数名 | 方向 | 引数の型 |
|---|---|---|
| inDataTable | In | System.Data.DataTable |
| inCategoryName | In | System.String |
| outItemList | Out | System.Collections.Generic.List |
変数も1つ作成します。
| 変数名 | 変数の型 |
|---|---|
| FilteredTable | System.Data.DataTable |
変数と引数の設定ができたら[データテーブルをフィルター] アクティビティを配置し、[データテーブル]の項目には、先ほど作成したinDataTableを設定します。[フィルターを設定]から、フィルタの左辺には先ほど同様、AIに式を生成してもらいます。
inDataTableの1列目
右辺には、inCategoryNameにします。これによって1つ目のプルダウンで選択された値、つまりinCategoryNameと一致するデータのみが残ります。
最後にデータテーブルをリスト形式に変換します。[代入]アクティビティを配置し、左辺にはoutItemListの引数を設定します。右辺の式は生成AIに作ってもらいます。
FilteredTableの2列目をリスト形式に変換して
これでワークフローの作成は完了です！
4．ワークフローのパブリッシュ
パブリッシュして、Orchestratorにデプロイしておいてください。 下記の記事の「Studioからオートメーションプロジェクトのパブリッシュ」と「プロセス登録」の項目が完了すればOKです。
アプリとオートメーションの連携
アプリにワークフローを起動するルールを作成します。
- アプリを読み込み時 → 01_ReadExcelData.xamlを呼び出し
- 分類のプルダウンを選択時 → 02_FilterTable.xamlを呼び出し
アプリを読み込み時のルール設定
事前に作成したワークフローをアプリで参照できる状態にしておいてください。
準備ができたら画像のように左のパネルから一番上の階層を選択した時に右側のパネルに表示させるルールを作成をクリックします。
[ワークフローをトリガー] のルールを配置して、01_ReadExcelData.xamlを選択します。
これで1つ目のワークフローの準備は完了です。
ワークフローの結果を分類のプルダウンに設定
01のワークフローから出力されたoutCategoryListを分類のプルダウンのリストに当てはめてみましょう。方法は簡単です。分類の項目を選択して、[リストのソース]を見つけます。 プロセス > InvokedWorkflows_01_ReadExcelData_xaml > outCategoryListの順番で選択するとリストを設定することができました。
分類のプルダウンを選択時のルールを設定
分類のプルダウンが選ばれたときに、選択された値に応じて次の商品名のプルダウンの選択肢を変更できるようにします。そのためには、分類のプルダウンが変更されたときにワークフローを起動します。分類のボタンが選択された状態で、[ルールを編集] をクリックします。
[ワークフローをトリガー] のルールを配置して、02_FilterTable.xamlを選択します。
[入力の上書き] からワークフローの引数を設定します。
①inDataTable
左辺には、02_FilterTableのinDataTableを選択します。
右辺には、01_ReadExcelDataのアウトプットを出力を設定します。
②inCategory
左辺には、02_FilterTableのinDataTableを選択します。
右辺には、分類のプルダウンで選択された値を取得します。
ワークフローの結果を商品名のプルダウンに設定
最後の工程です。02のワークフローの結果を商品名のプルダウンのリストのソースとして設定します。02のワークフローのアウトプットであるoutItemListをリストのソースに代入します。
これですべての開発が完了しました！
プレビュー
最後に動作を確認します。
紙製品を選択すると、、
無事に紙製品の商品だけ表示されるようになりました！
少しラグを感じるかもしれませんが、そこまで違和感はないです。
最後に
今回はローカルのExcelファイルをデータテーブルとしてアプリを作成しました。ほかの人にもこのアプリを使ってもらう場合には、ワークフローの中で、共有のファイルサーバーに置いたExcelファイルをダウンロードする処理を追加するとよいかもしれません。スプレッドシートなどでも作成可能です。
ぜひ今回のアプリをベースにカスタマイズした素敵なアプリを作ってみてください！