サインアップの承認
**それでは始めましょう。プライベート・ベータ版の製品があります。**ユーザーがサインアップできるように、特定のユーザーを承認するツールが必要です。5分でゼロからサインアップツールを作成します。
1. ユーザーの表示
最初に、SQLクエリーを作成して、ユーザーを取得しましょう。
select * from users order by id;
クエリーは次のようになります。

Run
(⌘⏎)を押して、クエリーをプレビューします。問題がなければ、「Save」 (⌘S)を押します。次に、右側からTable
をドラッグしましょう。作成したクエリーからデータが自動的に移入されます。
これで、ユーザーの表ができました。では、ユーザーを検索してみましょう。

2. ユーザーの検索
ユーザーを検索するには、右側からTextInput
をドラッグしましょう。

TextInput
をTable
の上部に配置します
次に、TextInput
の値で検索するようにSQLクエリーを変更する必要があります。次のように、SQLクエリーを変更しましょう。
select * from users where first_name ILIKE {{'%' + textinput1.value + '%'}}
部分一致を実行するために、%
を追加しています。これがないと、「mary」は「Mary」と一致しますが、「mar」は一致しません。これがあると、「ma」は「Mary」と「Marilyn」の両方と一致します。
{{ }}内のJavascript
{{ }}
内はすべてJavascriptです。したがって、%
を+
演算子とともに先頭に追加したり最後に追加したりできます。RetoolではSQLをパラメーター化したクエリーに変換するので、Javascript内でこれを実行する必要があります。これは、SQLインジェクションを防止するためです。Javascriptの外でこれを実行した場合(例:
select * from users where first_name ILIKE %{{textinput1.value}}%
)、(select * from users were first_name ILIKE %$1%
)に変換され、有効なSQLではなくなります。
TextInput
に別の名前を入力すると、クエリーが自動的にリフレッシュされ、これによってTable
もリフレッシュされます。あいまい検索がわずか2~3分でできました。
3. ユーザーの承認
ユーザーを承認するには、別の2つのボタンをドラッグします。1つは承認用で、もう1つは否認用です。ボタンにラベルを付け、否認ボタンを赤色にしましょう。アプリは次のようになります。

承認ボタンと否認ボタン
クエリー(承認用と否認用)を実行するようにボタンを接続します。承認用Button
をクリックしましょう。右側にAction
カテゴリーが表示されていますね。「run a query」が表示されているのを確認してから、新規クエリーを作成しましょう。

承認用Button
のアクションを変更します
PUT
リクエストに入力し、承認クエリーなので、active
をtrue
に設定しましょう。

PUT
クエリーを作成します
ユーザーの承認後、元のusers
クエリーをリフレッシュする必要もあります。これで、アクティブのブール値によるTable
の変更を確認できます。これを行うには、On success, trigger these queries
セクションまでスクロールし、(クエリーの名前に関係なく)query1
をリフレッシュすることを選択します。

成功時にリフレッシュするクエリーを選択します
クエリーを保存し、「Reject」ボタンについても同じように繰り返しましょう。
ここで、2つのクエリーが必要になります。このクエリーを複製して、active
をfalse
に変更しましょう。次に、ボタンに戻り、クリック時にこの新規クエリーを実行するように指示します。

否認ボタンを否認クエリーに接続します
これで終了です。ユーザーに対して承認ボタンまたは否認ボタンを実行することができるようになりました。これにより、ユーザーはactive
またはinactive
になります。
4. 実際の使用
このツールの本番での稼働の準備が完了しました。同僚が(面倒な手間をかけることなく)使用できるように、同僚にこのツールのリンクを送信します。同僚に特定の権限を付与している場合、同僚はツールの編集やクエリーの変更を行うことはできません。実行できるのは、作成したツールを使用することだけです。
数分間で、APIコールによってデータベースからユーザーを表示し、ユーザーを検索し、各ユーザーを承認または否認するためのツールを作成しました。
Updated 30 days ago