feat(modal-repeater-table): 컬럼 매핑 및 계산 규칙 UI 대폭 개선
새로운 기능 - 컬럼별 독립적인 소스 테이블 선택 기능 - SourceColumnSelector, ReferenceColumnSelector 컴포넌트 추가 - 계산 규칙 자동 동기화 로직 (cleanupInitialConfig) UI/UX 개선 - 컬럼 설정 UI를 세로 레이아웃으로 재구성 (h-10 통일) - 매핑 타입별 색상 구분 (파란색/보라색/초록색) - 계산 규칙 섹션 재디자인 (안내 박스, 번호 배지, 빈 상태) - 현재 설정 시각화 (코드 스타일 표시) 버그 수정 - 계산 규칙 삭제 시 컬럼이 수정 불가능 상태로 남는 문제 해결 - 결과 필드 변경 시 이전 필드의 calculated 속성 제거 - 초기 로드 시 계산 규칙과 컬럼 속성 동기화 개선 사항 - 모든 입력 필드의 높이와 텍스트 크기 일관성 확보 - 섹션별 명확한 제목과 설명 추가 - 접근성 향상 (ARIA 레이블, 포커스 스타일)
This commit is contained in:
@@ -128,20 +128,56 @@ export function ModalRepeaterTableComponent({
|
||||
|
||||
const handleAddItems = (items: any[]) => {
|
||||
console.log("➕ handleAddItems 호출:", items.length, "개 항목");
|
||||
console.log("📋 소스 데이터:", items);
|
||||
|
||||
// 매핑 규칙에 따라 데이터 변환
|
||||
const mappedItems = items.map((sourceItem) => {
|
||||
const newItem: any = {};
|
||||
|
||||
// 기본값 적용
|
||||
const itemsWithDefaults = items.map((item) => {
|
||||
const newItem = { ...item };
|
||||
columns.forEach((col) => {
|
||||
console.log(`🔄 컬럼 "${col.field}" 매핑 처리:`, col.mapping);
|
||||
|
||||
// 1. 매핑 규칙이 있는 경우
|
||||
if (col.mapping) {
|
||||
if (col.mapping.type === "source") {
|
||||
// 소스 테이블 컬럼에서 복사
|
||||
const sourceField = col.mapping.sourceField;
|
||||
if (sourceField && sourceItem[sourceField] !== undefined) {
|
||||
newItem[col.field] = sourceItem[sourceField];
|
||||
console.log(` ✅ 소스 복사: ${sourceField} → ${col.field}:`, newItem[col.field]);
|
||||
} else {
|
||||
console.warn(` ⚠️ 소스 필드 "${sourceField}" 값이 없음`);
|
||||
}
|
||||
} else if (col.mapping.type === "reference") {
|
||||
// 외부 테이블 참조 (TODO: API 호출 필요)
|
||||
console.log(` ⏳ 참조 조회 필요: ${col.mapping.referenceTable}.${col.mapping.referenceField}`);
|
||||
// 현재는 빈 값으로 설정 (나중에 API 호출로 구현)
|
||||
newItem[col.field] = undefined;
|
||||
} else if (col.mapping.type === "manual") {
|
||||
// 사용자 입력 (빈 값)
|
||||
newItem[col.field] = undefined;
|
||||
console.log(` ✏️ 수동 입력 필드`);
|
||||
}
|
||||
}
|
||||
// 2. 매핑 규칙이 없는 경우 - 소스 데이터에서 같은 필드명으로 복사
|
||||
else if (sourceItem[col.field] !== undefined) {
|
||||
newItem[col.field] = sourceItem[col.field];
|
||||
console.log(` 📝 직접 복사: ${col.field}:`, newItem[col.field]);
|
||||
}
|
||||
|
||||
// 3. 기본값 적용
|
||||
if (col.defaultValue !== undefined && newItem[col.field] === undefined) {
|
||||
newItem[col.field] = col.defaultValue;
|
||||
console.log(` 🎯 기본값 적용: ${col.field}:`, col.defaultValue);
|
||||
}
|
||||
});
|
||||
|
||||
console.log("📦 변환된 항목:", newItem);
|
||||
return newItem;
|
||||
});
|
||||
|
||||
// 계산 필드 업데이트
|
||||
const calculatedItems = calculateAll(itemsWithDefaults);
|
||||
const calculatedItems = calculateAll(mappedItems);
|
||||
|
||||
// 기존 데이터에 추가
|
||||
const newData = [...value, ...calculatedItems];
|
||||
|
||||
Reference in New Issue
Block a user