diff --git a/frontend/lib/registry/pop-components/pop-dashboard/PopDashboardConfig.tsx b/frontend/lib/registry/pop-components/pop-dashboard/PopDashboardConfig.tsx index b75f9b66..1c19a856 100644 --- a/frontend/lib/registry/pop-components/pop-dashboard/PopDashboardConfig.tsx +++ b/frontend/lib/registry/pop-components/pop-dashboard/PopDashboardConfig.tsx @@ -1307,9 +1307,9 @@ function ItemEditor({ onUpdate({ ...item, gaugeConfig: { + ...item.gaugeConfig, min: parseInt(e.target.value) || 0, max: item.gaugeConfig?.max ?? 100, - ...item.gaugeConfig, }, }) } @@ -1325,9 +1325,9 @@ function ItemEditor({ onUpdate({ ...item, gaugeConfig: { + ...item.gaugeConfig, min: item.gaugeConfig?.min ?? 0, max: parseInt(e.target.value) || 100, - ...item.gaugeConfig, }, }) } @@ -1343,9 +1343,9 @@ function ItemEditor({ onUpdate({ ...item, gaugeConfig: { + ...item.gaugeConfig, min: item.gaugeConfig?.min ?? 0, max: item.gaugeConfig?.max ?? 100, - ...item.gaugeConfig, target: parseInt(e.target.value) || undefined, }, }) diff --git a/frontend/lib/registry/pop-components/pop-dashboard/items/GaugeItem.tsx b/frontend/lib/registry/pop-components/pop-dashboard/items/GaugeItem.tsx index c7313a85..cca20686 100644 --- a/frontend/lib/registry/pop-components/pop-dashboard/items/GaugeItem.tsx +++ b/frontend/lib/registry/pop-components/pop-dashboard/items/GaugeItem.tsx @@ -69,17 +69,21 @@ export function GaugeItemComponent({ const largeArcFlag = percentage > 50 ? 1 : 0; return ( -
+
{/* 라벨 */} {visibility.showLabel && ( -

+

{item.label}

)} - {/* 게이지 SVG */} -
- + {/* 게이지 SVG - 높이/너비 모두 반응형 */} +
+ {/* 배경 반원 (회색) */} +

목표: {abbreviateNumber(target)}

)} diff --git a/frontend/lib/registry/pop-components/pop-dashboard/items/KpiCard.tsx b/frontend/lib/registry/pop-components/pop-dashboard/items/KpiCard.tsx index 29db2791..13086587 100644 --- a/frontend/lib/registry/pop-components/pop-dashboard/items/KpiCard.tsx +++ b/frontend/lib/registry/pop-components/pop-dashboard/items/KpiCard.tsx @@ -66,7 +66,7 @@ export function KpiCardComponent({ const valueColor = getColorForValue(displayValue, kpiConfig?.colorRanges); return ( -
+
{/* 라벨 */} {visibility.showLabel && (

diff --git a/frontend/lib/registry/pop-components/pop-dashboard/items/StatCard.tsx b/frontend/lib/registry/pop-components/pop-dashboard/items/StatCard.tsx index c3c02e7b..93cc1305 100644 --- a/frontend/lib/registry/pop-components/pop-dashboard/items/StatCard.tsx +++ b/frontend/lib/registry/pop-components/pop-dashboard/items/StatCard.tsx @@ -37,7 +37,7 @@ export function StatCardComponent({ item, categoryData }: StatCardProps) { const total = Object.values(categoryData).reduce((sum, v) => sum + v, 0); return ( -

+
{/* 라벨 */} {visibility.showLabel && (

diff --git a/frontend/lib/registry/pop-components/pop-dashboard/modes/ArrowsMode.tsx b/frontend/lib/registry/pop-components/pop-dashboard/modes/ArrowsMode.tsx index 51a05814..d91e6ea2 100644 --- a/frontend/lib/registry/pop-components/pop-dashboard/modes/ArrowsMode.tsx +++ b/frontend/lib/registry/pop-components/pop-dashboard/modes/ArrowsMode.tsx @@ -47,42 +47,37 @@ export function ArrowsModeComponent({ } return ( -

- {/* 콘텐츠 + 화살표 */} -
- {/* 왼쪽 화살표 */} - {itemCount > 1 && ( +
+ {/* 아이템 (전체 영역 사용) */} +
+ {renderItem(currentIndex)} +
+ + {/* 좌우 화살표 (콘텐츠 위에 겹침) */} + {itemCount > 1 && ( + <> - )} - - {/* 아이템 */} -
- {renderItem(currentIndex)} -
- - {/* 오른쪽 화살표 */} - {itemCount > 1 && ( - )} -
+ + )} - {/* 페이지 인디케이터 */} + {/* 페이지 인디케이터 (콘텐츠 하단에 겹침) */} {showIndicator && itemCount > 1 && ( -
+
{Array.from({ length: itemCount }).map((_, i) => (