diff --git a/frontend/components/screen/InteractiveDataTable.tsx b/frontend/components/screen/InteractiveDataTable.tsx index 45a5e488..54c4be4b 100644 --- a/frontend/components/screen/InteractiveDataTable.tsx +++ b/frontend/components/screen/InteractiveDataTable.tsx @@ -109,6 +109,7 @@ export const InteractiveDataTable: React.FC = ({ const [columnWidths, setColumnWidths] = useState>({}); const hasInitializedWidthsRef = useRef(false); const columnRefs = useRef>({}); + const isResizingRef = useRef(false); // SaveModal 상태 (등록/수정 통합) const [showSaveModal, setShowSaveModal] = useState(false); @@ -1994,6 +1995,8 @@ export const InteractiveDataTable: React.FC = ({ const thElement = columnRefs.current[column.id]; if (!thElement) return; + isResizingRef.current = true; + const startX = e.clientX; const startWidth = columnWidth || thElement.offsetWidth; @@ -2024,6 +2027,11 @@ export const InteractiveDataTable: React.FC = ({ document.body.style.userSelect = ''; document.body.style.cursor = ''; + // 약간의 지연 후 리사이즈 플래그 해제 + setTimeout(() => { + isResizingRef.current = false; + }, 100); + document.removeEventListener('mousemove', handleMouseMove); document.removeEventListener('mouseup', handleMouseUp); }; diff --git a/frontend/lib/registry/components/table-list/TableListComponent.tsx b/frontend/lib/registry/components/table-list/TableListComponent.tsx index aa82d5b2..a1254d18 100644 --- a/frontend/lib/registry/components/table-list/TableListComponent.tsx +++ b/frontend/lib/registry/components/table-list/TableListComponent.tsx @@ -248,6 +248,7 @@ export const TableListComponent: React.FC = ({ const columnRefs = useRef>({}); const [isAllSelected, setIsAllSelected] = useState(false); const hasInitializedWidths = useRef(false); + const isResizing = useRef(false); // 필터 설정 관련 상태 const [isFilterSettingOpen, setIsFilterSettingOpen] = useState(false); @@ -1073,7 +1074,10 @@ export const TableListComponent: React.FC = ({ maxWidth: column.columnName === "__checkbox__" ? '48px' : undefined, userSelect: 'none' }} - onClick={() => column.sortable && handleSort(column.columnName)} + onClick={() => { + if (isResizing.current) return; + if (column.sortable) handleSort(column.columnName); + }} > {column.columnName === "__checkbox__" ? ( renderCheckboxHeader() @@ -1098,6 +1102,8 @@ export const TableListComponent: React.FC = ({ const thElement = columnRefs.current[column.columnName]; if (!thElement) return; + isResizing.current = true; + const startX = e.clientX; const startWidth = columnWidth || thElement.offsetWidth; @@ -1128,6 +1134,11 @@ export const TableListComponent: React.FC = ({ document.body.style.userSelect = ''; document.body.style.cursor = ''; + // 약간의 지연 후 리사이즈 플래그 해제 (클릭 이벤트가 먼저 처리되지 않도록) + setTimeout(() => { + isResizing.current = false; + }, 100); + document.removeEventListener('mousemove', handleMouseMove); document.removeEventListener('mouseup', handleMouseUp); };