# 第 3 章：タスクデータの管理

<iframe width="800" height="436" src="https://player.bilibili.com/player.html?isOutside=true&aid=113504258425496&bvid=BV1XvUxYREWx&cid=26827688969&p=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>

タスク管理システムの要件を整理できたので、いよいよ実際の操作に入りましょう！思い出してください。タスク管理システムでは、タスクの **[新規作成](https://docs-cn.nocobase.com/handbook/ui/actions/types/add-new)、[編集](https://docs-cn.nocobase.com/handbook/ui/actions/types/edit)、[削除](https://docs-cn.nocobase.com/handbook/ui/actions/types/delete)** 、そして **タスク一覧の検索** が必要です。これらの機能はすべて、NocoBase のページ、ブロック、操作で実現できます。

> 公式ドキュメントで[メニュー](https://docs-cn.nocobase.com/handbook/ui/menus)と[ページ](https://docs-cn.nocobase.com/handbook/ui/pages)の詳細な定義を確認できます。

### 3.1 どこから始めましょうか？

以前、新しいページの作成方法やユーザー一覧の表示方法を紹介したことを覚えていますか？ページはキャンバスのようなもので、さまざまな種類のブロックを配置でき、順番やサイズを自由に調整できます。復習のために操作手順を確認しましょう。

1. [**新しいページを作成する**](https://docs-cn.nocobase.com/handbook/ui/pages)：数クリックでページの作成が完了します。
   ![新しいページを作成](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162333648.gif)
2. **新しい[テーブルブロック](https://docs-cn.nocobase.com/handbook/ui/blocks/data-blocks/table)を作成する**：テーブルブロックを選択すると、さまざまなデータを表示できます。
   ![テーブルブロックを作成](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162333239.gif)

とても簡単ですよね？
ただし、「データ一覧」を開くと、デフォルトでは「ユーザー」と「ロール」の 2 つのテーブルしかないことに気づくでしょう。
タスクテーブルはどこにあるのでしょうか？大丈夫です。答えは NocoBase の[**データソース**](https://docs-cn.nocobase.com/handbook/data-source-manager)機能にあります。

> **データソースの紹介：** データソースは、データベース、API、その他のデータストレージで、MySQL、PostgreSQL、SQLite、MariaDB などのリレーショナルデータベースへの接続をサポートしています。
> NocoBase では、データソースとデータテーブルを管理するための**データソース管理プラグイン**が提供されています。ただし、データソース管理プラグインはデータソース管理画面を提供するだけで、データソースに接続する機能自体は持っていません。各種**データソースプラグイン**と組み合わせて使用する必要があります。

### 3.2 データソース：データテーブルの倉庫

![](https://static-docs.nocobase.com/20241009144356.png)

NocoBase では、すべてのデータテーブルは[**データソース**](https://docs-cn.nocobase.com/handbook/data-source-manager)に格納されています。データソースは本のようなもので、各データテーブルの設計と構造が記録されています。次に、私たちの新しいページとなる **タスクテーブル** を一緒に作成しましょう。

> [!NOTE] Note
> データソースとデータテーブルの詳しい機能については、[データソース管理](https://docs-cn.nocobase.com/handbook/data-source-manager) と [データテーブルの概要](https://docs-cn.nocobase.com/handbook/data-modeling/collection) を参照してください。

- **データソース設定に入る**：
  - 右上の **設定** > **データソース** > **メインデータソース設定** をクリックします。
  - NocoBase のメインデータソースに存在するすべてのテーブルが表示されます。通常、デフォルトでは「ユーザー」と「ロール」の 2 つのテーブルのみです。
    ![データソース設定](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162334835.gif)

さあ、3 番目のテーブル、つまり **タスクテーブル** を作成しましょう！NocoBase で初めてデータテーブルを作成するこの瞬間はワクワクしますね！先ほどの設計に従って、以下のフィールドを含むシンプルなタスクテーブルを作成します。

```
タスクテーブル（Tasks）：
        タスク名（task_name） 単行テキスト
        タスク説明（task_description） 複数行テキスト
```

### 3.3 タスクテーブルの作成

1. **タスクテーブルを新規作成する**：

   - 「データテーブルを作成」> **普通データテーブル** を選択 > **データテーブル名**（例：「タスクテーブル」）と **データテーブル識別子**（例：「tasks」）を入力します。
   - **データテーブル識別子** はテーブルの一意な ID です。英語、数字、またはアンダースコアで命名することをおすすめします。後から検索やメンテナンスがしやすくなります。
   - 送信して作成します。
     ![タスクテーブルの作成](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162334006.gif)
2. **デフォルトフィールドの説明**：
   NocoBase は各普通データテーブルにプリセットフィールドを自動生成します。

   - **ID**：各レコードの一意な識別子。
   - **作成日時**：タスクの作成時刻を自動記録します。
   - **作成者**：タスクの作成者を自動記録します。
   - **最終更新日時** と **最終更新者**：タスクが変更されるたびに、その時刻とユーザーを記録します。

これらのデフォルトフィールドは私たちが必要とするものそのもので、手動で追加する手間が大幅に省けます。

3. **カスタムフィールドの作成**：
   - **タスク名**：「フィールドを追加」> **単行テキスト** を選択 > フィールド名を「タスク名」、フィールド識別子を「task_name」に設定します。
     ![タスク名フィールドの作成](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162335943.gif)
   - **タスク説明**：もう一つ **複数行テキスト** フィールドを作成し、フィールド識別子を「task_description」に設定します。
     ![タスク説明フィールドの作成](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162335521.gif)

おめでとうございます！これで **タスクテーブル** の定義が完了しました。自分だけのタスクデータ構造の作成に成功です。素晴らしいですね！

### 3.4 タスク管理ページの作成

タスクテーブルができたので、次は適切なブロックを使ってページに表示しましょう。新しい **タスク管理ページ** を作成し、タスクデータを表示するテーブルブロックを追加します。

1. **タスク管理ページを新規作成する**：

   - 「新しいページ」をクリックし、「タスク管理」と名前を付けます。
   - タスクブロックを作成して、タスクテーブルのデータを表示します。
     ![タスクブロックの作成](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162336833.gif)
2. **データを追加する**：

   - 「あれ、データがないのはなぜ？」と思うかもしれません。大丈夫です。今から追加しましょう！
   - ページ右上の「操作を設定」をクリックし、**「追加」** 操作をクリックすると、空のポップアップコンテナが表示されます。
     [追加](https://docs-cn.nocobase.com/handbook/ui/actions/types/add-new)、[編集](https://docs-cn.nocobase.com/handbook/ui/actions/types/edit) 操作にはデフォルトでポップアップがバインドされます。
   - 次に新しいブロック（フォーム）の出番です。ポップアップブロックを作成 > **現在のデータテーブル** を選択します。
   - タスク名と説明フィールドを表示し、送信操作を設定すれば、フォームの送信は完了です！
     ![操作の設定](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162337313.gif)
3. **データを入力する**：

   - テストデータを 1 件入力し、送信をクリックすれば、成功です！タスクデータが追加されました。
     ![データの送信](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162338074.gif)

ワクワクする瞬間です！最初のタスクデータの入力に成功しました。簡単でしたよね？

### 3.5 タスクの検索とフィルタリング -- タスクをすばやく見つける

タスクが増えてきたら、目的のタスクをどうやってすばやく見つけましょうか？そんなときに[**フィルター操作**](https://docs-cn.nocobase.com/handbook/ui/actions/types/filter)が役立ちます。NocoBase では、フィルター操作の条件を組み合わせて特定のタスクを簡単に検索できます。

#### 3.5.1 フィルター操作を有効にする

まず、フィルター操作を有効にしましょう。

- **マウスを「操作を設定」に移動**し、**フィルタースイッチ**をクリックしてフィルターを有効にします。
  ![フィルターの有効化](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162338152.png)

#### 3.5.2 フィルター条件を使う

フィルター操作を有効にすると、ページにフィルターボタンが表示されます。**タスク名**を使ってフィルター操作が正しく動作するか試してみましょう。

- フィルター操作パネルでタスク名を選択し、検索したい内容を入力します。
- 「送信」をクリックして、タスク一覧にフィルター結果が正しく表示されるか確認します。
  ![フィルターの有効化](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162338495.gif)

#### 3.5.3 フィルター操作を無効にする

フィルター操作が不要になったら、スイッチタイプの操作は 1 クリックで解除できます。

- **フィルター条件をリセットする**：フィルター条件が有効になっていないことを確認し、「リセット」ボタンをクリックします。
- 再度 **「フィルター」スイッチ**をクリックすると、ページからフィルターが非表示になります。
  ![フィルターの無効化](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162339299.gif)

とても簡単です！フィルター操作は大量のタスクを管理する際にとても便利です。システムに慣れていくにつれて、さらに多様で柔軟な検索方法もご紹介していきます。（[フォームフィルターブロック](https://docs-cn.nocobase.com/handbook/ui/blocks/filter-blocks/form) や [折りたたみパネルフィルターブロック](https://docs-cn.nocobase.com/handbook/ui/blocks/filter-blocks/collapse) もご参照ください。）

この調子で前に進みましょう！

### 3.6 タスクの編集と削除

タスクの追加・検索に加えて、[**編集**](https://docs-cn.nocobase.com/handbook/ui/actions/types/edit) と [**削除**](https://docs-cn.nocobase.com/handbook/ui/actions/types/delete) も必要です。ブロック、フィールド、操作の追加フローはすでに覚えていますので、これは簡単です。

1. **タスクを編集する**：

   - タスク一覧の設定に **編集** 操作を追加し、編集をクリック > フォーム（編集）ブロックを追加 > 編集したいフィールドを選択します。
2. **タスクを削除する**：

   - 同様に、操作列の設定で **削除** 操作スイッチをオンにし、削除ボタンが表示されたら、削除をクリック > 確認すると、タスクが一覧から削除されます。
     ![タスクの編集](https://static-docs.nocobase.com/nocobase_tutorials_zh/202412162339672.gif)

これで、タスク一覧の **CRUD（追加・削除・編集・検索）** 操作がすべて実装できました。

素晴らしい！このステップも無事完了です！

### チャレンジ課題

NocoBase の操作に慣れてきたら、ちょっとしたチャレンジに挑戦してみましょう。タスクのステータスを表示し、添付ファイルのアップロードに対応させるにはどうすればいいでしょうか？

ヒント：

- タスクテーブルに以下を追加します。
  1. 「**ステータス（status）**」フィールド：ドロップダウン単一選択として、以下の選択肢を含めます。**未着手、進行中、レビュー待ち、完了、キャンセル、アーカイブ済み**。
  2. 「**添付ファイル（attachment）**」フィールド。
- タスクテーブル、「追加」および「編集」フォームブロックに、「ステータス」「添付ファイル」フィールドを表示します。

アイデアは浮かびましたか？慌てなくて大丈夫です。[次の章（第 4 章：タスクとコメントプラグイン）](./04-plugins)で答え合わせをしましょう！

---

引き続き探索を楽しんで、創造力を発揮しましょう！問題が発生した場合は、いつでも [NocoBase 公式ドキュメント](https://docs-cn.nocobase.com/) を参照するか、[NocoBase コミュニティ](https://forum.nocobase.com/) に参加してディスカッションできます。
