분할패널 설정변경

This commit is contained in:
kjs
2026-01-08 15:56:06 +09:00
parent 9821afe9cd
commit 4dfa82d3dd
6 changed files with 392 additions and 229 deletions

View File

@@ -830,7 +830,8 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
size: 1,
});
const detail = result.items && result.items.length > 0 ? result.items[0] : null;
// result.data가 EntityJoinResponse의 실제 배열 필드
const detail = result.data && result.data.length > 0 ? result.data[0] : null;
setRightData(detail);
} else if (relationshipType === "join") {
// 조인 모드: 다른 테이블의 관련 데이터 (여러 개)
@@ -899,16 +900,54 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
return;
}
// 🆕 복합키 지원
if (keys && keys.length > 0 && leftTable) {
// 🆕 엔티티 관계 자동 감지 로직 개선
// 1. 설정된 keys가 있으면 사용
// 2. 없으면 테이블 타입관리에서 정의된 엔티티 관계를 자동으로 조회
let effectiveKeys = keys || [];
if (effectiveKeys.length === 0 && leftTable && rightTableName) {
// 엔티티 관계 자동 감지
console.log("🔍 [분할패널] 엔티티 관계 자동 감지 시작:", leftTable, "->", rightTableName);
const { tableManagementApi } = await import("@/lib/api/tableManagement");
const relResponse = await tableManagementApi.getTableEntityRelations(leftTable, rightTableName);
if (relResponse.success && relResponse.data?.relations && relResponse.data.relations.length > 0) {
effectiveKeys = relResponse.data.relations.map((rel) => ({
leftColumn: rel.leftColumn,
rightColumn: rel.rightColumn,
}));
console.log("✅ [분할패널] 자동 감지된 관계:", effectiveKeys);
}
}
if (effectiveKeys.length > 0 && leftTable) {
// 복합키: 여러 조건으로 필터링
const { entityJoinApi } = await import("@/lib/api/entityJoin");
// 복합키 조건 생성
// 복합키 조건 생성 (다중 값 지원)
// 🆕 항상 배열로 전달하여 백엔드에서 다중 값 컬럼 검색을 지원하도록 함
// 예: 좌측에서 "2"를 선택해도, 우측에서 "2,3"을 가진 행이 표시되도록
const searchConditions: Record<string, any> = {};
keys.forEach((key) => {
effectiveKeys.forEach((key) => {
if (key.leftColumn && key.rightColumn && leftItem[key.leftColumn] !== undefined) {
searchConditions[key.rightColumn] = leftItem[key.leftColumn];
const leftValue = leftItem[key.leftColumn];
// 다중 값 지원: 모든 값을 배열로 변환하여 다중 값 컬럼 검색 활성화
if (typeof leftValue === "string") {
if (leftValue.includes(",")) {
// "2,3" 형태면 분리해서 배열로
const values = leftValue.split(",").map((v: string) => v.trim()).filter((v: string) => v);
searchConditions[key.rightColumn] = values;
console.log("🔗 [분할패널] 다중 값 검색 (분리):", key.rightColumn, "=", values);
} else {
// 단일 값도 배열로 변환 (우측에 "2,3" 같은 다중 값이 있을 수 있으므로)
searchConditions[key.rightColumn] = [leftValue.trim()];
console.log("🔗 [분할패널] 다중 값 검색 (단일):", key.rightColumn, "=", [leftValue.trim()]);
}
} else {
// 숫자나 다른 타입은 배열로 감싸기
searchConditions[key.rightColumn] = [leftValue];
console.log("🔗 [분할패널] 다중 값 검색 (기타):", key.rightColumn, "=", [leftValue]);
}
}
});
@@ -947,7 +986,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
setRightData(filteredData);
} else {
// 단일키 (하위 호환성)
// 단일키 (하위 호환성) 또는 관계를 찾지 못한 경우
const leftColumn = componentConfig.rightPanel?.relation?.leftColumn;
const rightColumn = componentConfig.rightPanel?.relation?.foreignKey;
@@ -965,6 +1004,9 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
componentConfig.rightPanel?.deduplication, // 🆕 중복 제거 설정 전달
);
setRightData(joinedData || []); // 모든 관련 레코드 (배열)
} else {
console.warn("⚠️ [분할패널] 테이블 관계를 찾을 수 없습니다:", leftTable, "->", rightTableName);
setRightData([]);
}
}
}