diff --git a/frontend/components/admin/dashboard/DashboardDesigner.tsx b/frontend/components/admin/dashboard/DashboardDesigner.tsx index ee90063c..7d7e3cd6 100644 --- a/frontend/components/admin/dashboard/DashboardDesigner.tsx +++ b/frontend/components/admin/dashboard/DashboardDesigner.tsx @@ -392,12 +392,21 @@ export default function DashboardDesigner({ dashboardId: initialDashboardId }: D // 사이드바 적용 const handleApplySidebar = useCallback( (updatedElement: DashboardElement) => { - updateElement(updatedElement.id, updatedElement); - // 사이드바는 열린 채로 유지하여 연속 수정 가능 - // 단, sidebarElement도 업데이트해서 최신 상태 반영 - setSidebarElement(updatedElement); + // 현재 요소의 최신 상태를 가져와서 position과 size는 유지 + const currentElement = elements.find((el) => el.id === updatedElement.id); + if (currentElement) { + // position과 size는 현재 상태 유지, 나머지만 업데이트 + const finalElement = { + ...updatedElement, + position: currentElement.position, + size: currentElement.size, + }; + updateElement(finalElement.id, finalElement); + // 사이드바도 최신 상태로 업데이트 + setSidebarElement(finalElement); + } }, - [updateElement], + [elements, updateElement], ); // 레이아웃 저장 diff --git a/frontend/components/admin/dashboard/widgets/ListWidget.tsx b/frontend/components/admin/dashboard/widgets/ListWidget.tsx index e3a2a7e7..378d8825 100644 --- a/frontend/components/admin/dashboard/widgets/ListWidget.tsx +++ b/frontend/components/admin/dashboard/widgets/ListWidget.tsx @@ -255,7 +255,7 @@ export function ListWidget({ element }: ListWidgetProps) { ) : ( paginatedRows.map((row, idx) => ( - + {displayColumns .filter((col) => col.visible) .map((col) => ( diff --git a/frontend/components/admin/dashboard/widgets/list-widget/UnifiedColumnEditor.tsx b/frontend/components/admin/dashboard/widgets/list-widget/UnifiedColumnEditor.tsx index 53eb30b9..2ddaafdc 100644 --- a/frontend/components/admin/dashboard/widgets/list-widget/UnifiedColumnEditor.tsx +++ b/frontend/components/admin/dashboard/widgets/list-widget/UnifiedColumnEditor.tsx @@ -119,22 +119,13 @@ export function UnifiedColumnEditor({ queryResult, config, onConfigChange }: Uni return (
{ - handleDragStart(index); - e.currentTarget.style.cursor = "grabbing"; - }} onDragOver={(e) => handleDragOver(e, index)} onDrop={handleDrop} - onDragEnd={(e) => { - handleDragEnd(); - e.currentTarget.style.cursor = "grab"; - }} className={`group relative rounded-md border transition-all ${ col.visible ? "border-primary/40 bg-primary/5 shadow-sm" : "border-gray-200 bg-white hover:border-gray-300 hover:shadow-sm" - } cursor-grab active:cursor-grabbing ${draggedIndex === index ? "scale-95 opacity-50" : ""}`} + } ${draggedIndex === index ? "scale-95 opacity-50" : ""}`} > {/* 헤더 */}
@@ -143,7 +134,20 @@ export function UnifiedColumnEditor({ queryResult, config, onConfigChange }: Uni onCheckedChange={() => handleToggle(col.id)} className="data-[state=checked]:bg-primary data-[state=checked]:border-primary h-4 w-4 shrink-0 rounded-full" /> - +
{ + handleDragStart(index); + e.currentTarget.style.cursor = "grabbing"; + }} + onDragEnd={(e) => { + handleDragEnd(); + e.currentTarget.style.cursor = "grab"; + }} + className="cursor-grab active:cursor-grabbing" + > + +