- 외부 테이블 데이터 소스 설정 (TableDataSourceConfig) 추가
- 다중 테이블 조인 지원 (AdditionalJoinConfig)
- 테이블 필터링 (equals/notEquals) 지원
- 테이블 CRUD (행 추가/수정/삭제) 기능 추가
- 데이터 변경 시 집계 실시간 재계산 (recalculateAggregationsWithExternalData)
- 시각적 수식 빌더 (FormulaBuilder) 컴포넌트 추가
- 테이블 컬럼 순서 변경 기능 추가
- 백엔드: 배열 파라미터 IN 절 변환 로직 추가
- contentRows 기반 자유 레이아웃 지원 (header/aggregation/table/fields 타입)
- aggregationFields, tableColumns 직접 참조하도록 렌더링 로직 수정
- groupByField 없어도 grouping.enabled면 그룹핑 모드로 처리
- buttonActions에서 selectedRowsData를 모달 이벤트로 전달
- ScreenModal에서 selectedData를 groupedData props로 컴포넌트에 전달
- types.ts에 CardContentRowConfig, AggregationDisplayConfig 인터페이스 추가
- SimpleRepeaterTable: 검색/추가 없이 데이터 표시 및 편집, 자동 계산 지원
- RepeatScreenModal: 그룹핑 기반 카드 레이아웃, 집계 기능, 테이블 모드 지원
- UnifiedPropertiesPanel: overflow-x-auto 추가로 가로 스크롤 활성화
- ModernDatePicker: 로컬 상태 관리로 즉시 검색 방지
- tempValue 상태 추가하여 확인 버튼 클릭 시에만 검색 실행
- 빠른 선택 버튼 추가 (오늘, 이번주, 이번달, 최근 7일, 최근 30일)
- TableSearchWidget: ModernDatePicker 통합
- 기본 HTML input[type=date]를 ModernDatePicker로 교체
- 날짜 범위 객체 {from, to}를 파이프 구분 문자열로 변환
- 백엔드 재시작 없이 작동하도록 임시 포맷팅 적용
- tableManagementService: 날짜 범위 검색 로직 개선
- getColumnWebTypeInfo: web_type이 null이면 input_type 폴백
- buildDateRangeCondition: VARCHAR 타입 날짜 컬럼 지원
- 날짜 컬럼을 ::date로 캐스팅하여 타입 호환성 확보
- 파이프 구분 문자열 파싱 지원 (YYYY-MM-DD|YYYY-MM-DD)
- 디버깅 로깅 추가
- 컬럼 타입 정보 조회 결과 로깅
- 날짜 범위 검색 조건 생성 과정 추적
- 프론트엔드: EditModal에 날짜 정규화 함수 추가 (YYYY-MM-DD 형식)
- 백엔드: convertValueForPostgreSQL에서 DATE 타입 문자열 그대로 유지
- 기존 TIMESTAMP 형식 변환을 DATE 타입 문자열 유지로 변경
- 날짜 변환 로직에서 YYYY-MM-DD 형식 문자열 변환 제거
closes #납기일-TIMESTAMP-형식-저장-이슈
주요 수정사항:
1. 탭 컴포넌트 내 자식 화면에 menuObjid와 tableName 전달
- TabsWidget에 menuObjid prop 추가
- InteractiveScreenViewerDynamic를 통해 자식 화면에 전달
- 채번 규칙 생성 시 올바른 메뉴 스코프 및 테이블명 적용
2. 백엔드: 화면 레이아웃 API에 tableName 추가
- screenManagementService.getLayout()에서 테이블명 반환
- LayoutData 타입에 tableName 필드 추가
- 채번 규칙 생성 시 tableName 검증 강화
3. 카테고리 필터링 기능 복원
- DataFilterConfigPanel에 menuObjid 전달
- getCategoryValues API 사용으로 메뉴 스코프 적용
- 새로고침 후 카테고리 값 자동 재로드
- SplitPanelLayoutConfigPanel에 menuObjid 전달
4. 선택항목 상세입력 설정 패널 포커스 문제 해결
- 로컬 입력 상태 추가로 실시간 속성 편집 패턴 적용
- 텍스트 및 라벨 입력 시 포커스 유지
5. 테이블 리스트 설정 초기화 문제 해결
- handleChange 함수에서 기존 config와 병합하여 전달
- 다른 속성 손실 방지 (columns, dataFilter 등)
버그 수정:
- 채번 규칙 생성 시 빈 문자열 대신 null 전달
- 필터 설정 변경 시 컬럼 설정 초기화 방지
- 카테고리 컬럼 선택 시 셀렉트박스 표시
- RealtimePreview: border → outline 전환, getHeight() 함수 추가
- SectionPaperComponent: width/height 100%, overflow-auto, min-h 제거
- 모든 높이에서 선택 영역 = 컨텐츠 영역 정확히 일치
- 품목 추가 시 공통 필드(거래처, 담당자, 메모) 자동 복사
- ModalRepeaterTable onChange 시 groupData 반영
- 백엔드 타입 캐스팅으로 PostgreSQL 에러 해결
- 타입 정규화로 불필요한 UPDATE 방지
- 수정 모달에서 거래처/수주번호 읽기 전용 처리
- EditModal의 handleSave가 button-primary까지 전달되도록 수정
- ConditionalContainer/ConditionalSectionViewer에 onSave prop 추가
- DynamicComponentRenderer와 InteractiveScreenViewerDynamic에 onSave 전달 로직 추가
- ButtonActionExecutor에서 context.onSave 콜백 우선 실행 로직 구현
- 신규 품목 추가 시 groupByColumns 값 자동 포함 처리
기능:
- 품목 추가: order_no 자동 설정
- 품목 수정: 변경 필드만 부분 업데이트
- 품목 삭제: originalGroupData 비교 후 제거
- entityJoinApi 조회 데이터의 조인 컬럼(material_label 등) 필터링
- dynamicFormService.ts: 병합 모드에서 columnInfo 기반 유효 컬럼만 저장
- sales_order_mng 테이블에 존재하지 않는 컬럼 INSERT 방지
- "column does not exist" PostgreSQL 에러 해결
영향: 수주관리 그룹 편집 저장 정상 동작
- 같은 수주번호(order_no)를 가진 품목 일괄 수정 기능 추가
- groupByColumns 개념 도입 및 EditModal 그룹 데이터 처리 로직 구현
- ConditionalSectionViewer에서 DynamicComponentRenderer 사용으로 groupedData 전달 경로 확보
- ModalRepeaterTable onChange 에러 수정 및 sourceColumns 필터링 추가
- 조인된 컬럼 제외 로직 추가로 DB 저장 오류 해결
- types.ts에 targetTable 필드 추가하여 config에 저장되도록 수정
- ConfigPanel에서 targetTable을 localConfig로 관리하여 설정 유지
- Renderer 단순화 (TextInput 패턴 적용)
- Component에서 직접 isInteractive 체크 및 필드 매핑 처리
- ComponentRendererProps 상속으로 필수 props 타입 안정성 확보
문제:
- ConfigPanel 설정이 초기화되는 문제
- 필드 매핑 데이터가 DB에 저장되지 않는 문제
해결:
- 정상 작동하는 TextInput 컴포넌트 패턴 분석 및 적용
- Renderer는 props만 전달, Component가 저장 로직 처리
- TableListConfigPanel: handleNestedChange에서 전체 config 병합 로직 추가
- TableListComponent: checkbox.enabled 및 position 기본값 처리 (undefined시 기본값 사용)
- SelectedItemsDetailInputConfigPanel: handleChange에서 전체 config 병합 로직 추가
- SelectedItemsDetailInputConfigPanel: 원본 데이터 테이블 선택 disabled 조건 제거
- UnifiedPropertiesPanel: allTables 로드 및 ConfigPanel에 전달 추가
문제:
1. table-list 컴포넌트 체크박스 설정 변경 시 다른 설정 초기화
2. selected-items-detail-input 설정 변경 시 컴포넌트 이름 등 다른 속성 손실
3. 원본 데이터 테이블 선택이 비활성화되어 있음
해결:
- 모든 설정 패널에서 부분 업데이트 시 기존 config와 병합하도록 수정
- checkbox 관련 기본값 처리로 기존 컴포넌트 호환성 보장
- allTables를 별도로 로드하여 전체 테이블 목록 제공
- UnifiedPropertiesPanel의 handleConfigChange에서 config 병합 로직 추가
- 기존 config와 새 config를 merge하여 checkbox 등 다른 설정이 사라지지 않도록 수정
- 이전에는 부분 업데이트된 config만 전달되어 다른 속성들이 손실되는 문제 해결
- renderComponentConfigPanel에서 ConfigPanelComponent 호출 시 screenTableName과 tableColumns 전달 추가
- 이전 커밋(e2cc09b2)에서 renderComponentConfigPanel 로직 추가로 인한 회귀 버그 수정
- table-list 컴포넌트 설정 패널에서 컬럼 추가 기능 정상 작동
- 검색 필터 설정을 화면별로 독립적으로 저장하도록 개선 (screenId 포함)
- FilterPanel, TableSearchWidget, TableListComponent에 화면 ID 기반 localStorage 키 적용
- 동적 모드(사용자 설정)와 고정 모드(디자이너 설정) 2가지 필터 방식 추가
- 고정 모드에서 컬럼 드롭다운 선택 기능 구현
- 컬럼 선택 시 라벨 및 필터 타입 자동 설정
- ConfigPanel 표시 문제 해결 (type='component' 지원)
- UnifiedPropertiesPanel에서 독립 컴포넌트 ConfigPanel 조회 개선
주요 변경:
- 같은 테이블을 사용하는 다른 화면에서 필터 설정이 독립적으로 관리됨
- 고정 모드에서는 설정 버튼이 숨겨지고 지정된 필터만 표시
- 테이블 정보가 있으면 컬럼을 드롭다운으로 선택 가능
- inputType에 따라 filterType 자동 추론 (number, date, select, text)
- 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)
- 선택항목 상세입력 컴포넌트 확장
- 실시간 가격 계산 기능 추가 (할인율/할인금액, 반올림 방식)
- 카테고리 값 기반 연산 매핑 시스템
- 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 사용 시 깔끔한 콘솔
- 에러 발생 시에만 에러 메시지 표시 (기존 핸들링 유지)
- 필요시 주석 해제로 디버깅 로그 재활성화 가능
새로운 그룹화 레이아웃 컴포넌트 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개 항목 입력 가능
- 각 항목 클릭 → 수정 가능
- 저장 시 모든 입력 항목이 개별 레코드로 저장됨
- 범용 컴포넌트 3종 개발 및 레지스트리 등록:
* AutocompleteSearchInput: 자동완성 검색 입력 컴포넌트
* EntitySearchInput: 엔티티 검색 모달 컴포넌트
* ModalRepeaterTable: 모달 기반 반복 테이블 컴포넌트
- 수주등록 전용 컴포넌트:
* OrderCustomerSearch: 거래처 검색 (AutocompleteSearchInput 래퍼)
* OrderItemRepeaterTable: 품목 관리 (ModalRepeaterTable 래퍼)
* OrderRegistrationModal: 수주등록 메인 모달
- 백엔드 API:
* Entity 검색 API (멀티테넌시 지원)
* 수주 등록 API (자동 채번)
- 화면 편집기 통합:
* 컴포넌트 레지스트리에 등록
* ConfigPanel을 통한 설정 기능
* 드래그앤드롭으로 배치 가능
- 개발 문서:
* 수주등록_화면_개발_계획서.md (상세 설계 문서)
- ScreenModal에 onRefresh 콜백 추가하여 refreshTable 이벤트 발송
- InteractiveScreenViewerDynamic에 onRefresh, onFlowRefresh prop 추가 및 하위 컴포넌트로 전달
- TableListComponent에 refreshTable 이벤트 리스너 추가
- SplitPanelLayoutComponent에 refreshTable 이벤트 리스너 추가하여 좌/우측 패널 모두 새로고침
- 모달에서 데이터 저장 시 부모 화면의 모든 테이블 컴포넌트가 자동으로 새로고침되도록 개선
변경된 파일:
- frontend/components/common/ScreenModal.tsx
- frontend/components/screen/InteractiveScreenViewerDynamic.tsx
- frontend/lib/registry/components/table-list/TableListComponent.tsx
- frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
- 카테고리 색상 설정 시 '배지 없음' 옵션 추가
- color='none'일 때 배지 대신 일반 텍스트로 표시
- CategoryValueEditDialog, CategoryValueAddDialog에 배지 없음 버튼 추가
- InteractiveDataTable, TableListComponent에서 배지 없음 처리
- CategoryValueManager에서 배지 없음 표시 추가
- 기본 색상을 배지 없음으로 변경
- table_column_category_values JOIN 시 회사 데이터만 사용하도록 수정
- 공통 데이터(company_code='*') 사용 금지
- is_active=true 필터 추가로 활성화된 카테고리만 조회
- entityJoinService.ts의 buildJoinQuery 및 buildCountQuery 수정
- 품목 정보 테이블 등에서 발생하던 2배 중복 문제 해결
## 주요 변경사항
### 1. 화면 복사 기능 강화
- 최고 관리자가 다른 회사로 화면 복사 가능하도록 개선
- 메인 화면과 연결된 모달 화면 자동 감지 및 일괄 복사
- 복사 시 버튼의 targetScreenId 자동 업데이트
- 일괄 이름 변경 기능 추가 (복사본 텍스트 제거)
- 중복 화면명 체크 기능 추가
#### 백엔드 (screenManagementService.ts)
- generateMultipleScreenCodes: 여러 화면 코드 일괄 생성 (Advisory Lock 사용)
- detectLinkedModalScreens: edit 액션도 모달로 감지하도록 개선
- checkDuplicateScreenName: 중복 화면명 체크 API 추가
- copyScreenWithModals: 메인+모달 일괄 복사 및 버튼 업데이트
- updateButtonTargetScreenIds: 복사된 모달로 버튼 targetScreenId 업데이트
- updated_date 컬럼 제거 (screen_layouts 테이블에 존재하지 않음)
#### 프론트엔드 (CopyScreenModal.tsx)
- 회사 선택 UI 추가 (최고 관리자 전용)
- 연결된 모달 화면 자동 감지 및 표시
- 일괄 이름 변경 기능 (텍스트 제거/추가)
- 실시간 미리보기
- 중복 화면명 체크
### 2. 버튼 설정 모달 화면 선택 개선
- 편집 중인 화면의 company_code 기준으로 화면 목록 조회
- 최고 관리자가 다른 회사 화면 편집 시 해당 회사의 모달 화면만 표시
- targetScreenId 문자열/숫자 타입 불일치 수정
#### 백엔드 (screenManagementController.ts)
- getScreens API에 companyCode 쿼리 파라미터 추가
- 최고 관리자는 다른 회사의 화면 목록 조회 가능
#### 프론트엔드
- ButtonConfigPanel: currentScreenCompanyCode props 추가
- DetailSettingsPanel: currentScreenCompanyCode 전달
- UnifiedPropertiesPanel: currentScreenCompanyCode 전달
- ScreenDesigner: selectedScreen.companyCode 전달
- targetScreenId 비교 시 parseInt 처리 (문자열→숫자)
### 3. 카테고리 메뉴별 컬럼 분리 기능
- 메뉴별로 카테고리 컬럼을 독립적으로 관리
- 카테고리 컬럼 추가/삭제 시 메뉴 스코프 적용
## 수정된 파일
- backend-node/src/services/screenManagementService.ts
- backend-node/src/controllers/screenManagementController.ts
- backend-node/src/routes/screenManagementRoutes.ts
- frontend/components/screen/CopyScreenModal.tsx
- frontend/components/screen/config-panels/ButtonConfigPanel.tsx
- frontend/components/screen/panels/DetailSettingsPanel.tsx
- frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
- frontend/components/screen/ScreenDesigner.tsx
- frontend/lib/api/screen.ts
문제:
1. ColumnVisibilityPanel에서 순서 변경 후 onColumnOrderChange가 호출되지 않음
2. 필터 입력 시 데이터가 제대로 필터링되지 않음
3. useAuth 훅 import 경로 오류 (@/hooks/use-auth → @/hooks/useAuth)
해결:
1. ColumnVisibilityPanel.handleApply()에 onColumnOrderChange 호출 추가
2. 필터 변경 감지 및 데이터 로드 로직 디버깅 로그 추가
3. useAuth import 경로 수정
테스트:
- 거래처관리 화면에서 컬럼 순서 변경 → 실시간 반영 ✅
- 페이지 새로고침 → 순서 유지 (localStorage) ✅
- 필터 입력 → 필터 변경 감지 (추가 디버깅 필요)
- FilterPanel: 필터별 너비(width) 설정 기능 추가 (50-500px)
- TableSearchWidget: 필터가 여러 줄로 자동 wrap되도록 flex-wrap 적용
- TableSearchWidget: 필터 너비 설정을 localStorage에 저장/복원
- InteractiveScreenViewerDynamic: TableSearchWidget의 높이를 auto로 설정하여 콘텐츠에 맞게 자동 조정
- globals.css: 입력 필드 포커스 시 검정 테두리 제거 (combobox, input)
주요 변경사항:
1. 필터 설정에서 각 필터의 표시 너비를 개별 설정 가능
2. 필터가 많을 때 자동으로 여러 줄로 배치 (overflow 방지)
3. 설정된 필터 너비가 새로고침 후에도 유지됨
4. TableSearchWidget 높이가 콘텐츠에 맞게 자동 조정
TODO: TableSearchWidget 높이 변화 시 아래 컴포넌트 자동 재배치 기능 구현 예정
- TableRegistration에 getColumnUniqueValues 콜백 함수 추가
- TableListComponent에서 현재 데이터의 고유 값 추출 함수 구현
- TableSearchWidget에서 select 타입 필터의 옵션을 자동으로 로드
- 테이블 데이터가 변경되면 필터 옵션도 자동 업데이트
- 데이터 건수 표시 기능도 함께 수정 (등록 순서 문제 해결)
- TableOptionsContext 기반 테이블 자동 감지 시스템 구현
- 독립 위젯으로 드래그앤드롭 배치 가능
- 3가지 기능: 컬럼 가시성, 필터 설정, 그룹 설정
- FlowWidget, TableList, SplitPanel 등 모든 테이블 컴포넌트 지원
- 유틸리티 카테고리에 등록 (1920×80px)
- 위젯 크기 제어 가이드 룰 파일에 추가
- 백엔드: screenManagementService에 getMenuByScreen 함수 추가
- 백엔드: GET /api/screen-management/screens/:id/menu 엔드포인트 추가
- 프론트엔드: screenApi.getScreenMenu() 함수 추가
- ScreenDesigner: 화면 로드 시 menu_objid 자동 조회
- ScreenDesigner: menuObjid를 RealtimePreview와 UnifiedPropertiesPanel에 전달
- UnifiedPropertiesPanel: menuObjid를 DynamicComponentConfigPanel에 전달
이로써 화면 편집기에서 코드/카테고리/채번규칙이 해당 화면이 할당된 메뉴 기준으로 필터링됨
- useCodeOptions 훅에 menuObjid 파라미터 추가
- commonCodeApi.codes.getList에 menuObjid 전달
- SelectBasicComponent에서 menuObjid 받아서 useCodeOptions로 전달
- InteractiveScreenViewer에서 DynamicWebTypeRenderer로 menuObjid 전달
- 화면 페이지에서 RealtimePreview로 menuObjid 전달
이제 코드 위젯도 카테고리처럼 형제 메뉴별로 격리됩니다.
✅ 구현 내용:
1. 백엔드 API 추가
- GET /api/table-management/menu/:menuObjid/category-columns
- 형제 메뉴들의 테이블에서 카테고리 타입 컬럼 조회
- menuService.getSiblingMenuObjids() 재사용
2. 프론트엔드 CategoryWidget 수정
- menuObjid를 props로 받아 CategoryColumnList에 전달
- effectiveMenuObjid로 props.menuObjid도 처리
- 선택된 컬럼에 tableName 포함하여 상태 관리
3. CategoryColumnList 수정
- menuObjid 기반으로 형제 메뉴의 모든 카테고리 컬럼 조회
- 테이블명+컬럼명 함께 표시
- onColumnSelect에 tableName 전달
4. 메뉴 네비게이션 수정
- AppLayout.tsx: 화면 이동 시 menuObjid를 URL 쿼리 파라미터로 전달
- useMenu.ts: 동일하게 menuObjid 전달
- page.tsx: 자식 컴포넌트에도 menuObjid 전달
🎯 효과:
- 이제 형제 메뉴들이 서로 다른 테이블을 사용해도 카테고리 공유 가능
- 메뉴 클릭 → 화면 이동 시 자동으로 menuObjid 전달
- 카테고리 위젯이 형제 메뉴의 모든 카테고리 컬럼 표시
✅ 주요 변경사항:
- 백엔드: menuService.ts 추가 (형제 메뉴 조회 유틸리티)
- 백엔드: numberingRuleService.getAvailableRulesForMenu() 메뉴 스코프 적용
- 백엔드: tableCategoryValueService 메뉴 스코프 준비 (menuObjid 파라미터 추가)
- 프론트엔드: TextInputConfigPanel에 부모 메뉴 선택 UI 추가
- 프론트엔드: 메뉴별 채번규칙 필터링 (형제 메뉴 공유)
🔧 기술 세부사항:
- getSiblingMenuObjids(): 같은 부모를 가진 형제 메뉴 OBJID 조회
- 채번규칙 우선순위: menu (형제) > table > global
- 사용자 메뉴(menu_type='1') 레벨 2만 부모 메뉴로 선택 가능
📝 다음 단계:
- 카테고리 컴포넌트도 메뉴 스코프로 전환 예정
- 문제: 테이블 리스트에서 writer 컬럼이 user_id로 표시됨
- 해결:
1. 백엔드: entityJoinService에서 writer 컬럼 자동 감지
2. writer 컬럼 발견 시 user_info 테이블과 자동 조인
3. writer_name 별칭으로 user_name 반환
4. 프론트엔드: writer 컬럼일 때 writer_name 우선 표시
- 영향:
- writer 컬럼이 있는 모든 테이블에서 자동으로 작성자명 표시
- 기존 entity 조인 설정과 충돌 없이 작동
- column_labels 설정 불필요
- 문제: 속성 패널에서 너비 입력 시 size.width는 변경되지만 화면에 반영되지 않음
- 원인: RealtimePreviewDynamic의 baseStyle에서 componentStyle을 getWidth() 이후에 스프레드하여 size.width를 덮어씀
- 해결:
1. componentStyle에서 width, height 제거
2. 나머지 스타일만 먼저 적용
3. getWidth(), getHeight()로 size 기반 크기를 마지막에 설정
- 영향:
- 속성 패널에서 입력한 너비/높이가 화면에 즉시 반영됨
- component.style의 width/height는 무시되고 size.width/height만 사용됨
- 디버깅 로그 제거
- 문제: 속성 패널에서 너비를 입력해도 화면에 반영되지 않음
- 원인: updateComponentProperty에서 gridColumns 변경 시 자동으로 너비를 재계산
- 해결:
1. gridColumns 변경 시 updateSizeFromGridColumns 호출 제거
2. gridColumns 변경 시 calculateWidthFromColumns 호출 제거
- 영향:
- 속성 패널에서 입력한 너비가 화면에 즉시 반영됨
- gridColumns는 더 이상 너비를 자동으로 조정하지 않음
- 문제: 너비 입력 시 onChange에서 즉시 업데이트되어 30에서 3을 지우기 어려움
- 해결:
1. localWidth 상태 추가
2. onChange: 로컬 상태만 업데이트 (완전 자유 입력)
3. onBlur/Enter: 실제 업데이트 + 10px 단위 스냅
4. useEffect로 컴포넌트 변경 시 localWidth 동기화
- 영향:
- 30 입력 시 3, 0 모두 자유롭게 지우고 입력 가능
- 포커스 아웃 시에만 10px 단위로 정렬
- 문제: 너비/높이 입력 시 즉시 10px 단위로 스냅되어 자유 입력 불가
- 해결:
1. 너비: onChange에서는 입력값 그대로 반영, onBlur에서 10px 단위로 스냅
2. 높이: 로컬 상태로 자유 입력 허용, onBlur/Enter 시 10px 단위로 스냅
3. step을 10에서 1로 변경하여 자유 입력 가능
- 영향:
- 입력 중에는 원하는 값 입력 가능
- 입력 완료 시(포커스 아웃 또는 Enter) 자동으로 10px 단위로 정렬
- 문제: 속성 패널에서 너비/높이 입력 시 격자 시스템이 자동으로 값을 변경
- 원인: updateComponentProperty에서 size.width/height 변경 시 무조건 격자 스냅 적용
- 해결: 직접 입력 시에는 격자 스냅을 적용하지 않도록 로직 주석 처리
- 영향:
- 속성 패널에서 원하는 크기로 자유롭게 설정 가능
- 드래그/리사이즈 시에는 별도 로직에서 격자 스냅 처리
- 디버깅 로그 제거
- 문제: adjustGridColumnsFromSize 등 gridUtils 함수들이 import되지 않아 런타임 오류 발생
- 해결:
1. gridUtils에서 필요한 함수들 import 추가
2. 3개 파라미터를 받는 snap 함수 호출을 올바른 함수로 변경
- snapSizeTo10px -> snapSizeToGrid
- snapPositionTo10px -> snapToGrid
- 영향: 컴포넌트 크기/위치 조정 시 격자 스냅 기능 정상 작동
- 문제: 버튼 컴포넌트 클릭 시 버튼 동작이 실행되어 선택되지 않음
- 해결:
1. ButtonPrimaryComponent에서 디자인 모드일 때 <button> 대신 <div>로 렌더링
2. ScreenDesigner의 ScreenPreviewProvider에서 isPreviewMode를 false로 설정
3. 디자인 모드에서는 버튼 액션이 실행되지 않고 onClick만 전달되도록 수정
- 영향: button-primary 타입 버튼이 화면 편집기에서 정상적으로 선택 가능
- 드래그 드롭으로 배치되는 인풋 필드 기본 높이 30px로 변경
- 날짜 입력 컴포넌트의 모든 외부 div에 h-full 추가
- 모든 input 요소에 min-h-full 추가하여 부모 높이를 제대로 따르도록 수정
- daterange, year 타입도 동일하게 적용
주요 변경사항:
- Dialog/DialogContent를 ResizableDialog/ResizableDialogContent로 변경
- DialogTitle을 ResizableDialogTitle로 변경
- 내부 컨텐츠 컨테이너를 유연한 크기(w-full h-full)로 변경
- minWidth/minHeight 사용으로 최소 크기 보장
참고:
- 컴포넌트 레이아웃이 화면관리에서 설정된 대로 정확히 렌더링됨
- 레이아웃 자체의 문제는 화면관리에서 재설계 필요
파일 변경:
- frontend/components/screen/SaveModal.tsx
주요 변경사항:
- 드래그앤드롭 컬럼의 라벨 숨김 및 placeholder로 라벨명 표시
- 기본 높이 30px로 변경
- 5개 시스템 컬럼(id, created_date, updated_date, writer, company_code) 숨김
- AI-개발자 협업 작업 수칙 문서 작성 및 .cursorrules에 통합
파일 변경:
- frontend/components/screen/ScreenDesigner.tsx
* getDefaultHeight(): 기본 높이를 30px로 변경
* handleDrop(): labelDisplay false, placeholder 추가
- frontend/components/screen/panels/TablesPanel.tsx
* hiddenColumns Set으로 시스템 컬럼 필터링
- .cursor/rules/ai-developer-collaboration-rules.mdc (신규)
* 확인 우선, 한 번에 하나, 철저한 마무리 원칙
* 데이터베이스 검증, 코드 수정, 테스트, 커뮤니케이션 규칙
- .cursorrules
* 필수 확인 규칙 섹션 추가
* 모든 작업 시작/완료 시 협업 규칙 확인 강제화
- 채번 규칙 scope_type을 table로 단순화
- 화면의 테이블명을 자동으로 감지하여 채번 규칙 필터링
- TextInputConfigPanel에 screenTableName prop 추가
- getAvailableNumberingRulesForScreen API로 테이블 기반 조회
- NumberingRuleDesigner에서 자동으로 테이블명 설정
- webTypeConfigConverter 유틸리티 추가 (기존 화면 호환성)
- AutoGenerationConfig 타입 개선 (enabled, options.numberingRuleId)
- 채번 규칙 선택 UI에서 ID 제거, 설명 추가
- 불필요한 console.log 제거
Backend:
- numberingRuleService: 테이블 기반 필터링 로직 구현
- numberingRuleController: available-for-screen 엔드포인트 수정
Frontend:
- TextInputConfigPanel: 테이블명 기반 채번 규칙 로드
- NumberingRuleDesigner: 적용 범위 UI 제거, 테이블명 자동 설정
- ScreenDesigner: webTypeConfig → autoGeneration 변환 로직 통합
- DetailSettingsPanel: autoGeneration 속성 매핑 개선
- 카테고리 타입 컬럼이 테이블 리스트/플로우 위젯에서 코드값 대신 라벨로 표시되도록 수정
- InteractiveDataTable: categoryMappings 상태 추가 및 formatCellValue에서 카테고리 라벨 변환
- FlowWidget: categoryMappings 상태 추가 및 formatValue에서 카테고리 라벨 변환
- TableListComponent: categoryMappings 상태 추가 및 formatCellValue에서 카테고리 라벨 변환
- FlowWidget 런타임 에러 수정
- formatValue 함수를 categoryMappings 상태 선언 이후로 이동
- useCallback 의존성 배열 오류 해결
- Dialog 컴포넌트 빌드 오류 수정
- CopyScreenModal: DialogFooter → ResizableDialogFooter 태그 일치
- MenuAssignmentModal: 모든 Dialog 컴포넌트를 ResizableDialog 버전으로 변경
- Dialog → ResizableDialog
- DialogContent → ResizableDialogContent
- DialogFooter → ResizableDialogFooter
- DialogHeader → ResizableDialogHeader
- DialogTitle → ResizableDialogTitle
- DialogDescription → ResizableDialogDescription
- 불필요한 console.log 제거
- InteractiveDataTable, FlowWidget, TableListComponent에서 디버깅 로그 정리
- 문제: 높이 입력 시 10 단위로만 입력 가능 (예: 1080 입력 불가)
- 원인: 격자 스냅 로직이 onChange마다 높이를 10/20 단위로 강제 반올림
- 해결:
1. 모든 number input 필드에 step="1" 추가
2. ScreenDesigner.tsx의 격자 스냅 로직 수정 (높이 스냅 제거)
3. UnifiedPropertiesPanel.tsx에 로컬 상태 추가하여 입력 중 스냅 방지
4. onBlur/Enter 시에만 실제 값 업데이트
수정 파일:
- frontend/components/screen/ScreenDesigner.tsx
- frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
- frontend/components/screen/panels/PropertiesPanel.tsx
- frontend/components/screen/panels/ResolutionPanel.tsx
- frontend/components/screen/panels/RowSettingsPanel.tsx
- frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx
- frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx
; Please enter a commit message to explain why this merge is necessary,
; especially if it merges an updated upstream into a topic branch.
;
; Lines starting with ';' will be ignored, and an empty message aborts
; the commit.
leeheejin
SeongHyun Kim
kjs
hjlee
dohyeons