대시보드에 화면 할당 (중간)

frontend/components/admin/dashboard/DashboardDesigner.tsx

@@ -6,6 +6,7 @@ import { DashboardCanvas } from "./DashboardCanvas";
 import { DashboardTopMenu } from "./DashboardTopMenu";
 import { ElementConfigModal } from "./ElementConfigModal";
 import { ListWidgetConfigModal } from "./widgets/ListWidgetConfigModal";
+import { MenuAssignmentModal } from "./MenuAssignmentModal";
 import { DashboardElement, ElementType, ElementSubtype } from "./types";
 import { GRID_CONFIG, snapToGrid, snapSizeToGrid, calculateCellSize } from "./gridUtils";
 import { Resolution, RESOLUTIONS, detectScreenResolution } from "./ResolutionSelector";
@@ -33,6 +34,10 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
   const [canvasBackgroundColor, setCanvasBackgroundColor] = useState<string>("#f9fafb");
   const canvasRef = useRef<HTMLDivElement>(null);
 
+  // 메뉴 할당 모달 상태
+  const [menuAssignmentModalOpen, setMenuAssignmentModalOpen] = useState(false);
+  const [savedDashboardInfo, setSavedDashboardInfo] = useState<{ id: string; title: string } | null>(null);
+
   // 화면 해상도 자동 감지
   const [screenResolution] = useState<Resolution>(() => detectScreenResolution());
   const [resolution, setResolution] = useState<Resolution>(screenResolution);
@@ -348,10 +353,12 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
         console.log("✅ 저장된 대시보드:", savedDashboard);
         console.log("✅ 저장된 settings:", (savedDashboard as any).settings);
 
-        alert(`대시보드 "${savedDashboard.title}"이 업데이트되었습니다!`);
-
-        // Next.js 라우터로 뷰어 페이지 이동
-        router.push(`/dashboard/${savedDashboard.id}`);
+        // 메뉴 할당 모달 띄우기 (기존 대시보드 업데이트 시에도)
+        setSavedDashboardInfo({
+          id: savedDashboard.id,
+          title: savedDashboard.title,
+        });
+        setMenuAssignmentModalOpen(true);
       } else {
         // 새 대시보드 생성
         const title = prompt("대시보드 제목을 입력하세요:", "새 대시보드");
@@ -372,11 +379,16 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
 
         savedDashboard = await dashboardApi.createDashboard(dashboardData);
 
-        const viewDashboard = confirm(`대시보드 "${title}"이 저장되었습니다!\n\n지금 확인해보시겠습니까?`);
-        if (viewDashboard) {
-          // Next.js 라우터로 뷰어 페이지 이동
-          router.push(`/dashboard/${savedDashboard.id}`);
-        }
+        // 대시보드 ID 설정 (다음 저장 시 업데이트 모드로 전환)
+        setDashboardId(savedDashboard.id);
+        setDashboardTitle(savedDashboard.title);
+
+        // 메뉴 할당 모달 띄우기
+        setSavedDashboardInfo({
+          id: savedDashboard.id,
+          title: savedDashboard.title,
+        });
+        setMenuAssignmentModalOpen(true);
       }
     } catch (error) {
       const errorMessage = error instanceof Error ? error.message : "알 수 없는 오류";
@@ -384,6 +396,58 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
     }
   }, [elements, dashboardId, router, resolution, canvasBackgroundColor]);
 
+  // 메뉴 할당 처리
+  const handleMenuAssignment = useCallback(
+    async (assignToMenu: boolean, menuId?: string, menuType?: "0" | "1") => {
+      if (!savedDashboardInfo) return;
+
+      try {
+        if (assignToMenu && menuId) {
+          // 메뉴 API를 통해 대시보드 URL 할당
+          const { menuApi } = await import("@/lib/api/menu");
+
+          // 대시보드 URL 생성 (관리자 메뉴면 mode=admin 추가)
+          let dashboardUrl = `/dashboard/${savedDashboardInfo.id}`;
+          if (menuType === "0") {
+            dashboardUrl += "?mode=admin";
+          }
+
+          // 메뉴 정보 가져오기
+          const menuResponse = await menuApi.getMenuInfo(menuId);
+          if (menuResponse.success && menuResponse.data) {
+            const menu = menuResponse.data;
+
+            // 메뉴 URL 업데이트
+            await menuApi.updateMenu(menuId, {
+              menuUrl: dashboardUrl,
+              parentObjId: menu.parent_obj_id || menu.PARENT_OBJ_ID || "0",
+              menuNameKor: menu.menu_name_kor || menu.MENU_NAME_KOR || "",
+              menuDesc: menu.menu_desc || menu.MENU_DESC || "",
+              seq: menu.seq || menu.SEQ || 1,
+              menuType: menu.menu_type || menu.MENU_TYPE || "1",
+              status: menu.status || menu.STATUS || "active",
+              companyCode: menu.company_code || menu.COMPANY_CODE || "",
+              langKey: menu.lang_key || menu.LANG_KEY || "",
+            });
+
+            alert(`메뉴 "${menu.menu_name_kor || menu.MENU_NAME_KOR}"에 대시보드가 할당되었습니다!`);
+          }
+        }
+
+        // 모달 닫기
+        setMenuAssignmentModalOpen(false);
+        setSavedDashboardInfo(null);
+
+        // 대시보드 뷰어로 이동
+        router.push(`/dashboard/${savedDashboardInfo.id}`);
+      } catch (error) {
+        console.error("메뉴 할당 오류:", error);
+        alert("메뉴 할당 중 오류가 발생했습니다.");
+      }
+    },
+    [savedDashboardInfo, router],
+  );
+
   // 로딩 중이면 로딩 화면 표시
   if (isLoading) {
     return (
@@ -458,6 +522,22 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
           )}
         </>
       )}
+
+      {/* 메뉴 할당 모달 */}
+      {savedDashboardInfo && (
+        <MenuAssignmentModal
+          isOpen={menuAssignmentModalOpen}
+          onClose={() => {
+            setMenuAssignmentModalOpen(false);
+            setSavedDashboardInfo(null);
+            // 모달을 그냥 닫으면 대시보드 뷰어로 이동
+            router.push(`/dashboard/${savedDashboardInfo.id}`);
+          }}
+          onConfirm={handleMenuAssignment}
+          dashboardId={savedDashboardInfo.id}
+          dashboardTitle={savedDashboardInfo.title}
+        />
+      )}
     </div>
   );
 }