4afe37968b
実装内容: バックエンド: summary APIに total_fields, assigned_fields, unassigned_fields を追加 フロントエンド: /dashboard に新画面を作成 概要サマリー: 全圃場数 / 作付け済み / 未割当（警告アイコン付き） 作物別集計テーブル（筆数・面積・合計行） クイックアクセス: 4つのボタン（作付け計画・圃場管理・帳票出力・データ取込） 年度セレクタで切替可能 Navbar: 「ホーム」ボタン追加、KeinaSystemロゴクリックでダッシュボードへ ルート (/): /allocation → /dashboard にリダイレクト先変更 http://localhost:3000/dashboard で確認できます。 残りタスク: A-7（検索・フィルタ）のみです
97 lines
3.8 KiB
TypeScript
97 lines
3.8 KiB
TypeScript
'use client';
|
|
|
|
import { useRouter, usePathname } from 'next/navigation';
|
|
import { LogOut, Wheat, MapPin, FileText, Upload, LayoutDashboard } from 'lucide-react';
|
|
import { logout } from '@/lib/api';
|
|
|
|
export default function Navbar() {
|
|
const router = useRouter();
|
|
const pathname = usePathname();
|
|
|
|
const handleLogout = () => {
|
|
logout();
|
|
};
|
|
|
|
const isActive = (path: string) => pathname === path;
|
|
|
|
return (
|
|
<nav className="bg-white shadow-sm border-b border-gray-200">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="flex justify-between h-16">
|
|
<div className="flex items-center space-x-8">
|
|
<button onClick={() => router.push('/dashboard')} className="text-xl font-bold text-green-700 hover:text-green-800 transition-colors">
|
|
KeinaSystem
|
|
</button>
|
|
<div className="flex items-center space-x-4">
|
|
<button
|
|
onClick={() => router.push('/dashboard')}
|
|
className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
|
|
isActive('/dashboard')
|
|
? 'text-green-700 bg-green-50'
|
|
: 'text-gray-700 hover:text-gray-900 hover:bg-gray-100'
|
|
}`}
|
|
>
|
|
<LayoutDashboard className="h-4 w-4 mr-2" />
|
|
ホーム
|
|
</button>
|
|
<button
|
|
onClick={() => router.push('/allocation')}
|
|
className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
|
|
isActive('/allocation')
|
|
? 'text-green-700 bg-green-50'
|
|
: 'text-gray-700 hover:text-gray-900 hover:bg-gray-100'
|
|
}`}
|
|
>
|
|
<Wheat className="h-4 w-4 mr-2" />
|
|
作付け計画
|
|
</button>
|
|
<button
|
|
onClick={() => router.push('/fields')}
|
|
className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
|
|
isActive('/fields') || pathname?.startsWith('/fields/')
|
|
? 'text-green-700 bg-green-50'
|
|
: 'text-gray-700 hover:text-gray-900 hover:bg-gray-100'
|
|
}`}
|
|
>
|
|
<MapPin className="h-4 w-4 mr-2" />
|
|
圃場管理
|
|
</button>
|
|
<button
|
|
onClick={() => router.push('/reports')}
|
|
className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
|
|
isActive('/reports') || pathname?.startsWith('/reports/')
|
|
? 'text-green-700 bg-green-50'
|
|
: 'text-gray-700 hover:text-gray-900 hover:bg-gray-100'
|
|
}`}
|
|
>
|
|
<FileText className="h-4 w-4 mr-2" />
|
|
帳票出力
|
|
</button>
|
|
<button
|
|
onClick={() => router.push('/import')}
|
|
className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
|
|
isActive('/import')
|
|
? 'text-green-700 bg-green-50'
|
|
: 'text-gray-700 hover:text-gray-900 hover:bg-gray-100'
|
|
}`}
|
|
>
|
|
<Upload className="h-4 w-4 mr-2" />
|
|
データ取込
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center">
|
|
<button
|
|
onClick={handleLogout}
|
|
className="flex items-center px-4 py-2 text-sm text-gray-700 hover:text-gray-900 hover:bg-gray-100 rounded-md transition-colors"
|
|
>
|
|
<LogOut className="h-4 w-4 mr-2" />
|
|
ログアウト
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
);
|
|
}
|