diff --git a/src/components/items/ItemMasterDataManagement.tsx b/src/components/items/ItemMasterDataManagement.tsx index c0c7261d..fbf59be0 100644 --- a/src/components/items/ItemMasterDataManagement.tsx +++ b/src/components/items/ItemMasterDataManagement.tsx @@ -9,7 +9,7 @@ import { MasterFieldTab, HierarchyTab, SectionsTab } from './ItemMasterDataManag import { LoadingSpinner } from '@/components/ui/loading-spinner'; import { ServerErrorPage } from '@/components/common/ServerErrorPage'; // 2025-12-24: Phase 2 UI 컴포넌트 분리 -import { AttributeTabContent, ItemMasterDialogs } from './ItemMasterDataManagement/components'; +import { AttributeTabContent } from './ItemMasterDataManagement/components'; import { Database, FileText, @@ -17,8 +17,6 @@ import { import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; -import { Badge } from '@/components/ui/badge'; -import { toast } from 'sonner'; // 커스텀 훅 import import { @@ -53,19 +51,6 @@ const INPUT_TYPE_OPTIONS = [ { value: 'textarea', label: '텍스트영역' } ]; -// 입력 타입 라벨 변환 헬퍼 함수 (중복 코드 제거) -const getInputTypeLabel = (inputType: string | undefined): string => { - const labels: Record = { - textbox: '텍스트박스', - number: '숫자', - dropdown: '드롭다운', - checkbox: '체크박스', - date: '날짜', - textarea: '텍스트영역', - }; - return labels[inputType || ''] || '텍스트박스'; -}; - export function ItemMasterDataManagement() { const { itemPages, @@ -158,7 +143,6 @@ export function ItemMasterDataManagement() { newColumnType, setNewColumnType, newColumnRequired, setNewColumnRequired, handleAddOption, handleDeleteOption, - handleAddColumn: _handleAddColumn, handleDeleteColumn: _handleDeleteColumn, } = attributeManagement; // 2025-12-24: 신규 훅 초기화 @@ -185,7 +169,6 @@ export function ItemMasterDataManagement() { const deleteManagement = useDeleteManagement({ itemPages }); const { handleDeletePage: handleDeletePageWithTracking, - handleDeleteSection: _handleDeleteSectionWithTracking, handleUnlinkField: handleUnlinkFieldWithTracking, handleResetAllData: handleResetAllDataFromHook, } = deleteManagement; @@ -268,7 +251,7 @@ export function ItemMasterDataManagement() { isLoadTemplateDialogOpen, setIsLoadTemplateDialogOpen, selectedTemplateId, setSelectedTemplateId, isTemplateFieldDialogOpen, setIsTemplateFieldDialogOpen, - currentTemplateId: _currentTemplateId, setCurrentTemplateId, + setCurrentTemplateId, editingTemplateFieldId, setEditingTemplateFieldId, templateFieldName, setTemplateFieldName, templateFieldKey, setTemplateFieldKey, @@ -290,14 +273,6 @@ export function ItemMasterDataManagement() { handleDeleteBOMItemFromTemplate, } = templateManagement; - // 모든 페이지의 섹션을 하나의 배열로 평탄화 - const _itemSections = itemPages.flatMap(page => - page.sections.map(section => ({ - ...section, - parentPageId: page.id - })) - ); - // 2025-11-26: itemPages의 모든 섹션 + 독립 섹션(independentSections)을 SectionTemplate 형식으로 변환 // 이렇게 하면 계층구조 탭과 섹션 탭이 같은 데이터 소스를 사용하여 자동 동기화됨 // 독립 섹션: 페이지에서 연결 해제된 섹션 (page_id = null) @@ -481,531 +456,32 @@ export function ItemMasterDataManagement() { */} - {/* 속성 탭 (단위/재질/표면처리 통합) */} + {/* 속성 탭 (단위/재질/표면처리 통합) - 2025-12-24: AttributeTabContent로 분리 */} - - - 속성 관리 - 단위, 재질, 표면처리 등의 속성을 관리합니다 - - - {/* 속성 하위 탭 (칩 형태) */} -
-
- {attributeSubTabs.sort((a, b) => a.order - b.order).map(tab => ( - - ))} -
- -
- - {/* 단위 관리 */} - {activeAttributeTab === 'units' && ( -
-
-

단위 목록

-
- - -
-
-
- {unitOptions.map((option) => { - const columns = attributeColumns['units'] || []; - const hasColumns = columns.length > 0 && option.columnValues; - - return ( -
-
-
-
- {option.label} - {option.inputType && ( - {getInputTypeLabel(option.inputType)} - )} - {option.required && ( - 필수 - )} -
- -
-
- 값(Value): - {option.value} -
- {option.placeholder && ( -
- 플레이스홀더: - {option.placeholder} -
- )} - {option.defaultValue && ( -
- 기본값: - {option.defaultValue} -
- )} - {option.inputType === 'dropdown' && option.options && ( -
- 옵션: -
- {option.options.map((opt, idx) => ( - {opt} - ))} -
-
- )} -
- - {hasColumns && ( -
-

추가 칼럼

-
- {columns.map((column) => ( -
- {column.name}: - {option.columnValues?.[column.key] || '-'} -
- ))} -
-
- )} -
- -
-
- ); - })} -
-
- )} - - {/* 재질 관리 */} - {activeAttributeTab === 'materials' && ( -
-
-

재질 목록

-
- - -
-
-
- {materialOptions.map((option) => { - const columns = attributeColumns['materials'] || []; - const hasColumns = columns.length > 0 && option.columnValues; - - return ( -
-
-
-
- {option.label} - {option.inputType && ( - {getInputTypeLabel(option.inputType)} - )} - {option.required && ( - 필수 - )} -
- -
-
- 값(Value): - {option.value} -
- {option.placeholder && ( -
- 플레이스홀더: - {option.placeholder} -
- )} - {option.defaultValue && ( -
- 기본값: - {option.defaultValue} -
- )} - {option.inputType === 'dropdown' && option.options && ( -
- 옵션: -
- {option.options.map((opt, idx) => ( - {opt} - ))} -
-
- )} -
- - {hasColumns && ( -
-

추가 칼럼

-
- {columns.map((column) => ( -
- {column.name}: - {option.columnValues?.[column.key] || '-'} -
- ))} -
-
- )} -
- -
-
- ); - })} -
-
- )} - - {/* 표면처리 관리 */} - {activeAttributeTab === 'surface' && ( -
-
-

표면처리 목록

-
- - -
-
-
- {surfaceTreatmentOptions.map((option) => { - const columns = attributeColumns['surface'] || []; - const hasColumns = columns.length > 0 && option.columnValues; - const inputTypeLabel = getInputTypeLabel(option.inputType); - - return ( -
-
-
-
- {option.label} - {option.inputType && ( - {inputTypeLabel} - )} - {option.required && ( - 필수 - )} -
- -
-
- 값(Value): - {option.value} -
- {option.placeholder && ( -
- 플레이스홀더: - {option.placeholder} -
- )} - {option.defaultValue && ( -
- 기본값: - {option.defaultValue} -
- )} - {option.inputType === 'dropdown' && option.options && ( -
- 옵션: -
- {option.options.map((opt, idx) => ( - {opt} - ))} -
-
- )} -
- - {hasColumns && ( -
-

추가 칼럼

-
- {columns.map((column) => ( -
- {column.name}: - {option.columnValues?.[column.key] || '-'} -
- ))} -
-
- )} -
- -
-
- ); - })} -
-
- )} - - {/* 사용자 정의 속성 탭 및 마스터 항목 탭 */} - {!['units', 'materials', 'surface'].includes(activeAttributeTab) && (() => { - const currentTabKey = activeAttributeTab; - - // 마스터 항목인지 확인 - const masterField = itemMasterFields.find(f => f.id.toString() === currentTabKey); - - // 마스터 항목이면 해당 항목의 속성값들을 표시 - // Note: properties is Record | null, convert to array for display - const propertiesArray = masterField?.properties - ? Object.entries(masterField.properties).map(([key, value]) => ({ key, ...value as object })) - : []; - - if (masterField && propertiesArray.length > 0) { - return ( -
-
-
-

{masterField.field_name} 속성 목록

-

- 항목 탭에서 추가한 "{masterField.field_name}" 항목의 속성값들입니다 -

-
-
- -
- {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */} - {propertiesArray.map((property: any) => { - const inputTypeLabel = getInputTypeLabel(property.type); - - return ( -
-
-
-
- {property.label} - {inputTypeLabel} - {property.required && ( - 필수 - )} -
- -
-
- 키(Key): - {property.key} -
- {property.placeholder && ( -
- 플레이스홀더: - {property.placeholder} -
- )} - {property.defaultValue && ( -
- 기본값: - {property.defaultValue} -
- )} - {property.type === 'dropdown' && property.options && ( -
- 옵션: -
- {property.options.map((opt: string, idx: number) => ( - {opt} - ))} -
-
- )} -
-
-
-
- ); - })} -
- -
-
- -
-

- 마스터 항목 속성 관리 -

-

- 이 속성들은 항목 탭에서 "{masterField.field_name}" 항목을 편집하여 추가/수정/삭제할 수 있습니다. -

-
-
-
-
- ); - } - - // 사용자 정의 속성 탭 (기존 로직) - const currentOptions = customAttributeOptions[currentTabKey] || []; - - return ( -
-
-

- {attributeSubTabs.find(t => t.key === activeAttributeTab)?.label || '사용자 정의'} 목록 -

-
- - -
-
- - {currentOptions.length > 0 ? ( -
- {currentOptions.map((option) => { - const columns = attributeColumns[currentTabKey] || []; - const hasColumns = columns.length > 0 && option.columnValues; - const inputTypeLabel = getInputTypeLabel(option.inputType); - - return ( -
-
-
-
- {option.label} - {inputTypeLabel} - {option.required && ( - 필수 - )} -
- -
-
- 값(Value): - {option.value} -
- {option.placeholder && ( -
- 플레이스홀더: - {option.placeholder} -
- )} - {option.defaultValue && ( -
- 기본값: - {option.defaultValue} -
- )} - {option.inputType === 'dropdown' && option.options && ( -
- 옵션: -
- {option.options.map((opt, idx) => ( - {opt} - ))} -
-
- )} -
- - {hasColumns && ( -
-

추가 칼럼

-
- {columns.map((column) => ( -
- {column.name}: - {option.columnValues?.[column.key] || '-'} -
- ))} -
-
- )} -
- -
-
- ); - })} -
- ) : ( -
- -

아직 추가된 항목이 없습니다

-

위 "추가" 버튼을 클릭하여 새로운 속성을 추가할 수 있습니다

-
- )} -
- ); - })()} - - + {/* 항목 탭 */}