대시보드 위젯 렌더링 수정 및 외부 API 키 통합

- DashboardViewer에 ListSummaryWidget 연결
- list 위젯이 실제 DB 데이터 표시하도록 수정
- ITS_API_KEY (국토교통부 교통사고 API) 추가
- KMA_API_KEY (기상청 특보 API) 재적용
- dashboard.ts API URL 수정 (/api로 통일)

backend-node/src/services/DashboardService.ts

@@ -300,6 +300,11 @@ export class DashboardService {
       const elementsResult = await PostgreSQLService.query(elementsQuery, [dashboardId]);
       
       // 3. 요소 데이터 변환
+      console.log('📊 대시보드 요소 개수:', elementsResult.rows.length);
+      if (elementsResult.rows.length > 0) {
+        console.log('📊 첫 번째 요소 raw data:', elementsResult.rows[0]);
+      }
+      
       const elements: DashboardElement[] = elementsResult.rows.map((row: any) => ({
         id: row.id,
         type: row.element_type,
@@ -318,6 +323,8 @@ export class DashboardService {
         chartConfig: JSON.parse(row.chart_config || '{}')
       }));
       
+      console.log('📊 변환된 첫 번째 요소:', elements[0]);
+      
       return {
         id: dashboard.id,
         title: dashboard.title,

docker/dev/docker-compose.backend.mac.yml

@@ -20,7 +20,7 @@ services:
       - LOG_LEVEL=debug
       - ENCRYPTION_KEY=ilshin-plm-mail-encryption-key-32characters-2024-secure
       - KMA_API_KEY=ogdXr2e9T4iHV69nvV-IwA
-      - ITS_API_KEY=${ITS_API_KEY:-}
+      - ITS_API_KEY=d6b9befec3114d648284674b8fddcc32
       - EXPRESSWAY_API_KEY=${EXPRESSWAY_API_KEY:-}
     volumes:
       - ../../backend-node:/app # 개발 모드: 코드 변경 시 자동 반영

frontend/components/dashboard/DashboardViewer.tsx

@@ -3,6 +3,10 @@
 import React, { useState, useEffect, useCallback } from "react";
 import { DashboardElement, QueryResult } from "@/components/admin/dashboard/types";
 import { ChartRenderer } from "@/components/admin/dashboard/charts/ChartRenderer";
+import dynamic from "next/dynamic";
+
+// 위젯 동적 import
+const ListSummaryWidget = dynamic(() => import("./widgets/ListSummaryWidget"), { ssr: false });
 
 interface DashboardViewerProps {
   elements: DashboardElement[];
@@ -198,8 +202,11 @@ function ViewerElement({ element, data, isLoading, onRefresh }: ViewerElementPro
       <div className="h-[calc(100%-57px)]">
         {element.type === "chart" ? (
           <ChartRenderer element={element} data={data} width={element.size.width} height={element.size.height - 57} />
+        ) : element.subtype === "list" ? (
+          // 리스트 위젯
+          <ListSummaryWidget element={element} />
         ) : (
-          // 위젯 렌더링
+          // 기타 위젯 렌더링
           <div className="flex h-full w-full items-center justify-center bg-gradient-to-br from-blue-400 to-purple-600 p-4 text-white">
             <div className="text-center">
               <div className="mb-2 text-3xl">

frontend/lib/api/dashboard.ts

@@ -5,7 +5,7 @@
 import { DashboardElement } from "@/components/admin/dashboard/types";
 
 // API 기본 설정
-const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || "http://localhost:3001/api";
+const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || "/api";
 
 // 토큰 가져오기 (실제 인증 시스템에 맞게 수정)
 function getAuthToken(): string | null {