alireza
3870d66f7d
Some checks failed
Deploy MyApp on Same Server / build-and-deploy (push) Failing after 5s
91 lines
3.4 KiB
TypeScript
91 lines
3.4 KiB
TypeScript
import { Home as HomeIcon, Settings, Calendar, BarChart3, Leaf } from 'lucide-react'
|
||
import Link from 'next/link'
|
||
|
||
export default function Home() {
|
||
const menuItems = [
|
||
{
|
||
title: 'انتخاب دستگاه',
|
||
description: 'اتصال به دستگاه گلخانه',
|
||
href: '/devices',
|
||
icon: Settings,
|
||
color: 'from-blue-500 to-blue-600',
|
||
iconColor: 'text-blue-500'
|
||
},
|
||
{
|
||
title: 'تقویم',
|
||
description: 'مشاهده دادههای ماهانه',
|
||
href: '/calendar?deviceId=1',
|
||
icon: Calendar,
|
||
color: 'from-green-500 to-green-600',
|
||
iconColor: 'text-green-500'
|
||
},
|
||
{
|
||
title: 'جزئیات روز',
|
||
description: 'دادههای روزانه',
|
||
href: '/day-details?deviceId=1&year=1403&month=1',
|
||
icon: BarChart3,
|
||
color: 'from-purple-500 to-purple-600',
|
||
iconColor: 'text-purple-500'
|
||
},
|
||
{
|
||
title: 'دادههای تلهمتری',
|
||
description: 'مشاهده دادههای لحظهای',
|
||
href: '/telemetry?deviceId=1',
|
||
icon: Leaf,
|
||
color: 'from-orange-500 to-orange-600',
|
||
iconColor: 'text-orange-500'
|
||
}
|
||
]
|
||
|
||
return (
|
||
<main className="min-h-screen p-4 md:p-8">
|
||
<div className="max-w-6xl mx-auto">
|
||
{/* Header */}
|
||
<div className="text-center mb-12 mt-8">
|
||
<div className="inline-flex items-center justify-center w-20 h-20 bg-gradient-to-br from-green-500 to-green-600 rounded-2xl shadow-lg mb-4">
|
||
<HomeIcon className="w-10 h-10 text-white" />
|
||
</div>
|
||
<h1 className="text-4xl md:text-5xl font-bold text-gray-900 mb-3">GreenHome</h1>
|
||
<p className="text-lg text-gray-600">مدیریت هوشمند گلخانه</p>
|
||
</div>
|
||
|
||
{/* Menu Grid */}
|
||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
{menuItems.map((item) => {
|
||
const Icon = item.icon
|
||
return (
|
||
<Link
|
||
key={item.href}
|
||
href={item.href}
|
||
className="group relative bg-white rounded-2xl shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden border border-gray-100"
|
||
>
|
||
<div className="p-6">
|
||
<div className="flex items-start gap-4">
|
||
<div className={`flex-shrink-0 w-14 h-14 rounded-xl bg-gradient-to-br ${item.color} flex items-center justify-center shadow-md group-hover:scale-110 transition-transform duration-300`}>
|
||
<Icon className="w-7 h-7 text-white" />
|
||
</div>
|
||
<div className="flex-1">
|
||
<h3 className="text-xl font-semibold text-gray-900 mb-1 group-hover:text-green-600 transition-colors">
|
||
{item.title}
|
||
</h3>
|
||
<p className="text-sm text-gray-500">{item.description}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className={`absolute bottom-0 left-0 right-0 h-1 bg-gradient-to-r ${item.color} transform scale-x-0 group-hover:scale-x-100 transition-transform duration-300`} />
|
||
</Link>
|
||
)
|
||
})}
|
||
</div>
|
||
|
||
{/* Footer Info */}
|
||
<div className="mt-12 text-center">
|
||
<p className="text-sm text-gray-500">
|
||
سیستم مدیریت و مانیتورینگ گلخانه هوشمند
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
)
|
||
}
|