栽培管理アプリを作ってます⑦：作業履歴画面で肥料・農薬の詳細を表示できるようにしました

2025年12月28日

前回は複数ハウス選択と農薬混用に対応した作業登録機能を実装しましたが、今回は作業履歴の可視化に取り組みました。

農業でGAP（農業生産工程管理）対応するには、「いつ・どこで・何を・どれだけ使ったか」を記録することが必須です。しかし、ただ記録するだけでなく、後から確認しやすい形で表示することも同じくらい重要です。

今回実装した作業履歴画面では、施肥・防除・灌水の記録を一覧表示し、肥料名や農薬名、使用量などの詳細情報を確認できるようにしました。

実装した機能

1. 作業履歴ページの改善：テーブル形式からカード形式へ

修正前（テーブル形式）：

詳細はこちらの記事に記載しましたが、「とりあえず」という感じ全ての作業が1行ずつ表示され、情報量が多くて見づらい状態でした。
また、肥料名や農薬名などが未記載でした。あと一覧で確認するにはテーブル式は見にくいと感じていました。

修正後（カード形式）：

日付ごとにカード形式でグループ化し、見やすくしました。
主な改善点：

日付ごとにカード表示（新しい順）
カードを展開（▼ボタン）すると詳細を表示
さらに一覧表示をクリックすると、各畝の詳細（修正前のテーブル表示）
編集・削除機能

カード形式にすることで、「いつ・どこで・何をしたか」が一目で分かるようになり、詳細を確認したい時だけ展開できるようになりました。

2. 施肥記録：肥料名の表示

施肥の記録では、どの肥料を使ったかが一目で分かるようになりました。

表示内容：

肥料名
肥料タイプ（液肥 or 固形）
使用量
作業時間

これまでは「施肥した」という記録しかありませんでしたが、肥料名を表示することで、どの肥料をどれだけ使ったかが履歴から追えるようになりました。

3. 防除記録：農薬の詳細表示

防除（農薬散布）の記録では、さらに詳細な情報を表示しています。

表示内容：

農薬名
対象害虫
希釈倍率
原液量

特に原液量の表示は重要です。農薬の使用記録では「何mlの原液を使ったか」を記録する必要があるため、散布量（希釈後の量）だけでなく原液量も表示するようにしました。

また、1回の防除で複数の農薬を混用した場合も、それぞれの農薬情報が個別に表示されます。

4. 灌水記録：散布量の表示

灌水（水やり）の記録では、シンプルに散布量と作業時間を表示します。

表示内容：

散布量（例：50L、100L）
作業時間（例：30分）

肥料や農薬と違って管理項目が少ないため、必要最低限の情報に絞っています。

作業登録：液肥の原液量と散布量の同時記録

履歴一覧とは別に、重要な機能を追加しました。

液肥を使った施肥の際に、原液量（施肥）と散布量（灌水）を同時に記録できる機能です。

なぜ必要？

液肥を散布する場合：

施肥記録：原液を何kg（L）使ったか
灌水記録：希釈後の液を何L散布したか

この2つを記録する必要があります。

従来は施肥と灌水を別々に登録していましたが、これが面倒でした。

実装内容

液肥を選択した場合、入力フォームに2つの使用量欄が表示されます：

使用量（原液）：kg（L）
使用量（流した量）：L

保存すると、バックグラウンドで：

施肥レコード：原液量を記録
灌水レコード：散布量を記録

この2つが自動で作成されます。

使用量なしでも記録

散布量を入力しなかった場合でも、灌水レコードは作成されます（使用量は空欄）。

「いつ灌水したか」だけでも記録として残したいというニーズに対応しました。

技術的なポイント

今回の実装で重要だった技術的なポイントを軽く紹介します。

Supabaseでのテーブル結合

肥料名や農薬名を表示するために、Supabaseで複数のテーブルを結合しています。

施肥の場合：

// cult_logs から cult_fertilizers を JOIN
const { data } = await supabase
  .from("cult_logs")
  .select(`
    *,
    cult_fertilizers (id, name, type)
  `)

cult_logs テーブルには fertilizer_id しか保存されていないため、cult_fertilizers テーブルと結合して肥料名を取得しています。

防除の場合：

防除は少し複雑で、cult_log_pesticides という別テーブルで農薬情報を管理しています。

// cult_log_pesticides から農薬詳細を取得
const { data } = await supabase
  .from("cult_log_pesticides")
  .select(`
    *,
    cult_pesticides (id, name)
  `)

これにより、1回の防除で複数の農薬を使った場合でも、それぞれの詳細情報を取得できます。

データ構造の違い

作業の種類によってデータ構造が異なります。

作業種類	データ保存方法
施肥	`cult_logs.fertilizer_id` で肥料を直接参照
防除	`cult_log_pesticides` テーブルで複数農薬に対応
灌水	肥料情報なし（シンプル）

施肥は1回の作業で1つの肥料しか使わないため、cult_logs テーブルに直接 fertilizer_id を持たせています。

一方、防除は1回の作業で複数の農薬を混用することがあるため、別テーブル（cult_log_pesticides）で管理しています。

この設計により、柔軟なデータ構造を実現しています。