Files
invyone/frontend/types/repeater.ts
T

200 lines
7.4 KiB
TypeScript

/**
* 반복 필드 그룹(Repeater) 타입 정의
*/
/**
* 테이블 타입 관리(table_type_columns)에서 사용하는 input_type 값들
*/
export type RepeaterFieldType =
| "text" // 텍스트
| "number" // 숫자
| "textarea" // 텍스트영역
| "date" // 날짜
| "select" // 선택박스
| "checkbox" // 체크박스
| "radio" // 라디오
| "category" // 카테고리
| "entity" // 엔티티 참조
| "code" // 공통코드
| "image" // 이미지
| "direct" // 직접입력
| "calculated" // 계산식 필드
| string; // 기타 커스텀 타입 허용
/**
* 계산식 연산자
*/
export type CalculationOperator = "+" | "-" | "*" | "/" | "%" | "round" | "floor" | "ceil" | "abs";
/**
* 계산식 정의
* 예: { field1: "order_qty", operator: "*", field2: "unit_price" } → order_qty * unit_price
* 예: { field1: "amount", operator: "round", decimal_places: 2 } → round(amount, 2)
*/
export interface CalculationFormula {
field1: string; // 첫 번째 필드명
operator: CalculationOperator; // 연산자
field2?: string; // 두 번째 필드명 (단항 연산자의 경우 불필요)
constant_value?: number; // 상수값 (field2 대신 사용 가능)
decimal_places?: number; // 소수점 자릿수 (round, floor, ceil에서 사용)
}
/**
* 필드 표시 모드
* - input: 입력 필드로 표시 (편집 가능)
* - readonly: 읽기 전용 텍스트로 표시
* - hidden: 숨김 (UI에 표시되지 않지만 데이터에 포함됨)
* - (카테고리 타입은 자동으로 배지로 표시됨)
*/
export type RepeaterFieldDisplayMode = "input" | "readonly" | "hidden";
/**
* 하위 데이터 조회 소스 설정
* 필드 값을 하위 데이터 조회 결과에서 가져올 때 사용
*/
export interface SubDataSourceConfig {
enabled: boolean; // 활성화 여부
source_column: string; // 하위 데이터 조회 테이블의 소스 컬럼 (예: lot_number)
}
/**
* 반복 그룹 내 개별 필드 정의
*/
export interface RepeaterFieldDefinition {
name: string; // 필드 이름 (키)
label: string; // 필드 라벨
type: RepeaterFieldType; // 입력 타입
placeholder?: string;
required?: boolean;
readonly?: boolean; // 읽기 전용 여부
options?: Array<{ label: string; value: string }>; // select용
width?: string; // 필드 너비 (예: "200px", "50%")
display_mode?: RepeaterFieldDisplayMode; // 표시 모드: input(입력), readonly(읽기전용)
is_hidden?: boolean; // 숨김 여부 (true면 테이블에 표시 안 함, 데이터는 저장)
sub_data_source?: SubDataSourceConfig; // 하위 데이터 조회에서 값 가져오기 설정
category_code?: string; // category 타입일 때 사용할 카테고리 코드
formula?: CalculationFormula; // 계산식 (type이 "calculated"일 때 사용)
number_format?: {
use_thousand_separator?: boolean; // 천 단위 구분자 사용
prefix?: string; // 접두사 (예: "₩")
suffix?: string; // 접미사 (예: "원")
decimal_places?: number; // 소수점 자릿수
};
validation?: {
min_length?: number;
max_length?: number;
min?: number;
max?: number;
pattern?: string;
};
}
/**
* 반복 필드 그룹 설정
*/
export interface RepeaterFieldGroupConfig {
fields: RepeaterFieldDefinition[]; // 반복될 필드 정의
target_table?: string; // 저장할 대상 테이블 (미지정 시 메인 화면 테이블)
group_by_column?: string; // 수정 모드에서 그룹화할 컬럼 (예: "inbound_number")
fk_column?: string; // 분할 패널에서 좌측 선택 데이터와 연결할 FK 컬럼 (예: "serial_no")
min_items?: number; // 최소 항목 수
max_items?: number; // 최대 항목 수
add_button_text?: string; // 추가 버튼 텍스트
remove_button_text?: string; // 제거 버튼 텍스트 (보통 아이콘)
allow_reorder?: boolean; // 순서 변경 가능 여부
show_index?: boolean; // 인덱스 번호 표시 여부
collapsible?: boolean; // 각 항목을 접을 수 있는지 (카드 모드일 때만)
layout?: "grid" | "card"; // 레이아웃 타입: grid(테이블 행) 또는 card(카드 형식)
show_divider?: boolean; // 항목 사이 구분선 표시 (카드 모드일 때만)
empty_message?: string; // 항목이 없을 때 메시지
sub_data_lookup?: SubDataLookupConfig; // 하위 데이터 조회 설정 (재고, 단가 등)
}
/**
* 반복 그룹 항목 데이터
*/
export type RepeaterItemData = Record<string, any>;
/**
* 반복 그룹 전체 데이터 (배열)
*/
export type RepeaterData = RepeaterItemData[];
// ============================================================
// 하위 데이터 조회 설정 (Sub Data Lookup)
// 품목 선택 시 재고/단가 등 관련 데이터를 조회하고 선택하는 기능
// ============================================================
/**
* 선택 데이터 필드 매핑 설정
*/
export interface SubDataFieldMapping {
source_column: string; // 조회 테이블 컬럼 (예: lot_number)
target_field: string; // 저장 테이블 컬럼 (예: lot_number) 또는 "" (선택안함)
}
/**
* 하위 데이터 조회 테이블 설정
*/
export interface SubDataLookupSettings {
table_name: string; // 조회할 테이블 (예: inventory, price_list)
link_column: string; // 상위 데이터와 연결할 컬럼 (예: item_code)
display_columns: string[]; // 표시할 컬럼들 (예: ["warehouse_code", "location_code", "quantity"])
column_labels?: Record<string, string>; // 컬럼 라벨 (예: { warehouse_code: "창고" })
column_order?: string[]; // 컬럼 표시 순서 (없으면 display_columns 순서 사용)
field_mappings?: SubDataFieldMapping[]; // 선택 데이터 저장 매핑 (조회 컬럼 → 저장 컬럼)
additional_filters?: Record<string, any>; // 추가 필터 조건
}
/**
* 하위 데이터 선택 설정
*/
export interface SubDataSelectionSettings {
mode: "single" | "multiple"; // 단일/다중 선택
required_fields: string[]; // 필수 선택 필드 (예: ["warehouse_code"])
required_mode?: "any" | "all"; // 필수 조건: "any" = 하나만, "all" = 모두 (기본: "all")
}
/**
* 조건부 입력 활성화 설정
*/
export interface ConditionalInputSettings {
target_field: string; // 활성화할 입력 필드 (예: "outbound_qty")
max_value_field?: string; // 최대값 참조 필드 (예: "quantity" - 재고 수량)
warning_threshold?: number; // 경고 임계값 (퍼센트, 예: 90)
error_message?: string; // 에러 메시지
}
/**
* 하위 데이터 UI 설정
*/
export interface SubDataUISettings {
expand_mode: "inline" | "modal"; // 확장 방식 (인라인 또는 모달)
max_height?: string; // 최대 높이 (예: "150px")
show_summary?: boolean; // 요약 정보 표시
empty_message?: string; // 데이터 없을 때 메시지
}
/**
* 하위 데이터 조회 전체 설정
*/
export interface SubDataLookupConfig {
enabled: boolean; // 기능 활성화 여부
lookup: SubDataLookupSettings; // 조회 설정
selection: SubDataSelectionSettings; // 선택 설정
conditional_input: ConditionalInputSettings; // 조건부 입력 설정
ui?: SubDataUISettings; // UI 설정
}
/**
* 하위 데이터 상태 (런타임)
*/
export interface SubDataState {
item_index: number; // 상위 항목 인덱스
data: any[]; // 조회된 하위 데이터
selected_item: any | null; // 선택된 하위 항목
is_loading: boolean; // 로딩 상태
error: string | null; // 에러 메시지
is_expanded: boolean; // 확장 상태
}