From 4cdc72e360d7a84cb88738228a9ee76fd9b205f6 Mon Sep 17 00:00:00 2001 From: kjs Date: Wed, 12 Nov 2025 15:12:12 +0900 Subject: [PATCH] =?UTF-8?q?=EB=A1=9C=EA=B7=B8=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/(main)/screens/[screenId]/page.tsx | 26 +++--- .../screen/table-options/FilterPanel.tsx | 26 +++++- .../TableSearchWidgetHeightContext.tsx | 7 -- .../table-search-widget/TableSearchWidget.tsx | 87 +------------------ 4 files changed, 35 insertions(+), 111 deletions(-) diff --git a/frontend/app/(main)/screens/[screenId]/page.tsx b/frontend/app/(main)/screens/[screenId]/page.tsx index e4d8c618..ebfbd3e7 100644 --- a/frontend/app/(main)/screens/[screenId]/page.tsx +++ b/frontend/app/(main)/screens/[screenId]/page.tsx @@ -397,6 +397,11 @@ function ScreenViewPage() { const regularComponents = topLevelComponents.filter((c) => !processedButtonIds.has(c.id)); + // TableSearchWidget들을 먼저 찾기 + const tableSearchWidgets = regularComponents.filter( + (c) => (c as any).componentId === "table-search-widget" + ); + // TableSearchWidget 높이 차이를 계산하여 Y 위치 조정 const adjustedComponents = regularComponents.map((component) => { const isTableSearchWidget = (component as any).componentId === "table-search-widget"; @@ -406,26 +411,15 @@ function ScreenViewPage() { return component; } - // TableSearchWidget들을 찾아서 해당 위젯 아래에 있는지 확인 - const tableSearchWidgets = regularComponents.filter( - (c) => (c as any).componentId === "table-search-widget" - ); - let totalHeightAdjustment = 0; for (const widget of tableSearchWidgets) { // 현재 컴포넌트가 이 위젯 아래에 있는지 확인 - if (component.position.y > widget.position.y) { - const heightDiff = getHeightDiff(screenId, widget.id); - if (heightDiff > 0) { - totalHeightAdjustment += heightDiff; - console.log("📏 [ScreenView] 컴포넌트 위치 조정:", { - componentId: component.id, - originalY: component.position.y, - adjustment: heightDiff, - newY: component.position.y + heightDiff, - }); - } + const isBelow = component.position.y > widget.position.y; + const heightDiff = getHeightDiff(screenId, widget.id); + + if (isBelow && heightDiff > 0) { + totalHeightAdjustment += heightDiff; } } diff --git a/frontend/components/screen/table-options/FilterPanel.tsx b/frontend/components/screen/table-options/FilterPanel.tsx index b0ce4e00..4688bb18 100644 --- a/frontend/components/screen/table-options/FilterPanel.tsx +++ b/frontend/components/screen/table-options/FilterPanel.tsx @@ -206,12 +206,30 @@ export const FilterPanel: React.FC = ({ isOpen, onClose, onFiltersApplied onClose(); }; - // 초기화 + // 초기화 (즉시 저장 및 적용) const clearFilters = () => { - setColumnFilters((prev) => - prev.map((filter) => ({ ...filter, enabled: false })) - ); + const clearedFilters = columnFilters.map((filter) => ({ + ...filter, + enabled: false + })); + + setColumnFilters(clearedFilters); setSelectAll(false); + + // localStorage에서 제거 + if (table?.tableName) { + const storageKey = `table_filters_${table.tableName}`; + localStorage.removeItem(storageKey); + } + + // 빈 필터 배열로 적용 + table?.onFilterChange([]); + + // 콜백으로 빈 필터 정보 전달 + onFiltersApplied?.([]); + + // 즉시 닫기 + onClose(); }; const enabledCount = columnFilters.filter((f) => f.enabled).length; diff --git a/frontend/contexts/TableSearchWidgetHeightContext.tsx b/frontend/contexts/TableSearchWidgetHeightContext.tsx index e5c82007..d61d247a 100644 --- a/frontend/contexts/TableSearchWidgetHeightContext.tsx +++ b/frontend/contexts/TableSearchWidgetHeightContext.tsx @@ -36,13 +36,6 @@ export function TableSearchWidgetHeightProvider({ children }: { children: React. originalHeight, }); - console.log("📏 [TableSearchWidgetHeightContext] 높이 저장:", { - key, - height, - originalHeight, - heightDiff: height - originalHeight, - }); - return newMap; }); }, diff --git a/frontend/lib/registry/components/table-search-widget/TableSearchWidget.tsx b/frontend/lib/registry/components/table-search-widget/TableSearchWidget.tsx index b9a4839d..2b37e2d6 100644 --- a/frontend/lib/registry/components/table-search-widget/TableSearchWidget.tsx +++ b/frontend/lib/registry/components/table-search-widget/TableSearchWidget.tsx @@ -130,56 +130,27 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table return; } - console.log("🔄 [TableSearchWidget] select 옵션 초기 로드:", { - activeFiltersCount: activeFilters.length, - selectFiltersCount: selectFilters.length, - dataCount: currentTable.dataCount, - }); - const newOptions: Record> = { ...selectOptions }; for (const filter of selectFilters) { // 이미 로드된 옵션이 있으면 스킵 (초기값 유지) if (newOptions[filter.columnName] && newOptions[filter.columnName].length > 0) { - console.log("⏭️ [TableSearchWidget] 이미 로드된 옵션 스킵:", filter.columnName); continue; } try { const options = await currentTable.getColumnUniqueValues(filter.columnName); newOptions[filter.columnName] = options; - console.log("✅ [TableSearchWidget] select 옵션 로드:", { - columnName: filter.columnName, - optionCount: options.length, - options: options.slice(0, 5), - }); } catch (error) { console.error("❌ [TableSearchWidget] select 옵션 로드 실패:", filter.columnName, error); } } - - console.log("✅ [TableSearchWidget] 최종 selectOptions:", newOptions); setSelectOptions(newOptions); }; loadSelectOptions(); }, [activeFilters, currentTable?.tableName, currentTable?.getColumnUniqueValues]); // dataCount 제거, tableName으로 변경 - // 디버깅: 현재 테이블 정보 로깅 - useEffect(() => { - if (currentTable) { - console.log("🔍 [TableSearchWidget] 현재 테이블 정보:", { - selectedTableId, - tableId: currentTable.tableId, - tableName: currentTable.tableName, - label: currentTable.label, - dataCount: currentTable.dataCount, - hasDataCount: currentTable.dataCount !== undefined, - }); - } else { - console.log("🔍 [TableSearchWidget] 테이블 없음:", { selectedTableId }); - } - }, [selectedTableId, currentTable?.dataCount]); // 높이 변화 감지 및 알림 (실제 화면에서만) useEffect(() => { @@ -192,14 +163,6 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table for (const entry of entries) { const newHeight = entry.contentRect.height; - console.log("📏 [TableSearchWidget] 높이 변화 감지:", { - screenId, - componentId: component.id, - originalHeight, - newHeight, - heightDiff: newHeight - originalHeight, - }); - // Context에 높이 저장 (다른 컴포넌트 위치 조정에 사용) setWidgetHeight(screenId, component.id, newHeight, originalHeight); @@ -234,14 +197,6 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table try { const { height, originalHeight } = JSON.parse(savedData); setWidgetHeight(screenId, component.id, height, originalHeight); - - console.log("📥 [TableSearchWidget] 저장된 높이 복원:", { - screenId, - componentId: component.id, - height, - originalHeight, - heightDiff: height - originalHeight, - }); } catch (error) { console.error("저장된 높이 복원 실패:", error); } @@ -252,12 +207,6 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table // 필터 값 변경 핸들러 const handleFilterChange = (columnName: string, value: string) => { - console.log("🔍 [TableSearchWidget] 필터 값 변경:", { - columnName, - value, - currentTable: currentTable?.tableId, - }); - const newValues = { ...filterValues, [columnName]: value, @@ -277,13 +226,6 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table value: values[filter.columnName] || "", })).filter((f) => f.value !== ""); - console.log("🔍 [TableSearchWidget] 필터 적용:", { - activeFilters: activeFilters.length, - filtersWithValues: filtersWithValues.length, - filters: filtersWithValues, - hasOnFilterChange: !!currentTable?.onFilterChange, - }); - currentTable?.onFilterChange(filtersWithValues); }; @@ -328,12 +270,6 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table case "select": { let options = selectOptions[filter.columnName] || []; - console.log("🔍 [renderFilterInput] select 렌더링:", { - columnName: filter.columnName, - selectOptions: selectOptions[filter.columnName], - optionsLength: options.length, - }); - // 현재 선택된 값이 옵션 목록에 없으면 추가 (데이터 없을 때도 선택값 유지) if (value && !options.find(opt => opt.value === value)) { const savedLabel = selectedLabels[filter.columnName] || value; @@ -348,14 +284,6 @@ export function TableSearchWidget({ component, screenId, onHeightChange }: Table return acc; }, [] as Array<{ value: string; label: string }>); - console.log("✅ [renderFilterInput] uniqueOptions:", { - columnName: filter.columnName, - originalOptionsLength: options.length, - uniqueOptionsLength: uniqueOptions.length, - originalOptions: options, - uniqueOptions: uniqueOptions, - }); - return (