diff --git a/backend-node/src/services/DashboardService.ts b/backend-node/src/services/DashboardService.ts index 82ef499e..d7245ce0 100644 --- a/backend-node/src/services/DashboardService.ts +++ b/backend-node/src/services/DashboardService.ts @@ -321,34 +321,24 @@ export class DashboardService { ]); // 3. 요소 데이터 변환 - console.log("📊 대시보드 요소 개수:", elementsResult.rows.length); - const elements: DashboardElement[] = elementsResult.rows.map( - (row: any, index: number) => { - const element = { - id: row.id, - type: row.element_type, - subtype: row.element_subtype, - position: { - x: row.position_x, - y: row.position_y, - }, - size: { - width: row.width, - height: row.height, - }, - title: row.title, - content: row.content, - dataSource: JSON.parse(row.data_source_config || "{}"), - chartConfig: JSON.parse(row.chart_config || "{}"), - }; - - console.log( - `📊 위젯 #${index + 1}: type="${element.type}", subtype="${element.subtype}", title="${element.title}"` - ); - - return element; - } + (row: any) => ({ + id: row.id, + type: row.element_type, + subtype: row.element_subtype, + position: { + x: row.position_x, + y: row.position_y, + }, + size: { + width: row.width, + height: row.height, + }, + title: row.title, + content: row.content, + dataSource: JSON.parse(row.data_source_config || "{}"), + chartConfig: JSON.parse(row.chart_config || "{}"), + }) ); return { @@ -363,6 +353,7 @@ export class DashboardService { tags: JSON.parse(dashboard.tags || "[]"), category: dashboard.category, viewCount: parseInt(dashboard.view_count || "0"), + settings: dashboard.settings || undefined, elements, }; } catch (error) { diff --git a/backend-node/src/types/dashboard.ts b/backend-node/src/types/dashboard.ts index 7d5bfab6..f40ee768 100644 --- a/backend-node/src/types/dashboard.ts +++ b/backend-node/src/types/dashboard.ts @@ -48,6 +48,10 @@ export interface Dashboard { tags?: string[]; category?: string; viewCount: number; + settings?: { + resolution?: string; + backgroundColor?: string; + }; elements: DashboardElement[]; } diff --git a/frontend/components/admin/dashboard/DashboardDesigner.tsx b/frontend/components/admin/dashboard/DashboardDesigner.tsx index 86d5fa40..60983eff 100644 --- a/frontend/components/admin/dashboard/DashboardDesigner.tsx +++ b/frontend/components/admin/dashboard/DashboardDesigner.tsx @@ -37,6 +37,15 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D const [screenResolution] = useState(() => detectScreenResolution()); const [resolution, setResolution] = useState(screenResolution); + // resolution 변경 감지 + const handleResolutionChange = useCallback((newResolution: Resolution) => { + console.log("🎯 해상도 변경 요청:", newResolution); + setResolution((prev) => { + console.log("🎯 이전 해상도:", prev); + return newResolution; + }); + }, []); + // 현재 해상도 설정 (안전하게 기본값 제공) const canvasConfig = RESOLUTIONS[resolution] || RESOLUTIONS.fhd; @@ -81,6 +90,8 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D // 저장된 설정 복원 console.log("🔍 로드된 대시보드:", dashboard); console.log("📦 저장된 settings:", (dashboard as any).settings); + console.log("🎯 settings 타입:", typeof (dashboard as any).settings); + console.log("🔍 resolution 값:", (dashboard as any).settings?.resolution); if ((dashboard as any).settings?.resolution) { const savedResolution = (dashboard as any).settings.resolution as Resolution; @@ -91,6 +102,7 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D } if ((dashboard as any).settings?.backgroundColor) { + console.log("✅ 저장된 배경색 복원:", (dashboard as any).settings.backgroundColor); setCanvasBackgroundColor((dashboard as any).settings.backgroundColor); } @@ -273,6 +285,9 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D if (dashboardId) { // 기존 대시보드 업데이트 + console.log("💾 저장 시작 - 현재 resolution 상태:", resolution); + console.log("💾 저장 시작 - 현재 배경색 상태:", canvasBackgroundColor); + const updateData = { elements: elementsData, settings: { @@ -280,11 +295,15 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D backgroundColor: canvasBackgroundColor, }, }; + console.log("💾 저장할 데이터:", updateData); - console.log("💾 저장할 해상도:", resolution); + console.log("💾 저장할 settings:", updateData.settings); savedDashboard = await dashboardApi.updateDashboard(dashboardId, updateData); + console.log("✅ 저장된 대시보드:", savedDashboard); + console.log("✅ 저장된 settings:", (savedDashboard as any).settings); + alert(`대시보드 "${savedDashboard.title}"이 업데이트되었습니다!`); // Next.js 라우터로 뷰어 페이지 이동 @@ -319,7 +338,7 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D const errorMessage = error instanceof Error ? error.message : "알 수 없는 오류"; alert(`대시보드 저장 중 오류가 발생했습니다.\n\n오류: ${errorMessage}\n\n관리자에게 문의하세요.`); } - }, [elements, dashboardId, router]); + }, [elements, dashboardId, router, resolution, canvasBackgroundColor]); // 로딩 중이면 로딩 화면 표시 if (isLoading) { @@ -344,7 +363,7 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D dashboardTitle={dashboardTitle} onAddElement={addElementFromMenu} resolution={resolution} - onResolutionChange={setResolution} + onResolutionChange={handleResolutionChange} currentScreenResolution={screenResolution} backgroundColor={canvasBackgroundColor} onBackgroundColorChange={setCanvasBackgroundColor}