'use client';

/**
 * 제품검사성적서 모달
 *
 * 양식 기반 전환 (5.2.4):
 * - documents API에서 FQC 문서를 조회하여 양식 기반 렌더링
 * - FqcDocumentContent로 template 구조 기반 표시
 * - 개소(orderItem)별 페이지네이션 유지
 *
 * Fallback: 문서가 없는 경우 기존 하드코딩 InspectionReportDocument 사용
 */

import { useState, useCallback, useMemo, useEffect, useRef } from 'react';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { ChevronLeft, ChevronRight, Loader2, AlertCircle } from 'lucide-react';
import { DocumentViewer } from '@/components/document-system';
import { FqcDocumentContent } from './FqcDocumentContent';
import { InspectionReportDocument } from './InspectionReportDocument';
import { getFqcDocument, getFqcTemplate } from '../fqcActions';
import type {
  InspectionReportDocument as InspectionReportDocumentType,
  OrderSettingItem,
  ProductInspection,
} from '../types';
import type { FqcDocument, FqcTemplate } from '../fqcActions';
import { buildReportDocumentDataForItem } from '../mockData';
import { formatDate } from '@/lib/utils/date';

interface InspectionReportModalProps {
  open: boolean;
  onOpenChange: (open: boolean) => void;
  data: InspectionReportDocumentType | null;
  /** 페이지네이션용: 원본 inspection 데이터 */
  inspection?: ProductInspection | null;
  /** 페이지네이션용: orderItems (수정 모드에서는 formData.orderItems) */
  orderItems?: OrderSettingItem[];
}

export function InspectionReportModal({
  open,
  onOpenChange,
  data,
  inspection,
  orderItems,
}: InspectionReportModalProps) {
  const [currentPage, setCurrentPage] = useState(1);
  const [inputPage, setInputPage] = useState('1');

  // rendered_html 캡처용 ref (Phase 1.3 준비)
  const contentWrapperRef = useRef<HTMLDivElement>(null);

  // FQC 문서/양식 상태
  const [fqcDocument, setFqcDocument] = useState<FqcDocument | null>(null);
  const [fqcTemplate, setFqcTemplate] = useState<FqcTemplate | null>(null);
  const [isLoadingFqc, setIsLoadingFqc] = useState(false);
  const [fqcError, setFqcError] = useState<string | null>(null);
  const [templateLoadFailed, setTemplateLoadFailed] = useState(false);

  // FQC 모드 우선 (orderItems에 documentId가 있으면 FQC 문서 존재)
  const hasFqcDocuments = !!orderItems && orderItems.some((i) => i.documentId);
  const useFqcMode = !templateLoadFailed && (hasFqcDocuments || !!fqcTemplate);

  // 총 페이지 수
  const totalPages = useMemo(() => {
    if (orderItems && orderItems.length > 0) return orderItems.length;
    return 1;
  }, [orderItems]);

  // 모달 열릴 때 초기화
  useEffect(() => {
    if (open) {
      setCurrentPage(1);
      setInputPage('1');
      setFqcDocument(null);
      setFqcError(null);
      setTemplateLoadFailed(false);
    }
  }, [open]);

  // FQC 양식 로드 (항상 시도, template 로드 실패 시 legacy fallback)
  useEffect(() => {
    if (!open || fqcTemplate || templateLoadFailed) return;
    getFqcTemplate().then(result => {
      if (result.success && result.data) {
        setFqcTemplate(result.data);
      } else {
        setTemplateLoadFailed(true);
      }
    });
  }, [open, fqcTemplate, templateLoadFailed]);

  // 페이지 변경 시 FQC 문서 로드
  useEffect(() => {
    if (!open || !hasFqcDocuments || !orderItems) return;

    const currentItem = orderItems[currentPage - 1];
    if (!currentItem) return;

    const documentId = currentItem.documentId;
    if (!documentId) {
      setFqcDocument(null);
      setFqcError(null);
      return;
    }

    setIsLoadingFqc(true);
    setFqcError(null);

    getFqcDocument(documentId)
      .then(result => {
        if (result.success && result.data) {
          setFqcDocument(result.data);
        } else {
          setFqcError(result.error || '문서 조회 실패');
          setFqcDocument(null);
        }
      })
      .finally(() => setIsLoadingFqc(false));
  }, [open, useFqcMode, currentPage, orderItems]);

  // 기존 모드: 현재 페이지 문서 데이터 (fallback)
  const legacyCurrentData = useMemo(() => {
    if (inspection && orderItems && orderItems.length > 0) {
      const currentItem = orderItems[currentPage - 1];
      if (currentItem) {
        return buildReportDocumentDataForItem(inspection, currentItem);
      }
    }
    return data;
  }, [inspection, orderItems, currentPage, data]);

  // 페이지네이션 핸들러
  const handlePrevPage = useCallback(() => {
    if (currentPage > 1) {
      const newPage = currentPage - 1;
      setCurrentPage(newPage);
      setInputPage(String(newPage));
    }
  }, [currentPage]);

  const handleNextPage = useCallback(() => {
    if (currentPage < totalPages) {
      const newPage = currentPage + 1;
      setCurrentPage(newPage);
      setInputPage(String(newPage));
    }
  }, [currentPage, totalPages]);

  const handleGoToPage = useCallback(() => {
    const pageNum = parseInt(inputPage, 10);
    if (!isNaN(pageNum) && pageNum >= 1 && pageNum <= totalPages) {
      setCurrentPage(pageNum);
    } else {
      setInputPage(String(currentPage));
    }
  }, [inputPage, totalPages, currentPage]);

  const handleKeyDown = useCallback(
    (e: React.KeyboardEvent<HTMLInputElement>) => {
      if (e.key === 'Enter') handleGoToPage();
    },
    [handleGoToPage]
  );

  // 문서 표시할 데이터 없음 체크
  if (!useFqcMode && !legacyCurrentData) return null;

  // 현재 페이지 아이템 정보
  const currentItem = orderItems?.[currentPage - 1];

  // 페이지네이션 UI
  const paginationUI = totalPages > 1 ? (
    <div className="flex items-center justify-center gap-2 py-3 border-t bg-gray-100 print:hidden">
      <Button
        variant="outline"
        size="sm"
        onClick={handlePrevPage}
        disabled={currentPage <= 1}
        className="h-8"
      >
        <ChevronLeft className="w-4 h-4 mr-1" />
        이전
      </Button>
      <div className="flex items-center gap-2">
        <Input
          value={inputPage}
          onChange={(e) => setInputPage(e.target.value)}
          onKeyDown={handleKeyDown}
          className="w-14 h-8 text-center"
        />
        <span className="text-sm text-muted-foreground">/ {totalPages}</span>
      </div>
      <Button variant="outline" size="sm" onClick={handleGoToPage} className="h-8">
        이동
      </Button>
      <Button
        variant="outline"
        size="sm"
        onClick={handleNextPage}
        disabled={currentPage >= totalPages}
        className="h-8"
      >
        다음
        <ChevronRight className="w-4 h-4 ml-1" />
      </Button>
      {/* 현재 개소 정보 */}
      {currentItem && (
        <span className="text-xs text-muted-foreground ml-2">
          {currentItem.floor || ''}{currentItem.symbol ? `-${currentItem.symbol}` : ''}
        </span>
      )}
    </div>
  ) : null;

  // 문서 제목
  const documentTitle = useFqcMode && fqcDocument
    ? fqcDocument.title
    : '제품검사성적서';

  // PDF 메타 정보
  const pdfMeta = useFqcMode && fqcDocument
    ? { documentNumber: fqcDocument.documentNo, createdDate: formatDate(fqcDocument.createdAt) }
    : legacyCurrentData
      ? { documentNumber: legacyCurrentData.documentNumber, createdDate: legacyCurrentData.createdDate }
      : undefined;

  return (
    <DocumentViewer
      title={documentTitle}
      preset="readonly"
      open={open}
      onOpenChange={onOpenChange}
      pdfMeta={pdfMeta}
      toolbarExtra={paginationUI}
    >
      {useFqcMode ? (
        // 양식 기반 모드
        isLoadingFqc ? (
          <div className="flex items-center justify-center py-20">
            <Loader2 className="w-6 h-6 animate-spin text-muted-foreground" />
            <span className="ml-2 text-muted-foreground">문서 로딩 중...</span>
          </div>
        ) : fqcError ? (
          <div className="flex flex-col items-center justify-center py-20 text-muted-foreground">
            <AlertCircle className="w-8 h-8 mb-2" />
            <p>{fqcError}</p>
          </div>
        ) : fqcDocument && fqcTemplate ? (
          <div ref={contentWrapperRef}>
            <FqcDocumentContent
              template={fqcTemplate}
              documentData={fqcDocument.data}
              documentNo={fqcDocument.documentNo}
              createdDate={formatDate(fqcDocument.createdAt)}
              readonly={true}
            />
          </div>
        ) : fqcTemplate && !hasFqcDocuments ? (
          // template은 있지만 문서가 없는 경우 → legacy fallback
          legacyCurrentData ? <InspectionReportDocument data={legacyCurrentData} /> : (
            <div className="flex flex-col items-center justify-center py-20 text-muted-foreground">
              <AlertCircle className="w-8 h-8 mb-2" />
              <p>이 개소의 FQC 문서가 아직 생성되지 않았습니다.</p>
            </div>
          )
        ) : (
          <div className="flex flex-col items-center justify-center py-20 text-muted-foreground">
            <AlertCircle className="w-8 h-8 mb-2" />
            <p>이 개소의 FQC 문서가 아직 생성되지 않았습니다.</p>
          </div>
        )
      ) : (
        // 기존 하드코딩 모드 (fallback)
        legacyCurrentData && <InspectionReportDocument data={legacyCurrentData} />
      )}
    </DocumentViewer>
  );
}
