"use client" import * as React from "react" import { Dialog, DialogContent, DialogHeader, DialogTitle, } from "@/components/ui/dialog" import { Button } from "@/components/ui/button" import { PrinterIcon } from "lucide-react" import { VendorPO, VendorPOItem } from "./types" import { formatNumber } from "@/lib/utils" import { getVendorPOById, getVendorPOItems } from "./service" interface VendorPOPrintDialogProps { open: boolean onOpenChange: (open: boolean) => void po: VendorPO | null } // 발주서 헤더 컴포넌트 (페이지마다 반복) function POHeader({ po }: { po: VendorPO }) { return (
{/* 로고 및 타이틀 */}
{/* 구매처 로고 위치 */} PURCHASER LOGO
발주서 / PURCHASE ORDER
{/* 공급자 로고 위치 */} SUPPLIER LOGO
{/* 회사 정보 및 PO 정보 */}
거제조선소 : 경상남도 거제시 장평3로 80 (장평동)
SHIP YARD : 80, Jangpyeong 3-ro, Geoje-si, Gyeongsangnam-do, 53261, Rep. of KOREA
FAX NO : +82-55-630-5768
TEL NO : +82-55-631-4434
PO번호 {po.contractNo}
REV {po.poVersion ? String(po.poVersion).padStart(2, '0') : '00'}
PO발행일 {po.contractDate || '-'}
구매담당 {po.purchaseManagerName || po.purchaseGroup || '-'}
{/* 출력 정보 */}
OUTPUT : {new Date().toLocaleString('ko-KR')}
) } export function VendorPOPrintDialog({ open, onOpenChange, po, }: VendorPOPrintDialogProps) { const [loading, setLoading] = React.useState(false) const [poDetails, setPoDetails] = React.useState(null) const [poItems, setPoItems] = React.useState([]) // PO 상세 정보 로드 React.useEffect(() => { if (open && po) { setLoading(true) Promise.all([ getVendorPOById(po.id), getVendorPOItems(po.id) ]) .then(([details, items]) => { setPoDetails(details) setPoItems(items) }) .catch((error) => { console.error("Failed to load PO details:", error) }) .finally(() => { setLoading(false) }) } }, [open, po]) const handlePrint = () => { window.print() } if (!po) return null const displayPO = poDetails || po // 총 수량 계산 const totalQuantity = poItems.reduce((sum, item) => sum + (item.quantity || 0), 0) return ( <> {/* 인쇄 전용 스타일 - Tailwind와 독립적으로 작동 */}