From e3df70d0fac67b4435371968b8fbba7c939229f2 Mon Sep 17 00:00:00 2001 From: kjs Date: Wed, 21 Jan 2026 18:19:29 +0900 Subject: [PATCH] =?UTF-8?q?=EC=B9=B4=ED=85=8C=EA=B3=A0=EB=A6=AC=20?= =?UTF-8?q?=EB=A7=A4=ED=95=91=20=EB=A1=9C=EC=A7=81=20=EA=B0=9C=EC=84=A0=20?= =?UTF-8?q?=EB=B0=8F=20=EB=94=94=EB=B2=84=EA=B7=B8=20=EB=A1=9C=EA=B7=B8=20?= =?UTF-8?q?=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - InteractiveDataTable에서 valueCode 및 valueId에 대한 매핑 로직을 추가하여, 두 가지 키로 카테고리 정보를 저장할 수 있도록 개선하였습니다. - UnifiedInput 및 TableListComponent에서 불필요한 디버그 로그를 주석 처리하여 코드 가독성을 향상시켰습니다. 이로 인해 카테고리 관리 및 데이터 처리의 효율성이 향상되었습니다. --- .../screen/InteractiveDataTable.tsx | 20 +++-- frontend/components/unified/UnifiedInput.tsx | 4 +- .../lib/registry/DynamicComponentRenderer.tsx | 10 +-- .../v2-table-list/TableListComponent.tsx | 76 +++++++++++-------- 4 files changed, 64 insertions(+), 46 deletions(-) diff --git a/frontend/components/screen/InteractiveDataTable.tsx b/frontend/components/screen/InteractiveDataTable.tsx index 8c4c95ce..54674e98 100644 --- a/frontend/components/screen/InteractiveDataTable.tsx +++ b/frontend/components/screen/InteractiveDataTable.tsx @@ -384,13 +384,23 @@ export const InteractiveDataTable: React.FC = ({ ); if (response.data.success && response.data.data) { - // valueCode -> {label, color} 매핑 생성 + // valueCode 및 valueId -> {label, color} 매핑 생성 const mapping: Record = {}; response.data.data.forEach((item: any) => { - mapping[item.valueCode] = { - label: item.valueLabel, - color: item.color, - }; + // valueCode로 매핑 + if (item.valueCode) { + mapping[item.valueCode] = { + label: item.valueLabel, + color: item.color, + }; + } + // valueId로도 매핑 (숫자 ID 저장 시 라벨 표시용) + if (item.valueId !== undefined && item.valueId !== null) { + mapping[String(item.valueId)] = { + label: item.valueLabel, + color: item.color, + }; + } }); mappings[col.columnName] = mapping; console.log(`✅ 카테고리 매핑 로드 성공 [${col.columnName}]:`, mapping, { menuObjid }); diff --git a/frontend/components/unified/UnifiedInput.tsx b/frontend/components/unified/UnifiedInput.tsx index 0aea0331..39dcdbbf 100644 --- a/frontend/components/unified/UnifiedInput.tsx +++ b/frontend/components/unified/UnifiedInput.tsx @@ -584,7 +584,7 @@ export const UnifiedInput = forwardRef((props userEditedNumberingRef.current = false; } - console.log("채번 코드 생성 성공:", generatedCode); + // 채번 코드 생성 성공 } else { console.warn("채번 코드 생성 실패:", previewResponse); } @@ -703,7 +703,7 @@ export const UnifiedInput = forwardRef((props const template = numberingTemplateRef.current; const canEdit = hadManualPartRef.current && template; - console.log("채번 필드 렌더링:", { displayValue, template, manualInputValue, canEdit, isGeneratingNumbering }); + // 채번 필드 렌더링 // 템플릿이 없으면 읽기 전용 (아직 생성 전이거나 수동 입력 부분 없음) if (!canEdit) { diff --git a/frontend/lib/registry/DynamicComponentRenderer.tsx b/frontend/lib/registry/DynamicComponentRenderer.tsx index ee9c9c7c..b137c884 100644 --- a/frontend/lib/registry/DynamicComponentRenderer.tsx +++ b/frontend/lib/registry/DynamicComponentRenderer.tsx @@ -206,15 +206,7 @@ export const DynamicComponentRenderer: React.FC = const componentType = mapToV2ComponentType(rawComponentType); - // 디버그: 컴포넌트 타입 확인 - if (rawComponentType && rawComponentType.includes("table")) { - console.log("🔍 DynamicComponentRenderer 타입 변환:", { - raw: rawComponentType, - mapped: componentType, - hasComponent: ComponentRegistry.hasComponent(componentType || ""), - componentConfig: (component as any).componentConfig, - }); - } + // 컴포넌트 타입 변환 완료 // 🆕 Unified 폼 시스템 연동 (최상위에서 한 번만 호출) // eslint-disable-next-line react-hooks/rules-of-hooks diff --git a/frontend/lib/registry/components/v2-table-list/TableListComponent.tsx b/frontend/lib/registry/components/v2-table-list/TableListComponent.tsx index 413aa296..93626b7b 100644 --- a/frontend/lib/registry/components/v2-table-list/TableListComponent.tsx +++ b/frontend/lib/registry/components/v2-table-list/TableListComponent.tsx @@ -353,11 +353,7 @@ export const TableListComponent: React.FC = ({ } }); - console.log("🔍 [TableListComponent] filters → searchValues:", { - filtersCount: filters.length, - filters: filters.map((f) => ({ col: f.columnName, op: f.operator, val: f.value })), - searchValues: newSearchValues, - }); + // filters → searchValues 변환 완료 setSearchValues(newSearchValues); setCurrentPage(1); // 필터 변경 시 첫 페이지로 @@ -1286,11 +1282,9 @@ export const TableListComponent: React.FC = ({ // 카테고리 컬럼 목록 추출 (useMemo로 최적화) const categoryColumns = useMemo(() => { - const cols = Object.entries(columnMeta) + return Object.entries(columnMeta) .filter(([_, meta]) => meta.inputType === "category") .map(([columnName, _]) => columnName); - - return cols; }, [columnMeta]); // 카테고리 매핑 로드 (columnMeta 변경 시 즉시 실행) @@ -1331,20 +1325,38 @@ export const TableListComponent: React.FC = ({ if (response.data.success && response.data.data && Array.isArray(response.data.data)) { const mapping: Record = {}; - response.data.data.forEach((item: any) => { - // valueCode를 문자열로 변환하여 키로 사용 - const key = String(item.valueCode); - mapping[key] = { - label: item.valueLabel, - color: item.color, - }; - }); + // 트리 구조를 평탄화하는 헬퍼 함수 + const flattenTree = (items: any[]) => { + items.forEach((item: any) => { + // valueCode를 문자열로 변환하여 키로 사용 + if (item.valueCode) { + const key = String(item.valueCode); + mapping[key] = { + label: item.valueLabel, + color: item.color, + }; + } + // valueId도 키로 추가 (숫자 ID 저장 시 라벨 표시용) + if (item.valueId !== undefined && item.valueId !== null) { + mapping[String(item.valueId)] = { + label: item.valueLabel, + color: item.color, + }; + } + // 자식 노드도 재귀적으로 처리 + if (item.children && Array.isArray(item.children) && item.children.length > 0) { + flattenTree(item.children); + } + }); + }; + + flattenTree(response.data.data); if (Object.keys(mapping).length > 0) { // 🆕 원래 컬럼명(item_info.material)으로 매핑 저장 mappings[columnName] = mapping; } else { - console.warn(`⚠️ [TableList] 매핑 데이터가 비어있음 [${columnName}]`); + // 매핑 데이터가 비어있음 - 해당 컬럼에 카테고리 값이 없음 } } else { console.warn(`⚠️ [TableList] 카테고리 값 없음 [${columnName}]:`, { @@ -1448,11 +1460,21 @@ export const TableListComponent: React.FC = ({ const mapping: Record = {}; response.data.data.forEach((item: any) => { - const key = String(item.valueCode); - mapping[key] = { - label: item.valueLabel, - color: item.color, - }; + // valueCode로 매핑 + if (item.valueCode) { + const key = String(item.valueCode); + mapping[key] = { + label: item.valueLabel, + color: item.color, + }; + } + // valueId도 키로 추가 (숫자 ID 저장 시 라벨 표시용) + if (item.valueId !== undefined && item.valueId !== null) { + mapping[String(item.valueId)] = { + label: item.valueLabel, + color: item.color, + }; + } }); if (Object.keys(mapping).length > 0) { @@ -1498,10 +1520,7 @@ export const TableListComponent: React.FC = ({ }; } } - console.log("✅ [TableList] 카테고리 연쇄관계 매핑 로드 완료:", { - tableName: tableConfig.selectedTable, - cascadingColumns: Object.keys(cascadingMappings), - }); + // 카테고리 연쇄관계 매핑 로드 완료 } } catch (cascadingError: any) { // 연쇄관계 매핑이 없는 경우 무시 (404 등) @@ -4992,10 +5011,7 @@ export const TableListComponent: React.FC = ({ useEffect(() => { if (!isDesignMode) { // relatedButtonFilter가 있으면 데이터 로드, null이면 빈 상태 (setRefreshTrigger로 트리거) - console.log("🔄 [TableList] RelatedDataButtons 상태 변경:", { - relatedButtonFilter, - isRelatedButtonTarget, - }); + // RelatedDataButtons 상태 변경 setRefreshTrigger((prev) => prev + 1); } }, [relatedButtonFilter, isDesignMode]);