alert를 Dialog 로 변경
This commit is contained in:
@@ -7,7 +7,8 @@ import { yardLayoutApi } from "@/lib/api/yardLayoutApi";
|
|||||||
import dynamic from "next/dynamic";
|
import dynamic from "next/dynamic";
|
||||||
import { YardLayout, YardPlacement } from "./types";
|
import { YardLayout, YardPlacement } from "./types";
|
||||||
import { Alert, AlertDescription } from "@/components/ui/alert";
|
import { Alert, AlertDescription } from "@/components/ui/alert";
|
||||||
import { AlertCircle } from "lucide-react";
|
import { AlertCircle, CheckCircle } from "lucide-react";
|
||||||
|
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from "@/components/ui/dialog";
|
||||||
|
|
||||||
const Yard3DCanvas = dynamic(() => import("./Yard3DCanvas"), {
|
const Yard3DCanvas = dynamic(() => import("./Yard3DCanvas"), {
|
||||||
ssr: false,
|
ssr: false,
|
||||||
@@ -39,6 +40,11 @@ export default function YardEditor({ layout, onBack }: YardEditorProps) {
|
|||||||
const [error, setError] = useState<string | null>(null);
|
const [error, setError] = useState<string | null>(null);
|
||||||
const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false); // 미저장 변경사항 추적
|
const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false); // 미저장 변경사항 추적
|
||||||
const [nextPlacementId, setNextPlacementId] = useState(-1); // 임시 ID (음수 사용)
|
const [nextPlacementId, setNextPlacementId] = useState(-1); // 임시 ID (음수 사용)
|
||||||
|
const [saveResultDialog, setSaveResultDialog] = useState<{
|
||||||
|
open: boolean;
|
||||||
|
success: boolean;
|
||||||
|
message: string;
|
||||||
|
}>({ open: false, success: false, message: "" });
|
||||||
|
|
||||||
// 배치 목록 로드
|
// 배치 목록 로드
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -208,11 +214,19 @@ export default function YardEditor({ layout, onBack }: YardEditorProps) {
|
|||||||
setHasUnsavedChanges(false);
|
setHasUnsavedChanges(false);
|
||||||
setSelectedPlacement(null);
|
setSelectedPlacement(null);
|
||||||
setShowConfigPanel(false);
|
setShowConfigPanel(false);
|
||||||
alert("저장되었습니다");
|
setSaveResultDialog({
|
||||||
|
open: true,
|
||||||
|
success: true,
|
||||||
|
message: "모든 변경사항이 성공적으로 저장되었습니다.",
|
||||||
|
});
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("저장 실패:", error);
|
console.error("저장 실패:", error);
|
||||||
alert("저장에 실패했습니다");
|
setSaveResultDialog({
|
||||||
|
open: true,
|
||||||
|
success: false,
|
||||||
|
message: `저장에 실패했습니다: ${error instanceof Error ? error.message : "알 수 없는 오류"}`,
|
||||||
|
});
|
||||||
} finally {
|
} finally {
|
||||||
setIsSaving(false);
|
setIsSaving(false);
|
||||||
}
|
}
|
||||||
@@ -403,6 +417,31 @@ export default function YardEditor({ layout, onBack }: YardEditorProps) {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* 저장 결과 Dialog */}
|
||||||
|
<Dialog open={saveResultDialog.open} onOpenChange={(open) => setSaveResultDialog((prev) => ({ ...prev, open }))}>
|
||||||
|
<DialogContent onPointerDown={(e) => e.stopPropagation()}>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle className="flex items-center gap-2">
|
||||||
|
{saveResultDialog.success ? (
|
||||||
|
<>
|
||||||
|
<CheckCircle className="h-5 w-5 text-green-600" />
|
||||||
|
저장 완료
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<AlertCircle className="h-5 w-5 text-red-600" />
|
||||||
|
저장 실패
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</DialogTitle>
|
||||||
|
<DialogDescription className="pt-2">{saveResultDialog.message}</DialogDescription>
|
||||||
|
</DialogHeader>
|
||||||
|
<div className="flex justify-end">
|
||||||
|
<Button onClick={() => setSaveResultDialog((prev) => ({ ...prev, open: false }))}>확인</Button>
|
||||||
|
</div>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user