'use client';

import {
  Dialog,
  DialogContent,
  DialogTitle,
  VisuallyHidden,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import {
  Copy,
  Edit,
  X as XIcon,
  CheckCircle,
  Printer,
  Send,
} from 'lucide-react';
import { ProposalDocument } from './ProposalDocument';
import { ExpenseReportDocument } from './ExpenseReportDocument';
import { ExpenseEstimateDocument } from './ExpenseEstimateDocument';
import { printArea } from '@/lib/print-utils';
import type {
  DocumentDetailModalProps,
  ProposalDocumentData,
  ExpenseReportDocumentData,
  ExpenseEstimateDocumentData,
} from './types';

export function DocumentDetailModal({
  open,
  onOpenChange,
  documentType,
  data,
  mode = 'inbox', // 기본값: 결재함 (승인/반려 표시)
  documentStatus,
  onEdit,
  onCopy,
  onApprove,
  onReject,
  onSubmit,
}: DocumentDetailModalProps) {
  // 기안함 모드에서 임시저장 상태일 때만 수정/상신 가능
  const getDocumentTitle = () => {
    switch (documentType) {
      case 'proposal':
        return '품의서';
      case 'expenseReport':
        return '지출결의서';
      case 'expenseEstimate':
        return '비용견적서';
      default:
        return '문서';
    }
  };

  const handlePrint = () => {
    printArea({ title: `${getDocumentTitle()} 인쇄` });
  };

  const renderDocument = () => {
    switch (documentType) {
      case 'proposal':
        return <ProposalDocument data={data as ProposalDocumentData} />;
      case 'expenseReport':
        return <ExpenseReportDocument data={data as ExpenseReportDocumentData} />;
      case 'expenseEstimate':
        return <ExpenseEstimateDocument data={data as ExpenseEstimateDocumentData} />;
      default:
        return null;
    }
  };

  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent className="max-w-[95vw] md:max-w-[800px] lg:max-w-[900px] h-[95vh] p-0 flex flex-col gap-0 overflow-hidden [&>button]:hidden">
        <VisuallyHidden>
          <DialogTitle>{getDocumentTitle()} 상세</DialogTitle>
        </VisuallyHidden>

        {/* 헤더 영역 - 고정 (인쇄 시 숨김) */}
        <div className="print-hidden flex-shrink-0 flex items-center justify-between px-6 py-4 border-b bg-white">
          <h2 className="text-lg font-semibold">{getDocumentTitle()} 상세</h2>
          <Button
            variant="ghost"
            size="icon"
            onClick={() => onOpenChange(false)}
            className="h-8 w-8"
          >
            <XIcon className="h-4 w-4" />
          </Button>
        </div>

        {/* 버튼 영역 - 고정 (인쇄 시 숨김) */}
        <div className="print-hidden flex-shrink-0 flex items-center gap-2 px-6 py-3 bg-muted/30 border-b">
          {/* 기안함 모드 + 임시저장 상태: 복제, 상신, 인쇄 */}
          {mode === 'draft' && documentStatus === 'draft' && (
            <>
              <Button variant="outline" size="sm" onClick={onCopy}>
                <Copy className="h-4 w-4 mr-1" />
                복제
              </Button>
              <Button variant="default" size="sm" onClick={onSubmit} className="bg-blue-600 hover:bg-blue-700">
                <Send className="h-4 w-4 mr-1" />
                상신
              </Button>
            </>
          )}

          {/* 기안함 모드 + 결재대기 이후 상태: 인쇄만 (버튼 없음, 아래 인쇄 버튼만 표시) */}

          {/* 결재함 모드: 수정, 반려, 승인, 인쇄 */}
          {mode === 'inbox' && (
            <>
              <Button variant="outline" size="sm" onClick={onEdit}>
                <Edit className="h-4 w-4 mr-1" />
                수정
              </Button>
              <Button variant="outline" size="sm" onClick={onReject} className="text-red-600 hover:text-red-700">
                <XIcon className="h-4 w-4 mr-1" />
                반려
              </Button>
              <Button variant="default" size="sm" onClick={onApprove} className="bg-blue-600 hover:bg-blue-700">
                <CheckCircle className="h-4 w-4 mr-1" />
                승인
              </Button>
            </>
          )}

          <Button variant="outline" size="sm" onClick={handlePrint}>
            <Printer className="h-4 w-4 mr-1" />
            인쇄
          </Button>

          {/* TODO: 공유 기능 추가 예정 - PDF 다운로드, 이메일, 팩스, 카카오톡 공유 */}
          {/* <DropdownMenu>
            <DropdownMenuTrigger asChild>
              <Button variant="outline" size="sm">
                <Share2 className="h-4 w-4 mr-1" />
                공유
                <ChevronDown className="h-3 w-3 ml-1" />
              </Button>
            </DropdownMenuTrigger>
            <DropdownMenuContent align="end">
              <DropdownMenuItem onClick={handleSharePdf}>
                <FileText className="h-4 w-4 mr-2" />
                PDF 다운로드
              </DropdownMenuItem>
              <DropdownMenuItem onClick={handleShareEmail}>
                <Mail className="h-4 w-4 mr-2" />
                이메일
              </DropdownMenuItem>
              <DropdownMenuItem onClick={handleShareFax}>
                <Phone className="h-4 w-4 mr-2" />
                팩스
              </DropdownMenuItem>
              <DropdownMenuItem onClick={handleShareKakao}>
                <MessageCircle className="h-4 w-4 mr-2" />
                카카오톡
              </DropdownMenuItem>
            </DropdownMenuContent>
          </DropdownMenu> */}
        </div>

        {/* 문서 영역 - 스크롤 (인쇄 시 이 영역만 출력) */}
        <div className="print-area flex-1 overflow-y-auto bg-gray-100 p-6">
          <div className="max-w-[210mm] mx-auto bg-white shadow-lg rounded-lg">
            {renderDocument()}
          </div>
        </div>
      </DialogContent>
    </Dialog>
  );
}

// Re-export types and components
export type { DocumentType, DocumentDetailModalProps } from './types';
export { ProposalDocument } from './ProposalDocument';
export { ExpenseReportDocument } from './ExpenseReportDocument';
export { ExpenseEstimateDocument } from './ExpenseEstimateDocument';

// V2 - DocumentViewer 기반
export { DocumentDetailModalV2 } from './DocumentDetailModalV2';
export { DynamicDocument } from './DynamicDocument';