path: root/lib/vendors/table/request-pq-dialog.tsx

"use client"

import * as React from "react"
import { type Row } from "@tanstack/react-table"
import { Loader, SendHorizonal, Search, X, Plus } from "lucide-react"
import { toast } from "sonner"
import { useMediaQuery } from "@/hooks/use-media-query"
import { Button } from "@/components/ui/button"
import {
  Dialog,
  DialogClose,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
  DialogTrigger,
} from "@/components/ui/dialog"
import {
  Drawer,
  DrawerClose,
  DrawerContent,
  DrawerDescription,
  DrawerFooter,
  DrawerHeader,
  DrawerTitle,
  DrawerTrigger,
} from "@/components/ui/drawer"
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select"
import { Checkbox } from "@/components/ui/checkbox"
import { Label } from "@/components/ui/label"
import { Input } from "@/components/ui/input"
import { Badge } from "@/components/ui/badge"
import { Vendor } from "@/db/schema/vendors"
import { requestBasicContractInfo, requestPQVendors } from "../service"
import { getProjectsWithPQList } from "@/lib/pq/service"
import type { Project } from "@/lib/pq/service"
import { useSession } from "next-auth/react"
import { DatePicker } from "@/components/ui/date-picker"
import { getALLBasicContractTemplates } from "@/lib/basic-contract/service"
import type { BasicContractTemplate } from "@/db/schema"
import { searchItemsForPQ } from "@/lib/items/service"
// import { PQContractViewer } from "../pq-contract-viewer" // 더 이상 사용하지 않음

interface RequestPQDialogProps extends React.ComponentPropsWithoutRef<typeof Dialog> {
  vendors: Row<Vendor>["original"][]
  showTrigger?: boolean
  onSuccess?: () => void
}

const AGREEMENT_LIST = [
  "준법서약",
  "표준하도급계약",
  "안전보건관리계약",
  "윤리규범 준수 서약",
  "동반성장협약",
  "내국신용장 미개설 합의",
  "기술자료 제출 기본 동의",
  "GTC 합의",
]

// PQ 대상 품목 타입 정의
interface PQItem {
  itemCode: string
  itemName: string
}

export function RequestPQDialog({ vendors, showTrigger = true, onSuccess, ...props }: RequestPQDialogProps) {
  const [isApprovePending, startApproveTransition] = React.useTransition()
  const isDesktop = useMediaQuery("(min-width: 640px)")
  const { data: session } = useSession()

  const [type, setType] = React.useState<"GENERAL" | "PROJECT" | "NON_INSPECTION" | null>(null)
  const [dueDate, setDueDate] = React.useState<string | null>(null)
  const [projects, setProjects] = React.useState<Project[]>([])
  const [selectedProjectId, setSelectedProjectId] = React.useState<number | null>(null)
  const [agreements, setAgreements] = React.useState<Record<string, boolean>>({})
  const [extraNote, setExtraNote] = React.useState<string>("")
  const [pqItems, setPqItems] = React.useState<PQItem[]>([])
  
  // 아이템 검색 관련 상태
  const [itemSearchQuery, setItemSearchQuery] = React.useState<string>("")
  const [filteredItems, setFilteredItems] = React.useState<PQItem[]>([])
  const [showItemDropdown, setShowItemDropdown] = React.useState<boolean>(false)
  const [isLoadingProjects, setIsLoadingProjects] = React.useState(false)
  const [basicContractTemplates, setBasicContractTemplates] = React.useState<BasicContractTemplate[]>([])
  const [selectedTemplateIds, setSelectedTemplateIds] = React.useState<number[]>([])
  const [isLoadingTemplates, setIsLoadingTemplates] = React.useState(false)

  // 아이템 검색 필터링
  React.useEffect(() => {
    if (itemSearchQuery.trim() === "") {
      setFilteredItems([])
      setShowItemDropdown(false)
      return
    }

    const searchItems = async () => {
      try {
        const results = await searchItemsForPQ(itemSearchQuery)
        setFilteredItems(results)
        setShowItemDropdown(true)
      } catch (error) {
        console.error("아이템 검색 오류:", error)
        toast.error("아이템 검색 중 오류가 발생했습니다.")
        setFilteredItems([])
        setShowItemDropdown(false)
      }
    }

    // 디바운싱: 300ms 후에 검색 실행
    const timeoutId = setTimeout(searchItems, 300)
    return () => clearTimeout(timeoutId)
  }, [itemSearchQuery])

  React.useEffect(() => {
    if (type === "PROJECT") {
      setIsLoadingProjects(true)
      getProjectsWithPQList().then(setProjects).catch(() => toast.error("프로젝트 로딩 실패"))
        .finally(() => setIsLoadingProjects(false))
    }
  }, [type])

  // 기본계약서 템플릿 로딩
  React.useEffect(() => {
    setIsLoadingTemplates(true)
    getALLBasicContractTemplates()
      .then(setBasicContractTemplates)
      .catch(() => toast.error("기본계약서 템플릿 로딩 실패"))
      .finally(() => setIsLoadingTemplates(false))
  }, [])

  React.useEffect(() => {
    if (!props.open) {
      setType(null)
      setSelectedProjectId(null)
      setAgreements({})
      setDueDate(null)
      setPqItems([])
      setExtraNote("")
      setSelectedTemplateIds([])
      setItemSearchQuery("")
      setFilteredItems([])
      setShowItemDropdown(false)
    }
  }, [props.open])

  // 아이템 선택 함수
  const handleSelectItem = (item: PQItem) => {
    // 이미 선택된 아이템인지 확인
    const isAlreadySelected = pqItems.some(selectedItem => 
      selectedItem.itemCode === item.itemCode
    )
    
    if (!isAlreadySelected) {
      setPqItems(prev => [...prev, item])
    }
    
    // 검색 초기화
    setItemSearchQuery("")
    setFilteredItems([])
    setShowItemDropdown(false)
  }

  // 아이템 제거 함수
  const handleRemoveItem = (itemCode: string) => {
    setPqItems(prev => prev.filter(item => item.itemCode !== itemCode))
  }

  const onApprove = () => {
    if (!type) return toast.error("PQ 유형을 선택하세요.")
    if (type === "PROJECT" && !selectedProjectId) return toast.error("프로젝트를 선택하세요.")
    if (!dueDate) return toast.error("마감일을 선택하세요.")
    if (!session?.user?.id) return toast.error("인증 실패")
  
    startApproveTransition(async () => {
      try {
        // 1단계: PQ 생성
        console.log("🚀 PQ 생성 시작")
        const { error: pqError } = await requestPQVendors({
          ids: vendors.map((v) => v.id),
          userId: Number(session.user.id),
          agreements,
          dueDate,
          projectId: type === "PROJECT" ? selectedProjectId : null,
          type: type || "GENERAL",
          extraNote,
          pqItems: JSON.stringify(pqItems),
          templateId: selectedTemplateIds.length > 0 ? selectedTemplateIds[0] : null,
        })

        if (pqError) {
          toast.error(`PQ 생성 실패: ${pqError}`)
          return
        }
        console.log("✅ PQ 생성 완료")
        toast.success("PQ가 성공적으로 요청되었습니다")

        // 2단계: 기본계약서 템플릿이 선택된 경우 백그라운드에서 처리
        if (selectedTemplateIds.length > 0) {
          const templates = basicContractTemplates.filter(t => 
            selectedTemplateIds.includes(t.id)
          )
          
          console.log("📋 기본계약서 백그라운드 처리 시작", templates.length, "개 템플릿")
          await processBasicContractsInBackground(templates, vendors)
        }
        
        // 완료 후 다이얼로그 닫기
        props.onOpenChange?.(false)
        onSuccess?.()

      } catch (error) {
        console.error('PQ 생성 오류:', error)
        toast.error(`처리 중 오류가 발생했습니다: ${error instanceof Error ? error.message : '알 수 없는 오류'}`)
      }
    })
  }

  // 백그라운드에서 기본계약서 처리
  const processBasicContractsInBackground = async (templates: BasicContractTemplate[], vendors: any[]) => {
    if (!session?.user?.id) {
      toast.error("인증 정보가 없습니다")
      return
    }

    try {
      const totalContracts = templates.length * vendors.length
      let processedCount = 0

      // 각 벤더별로, 각 템플릿을 처리
      for (let vendorIndex = 0; vendorIndex < vendors.length; vendorIndex++) {
        const vendor = vendors[vendorIndex]
        
        // 벤더별 템플릿 데이터 생성
        const templateData = {
          vendor_name: vendor.vendorName || '협력업체명',
          address: vendor.address || '주소',
          representative_name: vendor.representativeName || '대표자명',
          today_date: new Date().toLocaleDateString('ko-KR'),
        }

        console.log(`🔄 벤더 ${vendorIndex + 1}/${vendors.length} 템플릿 데이터:`, templateData)

        // 해당 벤더에 대해 각 템플릿을 순차적으로 처리
        for (let templateIndex = 0; templateIndex < templates.length; templateIndex++) {
          const template = templates[templateIndex]
          processedCount++
          
          console.log(`📄 처리 중: ${vendor.vendorName} - ${template.templateName} (${processedCount}/${totalContracts})`)
          
          // 개별 벤더에 대한 기본계약 생성
          await processTemplate(template, templateData, [vendor])
          
          console.log(`✅ 완료: ${vendor.vendorName} - ${template.templateName}`)
        }
      }

      toast.success(`총 ${totalContracts}개 기본계약이 모두 생성되었습니다`)

    } catch (error) {
      console.error('기본계약 처리 중 오류:', error)
      toast.error(`기본계약 처리 중 오류가 발생했습니다: ${error instanceof Error ? error.message : '알 수 없는 오류'}`)
    }
  }

  const processTemplate = async (template: BasicContractTemplate, templateData: any, vendors: any[]) => {
    try {
      // 1. 템플릿 파일 가져오기
      const templateResponse = await fetch('/api/basic-contract/get-template', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ templateId: template.id })
      })

      if (!templateResponse.ok) {
        throw new Error(`템플릿 파일을 가져올 수 없습니다: ${template.templateName}`)
      }

      const templateBlob = await templateResponse.blob()

      // 2. PDFTron을 사용해서 변수 치환 및 PDF 변환
      // @ts-ignore
      const WebViewer = await import("@pdftron/webviewer").then(({ default: WebViewer }) => WebViewer)
      
      // 임시 WebViewer 인스턴스 생성 (DOM에 추가하지 않음)
      const tempDiv = document.createElement('div')
      tempDiv.style.display = 'none'
      document.body.appendChild(tempDiv)

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

      try {
        const { Core } = instance
        const { createDocument } = Core

        // 3. 템플릿 문서 생성 및 변수 치환
        const templateDoc = await createDocument(templateBlob, {
          filename: template.fileName || 'template.docx',
          extension: 'docx',
        })

        console.log("🔄 변수 치환 시작:", templateData)
        await templateDoc.applyTemplateValues(templateData)
        console.log("✅ 변수 치환 완료")

        // 4. PDF 변환
        const fileData = await templateDoc.getFileData()
        const pdfBuffer = await Core.officeToPDFBuffer(fileData, { extension: 'docx' })

        console.log(`✅ PDF 변환 완료: ${template.templateName}`, `크기: ${pdfBuffer.byteLength} bytes`)

        // 5. 기본계약 생성 요청
        const { error: contractError } = await requestBasicContractInfo({
          vendorIds: vendors.map((v) => v.id),
          requestedBy: Number(session!.user.id),
          templateId: template.id,
          pdfBuffer: new Uint8Array(pdfBuffer),
        })

        if (contractError) {
          throw new Error(contractError)
        }

        console.log(`✅ 기본계약 생성 완료: ${template.templateName}`)

      } finally {
        // 임시 WebViewer 정리
        instance.UI.dispose()
        document.body.removeChild(tempDiv)
      }

    } catch (error) {
      console.error(`❌ 템플릿 처리 실패: ${template.templateName}`, error)
      throw error
    }
  }

  const dialogContent = (
    <div className="space-y-4 py-2">
      {/* 선택된 협력업체 정보 */}
      <div className="space-y-2">
        <Label>선택된 협력업체 ({vendors.length}개)</Label>
        <div className="max-h-40 overflow-y-auto border rounded-md p-3 space-y-2">
          {vendors.map((vendor) => (
            <div key={vendor.id} className="flex items-center justify-between text-sm">
              <div className="flex-1">
                <div className="font-medium">{vendor.vendorName}</div>
                <div className="text-muted-foreground">
                  {vendor.vendorCode} • {vendor.email || "이메일 없음"}
                </div>
              </div>
            </div>
          ))}
        </div>
      </div>

      <div className="space-y-2">
        <Label htmlFor="type">PQ 종류 선택</Label>
        <Select onValueChange={(val: "GENERAL" | "PROJECT" | "NON_INSPECTION") => setType(val)} value={type ?? undefined}>
          <SelectTrigger id="type"><SelectValue placeholder="PQ 종류를 선택하세요" /></SelectTrigger>
          <SelectContent>
            <SelectItem value="GENERAL">일반 PQ</SelectItem>
            <SelectItem value="PROJECT">프로젝트 PQ</SelectItem>
            <SelectItem value="NON_INSPECTION">미실사 PQ</SelectItem>
          </SelectContent>
        </Select>
      </div>

      {type === "PROJECT" && (
        <div className="space-y-2">
          <Label htmlFor="project">프로젝트 선택</Label>
          <Select onValueChange={(val) => setSelectedProjectId(Number(val))}>
            <SelectTrigger id="project">
              <SelectValue placeholder="프로젝트 선택" />
            </SelectTrigger>
            <SelectContent>
              {isLoadingProjects ? (
                <SelectItem value="loading" disabled>로딩 중...</SelectItem>
              ) : projects.map((p) => (
                <SelectItem key={p.id} value={p.id.toString()}>{p.projectCode} - {p.projectName}</SelectItem>
              ))}
            </SelectContent>
          </Select>
        </div>
      )}

      {/* 마감일 입력 */}
      <div className="space-y-2">
        <Label htmlFor="dueDate">PQ 제출 마감일</Label>
        <DatePicker
          date={dueDate ? new Date(dueDate) : undefined}
          onSelect={(date?: Date) => {
            if (date) {
              // 한국 시간대로 날짜 변환 (UTC 변환으로 인한 날짜 변경 방지)
              const kstDate = new Date(date.getTime() - date.getTimezoneOffset() * 60000)
              setDueDate(kstDate.toISOString().slice(0, 10))
            } else {
              setDueDate("")
            }
          }}
          placeholder="마감일 선택"
        />
      </div>

      {/* PQ 대상품목 */}
      <div className="space-y-2">
        <Label>PQ 대상품목</Label>
        
        {/* 선택된 아이템들 표시 */}
        {pqItems.length > 0 && (
          <div className="flex flex-wrap gap-2 mb-2">
            {pqItems.map((item) => (
              <Badge key={item.itemCode} variant="secondary" className="flex items-center gap-1">
                <span className="text-xs">
                  {item.itemCode} - {item.itemName}
                </span>
                <Button
                  type="button"
                  variant="ghost"
                  size="sm"
                  className="h-4 w-4 p-0 hover:bg-destructive hover:text-destructive-foreground"
                  onClick={() => handleRemoveItem(item.itemCode)}
                >
                  <X className="h-3 w-3" />
                </Button>
              </Badge>
            ))}
          </div>
        )}
        
        {/* 검색 입력 */}
        <div className="relative">
          <div className="relative">
            <Input
              placeholder="아이템 코드 또는 이름으로 검색하세요"
              value={itemSearchQuery}
              onChange={(e) => setItemSearchQuery(e.target.value)}
              className="pl-9"
            />
          </div>
          
          {/* 검색 결과 드롭다운 */}
          {showItemDropdown && (
            <div className="absolute top-full left-0 right-0 z-50 mt-1 max-h-48 overflow-y-auto bg-background border rounded-md shadow-lg">
              {filteredItems.length > 0 ? (
                filteredItems.map((item) => (
                  <button
                    key={item.itemCode}
                    type="button"
                    className="w-full px-3 py-2 text-left text-sm hover:bg-muted focus:bg-muted focus:outline-none"
                    onClick={() => handleSelectItem(item)}
                  >
                    <div className="font-medium">{item.itemCode}</div>
                    <div className="text-muted-foreground text-xs">{item.itemName}</div>
                  </button>
                ))
              ) : (
                <div className="px-3 py-2 text-sm text-muted-foreground">
                  검색 결과가 없습니다.
                </div>
              )}
            </div>
          )}
        </div>
        
        <div className="text-xs text-muted-foreground">
          아이템 코드나 이름을 입력하여 검색하고 선택하세요. (선택사항)
        </div>
      </div>

      {/* 추가 안내사항 */}
      <div className="space-y-2">
        <Label htmlFor="extraNote">추가 안내사항</Label>
        <textarea
          id="extraNote"
          value={extraNote}
          onChange={(e) => setExtraNote(e.target.value)}
          placeholder="추가 안내사항을 입력하세요 (선택사항)"
          className="w-full rounded-md border px-3 py-2 text-sm min-h-20 resize-none"
        />
      </div>

      {/* 기본계약서 템플릿 선택 (다중 선택) */}
      <div className="space-y-2">
        <Label>기본계약서 템플릿 (선택사항, 복수 선택 가능)</Label>
        {isLoadingTemplates ? (
          <div className="text-sm text-muted-foreground">템플릿 로딩 중...</div>
        ) : (
          <div className="space-y-2 max-h-40 overflow-y-auto border rounded-md p-3">
            {basicContractTemplates.map((template) => (
              <div key={template.id} className="flex items-center gap-2">
                <Checkbox
                  id={`template-${template.id}`}
                  checked={selectedTemplateIds.includes(template.id)}
                  onCheckedChange={(checked) => {
                    if (checked) {
                      setSelectedTemplateIds(prev => [...prev, template.id])
                    } else {
                      setSelectedTemplateIds(prev => prev.filter(id => id !== template.id))
                    }
                  }}
                />
                <Label htmlFor={`template-${template.id}`} className="text-sm">
                  {template.templateName}
                </Label>
              </div>
            ))}
            {basicContractTemplates.length === 0 && (
              <div className="text-sm text-muted-foreground">사용 가능한 템플릿이 없습니다.</div>
            )}
          </div>
        )}
        {selectedTemplateIds.length > 0 && (
          <div className="text-xs text-muted-foreground">
            {selectedTemplateIds.length}개 템플릿이 선택되었습니다.
          </div>
        )}
      </div>

      {/* <div className="space-y-2">
        <Label>계약 항목 선택</Label>
        {AGREEMENT_LIST.map((label) => (
          <div key={label} className="flex items-center gap-2">
            <Checkbox
              id={label}
              checked={agreements[label] || false}
              onCheckedChange={(val) =>
                setAgreements((prev) => ({ ...prev, [label]: Boolean(val) }))
              }
            />
            <Label htmlFor={label}>{label}</Label>
          </div>
        ))}
      </div> */}
    </div>
  )

  if (isDesktop) {
    return (
      <Dialog {...props}>
        {showTrigger && (
          <DialogTrigger asChild>
            <Button variant="outline" size="sm" className="gap-2">
              <SendHorizonal className="size-4" /> PQ 요청 ({vendors.length})
            </Button>
          </DialogTrigger>
        )}
        <DialogContent className="max-h-[80vh] flex flex-col">
          <DialogHeader>
            <DialogTitle>PQ 요청</DialogTitle>
            <DialogDescription>
              <span className="font-medium">{vendors.length}</span>
              {vendors.length === 1 ? "개 협력업체" : "개 협력업체들"}에게 PQ를 요청합니다.
            </DialogDescription>
          </DialogHeader>
          <div className="flex-1 overflow-y-auto">
            {dialogContent}
          </div>
          <DialogFooter>
            <DialogClose asChild><Button variant="outline">취소</Button></DialogClose>
            <Button onClick={onApprove} disabled={isApprovePending || !type || (type === "PROJECT" && !selectedProjectId)}>
              {isApprovePending && <Loader className="mr-2 size-4 animate-spin" />}요청하기
            </Button>
          </DialogFooter>
        </DialogContent>


      </Dialog>
    )
  }

  return (
    <Drawer {...props}>
      {showTrigger && (
        <DrawerTrigger asChild>
          <Button variant="outline" size="sm" className="gap-2">
            <SendHorizonal className="size-4" /> PQ 요청 ({vendors.length})
          </Button>
        </DrawerTrigger>
      )}
      <DrawerContent className="max-h-[80vh] flex flex-col">
        <DrawerHeader>
          <DrawerTitle>PQ 요청</DrawerTitle>
          <DrawerDescription>
            <span className="font-medium">{vendors.length}</span>
            {vendors.length === 1 ? "개 협력업체" : "개 협력업체들"}에게 PQ를 요청합니다.
          </DrawerDescription>
        </DrawerHeader>
        <div className="flex-1 overflow-y-auto px-4">
          {dialogContent}
        </div>
        <DrawerFooter>
          <DrawerClose asChild><Button variant="outline">취소</Button></DrawerClose>
          <Button onClick={onApprove} disabled={isApprovePending || !type || (type === "PROJECT" && !selectedProjectId)}>
            {isApprovePending && <Loader className="mr-2 size-4 animate-spin" />}요청하기
          </Button>
        </DrawerFooter>
      </DrawerContent>


    </Drawer>
  )
}