"use client"

import * as React from "react"
import { useRouter } from "next/navigation"
import { 
  Card, 
  CardContent,
  CardHeader,
  CardTitle,
  CardDescription
} from "@/components/ui/card"
import { Button } from "@/components/ui/button"
import { Badge } from "@/components/ui/badge"
import { Textarea } from "@/components/ui/textarea"
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle
} from "@/components/ui/dialog"
import { useToast } from "@/hooks/use-toast"
import { CheckCircle, AlertCircle, Paperclip, Square, Download } from "lucide-react"
import { PQGroupData } from "@/lib/pq/service"
import { approvePQAction, rejectPQAction, updateSHICommentAction, approveQMReviewAction, rejectQMReviewAction, requestPqSupplementAction, approveSafetyPQAction, rejectSafetyPQAction } from "@/lib/pq/service"
import { FileList, FileListHeader, FileListInfo, FileListItem, FileListName, FileListDescription, FileListAction, FileListIcon } from "@/components/ui/file-list"
// import * as ExcelJS from 'exceljs';
// import { saveAs } from "file-saver";

// PQ 제출 정보 타입
interface PQSubmission {
  id: number
  vendorId: number
  vendorName: string | null
  vendorCode: string | null
  type: string
  status: string
  projectId: number | null
  projectName: string | null
  projectCode: string | null
  submittedAt: Date | null
  approvedAt: Date | null
  rejectedAt: Date | null
  rejectReason: string | null
}

interface PQReviewWrapperProps {
  pqData: PQGroupData[]
  vendorId: number
  pqSubmission: PQSubmission
  vendorInfo?: any // 협력업체 정보 (선택사항)
  vendorCountry?: string | null
}

export function PQReviewWrapper({
  pqData,
  vendorId,
  pqSubmission,
  vendorInfo,
  vendorCountry,
}: PQReviewWrapperProps) {
  const router = useRouter()
  const { toast } = useToast()
  const [isSafetyApproving, setIsSafetyApproving] = React.useState(false)
  const [isSafetyRejecting, setIsSafetyRejecting] = React.useState(false)
  const [isApproving, setIsApproving] = React.useState(false)
  const [isRejecting, setIsRejecting] = React.useState(false)
  const [isQMApproving, setIsQMApproving] = React.useState(false)
  const [isQMRejecting, setIsQMRejecting] = React.useState(false)
  const [showSafetyApproveDialog, setShowSafetyApproveDialog] = React.useState(false)
  const [showSafetyRejectDialog, setShowSafetyRejectDialog] = React.useState(false)
  const [showApproveDialog, setShowApproveDialog] = React.useState(false)
  const [showRejectDialog, setShowRejectDialog] = React.useState(false)
  const [showQMApproveDialog, setShowQMApproveDialog] = React.useState(false)
  const [showQMRejectDialog, setShowQMRejectDialog] = React.useState(false)
  const [showSupplementDialog, setShowSupplementDialog] = React.useState(false)
  const [safetyRejectReason, setSafetyRejectReason] = React.useState("")
  const [rejectReason, setRejectReason] = React.useState("")
  const [qmRejectReason, setQmRejectReason] = React.useState("")
  const [supplementComment, setSupplementComment] = React.useState("")
  const [shiComments, setShiComments] = React.useState<Record<number, string>>({})
  const [isUpdatingComment, setIsUpdatingComment] = React.useState<number | null>(null)
  const [isSendingSupplement, setIsSendingSupplement] = React.useState(false)

  
  // 코드 순서로 정렬하는 함수 (1-1-1, 1-1-2, 1-2-1 순서)
  const sortByCode = (items: any[]) => {
    return [...items].sort((a, b) => {
      const parseCode = (code: string) => {
        return code.split('-').map(part => parseInt(part, 10))
      }
      
      const aCode = parseCode(a.code)
      const bCode = parseCode(b.code)
      
      for (let i = 0; i < Math.max(aCode.length, bCode.length); i++) {
        const aPart = aCode[i] || 0
        const bPart = bCode[i] || 0
        if (aPart !== bPart) {
          return aPart - bPart
        }
      }
      return 0
    })
  }

  // 벤더 내자/외자 판별 (국가 코드 기반)
  const isDomesticVendor = React.useMemo(() => {
    if (!vendorCountry) return null; // 정보 없으면 필터 미적용
    return vendorCountry === "KR" || vendorCountry === "한국";
  }, [vendorCountry]);

  // 벤더 유형에 따라 PQ 항목 필터링
  const filteredData: PQGroupData[] = React.useMemo(() => {
    if (isDomesticVendor === null) return pqData;

    const filterItemByType = (item: any) => {
      const itemType = item.type || "내외자";
      if (itemType === "내외자") return true;
      if (itemType === "내자") return isDomesticVendor === true;
      if (itemType === "외자") return isDomesticVendor === false;
      return true;
    };

    return pqData
      .map((group) => ({
        ...group,
        items: group.items.filter(filterItemByType),
      }))
      .filter((group) => group.items.length > 0);
  }, [pqData, isDomesticVendor]);
  

  // 기존 SHI 코멘트를 로컬 상태에 초기화
  React.useEffect(() => {
    const initialComments: Record<number, string> = {}
    pqData.forEach(group => {
      group.items.forEach(item => {
        if (item.answerId && item.shiComment) {
          initialComments[item.answerId] = item.shiComment
        }
      })
    })
    setShiComments(initialComments)
  }, [pqData])
  
  // 안전 PQ 승인 처리
  const handleSafetyApprove = async () => {
    try {
      setIsSafetyApproving(true)
      const result = await approveSafetyPQAction({
        pqSubmissionId: pqSubmission.id,
        vendorId: vendorId,
      })

      if (result.ok) {
        toast({
          title: "안전 PQ 승인 완료",
          description: "안전 검토가 승인되었습니다.",
        })
        router.refresh()
      } else {
        toast({
          title: "안전 승인 실패",
          description: result.error || "안전 PQ 승인 중 오류가 발생했습니다.",
          variant: "destructive",
        })
      }
    } catch (error) {
      console.error("안전 PQ 승인 오류:", error)
      toast({
        title: "안전 승인 실패",
        description: "안전 PQ 승인 중 오류가 발생했습니다.",
        variant: "destructive",
      })
    } finally {
      setIsSafetyApproving(false)
      setShowSafetyApproveDialog(false)
    }
  }

  // 안전 PQ 거절 처리
  const handleSafetyReject = async () => {
    if (!safetyRejectReason.trim()) {
      toast({
        title: "거절 사유 필요",
        description: "안전 거절 사유를 입력해주세요.",
        variant: "destructive",
      })
      return
    }

    try {
      setIsSafetyRejecting(true)
      const result = await rejectSafetyPQAction({
        pqSubmissionId: pqSubmission.id,
        vendorId: vendorId,
        rejectReason: safetyRejectReason,
      })

      if (result.ok) {
        toast({
          title: "안전 PQ 거절 완료",
          description: "안전 검토에서 거절되었습니다.",
        })
        router.refresh()
      } else {
        toast({
          title: "안전 거절 실패",
          description: result.error || "안전 PQ 거절 중 오류가 발생했습니다.",
          variant: "destructive",
        })
      }
    } catch (error) {
      console.error("안전 PQ 거절 오류:", error)
      toast({
        title: "안전 거절 실패",
        description: "안전 PQ 거절 중 오류가 발생했습니다.",
        variant: "destructive",
      })
    } finally {
      setSafetyRejectReason("")
      setIsSafetyRejecting(false)
      setShowSafetyRejectDialog(false)
    }
  }
  
  // PQ 승인 처리
  const handleApprove = async () => {
    try {
      setIsApproving(true)
      
      const result = await approvePQAction({
        pqSubmissionId: pqSubmission.id,
        vendorId: vendorId
      })
      
      if (result.ok) {
        toast({
          title: "PQ 승인 완료",
          description: "PQ가 성공적으로 승인되었습니다.",
        })
        // 페이지 새로고침
        router.push(`/evcp/pq_new/`)
      } else {
        toast({
          title: "승인 실패",
          description: result.error || "PQ 승인 중 오류가 발생했습니다.",
          variant: "destructive"
        })
      }
    } catch (error) {
      console.error("PQ 승인 오류:", error)
      toast({
        title: "승인 실패",
        description: "PQ 승인 중 오류가 발생했습니다.",
        variant: "destructive"
      })
    } finally {
      setIsApproving(false)
      setShowApproveDialog(false)
    }
  }

  // QM 승인 처리
  const handleQMApprove = async () => {
    try {
      setIsQMApproving(true)
      
      const result = await approveQMReviewAction({
        pqSubmissionId: pqSubmission.id,
        vendorId: vendorId
      })
      
      if (result.ok) {
        toast({
          title: "QM 승인 완료",
          description: "PQ가 최종 승인되어 실사 프로세스가 시작됩니다.",
        })
        // 페이지 새로고침
        router.refresh()
      } else {
        toast({
          title: "QM 승인 실패",
          description: result.error || "QM 승인 중 오류가 발생했습니다.",
          variant: "destructive"
        })
      }
    } catch (error) {
      console.error("QM 승인 오류:", error)
      toast({
        title: "QM 승인 실패",
        description: "QM 승인 중 오류가 발생했습니다.",
        variant: "destructive"
      })
    } finally {
      setIsQMApproving(false)
      setShowQMApproveDialog(false)
    }
  }

  // 보완요청 처리
  const handleRequestSupplement = async () => {
    if (!supplementComment.trim()) {
      toast({ title: "보완요청 내용 필요", description: "보완요청 사유를 입력해주세요.", variant: "destructive" })
      return
    }
    try {
      setIsSendingSupplement(true)
      const result = await requestPqSupplementAction({
        pqSubmissionId: pqSubmission.id,
        vendorId,
        comment: supplementComment,
      })
      if (result.ok) {
        toast({ title: "보완요청 전송", description: "보완요청 메일을 발송했습니다." })
        setShowSupplementDialog(false)
        setSupplementComment("")
        router.refresh()
      } else {
        toast({ title: "전송 실패", description: result.error || "보완요청 전송 중 오류가 발생했습니다.", variant: "destructive" })
      }
    } catch (e) {
      console.error(e)
      toast({ title: "전송 실패", description: "보완요청 전송 중 오류가 발생했습니다.", variant: "destructive" })
    } finally {
      setIsSendingSupplement(false)
    }
  }

  // QM 거절 처리
  const handleQMReject = async () => {
    if (!qmRejectReason.trim()) {
      toast({
        title: "거절 사유 필요",
        description: "거절 사유를 입력해주세요.",
        variant: "destructive"
      })
      return
    }
    
    try {
      setIsQMRejecting(true)
      
      const result = await rejectQMReviewAction({
        pqSubmissionId: pqSubmission.id,
        vendorId: vendorId,
        rejectReason: qmRejectReason
      })
      
      if (result.ok) {
        toast({
          title: "QM 거절 완료",
          description: "PQ가 QM에 의해 거절되었습니다.",
        })
        // 페이지 새로고침
        router.refresh()
      } else {
        toast({
          title: "QM 거절 실패",
          description: result.error || "QM 거절 중 오류가 발생했습니다.",
          variant: "destructive"
        })
      }
    } catch (error) {
      console.error("QM 거절 오류:", error)
      toast({
        title: "QM 거절 실패",
        description: "QM 거절 중 오류가 발생했습니다.",
        variant: "destructive"
      })
    } finally {
      setIsQMRejecting(false)
      setShowQMRejectDialog(false)
    }
  }
  
  // SHI 코멘트 업데이트 처리
  const handleSHICommentUpdate = async (answerId: number) => {
    const comment = shiComments[answerId] || ""
    
    try {
      setIsUpdatingComment(answerId)
      const result = await updateSHICommentAction({
        answerId,
        shiComment: comment,
      })
      
      if (result.ok) {
        toast({
          title: "SHI 코멘트 저장 완료",
          description: "SHI 코멘트가 저장되었습니다.",
        })
        // 페이지 새로고침
        router.refresh()
      } else {
        toast({
          title: "저장 실패",
          description: result.error || "SHI 코멘트 저장 중 오류가 발생했습니다.",
          variant: "destructive"
        })
      }
    } catch (error) {
      console.error("SHI 코멘트 저장 오류:", error)
      toast({
        title: "저장 실패",
        description: "SHI 코멘트 저장 중 오류가 발생했습니다.",
        variant: "destructive"
      })
    } finally {
      setIsUpdatingComment(null)
    }
  }

  // PQ 거부 처리
  const handleReject = async () => {
    if (!rejectReason.trim()) {
      toast({
        title: "거부 사유 필요",
        description: "거부 사유를 입력해주세요.",
        variant: "destructive"
      })
      return
    }
    
    try {
      setIsRejecting(true)
      
      const result = await rejectPQAction({
        pqSubmissionId: pqSubmission.id,
        vendorId: vendorId,
        rejectReason: rejectReason
      })
      
      if (result.ok) {
        toast({
          title: "PQ 거부 완료",
          description: "PQ가 거부되었습니다.",
        })
        // 페이지 리다이렉트
        router.push(`/evcp/pq_new/`)
      } else {
        toast({
          title: "거부 실패",
          description: result.error || "PQ 거부 중 오류가 발생했습니다.",
          variant: "destructive"
        })
      }
    } catch (error) {
      console.error("PQ 거부 오류:", error)
      toast({
        title: "거부 실패",
        description: "PQ 거부 중 오류가 발생했습니다.",
        variant: "destructive"
      })
    } finally {
      setIsRejecting(false)
      setShowRejectDialog(false)
    }
  }
  
  return (
    <div className="space-y-6">
      {filteredData.length === 0 && (
        <div className="rounded-md border border-dashed p-4 text-sm text-muted-foreground">
          표시할 PQ 항목이 없습니다. (벤더 내/외자 구분 필터 적용)
        </div>
      )}

      {/* 그룹별 PQ 항목 표시 */}
      {filteredData.map((group) => (
        <div key={group.groupName} className="space-y-4">
          <h3 className="text-lg font-medium">{group.groupName}</h3>
          
          <div className="grid grid-cols-2 gap-4">
            {sortByCode(group.items).map((item) => (
              <Card key={item.criteriaId}>
                <CardHeader>
                  <div className="flex justify-between items-start">
                    <div className="flex-1">
                      <div className="flex items-start gap-3">
                        <div className="flex-1">
                          <CardTitle className="text-base">
                            {item.code} - {item.checkPoint}
                          </CardTitle>
                          {item.description && (
                            <CardDescription className="mt-1 whitespace-pre-wrap">
                              {item.description}
                            </CardDescription>
                          )}
                          {item.remarks && (
                            <div className="mt-2 p-2 rounded-md">
                              <p className="text-sm font-medium text-muted-foreground mb-1">Remark:</p>
                              <p className="text-sm whitespace-pre-wrap">
                                {item.remarks}
                              </p>
                            </div>
                          )}
                        </div>
                      </div>
                    </div>
                    {/* 항목 상태 표시 */}
                    {!!item.answer || item.attachments.length > 0 ? (
                      <Badge variant="outline" className="text-green-600 bg-green-50">
                        <CheckCircle className="h-3 w-3 mr-1" />
                        답변 있음
                      </Badge>
                    ) : (
                      <Badge variant="outline" className="text-amber-600 bg-amber-50">
                        <AlertCircle className="h-3 w-3 mr-1" />
                        답변 없음
                      </Badge>
                    )}

                  </div>
                </CardHeader>
                <CardContent className="space-y-4">
                  {item.criteriaAttachments && item.criteriaAttachments.length > 0 && (
                    <div className="space-y-2">
                      <p className="text-sm font-medium">기준 첨부파일</p>
                      <FileList>
                        {item.criteriaAttachments.map((file) => (
                          <FileListItem key={file.attachId}>
                            <FileListHeader>
                              <FileListIcon />
                              <FileListInfo>
                                <FileListName>{file.fileName}</FileListName>
                                {file.fileSize && (
                                  <FileListDescription>{file.fileSize} bytes</FileListDescription>
                                )}
                              </FileListInfo>
                              <FileListAction
                                onClick={async () => {
                                  try {
                                    const { downloadFile } = await import('@/lib/file-download')
                                    await downloadFile(file.filePath, file.fileName, { showToast: true })
                                  } catch (error) {
                                    toast({
                                      title: "다운로드 실패",
                                      description: "파일 다운로드 중 오류가 발생했습니다.",
                                      variant: "destructive"
                                    })
                                  }
                                }}
                              >
                                <Download className="h-4 w-4" />
                                <span className="sr-only">Download</span>
                              </FileListAction>
                            </FileListHeader>
                          </FileListItem>
                        ))}
                      </FileList>
                    </div>
                  )}
                  {/* 프로젝트별 추가 정보 */}
                  {pqSubmission.projectId && item.contractInfo && (
                    <div className="space-y-1">
                      <p className="text-sm font-medium">계약 정보</p>
                      <div className="rounded-md bg-muted/30 p-3 text-sm whitespace-pre-wrap">
                        {item.contractInfo}
                      </div>
                    </div>
                  )}
                  
                  {pqSubmission.projectId && item.additionalRequirement && (
                    <div className="space-y-1">
                      <p className="text-sm font-medium">추가 요구사항</p>
                      <div className="rounded-md bg-muted/30 p-3 text-sm whitespace-pre-wrap">
                        {item.additionalRequirement}
                      </div>
                    </div>
                  )}
                  


                  {/* 벤더 답변 - 입력 형식에 따라 다르게 표시 */}
                  <div className="space-y-1">
                    <p className="text-sm font-medium flex items-center gap-1">
                      벤더 답변
                      {item.inputFormat && (
                        <Badge variant="outline" className="ml-2 text-xs">
                          {item.inputFormat === "TEXT" && "텍스트"}
                          {item.inputFormat === "EMAIL" && "이메일"}
                          {item.inputFormat === "PHONE" && "전화번호"}
                          {item.inputFormat === "FAX" && "팩스번호"}
                          {item.inputFormat === "NUMBER" && "숫자"}
                          {item.inputFormat === "NUMBER_WITH_UNIT" && "숫자+단위"}
                          {item.inputFormat === "FILE" && "파일"}
                          {item.inputFormat === "TEXT_FILE" && "텍스트+파일"}
                        </Badge>
                      )}
                    </p>
                    <div className="rounded-md border p-3 min-h-20">
                      {(() => {
                        const inputFormat = item.inputFormat || "TEXT";
                        
                        switch (inputFormat) {
                          case "EMAIL":
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">이메일 주소:</div>
                                <div className="whitespace-pre-wrap">
                                  {item.answer || <span className="text-muted-foreground">답변 없음</span>}
                                </div>
                              </div>
                            );
                          case "PHONE":
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">전화번호:</div>
                                <div className="whitespace-pre-wrap">
                                  {item.answer || <span className="text-muted-foreground">답변 없음</span>}
                                </div>
                              </div>
                            );
                          case "FAX":
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">팩스번호:</div>
                                <div className="whitespace-pre-wrap">
                                  {item.answer || <span className="text-muted-foreground">답변 없음</span>}
                                </div>
                              </div>
                            );
                          case "NUMBER":
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">숫자 값:</div>
                                <div className="whitespace-pre-wrap">
                                  {item.answer || <span className="text-muted-foreground">답변 없음</span>}
                                </div>
                              </div>
                            );
                          case "NUMBER_WITH_UNIT":
                            const numberWithUnit = item.answer || "";
                            const [number, unit] = numberWithUnit.split(' ');
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">숫자+단위:</div>
                                <div className="flex items-center gap-2">
                                  {number && (
                                    <span className="font-mono text-lg font-semibold text-blue-600">
                                      {number}
                                    </span>
                                  )}
                                  {unit && (
                                    <Badge variant="outline" className="text-xs">
                                      {unit}
                                    </Badge>
                                  )}
                                  {!numberWithUnit && (
                                    <span className="text-muted-foreground">답변 없음</span>
                                  )}
                                </div>
                              </div>
                            );
                          case "FILE":
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">파일 업로드 항목:</div>
                                <div className="text-sm text-muted-foreground">
                                  {item.attachments.length > 0 ? "파일이 업로드되었습니다." : "파일이 업로드되지 않았습니다."}
                                </div>
                              </div>
                            );
                          case "TEXT_FILE":
                            return (
                              <div className="space-y-2">
                                <div className="text-sm font-medium text-muted-foreground">텍스트 답변:</div>
                                <div className="whitespace-pre-wrap">
                                  {item.answer || <span className="text-muted-foreground">텍스트 답변 없음</span>}
                                </div>
                                <div className="text-sm font-medium text-muted-foreground">파일 업로드:</div>
                                <div className="text-sm text-muted-foreground">
                                  {item.attachments.length > 0 ? "파일이 업로드되었습니다." : "파일이 업로드되지 않았습니다."}
                                </div>
                              </div>
                            );
                          default: // TEXT
                            return (
                              <div className="whitespace-pre-wrap">
                                {item.answer || <span className="text-muted-foreground">답변 없음</span>}
                              </div>
                            );
                        }
                      })()}
                    </div>
                  </div>
                  {/* SHI 코멘트 필드 (편집 가능) */}
                  <div className="space-y-1">
                    <p className="text-sm font-medium flex items-center gap-1">
                      SHI 코멘트
                    </p>
                    <div className="rounded-md border p-3 min-h-20">
                      <Textarea
                        value={shiComments[item.answerId || 0] ?? item.shiComment ?? ""}
                        onChange={(e) => {
                          if (item.answerId) {
                            setShiComments(prev => ({
                              ...prev,
                              [item.answerId!]: e.target.value
                            }))
                          }
                        }}
                        placeholder="SHI 코멘트를 입력하세요."
                        className="min-h-20"
                      />
                      {item.answerId && (
                        <div className="mt-2 flex justify-end">
                          <Button
                            size="sm"
                            onClick={() => handleSHICommentUpdate(item.answerId!)}
                            disabled={isUpdatingComment === item.answerId}
                          >
                            {isUpdatingComment === item.answerId ? "저장 중..." : "저장"}
                          </Button>
                        </div>
                      )}
                    </div>
                  </div>
                  {/* 벤더 답변 필드 (읽기 전용) */}
                    <div className="space-y-1">
                      <p className="text-sm font-medium flex items-center gap-1">
                        벤더 reply
                      </p>
                      <div className="rounded-md border p-3 min-h-20 bg-muted/30">
                        <div className="whitespace-pre-wrap">
                          {item.vendorReply || <span className="text-muted-foreground">벤더 reply 없음</span>}
                        </div>
                      </div>
                    </div>

                  
                  {/* 첨부 파일 - FILE 또는 TEXT_FILE 형식에서만 표시 */}
                  {(item.inputFormat === "FILE" || item.inputFormat === "TEXT_FILE") && item.attachments.length > 0 && (
                    <div className="space-y-1">
                      <p className="text-sm font-medium flex items-center gap-1">
                        <Paperclip className="h-4 w-4" />
                        첨부 파일 ({item.attachments.length})
                      </p>
                      <div className="rounded-md border p-3">
                        <ul className="space-y-1">
                          {item.attachments.map((attachment, idx) => (
                            <li key={idx} className="flex items-center gap-2">
                              <button
                                onClick={async () => {
                                  try {
                                    const { downloadFile } = await import('@/lib/file-download')
                                    await downloadFile(attachment.filePath, attachment.fileName, {
                                      showToast: true,
                                      onError: (error) => {
                                        console.error('다운로드 오류:', error)
                                        toast({
                                          title: "다운로드 실패",
                                          description: error,
                                          variant: "destructive"
                                        })
                                      },
                                      onSuccess: (fileName, fileSize) => {
                                        console.log(`다운로드 성공: ${fileName} (${fileSize} bytes)`)
                                      }
                                    })
                                  } catch (error) {
                                    console.error('다운로드 오류:', error)
                                    toast({
                                      title: "다운로드 실패",
                                      description: "파일 다운로드 중 오류가 발생했습니다.",
                                      variant: "destructive"
                                    })
                                  }
                                }}
                                className="text-sm text-blue-600 hover:underline cursor-pointer"
                              >
                                {attachment.fileName}
                              </button>
                            </li>
                          ))}
                        </ul>
                      </div>
                    </div>
                  )}
                </CardContent>
              </Card>
            ))}
          </div>
        </div>
      ))}
      
      {/* 검토 버튼 - 상태에 따라 다른 버튼 표시 */}
        <div className="fixed bottom-4 right-4 bg-background p-4 rounded-lg shadow-md border">
          <div className="flex gap-2">
            {/* SUBMITTED 상태: 안전 담당자 승인/거절 */}
            {pqSubmission.status === "SUBMITTED" && (
              <>
                <Button
                  variant="outline"
                  onClick={() => setShowSafetyRejectDialog(true)}
                  disabled={isSafetyRejecting}
                >
                  {isSafetyRejecting ? "안전 거절 중..." : "안전 거절"}
                </Button>
                <Button
                  variant="secondary"
                  onClick={() => setShowSupplementDialog(true)}
                  disabled={isSendingSupplement}
                >
                  보완요청
                </Button>
                <Button
                  variant="default"
                  onClick={() => setShowSafetyApproveDialog(true)}
                  disabled={isSafetyApproving}
                >
                  {isSafetyApproving ? "안전 승인 중..." : "안전 승인"}
                </Button>
              </>
            )}

            {/* SAFETY_APPROVED 상태: 구매 담당자 승인/거절 */}
            {pqSubmission.status === "SAFETY_APPROVED" && (
              <>
                <Button
                  variant="outline"
                  onClick={() => setShowRejectDialog(true)}
                  disabled={isRejecting}
                >
                  {isRejecting ? "거부 중..." : "구매 거부"}
                </Button>
                <Button
                  variant="secondary"
                  onClick={() => setShowSupplementDialog(true)}
                  disabled={isSendingSupplement}
                >
                  보완요청
                </Button>
                <Button
                  variant="default"
                  onClick={() => setShowApproveDialog(true)}
                  disabled={isApproving}
                >
                  {isApproving ? "승인 중..." : "구매 승인"}
                </Button>
              </>
            )}

            {/* QM_REVIEWING 상태: QM 승인/거절 */}
            {pqSubmission.status === "QM_REVIEWING" && (
              <>
                <Button
                  variant="outline"
                  onClick={() => setShowQMRejectDialog(true)}
                  disabled={isQMRejecting}
                >
                  {isQMRejecting ? "QM 거절 중..." : "QM 거절"}
                </Button>
                <Button
                  variant="secondary"
                  onClick={() => setShowSupplementDialog(true)}
                  disabled={isSendingSupplement}
                >
                  보완요청
                </Button>
                <Button
                  variant="default"
                  onClick={() => setShowQMApproveDialog(true)}
                  disabled={isQMApproving}
                >
                  {isQMApproving ? "QM 승인 중..." : "QM 승인"}
                </Button>
              </>
            )}

            {/* QM_APPROVED 상태: 완료 표시 */}
            {pqSubmission.status === "QM_APPROVED" && (
              <div className="flex items-center gap-2 text-green-600">
                <CheckCircle className="h-4 w-4" />
                <span>QM 승인 완료</span>
              </div>
            )}

            {/* QM_REJECTED 상태: 거절 표시 */}
            {pqSubmission.status === "QM_REJECTED" && (
              <div className="flex items-center gap-2 text-red-600">
                <AlertCircle className="h-4 w-4" />
                <span>QM 거절됨</span>
              </div>
            )}

            {/* REJECTED 상태: 거절 표시 */}
            {pqSubmission.status === "REJECTED" && (
              <div className="flex items-center gap-2 text-red-600">
                <AlertCircle className="h-4 w-4" />
                <span>거절됨</span>
              </div>
            )}

            {/* SAFETY_REJECTED 상태: 안전 거절 표시 */}
            {pqSubmission.status === "SAFETY_REJECTED" && (
              <div className="flex items-center gap-2 text-red-600">
                <AlertCircle className="h-4 w-4" />
                <span>안전 거절됨</span>
              </div>
            )}
          </div>
        </div>

      
      {/* 안전 승인 확인 다이얼로그 */}
      <Dialog open={showSafetyApproveDialog} onOpenChange={setShowSafetyApproveDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>안전 PQ 승인 확인</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}의 {
                pqSubmission.type === "GENERAL" ? "일반" : 
                pqSubmission.type === "PROJECT" ? "프로젝트" : 
                pqSubmission.type === "NON_INSPECTION" ? "미실사" : "일반"
              } PQ를 안전 검토에서 승인하시겠습니까?
              {pqSubmission.projectId && (
                <span> 프로젝트: {pqSubmission.projectName}</span>
              )}
            </DialogDescription>
          </DialogHeader>
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowSafetyApproveDialog(false)}>
              취소
            </Button>
            <Button onClick={handleSafetyApprove} disabled={isSafetyApproving}>
              {isSafetyApproving ? "안전 승인 중..." : "안전 승인"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>

      {/* 안전 거부 확인 다이얼로그 */}
      <Dialog open={showSafetyRejectDialog} onOpenChange={setShowSafetyRejectDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>안전 PQ 거부</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}의 {
                pqSubmission.type === "GENERAL" ? "일반" : 
                pqSubmission.type === "PROJECT" ? "프로젝트" : 
                pqSubmission.type === "NON_INSPECTION" ? "미실사" : "일반"
              } PQ를 안전 검토에서 거부하는 이유를 입력해주세요.
              {pqSubmission.projectId && (
                <span> 프로젝트: {pqSubmission.projectName}</span>
              )}
            </DialogDescription>
          </DialogHeader>
          <Textarea
            value={safetyRejectReason}
            onChange={(e) => setSafetyRejectReason(e.target.value)}
            placeholder="안전 거부 사유를 입력하세요"
            className="min-h-24"
          />
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowSafetyRejectDialog(false)}>
              취소
            </Button>
            <Button 
              variant="destructive" 
              onClick={handleSafetyReject} 
              disabled={isSafetyRejecting || !safetyRejectReason.trim()}
            >
              {isSafetyRejecting ? "안전 거절 중..." : "안전 거절"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>

      {/* 승인 확인 다이얼로그 */}
      <Dialog open={showApproveDialog} onOpenChange={setShowApproveDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>PQ 승인 확인</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}의 {
                pqSubmission.type === "GENERAL" ? "일반" : 
                pqSubmission.type === "PROJECT" ? "프로젝트" : 
                pqSubmission.type === "NON_INSPECTION" ? "미실사" : "일반"
              } PQ를 승인하시겠습니까?
              {pqSubmission.projectId && (
                <span> 프로젝트: {pqSubmission.projectName}</span>
              )}
            </DialogDescription>
          </DialogHeader>
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowApproveDialog(false)}>
              취소
            </Button>
            <Button onClick={handleApprove} disabled={isApproving}>
              {isApproving ? "승인 중..." : "구매 승인"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>

      {/* 보완요청 다이얼로그 */}
      <Dialog open={showSupplementDialog} onOpenChange={setShowSupplementDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>PQ 보완요청</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}에 보완요청을 전송합니다. 내용(사유)을 입력해주세요.
            </DialogDescription>
          </DialogHeader>
          <Textarea
            value={supplementComment}
            onChange={(e) => setSupplementComment(e.target.value)}
            placeholder="보완요청 사유를 입력하세요"
            className="min-h-24"
          />
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowSupplementDialog(false)}>
              취소
            </Button>
            <Button onClick={handleRequestSupplement} disabled={isSendingSupplement || !supplementComment.trim()}>
              {isSendingSupplement ? "전송 중..." : "보완요청 전송"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>

      {/* QM 승인 확인 다이얼로그 */}
      <Dialog open={showQMApproveDialog} onOpenChange={setShowQMApproveDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>QM 승인 확인</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}의 {
                pqSubmission.type === "GENERAL" ? "일반" : 
                pqSubmission.type === "PROJECT" ? "프로젝트" : 
                pqSubmission.type === "NON_INSPECTION" ? "미실사" : "일반"
              } PQ를 QM에서 최종 승인하여 실사 프로세스를 시작하시겠습니까?
              {pqSubmission.projectId && (
                <span> 프로젝트: {pqSubmission.projectName}</span>
              )}
            </DialogDescription>
          </DialogHeader>
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowQMApproveDialog(false)}>
              취소
            </Button>
            <Button onClick={handleQMApprove} disabled={isQMApproving}>
              {isQMApproving ? "QM 승인 중..." : "QM 승인"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>
      
      {/* 구매 거부 확인 다이얼로그 */}
      <Dialog open={showRejectDialog} onOpenChange={setShowRejectDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>PQ 구매 거부</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}의 {
                pqSubmission.type === "GENERAL" ? "일반" : 
                pqSubmission.type === "PROJECT" ? "프로젝트" : 
                pqSubmission.type === "NON_INSPECTION" ? "미실사" : "일반"
              } PQ를 구매에서 거부하는 이유를 입력해주세요.
              {pqSubmission.projectId && (
                <span> 프로젝트: {pqSubmission.projectName}</span>
              )}
            </DialogDescription>
          </DialogHeader>
          <Textarea
            value={rejectReason}
            onChange={(e) => setRejectReason(e.target.value)}
            placeholder="거부 사유를 입력하세요"
            className="min-h-24"
          />
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowRejectDialog(false)}>
              취소
            </Button>
            <Button 
              variant="destructive" 
              onClick={handleReject} 
              disabled={isRejecting || !rejectReason.trim()}
            >
              {isRejecting ? "거부 중..." : "구매 거부"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>

      {/* QM 거절 확인 다이얼로그 */}
      <Dialog open={showQMRejectDialog} onOpenChange={setShowQMRejectDialog}>
        <DialogContent>
          <DialogHeader>
            <DialogTitle>QM 거절</DialogTitle>
            <DialogDescription>
              {pqSubmission.vendorName || "알 수 없는 업체"}의 {
                pqSubmission.type === "GENERAL" ? "일반" : 
                pqSubmission.type === "PROJECT" ? "프로젝트" : 
                pqSubmission.type === "NON_INSPECTION" ? "미실사" : "일반"
              } PQ를 QM에서 거절하는 이유를 입력해주세요.
              {pqSubmission.projectId && (
                <span> 프로젝트: {pqSubmission.projectName}</span>
              )}
            </DialogDescription>
          </DialogHeader>
          <Textarea
            value={qmRejectReason}
            onChange={(e) => setQmRejectReason(e.target.value)}
            placeholder="QM 거절 사유를 입력하세요"
            className="min-h-24"
          />
          <DialogFooter>
            <Button variant="outline" onClick={() => setShowQMRejectDialog(false)}>
              취소
            </Button>
            <Button 
              variant="destructive" 
              onClick={handleQMReject} 
              disabled={isQMRejecting || !qmRejectReason.trim()}
            >
              {isQMRejecting ? "QM 거절 중..." : "QM 거절"}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>
    </div>
  )
}