/** * 공통 테이블 핸들러 */ export type SortDirection = 'asc' | 'desc'; export interface SortState { key: string; direction: SortDirection; } /** * 테이블 헤더에 정렬 이벤트를 바인딩합니다. * @param table 대상 테이블 요소 * @param currentState 현재 정렬 상태 * @param onSort 정렬 변경 시 호출될 콜백 */ export function setupTableSorting( table: HTMLTableElement, currentState: SortState, onSort: (key: string, direction: SortDirection) => void ) { const headers = table.querySelectorAll('th[data-sort]'); headers.forEach(th => { const key = th.getAttribute('data-sort')!; th.classList.add('sortable'); // 현재 정렬 상태 표시 if (currentState.key === key) { th.classList.add(currentState.direction); } else { th.classList.remove('asc', 'desc'); } (th as HTMLElement).onclick = () => { let nextDirection: SortDirection = 'asc'; if (currentState.key === key) { nextDirection = currentState.direction === 'asc' ? 'desc' : 'asc'; } onSort(key, nextDirection); }; }); }