'use client';

import { useRouter, useParams } from 'next/navigation';
import { useState, useEffect } from 'react';
import { EmployeeDetail } from '@/components/hr/EmployeeManagement/EmployeeDetail';
import {
  AlertDialog,
  AlertDialogAction,
  AlertDialogCancel,
  AlertDialogContent,
  AlertDialogDescription,
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
} from '@/components/ui/alert-dialog';
import { ContentLoadingSpinner } from '@/components/ui/loading-spinner';
import type { Employee } from '@/components/hr/EmployeeManagement/types';

// TODO: 실제 API에서 데이터 가져오기
const mockEmployee: Employee = {
  id: '1',
  name: '김철수',
  employeeCode: 'EMP001',
  phone: '010-1234-5678',
  email: 'kimcs@company.com',
  status: 'active',
  hireDate: '2020-03-15',
  employmentType: 'regular',
  rank: '과장',
  gender: 'male',
  salary: 50000000,
  bankAccount: {
    bankName: '국민은행',
    accountNumber: '123-456-789012',
    accountHolder: '김철수',
  },
  address: {
    zipCode: '12345',
    address1: '서울시 강남구 테헤란로 123',
    address2: '101호',
  },
  departmentPositions: [
    { id: '1', departmentId: 'd1', departmentName: '개발본부', positionId: 'p1', positionName: '팀장' }
  ],
  clockInLocation: 'headquarters',
  clockOutLocation: 'headquarters',
  concurrentPosition: '',
  concurrentReason: '',
  userInfo: { userId: 'kimcs', role: 'manager', accountStatus: 'active' },
  createdAt: '2020-03-15T00:00:00Z',
  updatedAt: '2024-01-15T00:00:00Z',
};

export default function EmployeeDetailPage() {
  const router = useRouter();
  const params = useParams();
  const [employee, setEmployee] = useState<Employee | null>(null);
  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);

  useEffect(() => {
    // TODO: API 연동
    // const id = params.id;
    setEmployee(mockEmployee);
  }, [params.id]);

  const handleEdit = () => {
    router.push(`/ko/hr/employee-management/${params.id}/edit`);
  };

  const handleDelete = () => {
    setDeleteDialogOpen(true);
  };

  const confirmDelete = () => {
    // TODO: API 연동
    console.log('Delete employee:', params.id);
    router.push('/ko/hr/employee-management');
  };

  if (!employee) {
    return <ContentLoadingSpinner text="사원 정보를 불러오는 중..." />;
  }

  return (
    <>
      <EmployeeDetail
        employee={employee}
        onEdit={handleEdit}
        onDelete={handleDelete}
      />

      <AlertDialog open={deleteDialogOpen} onOpenChange={setDeleteDialogOpen}>
        <AlertDialogContent>
          <AlertDialogHeader>
            <AlertDialogTitle>사원 삭제</AlertDialogTitle>
            <AlertDialogDescription>
              &quot;{employee.name}&quot; 사원을 삭제하시겠습니까?
              <br />
              <span className="text-destructive">
                삭제된 사원 정보는 복구할 수 없습니다.
              </span>
            </AlertDialogDescription>
          </AlertDialogHeader>
          <AlertDialogFooter>
            <AlertDialogCancel>취소</AlertDialogCancel>
            <AlertDialogAction
              onClick={confirmDelete}
              className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
            >
              삭제
            </AlertDialogAction>
          </AlertDialogFooter>
        </AlertDialogContent>
      </AlertDialog>
    </>
  );
}
