// src/app/page.tsx (랜딩 페이지)

import React from "react";
import Link from "next/link";
import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import {
  Factory,
  Battery,
  LineChart,
  Settings,
  ChevronRight,
  Lightbulb,
  BarChart3,
} from "lucide-react";


import { redirect } from 'next/navigation'


export default function Home() {

  //최초 페이지 접근시 로그인 페이지로 리다이렉트
  redirect('/login')
  
  // 산업 분야별 솔루션 데이터
  const industries = [
    {
      title: "제조업",
      icon: <Factory className="h-12 w-12 mb-4 text-blue-600" />,
      description: "생산 공정 최적화와 에너지 효율 향상으로 제조 경쟁력 강화",
      features: ["실시간 에너지 모니터링", "설비별 효율 분석", "원단위 관리"],
    },
    {
      title: "화학/정유",
      icon: <Battery className="h-12 w-12 mb-4 text-blue-600" />,
      description: "공정 에너지 최적화 및 안전한 운영 지원",
      features: ["공정 최적화", "에너지 회수 분석", "규제 대응"],
    },
    {
      title: "반도체/디스플레이",
      icon: <Settings className="h-12 w-12 mb-4 text-blue-600" />,
      description: "클린룸 및 유틸리티 시스템의 효율적 운영",
      features: ["클린룸 에너지 관리", "유틸리티 최적화", "품질 연계 분석"],
    },
  ];

  // 주요 기능 데이터
  const features = [
    {
      icon: <LineChart className="h-6 w-6 text-blue-600" />,
      title: "실시간 모니터링",
      description: "설비와 에너지 사용량을 실시간으로 모니터링",
    },
    {
      icon: <BarChart3 className="h-6 w-6 text-blue-600" />,
      title: "데이터 분석",
      description: "AI 기반 에너지 사용 패턴 분석 및 최적화",
    },
    {
      icon: <Lightbulb className="h-6 w-6 text-blue-600" />,
      title: "절감 방안 도출",
      description: "맞춤형 에너지 절감 방안 제시",
    },
  ];

  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <div className="relative h-screen flex items-center justify-center bg-gradient-to-r from-blue-600 to-blue-800">
        <div className="absolute inset-0 bg-black/50" />
        <div className="relative z-10 text-center text-white px-4 max-w-4xl mx-auto">
          <h1 className="text-5xl font-bold mb-6">
            Factory Energy Management System
          </h1>
          <p className="text-xl mb-8 leading-relaxed">
            최첨단 AI 기술로 구현하는 스마트 에너지 관리 시스템으로 비용 절감과
            효율성을 극대화하세요
          </p>
          <div className="space-x-4">
            <Link href="/login">
              <Button size="lg" className="bg-blue-500 hover:bg-blue-600">
                시작하기
                <ChevronRight className="ml-2 h-4 w-4" />
              </Button>
            </Link>
            <Button
              variant="outline"
              size="lg"
              className="text-white border-white hover:bg-white/10"
            >
              자세히 보기
            </Button>
          </div>
        </div>
      </div>

      {/* Features Section */}
      <div className="py-20 bg-gray-50">
        <div className="max-w-7xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-3xl font-bold text-gray-900 mb-4">주요 기능</h2>
            <p className="text-xl text-gray-600">
              스마트한 에너지 관리를 위한 핵심 기능을 제공합니다
            </p>
          </div>
          <div className="grid md:grid-cols-3 gap-8">
            {features.map((feature, index) => (
              <Card
                key={index}
                className="text-center p-6 hover:shadow-lg transition-shadow"
              >
                <CardContent>
                  <div className="flex justify-center mb-4">{feature.icon}</div>
                  <h3 className="text-xl font-semibold mb-2">
                    {feature.title}
                  </h3>
                  <p className="text-gray-600">{feature.description}</p>
                </CardContent>
              </Card>
            ))}
          </div>
        </div>
      </div>

      {/* Industries Section */}
      <div className="py-20 bg-white">
        <div className="max-w-7xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-3xl font-bold text-gray-900 mb-4">
              산업별 맞춤 솔루션
            </h2>
            <p className="text-xl text-gray-600">
              다양한 산업 분야의 특성을 고려한 최적화된 솔루션을 제공합니다
            </p>
          </div>
          <div className="grid md:grid-cols-3 gap-8">
            {industries.map((industry, index) => (
              <Card key={index} className="hover:shadow-lg transition-shadow">
                <CardContent className="p-6">
                  <div className="text-center">
                    {industry.icon}
                    <h3 className="text-xl font-semibold mb-3">
                      {industry.title}
                    </h3>
                    <p className="text-gray-600 mb-4">{industry.description}</p>
                  </div>
                  <ul className="space-y-2">
                    {industry.features.map((feature, idx) => (
                      <li key={idx} className="flex items-center text-gray-700">
                        <ChevronRight className="h-4 w-4 text-blue-600 mr-2" />
                        {feature}
                      </li>
                    ))}
                  </ul>
                </CardContent>
              </Card>
            ))}
          </div>
        </div>
      </div>

      {/* Benefits Section */}
      <div className="py-20 bg-gray-50">
        <div className="max-w-7xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-3xl font-bold text-gray-900 mb-4">도입 효과</h2>
            <p className="text-xl text-gray-600">
              FEMS 도입을 통해 기대할 수 있는 핵심 가치
            </p>
          </div>
          <div className="grid md:grid-cols-4 gap-8">
            {[
              {
                title: "에너지 비용 절감",
                value: "15~25%",
                description: "연간 에너지 비용 절감",
              },
              {
                title: "설비 효율 개선",
                value: "20%",
                description: "설비 운영 효율 향상",
              },
              {
                title: "탄소 배출 감축",
                value: "30%",
                description: "온실가스 배출량 감축",
              },
              {
                title: "투자비 회수",
                value: "2년",
                description: "평균 투자비 회수 기간",
              },
            ].map((benefit, index) => (
              <Card
                key={index}
                className="text-center hover:shadow-lg transition-shadow"
              >
                <CardContent className="p-6">
                  <div className="text-4xl font-bold text-blue-600 mb-2">
                    {benefit.value}
                  </div>
                  <h3 className="text-lg font-semibold mb-2">
                    {benefit.title}
                  </h3>
                  <p className="text-gray-600">{benefit.description}</p>
                </CardContent>
              </Card>
            ))}
          </div>
        </div>
      </div>

      {/* CTA Section */}
      <div className="py-20 bg-blue-600">
        <div className="max-w-4xl mx-auto px-4 text-center text-white">
          <h2 className="text-3xl font-bold mb-4">지금 바로 시작하세요</h2>
          <p className="text-xl mb-8">
            스마트한 에너지 관리의 시작, FEMS가 함께합니다
          </p>
          <Button
            size="lg"
            variant="outline"
            className="text-white border-white hover:bg-white/10"
          >
            무료 상담 신청
          </Button>
        </div>
      </div>

      {/* Footer */}
      <footer className="bg-gray-900 text-gray-300 py-12">
        <div className="max-w-7xl mx-auto px-4">
          <div className="grid md:grid-cols-4 gap-8">
            <div>
              <h3 className="text-white font-semibold mb-4">About Us</h3>
              <p className="text-sm">
                최첨단 기술로 에너지 관리의 혁신을 선도하는 기업입니다.
              </p>
            </div>
            <div>
              <h3 className="text-white font-semibold mb-4">Solutions</h3>
              <ul className="space-y-2 text-sm">
                <li>제조업</li>
                <li>화학/정유</li>
                <li>반도체/디스플레이</li>
              </ul>
            </div>
            <div>
              <h3 className="text-white font-semibold mb-4">Support</h3>
              <ul className="space-y-2 text-sm">
                <li>기술지원</li>
                <li>교육</li>
                <li>문의하기</li>
              </ul>
            </div>
            <div>
              <h3 className="text-white font-semibold mb-4">Contact</h3>
              <ul className="space-y-2 text-sm">
                <li>contact@fems.com</li>
                <li>02-123-4567</li>
                <li>서울시 강남구 테헤란로</li>
              </ul>
            </div>
          </div>
          <div className="border-t border-gray-800 mt-8 pt-8 text-sm text-center">
            © 2024 PLM. All rights reserved.
          </div>
        </div>
      </footer>
    </div>
  );
}