daily-log
2026年1月13日の開発日記
今日は税務アプリのOCR Checker機能を大幅に強化した。macOS FinderライクなMiller Columns UIの実装、勘定科目のAI判定機能、バッチまたぎナビゲーションなど、フロントエンドの改善が中心だった。並行してClaude Codeの会話を自動保存する仕組みも構築し、実際に動作させた。
今日やったこと
1. Claude Code会話自動記録の仕組み構築
Claude Codeのセッションファイル(jsonl)を監視し、会話を自動的にMarkdownとして保存する仕組みを実装した。日付・プロジェクト名・開始時刻でディレクトリとファイルを分ける構成で、1分ごとにファイル更新、1日1回まとめてコミットする。
claude-code-sync/ディレクトリに自動保存{YYYY-MM-DD}/{project}_{HH-MM}.md形式- Windowsタスクスケジューラで常駐化
詳細: Claude Codeとの会話を自動記録する仕組み - Windows環境での実装計画
2. Miller Columns UI実装
税務アプリのOCR Checkerに「科目別一覧」タブを追加。4カラム階層ナビゲーション(年度→勘定科目→月別金額→内訳)で、最終的にレシート画像を表示できるようになった。
- 3ペインレイアウト: Miller Columns | 編集フォーム | 画像プレビュー
- キーボードナビゲーション(左右矢印キー)
- ループ移動: 最後から次へ進むと最初に戻る
- ソート順: 年度降順 → 勘定科目順 → 月昇順 → 金額降順
詳細: NuxtでMiller Columns UIを実装する
3. OCR Checkerリファクタリング
index.vueの大規模なリファクタリングを実施した。
- 日付パース関数を
dateFormat.tsに集約 useCommentsコンポーザブルの再利用- 使われていないコンポーネント(
CommentPanel.vue)の削除 - 全データ一括読み込み方式への変更: ファインダービューと同じデータを最初から読み込む
- バッチまたぎナビゲーション: 矢印キーで全バッチをまたいで移動可能に
- タブ名変更: 「スキャンレシート/領収書」→「バッチ一覧」、「ファインダービュー」→「科目別一覧」
- LocalStorage保存: 選択中のバッチ・ファイルを記憶
4. 勘定科目AI判定機能
レシートOCRのバリデーション機能に、サブエージェントによる勘定科目判定を追加した。
- サブエージェントが画像から勘定科目を判定
- Gemini OCRの結果と比較し、不一致は紫枠線+アイコンで表示
overall_scoreに反映(勘定科目30%の重み)- バグ修正:
file_nameのみで検索していたため、別バッチの同名ファイルを誤って取得していた問題を修正
詳細: 勘定科目AI判定機能の実装
5. レシート読み取りUI改善
日付入力を年/月/日の分割形式に変更した。
- 「2024/03/27」→「2024年 3月 27日」形式
- フォントサイズを合計支払金額と統一(28px)
- 合計支払金額に3桁カンマ区切りを追加
- 勘定科目ボタンの選択時スタイルを調整
6. Claude Codeセッション再開コマンドのドキュメント化
-cで直前のセッション再開、--resumeで一覧から選択など、セッション管理コマンドをまとめた。
詳細: Claude Code CLIのセッション再開コマンド完全ガイド
7. その他の改善
- PR #54のOGP画像パス修正レビュー
.claude/settings.local.jsonの整理(危険なパーミッションを削除)- JSONスキーマファイルの分離(
src/schema/receipt_schema.json)
今日の学び
- 状態管理の設計: Miller Columnsの選択状態を単一のインデックスから計算で導出すると、一貫性が保てる
- 複合キーの重要性:
file_nameだけでなくbatch_idも含めないと、同名ファイルで誤動作する - リファクタリングの効果: 日付パース関数を集約したことで、
MillerColumnsView.vueのコードが明確になった - UI/UXの細かい調整: 矢印インジケーターの削除、タブ名の変更など、小さな改善が使い勝手を向上させる