/**
 * 단가 최종 확정 다이얼로그
 */

'use client';

import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Lock, CheckCircle2 } from 'lucide-react';
import { formatNumber } from '@/lib/utils/amount';

interface PricingFinalizeDialogProps {
  open: boolean;
  onOpenChange: (open: boolean) => void;
  onConfirm: () => void;
  itemName: string;
  purchasePrice?: number;
  salesPrice?: number;
  marginRate?: number;
}

export function PricingFinalizeDialog({
  open,
  onOpenChange,
  onConfirm,
  itemName,
  purchasePrice,
  salesPrice,
  marginRate,
}: PricingFinalizeDialogProps) {
  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent>
        <DialogHeader>
          <DialogTitle className="flex items-center gap-2">
            <Lock className="h-5 w-5 text-purple-600" />
            최종 확정
          </DialogTitle>
          <DialogDescription>
            단가를 최종 확정하시겠습니까? 확정 후에는 수정할 수 없습니다.
          </DialogDescription>
        </DialogHeader>

        <div className="py-4">
          <div className="bg-purple-50 border border-purple-200 rounded-lg p-4 space-y-2 text-sm">
            <div className="flex justify-between">
              <span className="text-muted-foreground">품목:</span>
              <span className="font-semibold">{itemName}</span>
            </div>
            <div className="flex justify-between">
              <span className="text-muted-foreground">매입단가:</span>
              <span className="font-semibold">
                {formatNumber(purchasePrice)}원
              </span>
            </div>
            <div className="flex justify-between">
              <span className="text-muted-foreground">판매단가:</span>
              <span className="font-semibold">
                {formatNumber(salesPrice)}원
              </span>
            </div>
            <div className="flex justify-between">
              <span className="text-muted-foreground">마진율:</span>
              <span className="font-semibold">
                {marginRate?.toFixed(1) || '-'}%
              </span>
            </div>
          </div>
        </div>

        <DialogFooter>
          <Button variant="outline" onClick={() => onOpenChange(false)}>
            취소
          </Button>
          <Button
            onClick={onConfirm}
            className="bg-purple-600 hover:bg-purple-700"
          >
            <CheckCircle2 className="h-4 w-4 mr-2" />
            최종 확정
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
}

export default PricingFinalizeDialog;
