From 53ad72732f781e6c6d5ddb3776ea47aec010af8e Mon Sep 17 00:00:00 2001 From: dujinkim Date: Mon, 4 Aug 2025 09:39:21 +0000 Subject: (최겸) PQ/실사 수정 및 개발 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/pq/pq-review-table-new/pq-container.tsx | 300 ++++++++++++++-------------- 1 file changed, 150 insertions(+), 150 deletions(-) (limited to 'lib/pq/pq-review-table-new/pq-container.tsx') diff --git a/lib/pq/pq-review-table-new/pq-container.tsx b/lib/pq/pq-review-table-new/pq-container.tsx index ebe46809..01b7aab1 100644 --- a/lib/pq/pq-review-table-new/pq-container.tsx +++ b/lib/pq/pq-review-table-new/pq-container.tsx @@ -1,151 +1,151 @@ -"use client" - -import { useState, useEffect, useCallback, useRef } from "react" -import { useSearchParams } from "next/navigation" -import { Button } from "@/components/ui/button" -import { PanelLeftClose, PanelLeftOpen } from "lucide-react" - -import { cn } from "@/lib/utils" -import { getPQSubmissions } from "../service" -import { PQSubmissionsTable } from "./vendors-table" -import { PQFilterSheet } from "./pq-filter-sheet" - -interface PQContainerProps { - // Promise.all로 감싼 promises를 받음 - promises: Promise<[Awaited>]> - // 컨테이너 클래스명 (옵션) - className?: string -} - -export default function PQContainer({ - promises, - className -}: PQContainerProps) { - const searchParams = useSearchParams() - - // Whether the filter panel is open - const [isFilterPanelOpen, setIsFilterPanelOpen] = useState(false) - - // Container wrapper의 위치를 측정하기 위한 ref - const containerRef = useRef(null) - const [containerTop, setContainerTop] = useState(0) - - // Container 위치 측정 함수 - top만 측정 - const updateContainerBounds = useCallback(() => { - if (containerRef.current) { - const rect = containerRef.current.getBoundingClientRect() - setContainerTop(rect.top) - } - }, []) - - // 컴포넌트 마운트 시와 윈도우 리사이즈 시 위치 업데이트 - useEffect(() => { - updateContainerBounds() - - const handleResize = () => { - updateContainerBounds() - } - - window.addEventListener('resize', handleResize) - window.addEventListener('scroll', updateContainerBounds) - - return () => { - window.removeEventListener('resize', handleResize) - window.removeEventListener('scroll', updateContainerBounds) - } - }, [updateContainerBounds]) - - // 조회 버튼 클릭 핸들러 - PQFilterSheet에 전달 - const handleSearch = () => { - // Close the panel after search - setIsFilterPanelOpen(false) - } - - // Get active filter count for UI display (서버 사이드 필터만 계산) - const getActiveFilterCount = () => { - try { - // 새로운 이름 우선, 기존 이름도 지원 - const basicFilters = searchParams.get('basicFilters') || searchParams.get('pqBasicFilters') - return basicFilters ? JSON.parse(basicFilters).length : 0 - } catch (e) { - return 0 - } - } - - // Filter panel width - const FILTER_PANEL_WIDTH = 400; - - return ( - <> - {/* Filter Panel - fixed positioning으로 화면 최대 좌측에서 시작 */} -
- {/* Filter Content */} -
- setIsFilterPanelOpen(false)} - onSearch={handleSearch} - isLoading={false} // 로딩 상태 제거 - /> -
-
- - {/* Main Content Container */} -
-
- {/* Main Content - 너비 조정으로 필터 패널 공간 확보 */} -
- {/* Header Bar */} -
-
- -
-
- - {/* Table Content Area */} -
-
- {/* Promise를 직접 전달 - Items와 동일한 패턴 */} - -
-
-
-
-
- - ) +"use client" + +import { useState, useEffect, useCallback, useRef } from "react" +import { useSearchParams } from "next/navigation" +import { Button } from "@/components/ui/button" +import { PanelLeftClose, PanelLeftOpen } from "lucide-react" + +import { cn } from "@/lib/utils" +import { getPQSubmissions } from "../service" +import { PQSubmissionsTable } from "./vendors-table" +import { PQFilterSheet } from "./pq-filter-sheet" + +interface PQContainerProps { + // Promise.all로 감싼 promises를 받음 + promises: Promise<[Awaited>]> + // 컨테이너 클래스명 (옵션) + className?: string +} + +export default function PQContainer({ + promises, + className +}: PQContainerProps) { + const searchParams = useSearchParams() + + // Whether the filter panel is open + const [isFilterPanelOpen, setIsFilterPanelOpen] = useState(false) + + // Container wrapper의 위치를 측정하기 위한 ref + const containerRef = useRef(null) + const [containerTop, setContainerTop] = useState(0) + + // Container 위치 측정 함수 - top만 측정 + const updateContainerBounds = useCallback(() => { + if (containerRef.current) { + const rect = containerRef.current.getBoundingClientRect() + setContainerTop(rect.top) + } + }, []) + + // 컴포넌트 마운트 시와 윈도우 리사이즈 시 위치 업데이트 + useEffect(() => { + updateContainerBounds() + + const handleResize = () => { + updateContainerBounds() + } + + window.addEventListener('resize', handleResize) + window.addEventListener('scroll', updateContainerBounds) + + return () => { + window.removeEventListener('resize', handleResize) + window.removeEventListener('scroll', updateContainerBounds) + } + }, [updateContainerBounds]) + + // 조회 버튼 클릭 핸들러 - PQFilterSheet에 전달 + const handleSearch = () => { + // Close the panel after search + setIsFilterPanelOpen(false) + } + + // Get active filter count for UI display (서버 사이드 필터만 계산) + const getActiveFilterCount = () => { + try { + // 새로운 이름 우선, 기존 이름도 지원 + const basicFilters = searchParams.get('basicFilters') || searchParams.get('pqBasicFilters') + return basicFilters ? JSON.parse(basicFilters).length : 0 + } catch (e) { + return 0 + } + } + + // Filter panel width + const FILTER_PANEL_WIDTH = 400; + + return ( + <> + {/* Filter Panel - fixed positioning으로 화면 최대 좌측에서 시작 */} +
+ {/* Filter Content */} +
+ setIsFilterPanelOpen(false)} + onSearch={handleSearch} + isLoading={false} // 로딩 상태 제거 + /> +
+
+ + {/* Main Content Container */} +
+
+ {/* Main Content - 너비 조정으로 필터 패널 공간 확보 */} +
+ {/* Header Bar */} +
+
+ +
+
+ + {/* Table Content Area */} +
+
+ {/* Promise를 직접 전달 - Items와 동일한 패턴 */} + +
+
+
+
+
+ + ) } \ No newline at end of file -- cgit v1.2.3