- buttonActions.ts: formData가 배열인 경우 일반 저장 건너뜀
- SelectedItemsDetailInput이 UPSERT를 완료한 후 일반 저장이 실행되어 null 레코드가 삽입되던 문제 해결
- ScreenModal에서 그룹 레코드를 배열로 전달하는 경우 감지하여 처리
- skipDefaultSave 플래그가 제대로 작동하지 않던 문제 근본 해결
- SelectedItemsDetailInput 컴포넌트 수정 모드 지원
- 그룹화된 데이터 UPSERT API 추가 (/api/data/upsert-grouped)
- 부모 키 기준으로 기존 레코드 조회 후 INSERT/UPDATE/DELETE
- 각 레코드의 모든 필드 조합을 고유 키로 사용
- created_date 보존 (UPDATE 시)
- 수정 모드에서 groupByColumns 기준으로 관련 레코드 조회
- 날짜 타입 ISO 형식 자동 감지 및 포맷팅 (YYYY.MM.DD)
주요 변경사항:
- backend: dataService.upsertGroupedRecords() 메서드 구현
- backend: dataRoutes POST /api/data/upsert-grouped 엔드포인트 추가
- frontend: ScreenModal에서 groupByColumns 파라미터 전달
- frontend: SelectedItemsDetailInput 수정 모드 로직 추가
- frontend: 날짜 필드 타임존 제거 및 포맷팅 개선
- 여러 테이블(거래처, 품목 등)에서 데이터를 가져와 자동 매핑 가능
- 각 매핑마다 소스 테이블, 원본 필드, 저장 필드를 독립적으로 설정
- 검색 가능한 Combobox로 테이블 및 컬럼 선택 UX 개선
- 소스 테이블 선택 시 해당 테이블의 컬럼 자동 로드
- 라벨, 컬럼명, 데이터 타입으로 검색 가능
- 세로 레이아웃으로 가독성 향상
기술적 변경사항:
- ParentDataMapping 인터페이스 추가 (sourceTable, sourceField, targetField)
- buttonActions.ts의 handleBatchSave에서 소스 테이블 기반 데이터 소스 자동 판단
- tableManagementApi.getColumnList() 사용하여 테이블 컬럼 동적 로드
- Command + Popover 조합으로 검색 가능한 Select 구현
- 각 매핑별 독립적인 컬럼 상태 관리 (mappingSourceColumns)
문제:
- 조건부 컨테이너 내부의 modal-repeater-table 컴포넌트가 데이터 업데이트 불가
- ConditionalSectionViewer가 RealtimePreview에 formData/onFormDataChange 미전달
해결:
- ConditionalSectionViewer.tsx: RealtimePreview에 formData, onFormDataChange props 추가
- DynamicComponentRenderer.tsx: 디버깅 로그 정리
- ScreenModal.tsx: 디버깅 로그 정리
영향:
- 수주 등록 화면 품목 추가 기능 정상 작동
- 조건부 컨테이너 내부 모든 폼 컴포넌트 데이터 바인딩 정상화
Refs: #수주관리 #modal-repeater-table #ConditionalContainer
- ResizableDialog 콘텐츠 영역에 pointer-events 및 z-index 설정 추가
- TextInputComponent를 제어 컴포넌트에서 비제어 컴포넌트로 변경 (value → defaultValue)
- ItemSelectionModal 및 TextInputComponent 디버그 로그 제거
수정 파일:
- frontend/components/ui/resizable-dialog.tsx
- frontend/lib/registry/components/text-input/TextInputComponent.tsx
- frontend/lib/registry/components/modal-repeater-table/ItemSelectionModal.tsx
- 선택항목 상세입력 컴포넌트 확장
- 실시간 가격 계산 기능 추가 (할인율/할인금액, 반올림 방식)
- 카테고리 값 기반 연산 매핑 시스템
- 3단계 드릴다운 방식 설정 UI (메뉴 → 카테고리 → 값 매핑)
- 설정 가능한 계산 로직
- autoCalculation 설정으로 계산 필드명 동적 지정
- valueMapping으로 카테고리 코드와 연산 타입 매핑
- 할인 방식: none/rate/amount
- 반올림 방식: none/round/floor/ceil
- 반올림 단위: 1/10/100/1000
- UI 개선
- 입력 필드 가로 배치 (반응형 Grid)
- 카테고리 타입 필드 옵션 로딩 개선
- 계산 결과 필드 자동 표시 및 읽기 전용 처리
- 날짜 입력 필드 네이티브 피커 지원
- API 연동
- 2레벨 메뉴 목록 조회
- 메뉴별 카테고리 컬럼 조회
- 카테고리별 값 목록 조회
- 문서화
- 기간별 단가 설정 가이드 작성
목적:
- 콘솔창이 너무 많은 디버깅 정보로 지저분해지는 문제 해결
- 정상 작동 시 불필요한 로그 출력 최소화
변경사항:
- UnifiedPropertiesPanel: 4개 디버깅 로그 제거
• renderDetailTab 컴포넌트 타입 확인 로그
• DataTable/Component 타입 감지 로그
• DynamicComponentConfigPanel onChange 로그
- RealtimePreviewDynamic: baseStyle 크기 정보 로그 주석 처리
결과:
- Section Card/Paper 사용 시 깔끔한 콘솔
- 에러 발생 시에만 에러 메시지 표시 (기존 핸들링 유지)
- 필요시 주석 해제로 디버깅 로그 재활성화 가능
문제:
- 거래처별 품목 정보 등 모달 화면에서 TableSearchWidget 사용 시 에러 발생
- Error: useTableOptions must be used within TableOptionsProvider
원인:
- ScreenModal에서 화면을 렌더링할 때 필수 Context Provider 누락
- TableSearchWidget은 TableOptionsContext를 필수로 사용하는데 모달 환경에서 제공되지 않음
해결:
- ScreenModal에 TableOptionsProvider와 TableSearchWidgetHeightProvider 추가
- 모달 내부 화면 컴포넌트들이 정상적으로 Context를 사용할 수 있도록 수정
영향:
- 거래처별 품목 정보 화면의 '품목 추가' 버튼 정상 작동
- 모든 모달 화면에서 TableSearchWidget 사용 가능
- 기존 화면 페이지(/screens/[screenId])는 이미 Provider가 있어 영향 없음
새로운 그룹화 레이아웃 컴포넌트 2종 추가:
- Section Card: 제목+테두리 기반 명확한 섹션 구분
- Section Paper: 배경색 기반 미니멀한 섹션 구분
주요 변경사항:
- 새 컴포넌트 등록 (각 4개 파일: Component, ConfigPanel, Renderer, index)
- UnifiedPropertiesPanel에 인라인 설정 UI 추가 (280줄)
- DetailSettingsPanel ConfigPanel 인터페이스 통일화 (config → componentConfig)
- getComponentConfigPanel에 동적 import 매핑 추가
- 기존 컴포넌트 타입 정리 (autocomplete, entity-search, modal-repeater)
특징:
- shadcn/ui 기반 일관된 디자인 시스템 준수
- 중첩 박스 금지 원칙 적용
- 반응형 지원 (모바일 우선)
- collapsible 기능 지원 (Section Card)
- 데이터 구조 변경: ItemData.details → ItemData.fieldGroups (그룹별 관리)
- 각 필드 그룹마다 독립적으로 여러 항목 추가/수정/삭제 가능
- renderFieldsByGroup: 그룹별 입력 항목 목록 + 편집 + 추가 버튼 구현
- renderGridLayout/renderCardLayout: 품목별 그룹 카드 표시로 단순화
- handleFieldChange: groupId 파라미터 추가 (itemId, groupId, entryId, fieldName, value)
- handleAddGroupEntry, handleRemoveGroupEntry, handleEditGroupEntry 핸들러 추가
- buttonActions handleBatchSave: fieldGroups 구조 처리하도록 수정
- 원본 데이터 표시 버그 수정: modalData의 중첩 구조 처리
사용 예:
- 품목 1
- 그룹 1 (거래처 정보): 3개 항목 입력 가능
- 그룹 2 (단가 정보): 5개 항목 입력 가능
- 각 항목 클릭 → 수정 가능
- 저장 시 모든 입력 항목이 개별 레코드로 저장됨
- 품목 검색 모달에서 컬럼명 대신 라벨명 표시
* ItemSelectionModal에 columnLabels prop 추가
* ModalRepeaterTableComponent에서 columns 설정의 라벨 매핑 생성
* 테이블 헤더에 한글 라벨 표시 (품번, 품명, 규격, 재질 등)
- 이미 추가된 품목은 검색 결과에서 완전 제외
* filteredResults로 중복 항목 필터링
* 회색 표시 대신 목록에서 아예 제거
* 사용자 친화적인 안내 메시지 추가
- 수주등록 버튼 크기 및 렌더링 수정
* 기본 크기를 200x40에서 120x40으로 변경 (다른 버튼과 통일)
* h-full w-full 클래스 적용하여 컨테이너 크기에 맞게 렌더링
* style prop의 width/height 제거하여 Tailwind 클래스 우선순위 문제 해결
- 수주등록 모달에 판매 유형 및 무역 정보 추가
* 국내/해외 판매 선택 기능
* 해외 판매 시 무역 정보 섹션 표시 (인코텀즈, 결제조건, 통화 등)
* 거래처 정보 확장 (담당자, 납품처, 납품장소)
- 품목 반복 테이블 컬럼 조정
* 품목번호를 품번으로 변경
* 비고 컬럼 제거
* 규격, 재질 컬럼 추가
* 납품일을 납기일로 변경
- 범용 컴포넌트 3종 개발 및 레지스트리 등록:
* AutocompleteSearchInput: 자동완성 검색 입력 컴포넌트
* EntitySearchInput: 엔티티 검색 모달 컴포넌트
* ModalRepeaterTable: 모달 기반 반복 테이블 컴포넌트
- 수주등록 전용 컴포넌트:
* OrderCustomerSearch: 거래처 검색 (AutocompleteSearchInput 래퍼)
* OrderItemRepeaterTable: 품목 관리 (ModalRepeaterTable 래퍼)
* OrderRegistrationModal: 수주등록 메인 모달
- 백엔드 API:
* Entity 검색 API (멀티테넌시 지원)
* 수주 등록 API (자동 채번)
- 화면 편집기 통합:
* 컴포넌트 레지스트리에 등록
* ConfigPanel을 통한 설정 기능
* 드래그앤드롭으로 배치 가능
- 개발 문서:
* 수주등록_화면_개발_계획서.md (상세 설계 문서)