【UiPath Appsでアプリ作成③】Data Serviceにデータを登録する

今回はUiPath Appsで画面を作成し、Data Serviceのエンティティへデータを登録する方法について書いていきます。
前提として、前回までに作成したアプリをもとに書いているので、もしアプリの作成がまだの方は、以下の記事を参照してみてください。

https://qiita.com/kumatech/items/f1b8ea4c683233b8bc23

[【公式ドキュメント】UiPath Apps](https://docs.uipath.com/ja/apps/automation-cloud/latest)
[【ユーザーガイド】AppsをData Serviceと使用する](https://docs.uipath.com/ja/apps/automation-suite/2022.10/user-guide/using-apps-with-data-service)

<h2>作成する画面</h2>
金額や項目といった支出内容を入力し、支出管理テーブルにデータを登録する画面を作成していきます。

![エンティティへ登録.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/2be64dfb-3c4a-9a2c-be70-9213e71600be.gif)

登録後のテーブル

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/f7dda388-0f91-9224-e0fc-497c502136a0.png)


<h2>Data Serviceの準備</h2>

[Automation Cloud](https://cloud.uipath.com)を開き、メニュー画面からData Serviceを開きます。
Data Serviceがメニューに表示されない方は、[Automation Cloud 管理ガイド](https://docs.uipath.com/ja/automation-cloud/automation-cloud/latest/admin-guide/managing-services)をご確認ください。
    
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/520a9cdc-f592-7a9c-5475-9db31bd51230.png)

画面右上の[新しいエンティティを作成]をクリックして、支出管理を行うテーブルを作成します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/882a4bd1-2d8b-0847-510a-42f89aff673a.png)


必要な項目を記入し保存します

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/5b4c9ef1-8e67-273a-17ce-79a71baddaa4.png)

[新しいフィールドを作成]をクリックし作成した支出管理テーブルにいくつかフィールドを追加していきます。今回は、支出額(型:Number)、カテゴリ(型:Text)、日付(型:Date)、コメント(型:Text)の４つの項目を追加しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/2e320d0e-6f95-2e04-3a44-38b1354c7b37.png)

これでData Service側の操作は完了です。


<h2>アプリ内にエンティティを追加</h2>
作成したエンティティをアプリで参照するには、エンティティをアプリに追加する必要性があります。アプリの画面を開いて、[コントロールを追加]の右側にあるドロップダウンメニューを展開し、エンティティを選択します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/c24bd1e3-be9a-16f9-ea90-312a327cff66.png)

テナントを選択します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/6d62b3a5-e030-6253-d987-ac86683192d6.png)

先ほど作成したエンティティのチェックボックスをオンにして追加をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/2a67d120-457e-bbb6-7416-a7b483097031.png)

これでエンティティをアプリに追加することができました。

<h2>データ登録機能の作成</h2>

アプリの支出の記録ページを開きます。画面に支出内容の詳細を入力するためのコントロールを配置します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/356716d1-aeaf-e1c6-a147-a6465295b7dc.png)

[ドロップダウン]に関しては選択肢が必要なため、全般のリストのソースの設定を行います。式エディターを開いたら、支出項目の選択肢をリストにした以下の式を張り付けてください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/057f4bd7-30ff-d069-9de4-e763bcc37322.png)

```
AppsDataSource.from(New List(Of String) From {"生活費", "日用品", "娯楽費", "交際費", "衣服・美容", "健康・医療", "教育費", "特別支出", "資産", "その他"})
```
:::note Info
<b>AppsDataSource型への変換</b>
慣れている方はリストを作成するといえばNew List(Of String)を思いつくはずです。しかし今回のリストのソースの設定ではAppsDataSourceという型が求められているため、New List(Of String)だけではOption Strict On disallows implicit conversions from 'List(Of String)' to 'AppsDataSource'.というエラーが表示されます。このエラーを解消するために、AppsDataSource.from()をNew List(Of String)の前に記載し、型の変換を行います。
:::

これでエンティティに登録するための入力欄を用意することができました。しかしこれだけではエンティティには登録されません。クリックしたときにエンティティの登録処理が行われるボタンを配置しましょう。入力欄の一番下に[ボタン]を配置し、表示名を「保存」に変更します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/76b528e4-0b75-b41c-7370-19d56b7f7488.png)

ルール設定画面で[エンティティ レコードを作成]を追加し、支出管理テーブルのエンティティをダブルクリックで選択します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/e49b4027-14d8-f720-f92b-9d1937b3e918.png)

値を設定するために、各項目の横にある[式エディターを開く]をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/474cf1c2-715d-6064-c77a-6f4760e9474e.png)

各項目を更新するための式を入力し、保存します。
```
#カテゴリ
支出の記録ページ.CategoryDropdown.SelectedItem.ToString

#コメント
支出の記録ページ.CommentText.Value

#支出額
支出の記録ページ.AmmountText.Value

#日付
支出の記録ページ.Datepicker.Value

```

:::note warn
<b>式の書き方</b>
式は、<b>[ページの名称].[項目の名称]</b>の順番で構成されています。そのため、上記の式をコピー&ペーストしただけではエラーが表示される場合があります。ご自身の環境に合う形に変更してお使いください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/7836d765-9730-8c6e-1f82-82ccb11c1355.png)
:::

最後に、エンティティのレコード作成時に登録した内容を表示するポップアップメッセージと、リダイレクトするページを設定しましょう。

メッセージにはカテゴリと支出額を表示させます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/4fa515fc-2b16-787d-6705-6d159fdb5900.png)

リダイレクト先にはトップページを選択します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/72ad9d31-3a72-ad22-6ddb-bfc038ea257c.png)

これで完成です！
最後に実行してみて、エンティティに登録されているか確認しましょう。
Data Serviceを開き、エンティティを開いたらデータのタブへ切り替えます。追加したレコードが確認できればOKです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3575031/228aa70c-b4d1-b79a-cb8b-03f0968fe53a.png)

<H2> まとめ</H2>

今回は、アプリの画面からData Serviceのエンティティへデータを登録する方法をまとめました。次回は、登録したデータを一覧で表示する方法について書いています。

https://qiita.com/kumatech/items/f7fbca24ec26bf1e97b2

是非、過去の記事と合わせてお読みください！