feat(repeater): 하위 데이터 조회 및 조건부 입력 기능 구현, 테이블 선택 데이터 동기화 개선

Repeater 컴포넌트에 하위 데이터 조회 기능 추가 (재고/단가 조회)
조건부 입력 활성화 및 최대값 제한 기능 구현
필드 정의 순서 변경 기능 추가 (드래그앤드롭, 화살표 버튼)
TableListComponent의 DataProvider 클로저 문제 해결
ButtonPrimaryComponent에 modalDataStore fallback 로직 추가
This commit is contained in:
SeongHyun Kim
2026-01-15 10:35:34 +09:00
parent ca73685bc2
commit 2e02ace388
7 changed files with 1733 additions and 117 deletions

View File

@@ -95,6 +95,7 @@ export interface RepeaterFieldGroupConfig {
layout?: "grid" | "card"; // 레이아웃 타입: grid(테이블 행) 또는 card(카드 형식)
showDivider?: boolean; // 항목 사이 구분선 표시 (카드 모드일 때만)
emptyMessage?: string; // 항목이 없을 때 메시지
subDataLookup?: SubDataLookupConfig; // 하위 데이터 조회 설정 (재고, 단가 등)
}
/**
@@ -106,3 +107,71 @@ export type RepeaterItemData = Record<string, any>;
* 반복 그룹 전체 데이터 (배열)
*/
export type RepeaterData = RepeaterItemData[];
// ============================================================
// 하위 데이터 조회 설정 (Sub Data Lookup)
// 품목 선택 시 재고/단가 등 관련 데이터를 조회하고 선택하는 기능
// ============================================================
/**
* 하위 데이터 조회 테이블 설정
*/
export interface SubDataLookupSettings {
tableName: string; // 조회할 테이블 (예: inventory, price_list)
linkColumn: string; // 상위 데이터와 연결할 컬럼 (예: item_code)
displayColumns: string[]; // 표시할 컬럼들 (예: ["warehouse_code", "location_code", "quantity"])
columnLabels?: Record<string, string>; // 컬럼 라벨 (예: { warehouse_code: "창고" })
additionalFilters?: Record<string, any>; // 추가 필터 조건
}
/**
* 하위 데이터 선택 설정
*/
export interface SubDataSelectionSettings {
mode: "single" | "multiple"; // 단일/다중 선택
requiredFields: string[]; // 필수 선택 필드 (예: ["warehouse_code"])
requiredMode?: "any" | "all"; // 필수 조건: "any" = 하나만, "all" = 모두 (기본: "all")
}
/**
* 조건부 입력 활성화 설정
*/
export interface ConditionalInputSettings {
targetField: string; // 활성화할 입력 필드 (예: "outbound_qty")
maxValueField?: string; // 최대값 참조 필드 (예: "quantity" - 재고 수량)
warningThreshold?: number; // 경고 임계값 (퍼센트, 예: 90)
errorMessage?: string; // 에러 메시지
}
/**
* 하위 데이터 UI 설정
*/
export interface SubDataUISettings {
expandMode: "inline" | "modal"; // 확장 방식 (인라인 또는 모달)
maxHeight?: string; // 최대 높이 (예: "150px")
showSummary?: boolean; // 요약 정보 표시
emptyMessage?: string; // 데이터 없을 때 메시지
}
/**
* 하위 데이터 조회 전체 설정
*/
export interface SubDataLookupConfig {
enabled: boolean; // 기능 활성화 여부
lookup: SubDataLookupSettings; // 조회 설정
selection: SubDataSelectionSettings; // 선택 설정
conditionalInput: ConditionalInputSettings; // 조건부 입력 설정
ui?: SubDataUISettings; // UI 설정
}
/**
* 하위 데이터 상태 (런타임)
*/
export interface SubDataState {
itemIndex: number; // 상위 항목 인덱스
data: any[]; // 조회된 하위 데이터
selectedItem: any | null; // 선택된 하위 항목
isLoading: boolean; // 로딩 상태
error: string | null; // 에러 메시지
isExpanded: boolean; // 확장 상태
}