327b4d01c2
Some checks failed
Build and Push Images / build-and-push (push) Failing after 49s
- 구매입고: 검사기준 API 수정, 검사결과 DB 저장, 검사 미완료 확정 차단 - 판매출고: 재고 부족 사전 검증, 수주상세 ship_qty 반영, 에러 메시지 개선 - 공정실행: seq_no 비순차 대응(3곳), 자재투입 자동 창고 매칭 재고차감, 불필요 버튼 제거 - 검사관리+입출고관리: 신규 화면 (quality, inventory) - 공통: ConfirmModal 커스텀 모달 (native confirm 대체)
83 lines
2.2 KiB
TypeScript
83 lines
2.2 KiB
TypeScript
"use client";
|
|
|
|
import React from "react";
|
|
|
|
export interface ConfirmModalProps {
|
|
open: boolean;
|
|
title?: string;
|
|
message: string;
|
|
confirmText?: string;
|
|
cancelText?: string;
|
|
variant?: "primary" | "danger" | "success";
|
|
onConfirm: () => void;
|
|
onCancel: () => void;
|
|
}
|
|
|
|
/**
|
|
* POP 공용 확인 모달 (native confirm() 대체)
|
|
* 모바일 친화 디자인, bottom-sheet 스타일
|
|
*/
|
|
export function ConfirmModal({
|
|
open,
|
|
title,
|
|
message,
|
|
confirmText = "확인",
|
|
cancelText = "취소",
|
|
variant = "primary",
|
|
onConfirm,
|
|
onCancel,
|
|
}: ConfirmModalProps) {
|
|
if (!open) return null;
|
|
|
|
const confirmBg =
|
|
variant === "danger"
|
|
? "bg-gradient-to-b from-red-500 to-red-600 hover:from-red-600 hover:to-red-700"
|
|
: variant === "success"
|
|
? "bg-gradient-to-b from-emerald-500 to-emerald-600 hover:from-emerald-600 hover:to-emerald-700"
|
|
: "bg-gradient-to-b from-blue-500 to-blue-600 hover:from-blue-600 hover:to-blue-700";
|
|
|
|
return (
|
|
<div className="fixed inset-0 z-[100]" onClick={onCancel}>
|
|
{/* Overlay */}
|
|
<div className="absolute inset-0 bg-black/50" />
|
|
|
|
{/* Center modal */}
|
|
<div className="absolute inset-0 flex items-center justify-center p-6">
|
|
<div
|
|
className="w-full max-w-md bg-white rounded-2xl shadow-2xl overflow-hidden"
|
|
onClick={(e) => e.stopPropagation()}
|
|
>
|
|
{/* Body */}
|
|
<div className="px-6 py-7 text-center">
|
|
{title && (
|
|
<h3 className="text-lg font-bold text-gray-900 mb-3">{title}</h3>
|
|
)}
|
|
<p className="text-base text-gray-700 whitespace-pre-line leading-relaxed">
|
|
{message}
|
|
</p>
|
|
</div>
|
|
|
|
{/* Buttons */}
|
|
<div className="flex border-t border-gray-100">
|
|
<button
|
|
type="button"
|
|
onClick={onCancel}
|
|
className="flex-1 py-4 text-base font-semibold text-gray-600 hover:bg-gray-50 active:bg-gray-100 transition-colors"
|
|
>
|
|
{cancelText}
|
|
</button>
|
|
<div className="w-px bg-gray-100" />
|
|
<button
|
|
type="button"
|
|
onClick={onConfirm}
|
|
className={`flex-1 py-4 text-base font-bold text-white transition-all active:scale-[0.98] ${confirmBg}`}
|
|
>
|
|
{confirmText}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|