"use client"

import * as React from "react"
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from "@/components/ui/dialog"
import { Button } from "@/components/ui/button"
import { Badge } from "@/components/ui/badge"
import { Separator } from "@/components/ui/separator"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"

import { 
  Eye, 
  Download, 
  Save,
  Upload,
  Loader2, 
  FileText, 
  RefreshCw,
  Settings,
  AlertCircle,
  CheckCircle
} from "lucide-react"
import { toast } from "sonner"

import { type GtcClauseTreeView } from "@/db/schema/gtc"
import { ClausePreviewViewer } from "./clause-preview-viewer"
import { saveGtcDocumentAction } from "../service"

interface Vendor {
  vendorName: string
  address: string
  representativeName: string
  taxId: string
  phone: string
}

interface PreviewDocumentDialogProps
  extends React.ComponentPropsWithRef<typeof Dialog> {
  clauses: GtcClauseTreeView[]
  contractDocument: any
  vendor: Vendor
  contractId?: number
  onExport?: () => void
}

export function PreviewDocumentDialog({ 
  clauses, 
  contractDocument,
  vendor,
  contractId,
  onExport,
  ...props 
}: PreviewDocumentDialogProps) {

  const [isGenerating, setIsGenerating] = React.useState(false)
  const [isSaving, setIsSaving] = React.useState(false)
  const [isConverting, setIsConverting] = React.useState(false)
  const [documentGenerated, setDocumentGenerated] = React.useState(false)
  const [viewerInstance, setViewerInstance] = React.useState<any>(null)
  const [hasError, setHasError] = React.useState(false)
  
  // 파일 업로드 관련 상태
  const [selectedFile, setSelectedFile] = React.useState<File | null>(null)
  const [convertedPdf, setConvertedPdf] = React.useState<Uint8Array | null>(null)
  const fileInputRef = React.useRef<HTMLInputElement>(null)

  // 조항 통계 계산
  const stats = React.useMemo(() => {
    const activeClausesCount = clauses.filter(c => c.isActive !== false).length
    const topLevelCount = clauses.filter(c => !c.parentId && c.isActive !== false).length
    const hasContentCount = clauses.filter(c => c.content && c.isActive !== false).length
    
    return {
      total: activeClausesCount,
      topLevel: topLevelCount,
      withContent: hasContentCount,
      withoutContent: activeClausesCount - hasContentCount
    }
  }, [clauses])

  const handleGeneratePreview = async () => {
    setIsGenerating(true)
    setHasError(false)
    setDocumentGenerated(false)
    
    try {
      console.log("🚀 문서 미리보기 생성 시작")
      
      // ClausePreviewViewer가 완전히 로드될 때까지 기다림
      await new Promise(resolve => setTimeout(resolve, 2000))
      
      if (!hasError) {
        setDocumentGenerated(true)
        toast.success("문서 미리보기가 생성되었습니다.")
      }
    } catch (error) {
      console.error("문서 생성 중 오류:", error)
      setHasError(true)
      toast.error("문서 생성 중 오류가 발생했습니다.")
    } finally {
      setIsGenerating(false)
    }
  }

  // 파일 선택 핸들러
  const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => {
    const file = event.target.files?.[0]
    if (!file) return

    // Word 파일만 허용
    const allowedTypes = [
      'application/vnd.openxmlformats-officedocument.wordprocessingml.document', // .docx
      'application/msword' // .doc
    ]

    if (!allowedTypes.includes(file.type)) {
      toast.error("Word 파일(.doc, .docx)만 업로드할 수 있습니다.")
      return
    }

    if (file.size > 50 * 1024 * 1024) { // 50MB 제한
      toast.error("파일 크기는 50MB 이하여야 합니다.")
      return
    }

    setSelectedFile(file)
    setConvertedPdf(null) // 이전 변환 결과 초기화
    toast.success(`파일이 선택되었습니다: ${file.name}`)
  }

  // PDF 변환 함수
  const handleConvertToPdf = async () => {
    if (!selectedFile) {
      toast.error("먼저 Word 파일을 선택해주세요.")
      return
    }

    // 브라우저 환경 체크
    if (typeof window === 'undefined' || typeof document === 'undefined') {
      toast.error("브라우저 환경에서만 PDF 변환이 가능합니다.")
      return
    }

    setIsConverting(true)
    
    try {
      console.log("🔄 PDF 변환 시작:", selectedFile.name)

      // PDFTron WebViewer 동적 import
      const { default: WebViewer } = await import("@pdftron/webviewer")
      
      // 임시 WebViewer 인스턴스 생성 (화면에 표시하지 않음)
      const tempDiv = document.createElement('div')
      tempDiv.style.display = 'none'
      tempDiv.style.position = 'absolute'
      tempDiv.style.top = '-9999px'
      tempDiv.style.left = '-9999px'
      tempDiv.style.width = '1px'
      tempDiv.style.height = '1px'
      document.body.appendChild(tempDiv)

      const instance = await WebViewer(
        {
          path: "/pdftronWeb",
          licenseKey: process.env.NEXT_PUBLIC_PDFTRON_WEBVIEW_KEY,
          fullAPI: true,
          enableOfficeEditing: true,
        },
        tempDiv
      )

      try {
        // WebViewer 초기화 대기
        await new Promise(resolve => setTimeout(resolve, 1000))
        
        const { Core } = instance
        const { createDocument } = Core
        
        const templateData = {
          company_name: vendor.vendorName || '협력업체명',
          company_address: vendor.address || '주소',
          representative_name: vendor.representativeName || '대표자명',
          signature_date: new Date().toLocaleDateString('ko-KR'),
          tax_id: vendor.taxId || '사업자번호',
          phone_number: vendor.phone || '전화번호',
        }
 
        const templateDoc = await createDocument(selectedFile, {
          filename: selectedFile.name|| 'template.docx',
          extension: 'docx',
        })

        await templateDoc.applyTemplateValues(templateData)


        // 문서 로드 완료 대기
        await new Promise(resolve => setTimeout(resolve, 3000))

        // PDF로 변환 - 더 안전한 방식
        const fileData = await templateDoc.getFileData()
        const pdfBuffer = await Core.officeToPDFBuffer(fileData, { extension: 'docx' })

        console.log("✅ PDF 변환 완료:", pdfBuffer.byteLength, "bytes")
        setConvertedPdf(new Uint8Array(pdfBuffer))
        toast.success("PDF 변환이 완료되었습니다.")

      } finally {
        // 임시 WebViewer 정리
        try {
          instance.UI.dispose()
        } catch (disposeError) {
          console.warn("WebViewer dispose 오류:", disposeError)
        }
        
        try {
          if (tempDiv && tempDiv.parentNode) {
            document.body.removeChild(tempDiv)
          }
        } catch (removeError) {
          console.warn("임시 div 제거 오류:", removeError)
        }
      }

    } catch (error) {
      console.error("❌ PDF 변환 실패:", error)
      toast.error(`PDF 변환 실패: ${error instanceof Error ? error.message : '알 수 없는 오류'}`)
    } finally {
      setIsConverting(false)
    }
  }

  // 문서 저장 함수
  const handleSaveDocument = async () => {
    if (!convertedPdf || !selectedFile) {
      toast.error("먼저 파일을 업로드하고 PDF로 변환해주세요.")
      return
    }

    if (!contractId) {
      toast.error("계약 ID를 찾을 수 없습니다. URL에 contractId 파라미터가 필요합니다.")
      return
    }

    setIsSaving(true)
    
    try {
      console.log("💾 문서 저장 시작", { contractId })
      
      const result = await saveGtcDocumentAction({
        documentId: contractId,
        pdfBuffer: convertedPdf,
        originalFileName: selectedFile.name,
        vendor
      })

      if (result.success) {
        toast.success(`문서가 성공적으로 저장되었습니다.`)
        console.log("✅ 문서 저장 완료:", {
          fileName: result.fileName,
          filePath: result.filePath,
          fileSize: result.fileSize
        })
        
        // 저장 완료 후 상태 초기화
        setSelectedFile(null)
        setConvertedPdf(null)
        if (fileInputRef.current) {
          fileInputRef.current.value = ''
        }
      } else {
        throw new Error(result.error || "문서 저장에 실패했습니다.")
      }
    } catch (error) {
      console.error("❌ 문서 저장 실패:", error)
      toast.error(`문서 저장 실패: ${error instanceof Error ? error.message : '알 수 없는 오류'}`)
    } finally {
      setIsSaving(false)
    }
  }

  const handleExportDocument = () => {
    if (viewerInstance) {
      try {
        viewerInstance.UI.downloadPdf({
          filename: `${contractDocument?.title || 'GTC계약서'}_미리보기.pdf`
        })
        toast.success("PDF 다운로드가 시작됩니다.")
      } catch (error) {
        console.error("다운로드 오류:", error)
        toast.error("다운로드 중 오류가 발생했습니다.")
      }
    } else {
      toast.error("뷰어가 준비되지 않았습니다.")
    }
  }

  const handleRegenerateDocument = () => {
    console.log("🔄 문서 재생성 시작")
    setDocumentGenerated(false)
    setHasError(false)
    handleGeneratePreview()
  }

  const handleViewerSuccess = React.useCallback(() => {
    setDocumentGenerated(true)
    setIsGenerating(false)
    setHasError(false)
  }, [])

  const handleViewerError = React.useCallback(() => {
    setHasError(true)
    setIsGenerating(false)
    setDocumentGenerated(false)
  }, [])

  // 다이얼로그가 열릴 때 자동으로 미리보기 생성
  React.useEffect(() => {
    if (props.open && !documentGenerated && !isGenerating && !hasError) {
      const timer = setTimeout(() => {
        handleGeneratePreview()
      }, 300)
      
      return () => clearTimeout(timer)
    }
  }, [props.open, documentGenerated, isGenerating, hasError])

  // 다이얼로그가 닫힐 때 상태 초기화
  React.useEffect(() => {
    if (!props.open) {
      setDocumentGenerated(false)
      setIsGenerating(false)
      setIsSaving(false)
      setIsConverting(false)
      setHasError(false)
      setViewerInstance(null)
      setSelectedFile(null)
      setConvertedPdf(null)
      if (fileInputRef.current) {
        fileInputRef.current.value = ''
      }
    }
  }, [props.open])

  return (
    <Dialog {...props}>
      <DialogContent className="max-w-7xl h-[90vh] flex flex-col">
        <DialogHeader className="flex-shrink-0">
          <DialogTitle className="flex items-center gap-2">
            <Eye className="h-5 w-5" />
            문서 미리보기 및 저장
          </DialogTitle>
          <DialogDescription>
            조항 기반 미리보기를 확인하고, Word 파일을 업로드하여 최종 문서를 저장하세요.
          </DialogDescription>
        </DialogHeader>

        {/* 문서 정보 및 통계 */}
        <div className="flex-shrink-0 p-4 bg-muted/30 rounded-lg space-y-4">
          <div className="flex items-center justify-between">
            <div className="flex items-center gap-2">
              <FileText className="h-4 w-4" />
              <span className="font-medium">{contractDocument?.title || 'GTC 계약서'}</span>
              <Badge variant="outline">{stats.total}개 조항</Badge>
              {vendor && (
                <Badge variant="secondary">{vendor.vendorName}</Badge>
              )}
              {hasError && (
                <Badge variant="destructive" className="gap-1">
                  <AlertCircle className="h-3 w-3" />
                  오류 발생
                </Badge>
              )}
            </div>
            <div className="flex items-center gap-2">
              {documentGenerated && !hasError && (
                <Button
                  variant="outline"
                  size="sm"
                  onClick={handleRegenerateDocument}
                  disabled={isGenerating || isSaving || isConverting}
                >
                  <RefreshCw className={`mr-2 h-3 w-3 ${isGenerating ? 'animate-spin' : ''}`} />
                  재생성
                </Button>
              )}
              {hasError && (
                <Button
                  variant="default"
                  size="sm"
                  onClick={handleRegenerateDocument}
                  disabled={isGenerating || isSaving || isConverting}
                >
                  <RefreshCw className={`mr-2 h-3 w-3 ${isGenerating ? 'animate-spin' : ''}`} />
                  다시 시도
                </Button>
              )}
            </div>
          </div>

          {/* 파일 업로드 섹션 */}
          <div className="border-t pt-4">
            <div className="grid grid-cols-1 lg:grid-cols-3 gap-4">
              <div className="space-y-2">
                <Label htmlFor="file-upload">1. Word 파일 업로드</Label>
                <div className="flex gap-2">
                  <Input
                    ref={fileInputRef}
                    id="file-upload"
                    type="file"
                    accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"
                    onChange={handleFileSelect}
                    disabled={isConverting || isSaving}
                    className="flex-1"
                  />
                  {selectedFile && (
                    <CheckCircle className="h-8 w-8 text-green-500 flex-shrink-0" />
                  )}
                </div>
                {selectedFile && (
                  <p className="text-sm text-muted-foreground">
                    선택됨: {selectedFile.name} ({(selectedFile.size / (1024 * 1024)).toFixed(2)}MB)
                  </p>
                )}
              </div>

              <div className="space-y-2">
                <Label>2. PDF 변환</Label>
                <Button
                  onClick={handleConvertToPdf}
                  disabled={!selectedFile || isConverting || isSaving}
                  className="w-full"
                  variant={convertedPdf ? "outline" : "default"}
                >
                  {isConverting ? (
                    <Loader2 className="mr-2 h-4 w-4 animate-spin" />
                  ) : convertedPdf ? (
                    <CheckCircle className="mr-2 h-4 w-4" />
                  ) : (
                    <RefreshCw className="mr-2 h-4 w-4" />
                  )}
                  {isConverting ? "변환 중..." : convertedPdf ? "변환 완료" : "PDF 변환"}
                </Button>
              </div>

              <div className="space-y-2">
                <Label>3. 문서 저장</Label>
                <Button
                  onClick={handleSaveDocument}
                  disabled={!convertedPdf || isSaving || isConverting}
                  className="w-full"
                >
                  {isSaving ? (
                    <Loader2 className="mr-2 h-4 w-4 animate-spin" />
                  ) : (
                    <Save className="mr-2 h-4 w-4" />
                  )}
                  {isSaving ? "저장 중..." : "문서 저장"}
                </Button>
              </div>
            </div>
          </div>

          {/* 통계 정보 */}
          <div className="grid grid-cols-4 gap-4 text-sm border-t pt-4">
            <div className="text-center p-2 bg-background rounded">
              <div className="font-medium text-lg">{stats.total}</div>
              <div className="text-muted-foreground">총 조항</div>
            </div>
            <div className="text-center p-2 bg-background rounded">
              <div className="font-medium text-lg">{stats.topLevel}</div>
              <div className="text-muted-foreground">최상위 조항</div>
            </div>
            <div className="text-center p-2 bg-background rounded">
              <div className="font-medium text-lg text-green-600">{stats.withContent}</div>
              <div className="text-muted-foreground">내용 있음</div>
            </div>
            <div className="text-center p-2 bg-background rounded">
              <div className="font-medium text-lg text-amber-600">{stats.withoutContent}</div>
              <div className="text-muted-foreground">제목만</div>
            </div>
          </div>
        </div>

        <Separator />

        {/* PDFTron 뷰어 영역 */}
        <div className="flex-1 min-h-0 relative">
          {isGenerating ? (
            <div className="absolute inset-0 flex flex-col items-center justify-center bg-background">
              <Loader2 className="h-8 w-8 animate-spin text-primary mb-4" />
              <p className="text-lg font-medium mb-2">문서 생성 중...</p>
              <p className="text-sm text-muted-foreground">
                {stats.total}개의 조항을 배치하고 있습니다.
              </p>
              <p className="text-xs text-gray-400 mt-2">
                초기화에 시간이 걸릴 수 있습니다...
              </p>
            </div>
          ) : hasError ? (
            <div className="absolute inset-0 flex flex-col items-center justify-center bg-muted/10">
              <AlertCircle className="h-12 w-12 text-destructive mb-4" />
              <p className="text-lg font-medium mb-2 text-destructive">문서 생성 실패</p>
              <p className="text-sm text-muted-foreground mb-4 text-center max-w-md">
                문서 생성 중 오류가 발생했습니다. 네트워크 연결이나 파일 권한을 확인해주세요.
              </p>
              <Button onClick={handleRegenerateDocument} disabled={isGenerating || isSaving || isConverting}>
                <RefreshCw className="mr-2 h-4 w-4" />
                다시 시도
              </Button>
            </div>
          ) : documentGenerated ? (
            <ClausePreviewViewer
              clauses={clauses}
              document={contractDocument}
              instance={viewerInstance}
              setInstance={setViewerInstance}
              onSuccess={handleViewerSuccess}
              onError={handleViewerError}
            />
          ) : (
            <div className="absolute inset-0 flex flex-col items-center justify-center bg-muted/10">
              <FileText className="h-12 w-12 text-muted-foreground mb-4" />
              <p className="text-lg font-medium mb-2">문서 미리보기 준비 중</p>
              <Button onClick={handleGeneratePreview} disabled={isGenerating || isSaving || isConverting}>
                <Eye className="mr-2 h-4 w-4" />
                미리보기 생성
              </Button>
            </div>
          )}
        </div>
      </DialogContent>
    </Dialog>
  )
}