タスク管理システムの要件が概説されたので、実際のステップに入りましょう!私たちのシステムは、作成、編集、削除をサポートし、さらにタスクリストの表示ができるようにする必要があります。このすべての機能は、NocoBaseのページ、ブロック、アクションを使用して実現できます。
3.1 どのように始めるのか?
以前、ページの作成方法とユーザーリストの表示方法について説明しました。これらのページは、さまざまなブロックを自由に並べ替えることができるキャンバスとして機能します。手順を簡単におさらいしましょう:
簡単ですよね? しかし、「データリスト」を開くと、「ユーザー」と「役割」のコレクションしか表示されないことに気づくかもしれません。タスクテーブルはどこに行ったのでしょうか?心配しないでください。NocoBaseのデータソース機能を通じてアクセス可能です。
データソースについて: データソースは、データベース、API、またはその他のデータストレージタイプである可能性があります。NocoBaseは、MySQL、PostgreSQL、SQLite、MariaDBなどのさまざまなリレーショナルデータベースをサポートしています。
NocoBaseは、データソースとテーブルを管理するためのデータソース管理プラグインを提供しています。しかし、データソースに接続するには、特定のデータソースプラグインも必要です。
3.2 データソース:あなたのコレクションリポジトリ
NocoBaseでは、すべてのコレクションがデータソース内に保存されており、各コレクションの設計と構造が書かれた本のように機能します。新しい章を追加するために、タスクコレクションを作成しましょう。
- データソース設定にアクセスする方法:
- 設定 > データソース > メインデータソースの構成をクリックします。
- メインデータソースには、通常デフォルトで「ユーザー」と「役割」のコレクションが表示されます。
さあ、3つ目のコレクション-私たちのタスクコレクションを作成しましょう。前回の設計に従って、次のフィールドを持つシンプルなタスクコレクションを設定します:
タスクコレクション:
タスク名 (task_name) 単一行テキスト
タスクの説明 (task_description) 複数行テキスト
3.3 タスクコレクションの作成
-
タスクコレクションを作成:
- 「コレクションを作成」> 一般コレクションを選択> コレクション表示名(例:「タスクコレクション」)とコレクション名(例:「tasks」)を入力します。
- コレクション名は一意のIDであり、英文字、数字、またはアンダースコアを使用することが推奨され使いやすくなります。
- 作成のために提出します。
-
デフォルトフィールド: NocoBaseは、各標準コレクションのためのデフォルトフィールドを生成します:
- ID:各レコードの一意の識別子。
- 作成日時:タスクが作成された時間を自動的に記録します。
- 作成者:タスクを作成したユーザーを自動的に記録します。
- 最終更新日時および最終更新者:各修正の日時とユーザーを記録します。
これらのデフォルトフィールドは、まさに私たちが必要としているもので、手動で追加する手間を省いてくれます。
- カスタムフィールドの作成:
- タスク名:フィールドを追加 > 単一行テキストを選択 > ‘フィールド表示名’を「タスク名」に設定し、フィールド名を「task_name」にします。
- タスクの説明:長文テキストのフィールドをもう一つ作成し、フィールド名を「task_description」に設定します。
おめでとうございます!タスクコレクションが定義され、独自のタスクデータ構造を成功裏に作成しました。
3.4 タスク管理ページの作成
タスクコレクションが準備できたので、今度はそれをページ上にテーブルブロックを使って表示します。
-
タスク管理ページを作成:
- 「新しいページ」をクリックし、名前を「タスク管理」とします。
- タスクデータを表示するテーブルブロックを追加します。
-
データを追加:
- 「うーん、なぜデータがないの?」心配しないで、すぐに追加しましょう!
- 画面右上の「アクションを構成」をクリックし、追加アクションを選択し、空のポップアップコンテナが表示されます。
- 次にサブミットアクションを設定し、必要なフォームブロックを追加します!
-
データを入力:
- テストタスクを入力し、サブミットをクリックし、成功しました!タスクデータが追加されました。
3.5 タスクフィルタリング – タスクを迅速に探す
タスクが増えるにつれて、特定のものを迅速に見つけるにはどうすればよいでしょうか?ここでフィルターアクションが役立ちます。NocoBaseでは、フィルター条件を設定するだけでタスクを簡単に見つけることができます。
3.5.1 フィルターアクションの有効化
まず、フィルターアクションを有効にする必要があります:
- 「アクションを構成」上にマウスを移動し、フィルター切り替えスイッチをクリックします。
3.5.2 フィルター条件の使用
有効化後、ページにフィルターボタンが現れます。今度は、タスク名でフィルタリングしてみましょう:
- フィルターパネルでタスク名を選択し、クエリを入力します。
- 「送信」をクリックしてタスクリストが正しくフィルター条件に合う結果を表示するか確認してください。
3.5.3 フィルターアクションの無効化
もはやフィルターが必要ない場合は、その切り替えをオフにするだけです。
- フィルター条件をリセットして、アクティブなフィルターがないことを確認し、「リセット」をクリックします。
- 再度フィルターをオフにして隠します。
3.6 タスクの編集と削除
タスクの追加や表示に加え、私たちは編集と削除を行う必要があります。ブロック、フィールド、アクションの追加に慣れているので、これも簡単です:
-
タスクを編集:
- タスクリストの設定に編集アクションを追加します。編集をクリック > フォーム(編集)ブロックを追加 > 編集するフィールドを選択します。
-
タスクを削除:
- 同様に、設定を開いて削除アクションを有効にすると、削除ボタンが表示されます。削除をクリック > 確認して、タスクをリストから削除します。
素晴らしい!これでタスクに対する**作成、読み取り、更新、削除(CRUD)**機能が実装されました。