こんにちは!ゆかゆかです。
Nocodeツール「Adalo」を使ってlist of lists という機能を設定してみます〜。
こんな便利な使い方ができると、Adalo仲間様から教えていただきました。(神!感謝)
Adaloの英語説明があったので、読んでみて、こんな感じかなーと設定してみますね。
▼参考にしたAdaloの説明ページ
Lists of Lists - Adalo Resources
間違ってたらご指摘くださいませ〜!
データの準備
Lists of lists を使用するためには、
データコレクション間でリレーションを持たせる必要があるようです。
タイミングよく、お問い合わせチャットの方に
「動物病院の患者様情報管理アプリを作りたい」というお問い合わせをいただきました!
(お仲間が増えて嬉しいです!涙)
ということで、患者様情報をサンプルにLists of lists を設定いたします〜!
(ペット飼ったことが無いので、データの精度が悪いです・・・)
データのリレーション整理
今回は3つのデータコレクションを用意します!
- 患者(飼い主)
- ペット
- 診察
イラストの吹き出しのように、それぞれ関係を持たせていています。
今回のLists of lists ではペットと診察の関連を使っていきます!
最終的な出来上がり
最後はイラストのように、
ペットの名前を1つずつ表示しながら、
その下にペットに関連する診察履歴を表示させていきます。
では、まずはデータ準備をご紹介します!
データコレクションの設定
患者コレクション
ポイントとしては、ペットと関連を持たせています。
私はペットは複数の患者(飼い主)に属さないとしましたが、
複数の飼い主さんに属する場合は、一番下を選んでください。
ペットコレクション
ペットコレクションでも診察との関連を設定しています。
診察コレクション
担当医はユーザに登録することとして、
ユーザとの関連項目です。
Lists of lists を設定して参ります〜
事前準備
ここはお好みになります〜
1. 患者選択画面
Home画面に患者シンプルリストを配置しています。
アクションでLinkを設定して、次の画面に遷移するようにしています。
2. Lists of Lists 画面
お好みですが、ヘッダー部分にHome画面で選択した患者名を表示させています。
ヘッダー部分を選択して、マジックテキストを設定します。
こんな感じで設定できました。
Lists of lists 設定
ペット情報を繰り返しつつ、診察リストを表示する設定をします。
1. コンポーネント配置
この後のリスト表示に使用するコンポーネントを設定していきます。
- テキスト:ペット情報を表示する用
- シンプルリスト:診察を表示する用
- ボタン:診察を登録する用(無くてもOK)
2. List化する
- No1 で設定したコンポーネントを全部範囲選択
- 左側に表示される「MAKE LIST」を選択
Listにするとこんな感じで表示されます。
選択したコンポーネントがうっすら繰り返して表示されています。
3. リスト設定
No2 でできたList の設定をします。
- What is this a list of? にペットを選択
- Filter でCurrent 患者のペットを設定
ここのリストでは、前のHOME画面で選択した患者(飼い主)の
ペット情報をリスト表示する設定になります。
4. ペット情報を表示
テキストコンポーネントにペット情報を表示させます。
マジックテキストから、Current ペットの項目を選択していきます。
表示の内容はお好みです。
私はこんな感じで設定しました〜。
5. 診察用リストを表示
No1で用意したシンプルリストを設定していきます。
- What is this a list of? にペ診察を選択
- Filter でCurrent ペットの診察を設定
表示させる項目はお好みです。
マジックテキストで診察項目を表示してください。
今回は不要な表示をOffにして、シンプルにしてみました。
以上で設定が終わりました〜!
ではでは、プレビューして見ましょう!
プレビュー
まずはHome画面で患者を選択します。
続いて、患者(飼い主)に関連するペット情報と
そのペットに関連する診察情報を表示しました〜!
まとめ
無事にペットと診察の情報を繰り返し表示できました〜!
Lists of Lists この使い方であっていますかね?
もし違っているなどありましたら、チャットからお知らせいただけると参考になります!
ボタンは配置しただけですが、診察フォーム画面を用意して、
リンクを貼れば便利に使えそうです。
今回の内容が皆様のアイディアにつながると嬉しいです。
▼無料でも意外と使える Nocode開発ツール Adalo