【ServiceNow】欲しい物承認アプリ作ってみた。（超基本）

こんにちは。
IT歴5年のSEです。
ServiceNowの案件を始めて半年たったので、
ノウハウ整理のために簡単なアプリを作ってみました。

色々ServiceNowの機能を試していくために、
超基本的に作ったので、これから色々実装していくことをQiitaの記事に投稿していこうと思います。


今回は、ServiceNowで超シンプルに「欲しい物承認アプリ」を作ってみました。
イメージとしてはこんな感じ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/c717c181-e4b7-9d91-0f91-01d5f1bd807d.png)

もうちょっと詳細。
【登場人物】
・私
・お嬢

【使い方】
①私が欲しいものを登録
②お嬢が私が登録した欲しいものを確認
③お嬢が欲しいものに「買ってい良い」（承認）か「買っちゃダメ」（非承認）を登録
④私が「買ってい良い」と承認されたものを買う
⑤私が買ったものを「購入済み」として登録

【利用フロー図】
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/2a242c13-2057-94ae-4805-ad8e7a0f47e4.png)


<hr>
では、実際のServiceNowで作成したアプリを見てみましょう！

◆まずはホーム画面。メニューは、アプリケーションメニュー（Application Menu）とモジュール（Module）で構成されています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/8b3fbbf2-624d-37ee-9012-698118a1931f.png)



◆モジュール「欲しいものリスト」をクリックすると、欲しい物リストが表示されます。
　まだ何も登録していないので、レコードはありません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/7ca78cc1-24ea-7070-33cd-8a4d45b911e9.png)

◆それでは、欲しいものを登録していきましょう！「新規」ボタンをクリックすると欲しい物登録画面に遷移します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/06c3e5ea-aa35-982f-dc45-7ecc1686ead1.png)


⇓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/61a5a434-932d-18b5-05ed-209cc0001463.png)


◆欲しいものを入力していきます。今回欲しいものとして登録するのは以下です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/64460f06-b272-54db-da8d-e40f87e60a5a.png)

1つ目、「任天堂スイッチ」を登録します。欲しい理由も入力しておきます。
他はデフォルトのままです。入力し終わったら「送信」ボタンをクリックして登録を完了させます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/a1aca219-c676-c4b7-b187-98a285d699a2.png)

欲しい物リストに戻ります。先ほど登録したレコードが表示されていますね！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/73c838c6-f0bf-9ca5-a5c5-0eb1d1dc6f68.png)

同じ手順で残り二つも登録していきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/1cc5942d-7fdf-4b61-5d36-f8412d0730b5.png)

以上で、私の欲しいものがすべて登録できました！
お嬢に確認をお願いします。

◇お嬢が欲しい物リストを確認します。モジュール「欲しいものリスト」をクリックして、欲しい物リストを表示します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/2b4d13f4-3617-ad44-506f-417a4827ffea.png)
⇓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/e1839768-2603-c2c5-0186-3dbdabcfc40f.png)

◇確認するレコードの一番左のカラムをクリックします。（今回は「承認ステータス」カラム）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/a1fd1b5b-5c62-fffd-a82e-deb27f9cd24e.png)

◇レコードの詳細画面に遷移します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/92640d9f-c818-7b95-f5ad-c527678090b4.png)

◇内容を確認し、買ってよいか、ダメか承認結果を更新します。
　ギターは買ってはダメなので、「承認ステータス」を"ダ・メ・♡"に変更します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/4a11dc89-6c3d-0bf8-40a2-092ab0329098.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/48b06cea-3cc6-6466-1859-0f7e465d7440.png)

◇「更新」ボタンをクリックして更新します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/da94d0c7-4164-598d-c563-b8dd29c52ffd.png)
⇓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/eb3f379d-d822-02dc-4816-21612e5bbc99.png)

他2つも同じように更新していきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/ca34fe14-cc5f-f59d-0fd4-bcfe6ddd4ed4.png)


以上で、お嬢の承認がすべて完了したので、私が承認結果を確認します。

◆「承認ステータス」を確認し、"買っていいよ！"となっているものを確認します。
　今回は"任天堂スイッチ"が買ってよいとなっています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/dbdb3eae-868a-8217-3025-3ed7f1c0f4b2.png)

◆私は任天堂スイッチを買います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/da80758d-5b10-024c-388e-8cf0e4a40099.png)

◆任天堂スイッチを買ったら、買ったことを登録します。
「承認ステータス」カラムをクリックして、詳細画面に遷移します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/f2873e92-eaea-e98f-9d8b-e66efa02c19a.png)

「購入ステータス」カラムを"購入済み"に変更します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/39f9e70d-e83f-f7a0-3d04-59f50fd2dad7.png)

「更新」ボタンをクリックして、更新を完了します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/b66217ae-f39e-8e18-cc78-3462caf30d06.png)

欲しい物リストに戻ります。「購入ステータス」カラムが"購入済み"となりすべての工程が完了となります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723003/cf70ba41-fc9c-29f7-f3fa-476c034fe7de.png)


いろいろ改善点がありそうですね。。。
（ユーザビリティ、権限制御、テーブル構造…）
あと、ServiceNowの機能もほとんどまだ使ってないです。
これからこのアプリを便利にしたり、試したい機能を無理やり実装したり遊んでいきたいと思います！