import { DashboardTemplate } from "./templates/DashboardTemplate";
import { Database, Package, Box, Archive, Layers, Wrench, Building, FileText, Code, ArrowUpRight } from "lucide-react";
import { Badge } from "./ui/badge";

export function MasterDataDashboard() {
  const stats = [
    {
      label: "등록된 모델",
      value: "87",
      icon: Box,
      iconColor: "text-blue-600",
      trend: { value: "+5%", isPositive: true }
    },
    {
      label: "자재 종류",
      value: "456",
      icon: Archive,
      iconColor: "text-purple-600",
      trend: { value: "+8%", isPositive: true }
    },
    {
      label: "활성 거래처",
      value: "123",
      icon: Building,
      iconColor: "text-green-600",
      trend: { value: "+3%", isPositive: true }
    },
    {
      label: "BOM 구성",
      value: "342",
      icon: Layers,
      iconColor: "text-orange-600",
      trend: { value: "+4%", isPositive: true }
    }
  ];

  const recentActivities = [
    { type: "모델관리", action: "신규 모델 등록", item: "PRE-2024 V2", time: "10분 전" },
    { type: "BOM관리", action: "BOM 수정", item: "완제품 PRE-2024", time: "25분 전" },
    { type: "거래처관리", action: "거래처 등록", item: "현대자동차", time: "1시간 전" },
    { type: "검사기준관리", action: "검사기준 추가", item: "수입검사-철강", time: "2시간 전" }
  ];

  const modules = [
    { name: "모델관리", count: 87, icon: Box, description: "제품 모델 및 사양 관리" },
    { name: "자재관리", count: 456, icon: Archive, description: "자재 기준정보 관리" },
    { name: "BOM관리", count: 342, icon: Layers, description: "자재명세서(BOM) 관리" },
    { name: "공정관리", count: 45, icon: Wrench, description: "생산 공정 및 작업 관리" },
    { name: "거래처관리", count: 123, icon: Building, description: "고객 및 공급업체 관리" },
    { name: "검사기준관리", count: 89, icon: FileText, description: "품질 검사 기준 템플릿 관리" },
    { name: "코드관리", count: 234, icon: Code, description: "자동 코드 생성 규칙 관리" },
    { name: "공통코드관리", count: 156, icon: Code, description: "시스템 공통 코드 관리" }
  ];

  const getActivityBadgeColor = (type: string) => {
    switch (type) {
      case "모델관리": return "bg-blue-100 text-blue-700";
      case "BOM관리": return "bg-purple-100 text-purple-700";
      case "거래처관리": return "bg-green-100 text-green-700";
      case "검사기준관리": return "bg-orange-100 text-orange-700";
      default: return "bg-gray-100 text-gray-700";
    }
  };

  const quickActions = [
    { label: "모델관리", description: "제품 모델 및 사양 관리", icon: Box, onClick: () => {} },
    { label: "자재관리", description: "자재 기준정보 관리", icon: Archive, onClick: () => {} },
    { label: "BOM관리", description: "자재명세서(BOM) 관리", icon: Layers, onClick: () => {} },
    { label: "공정관리", description: "생산 공정 및 작업 관리", icon: Wrench, onClick: () => {} }
  ];

  const sections = [
    {
      title: "기준정보 모듈",
      content: (
        <div className="space-y-3">
          {modules.slice(0, 4).map((module, index) => {
            const Icon = module.icon;
            return (
              <div key={index} className="flex items-center justify-between p-3 rounded-lg hover:bg-accent transition-colors cursor-pointer">
                <div className="flex items-center gap-3">
                  <div className="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center">
                    <Icon className="h-5 w-5 text-primary" />
                  </div>
                  <div>
                    <p className="text-sm">{module.name}</p>
                    <p className="text-xs text-muted-foreground">{module.description}</p>
                  </div>
                </div>
                <div className="flex items-center gap-2">
                  <Badge variant="outline">{module.count}</Badge>
                  <ArrowUpRight className="h-4 w-4 text-muted-foreground" />
                </div>
              </div>
            );
          })}
        </div>
      )
    },
    {
      title: "최근 활동",
      content: (
        <div className="space-y-3">
          {recentActivities.map((activity, index) => (
            <div key={index} className="p-3 rounded-lg hover:bg-accent transition-colors cursor-pointer">
              <div className="flex items-center justify-between mb-2">
                <Badge className={getActivityBadgeColor(activity.type)}>{activity.type}</Badge>
                <p className="text-xs text-muted-foreground">{activity.time}</p>
              </div>
              <p className="text-sm mb-1">{activity.action}</p>
              <p className="text-xs text-muted-foreground">{activity.item}</p>
            </div>
          ))}
        </div>
      )
    },
    {
      title: "추가 모듈",
      span: "full" as const,
      content: (
        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
          {modules.slice(4).map((module, index) => {
            const Icon = module.icon;
            return (
              <div key={index} className="flex items-center gap-3 p-4 rounded-lg border hover:bg-accent transition-colors cursor-pointer">
                <div className="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center">
                  <Icon className="h-5 w-5 text-primary" />
                </div>
                <div className="flex-1">
                  <p className="text-sm">{module.name}</p>
                  <p className="text-xs text-muted-foreground">{module.count}개</p>
                </div>
              </div>
            );
          })}
        </div>
      )
    }
  ];

  return (
    <DashboardTemplate
      title="기준정보 관리"
      description="모든 기준정보를 통합 관리합니다"
      icon={Database}
      stats={stats}
      quickActions={quickActions}
      sections={sections}
    />
  );
}
