Workreport Agent

チャットで今日の作業をラフに伝えるだけで、形式的なデータとしてデータベースへ自動登録され、その結果も帳票として表示できるAIエージェントを実現するプロジェクトです。エージェントフレームワーク「Mastra」と、日本の複雑な帳票要件にも対応できるJavaScript帳票ライブラリ「Active Reports JS」の連携により、インタラクティブな日報管理システムを実現します。Next.jsとAzure OpenAIを使用したスマートな業務管理ソリューションです。

📚 このプロジェクトについて

このプロジェクトは、MESCIUS devlogの3部構成ブログシリーズ「Mastra + Active Reports JS で AI エージェント型ワークレポート管理システムの構築」に基づいて実装されています。詳細な解説については、このREADMEの最下部にある詳細ドキュメントセクションをご参照ください。

プロジェクト概要

このシステムは、AI-powered エージェントが以下を自動で支援します：

• 日報の作成・管理：CRUDツールで日報データの保存・更新・削除
• レポート生成：RDLX-JSON形式の帳票定義からレポートを生成
• 会話型インターフェース：ユーザーとフレンドリーにやり取り
• 会話履歴の永続化：すべての会話履歴をSQLiteに保存
• 気象情報の連携：天気情報を日報に組み込み

主要なフォルダ構成

workreport-agent-org/
├── app/                           # Next.js App Router
│   ├── page.tsx                   # ホームページ
│   ├── layout.tsx                 # ルートレイアウト
│   ├── globals.css                # グローバルスタイル
│   ├── hooks/
│   │   └── use-mastra.ts          # Mastraクライアントフック
│   └── worklog-agent/
│       └── page.tsx               # ワークレポートエージェント UI
├── components/                    # React コンポーネント
│   ├── chat-component.tsx         # チャットUI
│   └── report-viewer.tsx          # レポートビューア
├── mastra/                        # AI エージェント設定
│   ├── index.ts                   # Mastraインスタンス（LLM、ストレージ設定）
│   ├── agents/
│   │   ├── weather-agent.ts       # 天気情報取得エージェント
│   │   └── workreport-agent.ts    # 日報管理エージェント
│   ├── tools/
│   │   ├── weather-tool.ts        # 天気情報APIツール
│   │   ├── crud-tool.ts           # 日報CRUD操作ツール
│   │   └── reports-tool.ts        # レポート生成・管理ツール
│   ├── instructions/
│   │   └── workreport-instructions.ts # エージェント指示文
│   └── workflows/
│       └── weather-workflow.ts    # 気象ワークフロー
├── database/                      # Drizzle ORM
│   ├── schema.ts                  # データベーススキーマ定義
│   └── index.ts                   # DB接続
├── lib/
│   └── report-parser.ts           # レポートパーサー
├── reports/                       # RDLX-JSON レポート定義
│   ├── daily_reports.rdlx-json    # 日報テンプレート
│   └── test.rdlx-json             # テストレポート
└── public/                        # 静的ファイル

技術スタック

• フロントエンド：Next.js 16, React 19, Tailwind CSS
• AI フレームワーク：Mastra 1.1.0
• LLM：Azure OpenAI（GPT-4.1）
• データベース：LibSQL（SQLite）+ Drizzle ORM
• レポート生成：Active Reports JS
• バリデーション：Zod
• ロギング：Pino
• 監視：Mastra Observability

セットアップ手順

1. 環境変数の設定

.env.local ファイルを作成して、以下を設定してください：

# Azure OpenAI設定
AZURE_OPENAI_ENDPOINT=https://your-end-point/openai
AZURE_OPENAI_API_VERSION=2025-01-01-preview
AZURE_OPENAI_KEY=your-api-key
AZURE_OPENAI_RESOURCE_NAME=your-resource-name
# ActiveReportsJSライセンス
NEXT_PUBLIC_ACTIVEREPORTSJS_KEY='YOUR LICENSE KEY'
# MastraバックエンドAPI
NEXT_PUBLIC_MASTRA_API_BASE_URL=http://localhost:4111

2. 依存関係のインストール

npm install

3. データベースマイグーション

npm run db:push  # if using Drizzle commands

Mastraサーバーの起動

npx mastra dev --dir ./mastra

開発サーバーの起動

npm run dev

ブラウザで http://localhost:3000 を開きます。

利用可能なページ

• http://localhost:3000：メインページ
• http://localhost:3000/worklog-agent：ワークレポートエージェント チャットUI

エージェントの機能

Workreport Agent（日報管理エージェント）

• ID：workreport-agent
• LLM：Azure OpenAI GPT-4.1
• 利用可能なツール：
  • weatherTool：気象情報の取得
  • crudTool：日報データの作成・読取・更新・削除
  • reportTool：レポート生成・管理
• メモリ：会話履歴をSQLiteに永続化

Weather Agent（気象情報エージェント）

• 気象ワークフローの実行
• 天気情報取得ツール

主要ファイルの説明

mastra/index.ts

Mastraインスタンスの設定ファイル。Azure OpenAI ゲートウェイ、エージェント、ワークフロー、ストレージ、監視設定を定義します。

mastra/agents/workreport-agent.ts

日報管理の専門家ロールを演じるAIエージェント。CRUDツールとレポートツールを用いた業務支援を行います。

mastra/instructions/workreport-instructions.ts

エージェントの行動指針や応答スタイルを定義するプロンプト。

mastra/tools/crud-tool.ts

日報データベースへのCRUD操作（作成、読取、更新、削除）を実現します。

mastra/tools/reports-tool.ts

RDLX-JSON形式のレポート定義ファイルから帳票を生成・管理します。

components/chat-component.tsx

エージェントとのチャットユーザーインターフェース。メッセージ送受信とリアルタイム表示を担当します。

database/schema.ts

Drizzle ORMによるデータベーススキーマ定義。

詳細ドキュメント

このプロジェクトの詳しい実装方法や解説については、以下のブログ記事をご参照ください：

1. Mastra + Active Reports JS で AI エージェント型ワークレポート管理システムの構築 - Part 1

   • プロジェクト概要と構成、セットアップ方法

2. Mastra + Active Reports JS で AI エージェント型ワークレポート管理システムの構築 - Part 2

   • AI エージェント実装とツール設定

3. Mastra + Active Reports JS で AI エージェント型ワークレポート管理システムの構築 - Part 3

   • UI 実装とレポート生成機能

参考資料

• Mastra Framework
• Next.js Documentation
• Azure OpenAI Service
• Active Reports JS
• Drizzle ORM