blob: 0a1a4a5690fd50f6bf7c88358c5ebf493e917636 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
|
"use client"
import { useState } from "react"
// shadcn/ui components
import {
ResizablePanelGroup,
ResizablePanel,
ResizableHandle,
} from "@/components/ui/resizable"
import { cn } from "@/lib/utils"
import StageList from "./StageList"
import RevisionForm from "./RevisionForm"
import { getVendorDocumentLists } from "@/lib/vendor-document/service"
import { VendorDocumentsView } from "@/db/schema/vendorDocu"
import { DocumentListTable } from "@/lib/vendor-document/table/doc-table"
import StageSHIList from "./StageListfromSHI"
interface DocumentContainerProps {
promises: Promise<[Awaited<ReturnType<typeof getVendorDocumentLists>>]>
selectedPackageId: number
}
export default function DocumentContainer({
promises,
selectedPackageId
}: DocumentContainerProps) {
// 선택된 문서를 이 state로 관리
const [selectedDocument, setSelectedDocument] = useState<VendorDocumentsView | null>(null)
// 패널 collapse 상태
const [isTopCollapsed, setIsTopCollapsed] = useState(false)
const [isBottomLeftCollapsed, setIsBottomLeftCollapsed] = useState(false)
const [isBottomRightCollapsed, setIsBottomRightCollapsed] = useState(false)
// 문서 선택 핸들러
const handleSelectDocument = (document: VendorDocumentsView | null) => {
setSelectedDocument(document)
}
return (
// 명시적 높이 지정
<div className="h-[calc(100vh-100px)] w-full">
<ResizablePanelGroup direction="vertical" className="h-full w-full">
{/* 상단 패널 (문서 리스트 영역) */}
<ResizablePanel
defaultSize={65}
minSize={15}
maxSize={95}
collapsible
collapsedSize={10}
onCollapse={() => setIsTopCollapsed(true)}
onExpand={() => setIsTopCollapsed(false)}
className={cn("overflow-auto border-b", isTopCollapsed && "transition-all")}
>
<DocumentListTable
promises={promises}
selectedPackageId={selectedPackageId}
onSelectDocument={handleSelectDocument}
/>
</ResizablePanel>
{/* 상/하 분할을 위한 핸들 */}
<ResizableHandle
withHandle
className="pointer-events-none data-[resize-handle]:pointer-events-auto"
/>
<ResizablePanel minSize={0} defaultSize={35}>
{selectedDocument ? (
<StageList document={selectedDocument} />
) : (
<div className="p-4 text-sm text-muted-foreground">
문서를 선택하면 이슈 스테이지가 표시됩니다.
</div>
)}
</ResizablePanel>
</ResizablePanelGroup>
</div>
)
}
|
