diff --git a/frontend/lib/registry/components/table-list/TableListComponent.tsx b/frontend/lib/registry/components/table-list/TableListComponent.tsx index 6344f3e8..cc304fb0 100644 --- a/frontend/lib/registry/components/table-list/TableListComponent.tsx +++ b/frontend/lib/registry/components/table-list/TableListComponent.tsx @@ -274,6 +274,11 @@ export const TableListComponent: React.FC = ({ setCurrentPage(1); // 필터 변경 시 첫 페이지로 }, [filters]); + // grouping이 변경되면 groupByColumns 업데이트 + useEffect(() => { + setGroupByColumns(grouping); + }, [grouping]); + // 초기 로드 시 localStorage에서 저장된 설정 불러오기 useEffect(() => { if (tableConfig.selectedTable && currentUserId) { @@ -1652,9 +1657,20 @@ export const TableListComponent: React.FC = ({ data.forEach((item) => { // 그룹 키 생성: "통화:KRW > 단위:EA" const keyParts = groupByColumns.map((col) => { - const value = item[col]; + // 카테고리/엔티티 타입인 경우 _name 필드 사용 + const inputType = columnMeta?.[col]?.inputType; + let displayValue = item[col]; + + if (inputType === 'category' || inputType === 'entity' || inputType === 'code') { + // _name 필드가 있으면 사용 (예: division_name, writer_name) + const nameField = `${col}_name`; + if (item[nameField] !== undefined && item[nameField] !== null) { + displayValue = item[nameField]; + } + } + const label = columnLabels[col] || col; - return `${label}:${value !== null && value !== undefined ? value : "-"}`; + return `${label}:${displayValue !== null && displayValue !== undefined ? displayValue : "-"}`; }); const groupKey = keyParts.join(" > "); @@ -1677,7 +1693,7 @@ export const TableListComponent: React.FC = ({ count: items.length, }; }); - }, [data, groupByColumns, columnLabels]); + }, [data, groupByColumns, columnLabels, columnMeta]); // 저장된 그룹 설정 불러오기 useEffect(() => {