backend-node/src/controllers/DashboardController.ts

@@ -41,6 +41,7 @@ export class DashboardController {
         isPublic = false,
         tags,
         category,
+        settings,
       }: CreateDashboardRequest = req.body;
 
       // 유효성 검증
@@ -85,6 +86,7 @@ export class DashboardController {
         elements,
         tags,
         category,
+        settings,
       };
 
       // console.log('대시보드 생성 시작:', { title: dashboardData.title, userId, elementsCount: elements.length });

backend-node/src/services/DashboardService.ts

@@ -24,10 +24,20 @@ export class DashboardService {
     const dashboardId = uuidv4();
     const now = new Date();
 
+    console.log("🔍 [createDashboard] 받은 데이터:", {
+      title: data.title,
+      settings: data.settings,
+      settingsType: typeof data.settings,
+      settingsStringified: JSON.stringify(data.settings || {}),
+    });
+
     try {
       // 트랜잭션으로 대시보드와 요소들을 함께 생성
       const result = await PostgreSQLService.transaction(async (client) => {
         // 1. 대시보드 메인 정보 저장
+        const settingsJson = JSON.stringify(data.settings || {});
+        console.log("🔍 [createDashboard] DB INSERT settings:", settingsJson);
+
         await client.query(
           `
           INSERT INTO dashboards (
@@ -46,7 +56,7 @@ export class DashboardService {
             JSON.stringify(data.tags || []),
             data.category || null,
             0,
-            JSON.stringify(data.settings || {}),
+            settingsJson,
             companyCode || "DEFAULT",
           ]
         );
@@ -351,6 +361,13 @@ export class DashboardService {
 
       const dashboard = dashboardResult.rows[0];
 
+      // 🔍 디버깅: settings 원본 확인
+      console.log("🔍 [getDashboardById] dashboard.settings 원본:", {
+        type: typeof dashboard.settings,
+        value: dashboard.settings,
+        raw: JSON.stringify(dashboard.settings),
+      });
+
       // 2. 대시보드 요소들 조회
       const elementsQuery = `
         SELECT * FROM dashboard_elements
@@ -400,7 +417,21 @@ export class DashboardService {
         })
       );
 
-      return {
+      // 🔍 디버깅: settings 파싱
+      let parsedSettings = undefined;
+      if (dashboard.settings) {
+        if (typeof dashboard.settings === 'string') {
+          parsedSettings = JSON.parse(dashboard.settings);
+          console.log("🔍 [getDashboardById] settings 문자열 파싱:", parsedSettings);
+        } else {
+          parsedSettings = dashboard.settings;
+          console.log("🔍 [getDashboardById] settings 이미 객체:", parsedSettings);
+        }
+      } else {
+        console.log("🔍 [getDashboardById] settings 없음 (null/undefined)");
+      }
+
+      const result = {
         id: dashboard.id,
         title: dashboard.title,
         description: dashboard.description,
@@ -412,9 +443,13 @@ export class DashboardService {
         tags: JSON.parse(dashboard.tags || "[]"),
         category: dashboard.category,
         viewCount: parseInt(dashboard.view_count || "0"),
-        settings: dashboard.settings || undefined,
+        settings: parsedSettings,
         elements,
       };
+
+      console.log("🔍 [getDashboardById] 최종 반환 settings:", result.settings);
+
+      return result;
     } catch (error) {
       console.error("Dashboard get error:", error);
       throw error;
@@ -477,8 +512,13 @@ export class DashboardService {
           paramIndex++;
         }
         if (data.settings !== undefined) {
+          const settingsJson = JSON.stringify(data.settings);
+          console.log("🔍 [updateDashboard] DB UPDATE settings:", {
+            original: data.settings,
+            stringified: settingsJson,
+          });
           updateFields.push(`settings = $${paramIndex}`);
-          updateParams.push(JSON.stringify(data.settings));
+          updateParams.push(settingsJson);
           paramIndex++;
         }
 

frontend/components/admin/dashboard/DashboardDesigner.tsx

@@ -157,6 +157,13 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
       const { dashboardApi } = await import("@/lib/api/dashboard");
       const dashboard = await dashboardApi.getDashboard(id);
 
+      console.log("🔍 [loadDashboard] 대시보드 응답:", {
+        id: dashboard.id,
+        title: dashboard.title,
+        settingsType: typeof (dashboard as any).settings,
+        settingsValue: (dashboard as any).settings,
+      });
+
       // 대시보드 정보 설정
       setDashboardId(dashboard.id);
       setDashboardTitle(dashboard.title);
@@ -164,6 +171,12 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
       // 저장된 설정 복원
       const settings = (dashboard as { settings?: { resolution?: Resolution; backgroundColor?: string } }).settings;
 
+      console.log("🔍 [loadDashboard] 파싱된 settings:", {
+        settings,
+        resolution: settings?.resolution,
+        backgroundColor: settings?.backgroundColor,
+      });
+
       // 배경색 설정
       if (settings?.backgroundColor) {
         setCanvasBackgroundColor(settings.backgroundColor);
@@ -171,6 +184,7 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
 
       // 해상도와 요소를 함께 설정 (해상도가 먼저 반영되어야 함)
       const loadedResolution = settings?.resolution || "fhd";
+      console.log("🔍 [loadDashboard] 로드할 resolution:", loadedResolution);
       setResolution(loadedResolution);
 
       // 요소들 설정
@@ -457,6 +471,11 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
             },
           };
 
+          console.log("🔍 [handleSave] 업데이트 데이터:", {
+            dashboardId,
+            settings: updateData.settings,
+          });
+
           savedDashboard = await dashboardApi.updateDashboard(dashboardId, updateData);
         } else {
           // 새 대시보드 생성
@@ -471,6 +490,10 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D
             },
           };
 
+          console.log("🔍 [handleSave] 생성 데이터:", {
+            settings: dashboardData.settings,
+          });
+
           savedDashboard = await dashboardApi.createDashboard(dashboardData);
           setDashboardId(savedDashboard.id);
         }

frontend/components/admin/dashboard/widgets/yard-3d/spatialContainment.ts

@@ -162,3 +162,4 @@ export function getAllDescendants(
   return descendants;
 }
 
+

frontend/lib/api/dashboard.ts

@@ -131,6 +131,12 @@ export const dashboardApi = {
    * 대시보드 생성
    */
   async createDashboard(data: CreateDashboardRequest): Promise<Dashboard> {
+    console.log("🔍 [API createDashboard] 요청 데이터:", {
+      data,
+      settings: data.settings,
+      stringified: JSON.stringify(data),
+    });
+
     const result = await apiRequest<Dashboard>("/dashboards", {
       method: "POST",
       body: JSON.stringify(data),
@@ -140,6 +146,10 @@ export const dashboardApi = {
       throw new Error(result.message || "대시보드 생성에 실패했습니다.");
     }
 
+    console.log("🔍 [API createDashboard] 응답 데이터:", {
+      settings: result.data.settings,
+    });
+
     return result.data;
   },
 
@@ -226,6 +236,13 @@ export const dashboardApi = {
    * 대시보드 수정
    */
   async updateDashboard(id: string, data: Partial<CreateDashboardRequest>): Promise<Dashboard> {
+    console.log("🔍 [API updateDashboard] 요청 데이터:", {
+      id,
+      data,
+      settings: data.settings,
+      stringified: JSON.stringify(data),
+    });
+
     const result = await apiRequest<Dashboard>(`/dashboards/${id}`, {
       method: "PUT",
       body: JSON.stringify(data),
@@ -235,6 +252,10 @@ export const dashboardApi = {
       throw new Error(result.message || "대시보드 수정에 실패했습니다.");
     }
 
+    console.log("🔍 [API updateDashboard] 응답 데이터:", {
+      settings: result.data.settings,
+    });
+
     return result.data;
   },