이상한 부분 수정 피벗그리드
This commit is contained in:
parent
ab3a493abb
commit
8a865ac1f4
|
|
@ -526,11 +526,16 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
|
|||
});
|
||||
|
||||
return result;
|
||||
}, [filteredData, fields, pivotState.expandedRowPaths, pivotState.expandedColumnPaths]);
|
||||
}, [
|
||||
filteredData,
|
||||
fields,
|
||||
JSON.stringify(pivotState.expandedRowPaths),
|
||||
JSON.stringify(pivotState.expandedColumnPaths)
|
||||
]);
|
||||
|
||||
// 🆕 초기 로드 시 첫 레벨 자동 확장
|
||||
useEffect(() => {
|
||||
if (pivotResult && pivotResult.flatRows.length > 0) {
|
||||
if (pivotResult && pivotResult.flatRows.length > 0 && !isInitialExpanded) {
|
||||
console.log("🔶 피벗 결과 생성됨:", {
|
||||
flatRowsCount: pivotResult.flatRows.length,
|
||||
expandedRowPaths: pivotState.expandedRowPaths.length,
|
||||
|
|
@ -542,10 +547,10 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
|
|||
|
||||
console.log("🔶 첫 레벨 행 (level 0, hasChildren):", firstLevelRows.map(r => ({ path: r.path, caption: r.caption })));
|
||||
|
||||
// 초기 확장이 안 되어 있고, 첫 레벨 행이 있으면 자동 확장
|
||||
if (!isInitialExpanded && firstLevelRows.length > 0) {
|
||||
// 첫 레벨 행이 있으면 자동 확장
|
||||
if (firstLevelRows.length > 0) {
|
||||
const firstLevelPaths = firstLevelRows.map(row => row.path);
|
||||
console.log("🔶 초기 자동 확장 실행:", firstLevelPaths);
|
||||
console.log("🔶 초기 자동 확장 실행 (한 번만):", firstLevelPaths);
|
||||
setPivotState(prev => ({
|
||||
...prev,
|
||||
expandedRowPaths: firstLevelPaths,
|
||||
|
|
@ -553,7 +558,7 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
|
|||
setIsInitialExpanded(true);
|
||||
}
|
||||
}
|
||||
}, [pivotResult, isInitialExpanded, pivotState.expandedRowPaths.length]);
|
||||
}, [pivotResult, isInitialExpanded]);
|
||||
|
||||
// 조건부 서식용 전체 값 수집
|
||||
const allCellValues = useMemo(() => {
|
||||
|
|
@ -749,31 +754,61 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
|
|||
[onExpandChange]
|
||||
);
|
||||
|
||||
// 전체 확장
|
||||
// 전체 확장 (재귀적으로 모든 레벨 확장)
|
||||
const handleExpandAll = useCallback(() => {
|
||||
if (!pivotResult) return;
|
||||
if (!pivotResult) {
|
||||
console.log("❌ [handleExpandAll] pivotResult가 없음");
|
||||
return;
|
||||
}
|
||||
|
||||
// 🆕 재귀적으로 모든 가능한 경로 생성
|
||||
const allRowPaths: string[][] = [];
|
||||
pivotResult.flatRows.forEach((row) => {
|
||||
if (row.hasChildren) {
|
||||
allRowPaths.push(row.path);
|
||||
const rowFields = fields.filter((f) => f.area === "row" && f.visible !== false);
|
||||
|
||||
// 데이터에서 모든 고유한 경로 추출
|
||||
const pathSet = new Set<string>();
|
||||
filteredData.forEach((item) => {
|
||||
for (let depth = 1; depth <= rowFields.length; depth++) {
|
||||
const path = rowFields.slice(0, depth).map((f) => String(item[f.field] ?? ""));
|
||||
const pathKey = JSON.stringify(path);
|
||||
pathSet.add(pathKey);
|
||||
}
|
||||
});
|
||||
|
||||
// Set을 배열로 변환
|
||||
pathSet.forEach((pathKey) => {
|
||||
allRowPaths.push(JSON.parse(pathKey));
|
||||
});
|
||||
|
||||
console.log("🔷 [handleExpandAll] 확장할 행:", {
|
||||
totalRows: pivotResult.flatRows.length,
|
||||
rowsWithChildren: allRowPaths.length,
|
||||
paths: allRowPaths.slice(0, 5), // 처음 5개만 로그
|
||||
});
|
||||
|
||||
setPivotState((prev) => ({
|
||||
...prev,
|
||||
expandedRowPaths: allRowPaths,
|
||||
expandedColumnPaths: [],
|
||||
}));
|
||||
}, [pivotResult]);
|
||||
}, [pivotResult, fields, filteredData]);
|
||||
|
||||
// 전체 축소
|
||||
const handleCollapseAll = useCallback(() => {
|
||||
setPivotState((prev) => ({
|
||||
...prev,
|
||||
expandedRowPaths: [],
|
||||
expandedColumnPaths: [],
|
||||
}));
|
||||
console.log("🔷 [handleCollapseAll] 전체 축소 실행");
|
||||
|
||||
setPivotState((prev) => {
|
||||
console.log("🔷 [handleCollapseAll] 이전 상태:", {
|
||||
expandedRowPaths: prev.expandedRowPaths.length,
|
||||
expandedColumnPaths: prev.expandedColumnPaths.length,
|
||||
});
|
||||
|
||||
return {
|
||||
...prev,
|
||||
expandedRowPaths: [],
|
||||
expandedColumnPaths: [],
|
||||
};
|
||||
});
|
||||
}, []);
|
||||
|
||||
// 셀 클릭
|
||||
|
|
@ -1391,8 +1426,8 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
|
|||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-7 px-2"
|
||||
onClick={handleExpandAll}
|
||||
title="전체 확장"
|
||||
onClick={handleCollapseAll}
|
||||
title="전체 축소"
|
||||
>
|
||||
<ChevronDown className="h-4 w-4" />
|
||||
</Button>
|
||||
|
|
@ -1401,8 +1436,8 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
|
|||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-7 px-2"
|
||||
onClick={handleCollapseAll}
|
||||
title="전체 축소"
|
||||
onClick={handleExpandAll}
|
||||
title="전체 확장"
|
||||
>
|
||||
<ChevronRight className="h-4 w-4" />
|
||||
</Button>
|
||||
|
|
|
|||
Loading…
Reference in New Issue