리포트 저장 구현

frontend/components/report/designer/CanvasComponent.tsx

@@ -47,6 +47,8 @@ export function CanvasComponent({ component }: CanvasComponentProps) {
 
   // 마우스 이동 핸들러 (전역)
   useEffect(() => {
+    if (!isDragging && !isResizing) return;
+
     const handleMouseMove = (e: MouseEvent) => {
       if (isDragging) {
         const newX = Math.max(0, e.clientX - dragStart.x);
@@ -66,15 +68,25 @@ export function CanvasComponent({ component }: CanvasComponentProps) {
       setIsResizing(false);
     };
 
-    if (isDragging || isResizing) {
-      document.addEventListener("mousemove", handleMouseMove);
-      document.addEventListener("mouseup", handleMouseUp);
-      return () => {
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
-      };
-    }
-  }, [isDragging, isResizing, dragStart, resizeStart, component.id, updateComponent]);
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, [
+    isDragging,
+    isResizing,
+    dragStart.x,
+    dragStart.y,
+    resizeStart.x,
+    resizeStart.y,
+    resizeStart.width,
+    resizeStart.height,
+    component.id,
+    updateComponent,
+  ]);
 
   // 표시할 값 결정
   const getDisplayValue = (): string => {

frontend/components/report/designer/QueryManager.tsx

@@ -67,7 +67,6 @@ export function QueryManager() {
       setSelectedQueryId(null);
       setParameterValues({});
       setParameterTypes({});
-      setTestResult(null);
     }
   };
 
@@ -76,7 +75,6 @@ export function QueryManager() {
     setSelectedQueryId(queryId);
     setParameterValues({});
     setParameterTypes({});
-    setTestResult(null);
   };
 
   // 파라미터 값이 모두 입력되었는지 확인

frontend/components/report/designer/ReportDesignerCanvas.tsx

@@ -38,9 +38,9 @@ export function ReportDesignerCanvas() {
         fontFamily: "Malgun Gothic",
         fontWeight: "normal",
         fontColor: "#000000",
-        backgroundColor: "#ffffff",
-        borderWidth: 1,
-        borderColor: "#666666",
+        backgroundColor: "transparent",
+        borderWidth: 0,
+        borderColor: "#cccccc",
         borderRadius: 5,
         textAlign: "left",
         padding: 10,

frontend/components/report/designer/ReportDesignerToolbar.tsx

@@ -16,6 +16,11 @@ export function ReportDesignerToolbar() {
     await saveLayout();
   };
 
+  const handleSaveAndClose = async () => {
+    await saveLayout();
+    router.push("/admin/report");
+  };
+
   const handleReset = async () => {
     if (confirm("현재 변경사항을 모두 취소하고 마지막 저장 상태로 되돌리시겠습니까?")) {
       await loadLayout();
@@ -56,7 +61,7 @@ export function ReportDesignerToolbar() {
             <Eye className="h-4 w-4" />
             미리보기
           </Button>
-          <Button size="sm" onClick={handleSave} disabled={isSaving} className="gap-2">
+          <Button variant="outline" size="sm" onClick={handleSave} disabled={isSaving} className="gap-2">
             {isSaving ? (
               <>
                 <Loader2 className="h-4 w-4 animate-spin" />
@@ -69,6 +74,19 @@ export function ReportDesignerToolbar() {
               </>
             )}
           </Button>
+          <Button size="sm" onClick={handleSaveAndClose} disabled={isSaving} className="gap-2">
+            {isSaving ? (
+              <>
+                <Loader2 className="h-4 w-4 animate-spin" />
+                저장 중...
+              </>
+            ) : (
+              <>
+                <Save className="h-4 w-4" />
+                저장 후 닫기
+              </>
+            )}
+          </Button>
         </div>
       </div>