DDD1542
2348800e68
Build & Deploy to K8s / build-and-deploy (push) Successful in 9m22s
카테고리/캐스케이딩 시스템 (B/C/D) 전부 폐기:
- BE: mapper/Service/Controller 9세트 삭제 (cascading*, categoryTree, tableCategoryValue, categoryValueCascading, codeMerge)
- FE: 페이지 3 + API 8 + hooks 2 + 폐기 컴포넌트 6 삭제, 14곳 의존성 정리
- DB: 12 테이블 DROP, TABLE_TYPE_COLUMNS.CODE_CATEGORY → CODE_INFO rename
신설 commonCode 마스터-디테일:
- code_info: 1레벨 그룹 마스터
- code_detail: 2~∞ depth 재귀 트리 (parent_detail_id self-FK, depth 자동 계산)
- API: /api/common-codes/{info,detail}
- CodeCategoryFormModal/Panel → CodeInfoFormModal/Panel rename
- code_category 컬럼명 전부 code_info 로 치환 (mapper/Java/FE)
- 옛 commonCode API URL (/categories/...) → getCodeOptions 어댑터 + /detail?code_info=... 전환
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
SplitPanelLayout2 컴포넌트
마스터-디테일 패턴의 좌우 분할 레이아웃 컴포넌트 (개선 버전)
개요
- ID:
split-panel-layout2 - 카테고리: layout
- 웹타입: container
- 버전: 2.0.0
주요 기능
- 좌측 패널: 마스터 데이터 목록 (예: 부서 목록)
- 우측 패널: 디테일 데이터 목록 (예: 부서원 목록)
- 조인 기반 데이터 연결
- 검색 기능 (좌측/우측 모두)
- 계층 구조 지원 (트리 형태)
- 데이터 전달 기능 (모달로 선택된 데이터 전달)
- 리사이즈 가능한 분할 바
사용 예시
부서-사원 관리
- 좌측 패널:
dept_info테이블 (부서 목록) - 우측 패널:
user_info테이블 (사원 목록) - 조인 조건:
dept_code=dept_code - 데이터 전달:
dept_code,dept_name,company_code
설정 옵션
좌측 패널 설정
| 속성 | 타입 | 설명 |
|---|---|---|
| title | string | 패널 제목 |
| tableName | string | 테이블명 |
| displayColumns | ColumnConfig[] | 표시할 컬럼 목록 |
| searchColumn | string | 검색 대상 컬럼 |
| showSearch | boolean | 검색 기능 표시 여부 |
| hierarchyConfig | object | 계층 구조 설정 |
우측 패널 설정
| 속성 | 타입 | 설명 |
|---|---|---|
| title | string | 패널 제목 |
| tableName | string | 테이블명 |
| displayColumns | ColumnConfig[] | 표시할 컬럼 목록 |
| searchColumn | string | 검색 대상 컬럼 |
| showSearch | boolean | 검색 기능 표시 여부 |
| showAddButton | boolean | 추가 버튼 표시 |
| showEditButton | boolean | 수정 버튼 표시 |
| showDeleteButton | boolean | 삭제 버튼 표시 |
조인 설정
| 속성 | 타입 | 설명 |
|---|---|---|
| leftColumn | string | 좌측 테이블의 조인 컬럼 |
| rightColumn | string | 우측 테이블의 조인 컬럼 |
데이터 전달 설정
| 속성 | 타입 | 설명 |
|---|---|---|
| sourceColumn | string | 좌측 패널의 소스 컬럼 |
| targetColumn | string | 모달로 전달할 타겟 컬럼명 |
데이터 흐름
[좌측 패널 항목 클릭]
↓
[selectedLeftItem 상태 저장]
↓
[modalDataStore에 테이블명으로 저장]
↓
[ScreenContext DataProvider 등록]
↓
[우측 패널 데이터 로드 (조인 조건 적용)]
버튼과 연동
버튼 컴포넌트에서 이 컴포넌트의 선택된 데이터에 접근하려면:
- 버튼의 액션 타입을
openModalWithData로 설정 - 데이터 소스 ID를 좌측 패널의 테이블명으로 설정 (예:
dept_info) modalDataStore에서 자동으로 데이터를 가져옴
개발자 정보
- 생성일: 2024
- 경로:
lib/registry/components/split-panel-layout2/