概要
つぶやき投稿に「TODOにする」チェックボックスを追加した。チェックを入れると、締切日を設定してタスクとして管理できるようになる。完了マークを押すと、カードに印鑑風の「完了」スタンプが表示され、テキストに打ち消し線が入る。
実装した機能
投稿フォームの変更
- 「TODOにする」チェックボックスを追加した
- チェックを入れると締切日入力フィールドが表示される
- 締切日は任意項目(設定しない場合はTODOバッジのみ表示される)
タイムライン表示
未完了のTODOでは以下を表示する:
- 締切日あり:「締切まであとN日」(期限切れの場合は「期限切れ(N日経過)」)
- 締切日なし:「TODO」バッジ
完了済みのTODOでは以下を表示する:
- カード全体を薄くしてグレーアウト
- 右上に「完了」印鑑スタンプ(回転した楕円形のボーダー)
- テキストに打ち消し線
- 「登録からN日で完了」の表示
管理画面での操作
管理画面の投稿一覧に「✓ 完了にする」ボタンを追加した。完了済みの場合は「↩ 未完了に戻す」に変わる。押すたびに完了状態が切り替わる。
完了にした日付は自動的に記録され、登録日から完了日までの経過日数を計算して表示する。
データ構造
TODO情報はJSONカラム(todo_info)として保存する:
{
"isTodo": true,
"isDone": false,
"dueDate": "2026-04-20",
"completedAt": null
}
完了時は isDone: true、completedAt に完了日(YYYY-MM-DD)が入る。
セキュリティ対応
dueDateとcompletedAtはサーバー側でYYYY-MM-DD形式の正規表現チェックを行う- フロントから受け取ったJSONは一度パースして再シリアライズし、不正なフィールドを除去する
- 完了日(
completedAt)はサーバー側でJST基準の現在日付を生成する(クライアントの値を使わない)
データベース
ALTER TABLE posts ADD COLUMN todo_info TEXT DEFAULT NULL;
DDLラグ対策として、投稿APIにも自動ALTERを追加している。
残件・今後
- TODOのみを一覧表示するフィルタービュー(未実装)
- 締切日近くになった際の通知(未実装)