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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
|
// enhanced-doc-table-toolbar-actions.tsx - B4 업로드 기능 추가 버전
"use client"
import * as React from "react"
import { type Table } from "@tanstack/react-table"
import { Download, Upload, Plus, Files, RefreshCw } from "lucide-react"
import { toast } from "sonner"
import { exportTableToExcel } from "@/lib/export"
import { Button } from "@/components/ui/button"
import { SimplifiedDocumentsView } from "@/db/schema/vendorDocu"
import { SendToSHIButton } from "./send-to-shi-button"
import { ImportFromDOLCEButton } from "./import-from-dolce-button"
import { BulkB4UploadDialog } from "./bulk-b4-upload-dialog"
interface ProjectCodeStat {
code: string
count: number
projectId: number | null
}
interface EnhancedDocTableToolbarActionsProps {
table: Table<SimplifiedDocumentsView>
projectType: "ship" | "plant"
b4: boolean
projectCodeStats?: ProjectCodeStat[]
}
export function EnhancedDocTableToolbarActions({
table,
projectType,
b4,
projectCodeStats = []
}: EnhancedDocTableToolbarActionsProps) {
const [bulkUploadDialogOpen, setBulkUploadDialogOpen] = React.useState(false)
// 메모이제이션으로 불필요한 재계산 방지
const allDocuments = React.useMemo(() => {
return table.getFilteredRowModel().rows.map(row => row.original)
}, [
table.getFilteredRowModel().rows.length, // 행 개수가 변경될 때만 재계산
table.getState().columnFilters, // 필터가 변경될 때만 재계산
table.getState().globalFilter, // 전역 필터가 변경될 때만 재계산
])
// projectIds 메모이제이션 (ImportFromDOLCEButton에서 중복 계산 방지)
const projectIds = React.useMemo(() => {
const uniqueIds = [...new Set(allDocuments.map(doc => doc.projectId).filter(Boolean))]
return uniqueIds.sort()
}, [allDocuments])
// 프로젝트 옵션 생성 (전체 프로젝트 목록)
const projectOptions = React.useMemo(() => {
return projectCodeStats
.filter(stat => stat.code !== 'Unknown' && stat.projectId)
.map(stat => ({
id: String(stat.projectId),
code: stat.code
}))
}, [projectCodeStats])
// 핸들러들을 useCallback으로 메모이제이션
const handleSyncComplete = React.useCallback(() => {
table.resetRowSelection()
}, [table])
const handleDocumentAdded = React.useCallback(() => {
table.resetRowSelection()
// 강제 새로고침 대신 더 효율적인 방법 사용
setTimeout(() => {
// 상태 업데이트만으로 충분한 경우가 많음
window.location.reload()
}, 500)
}, [table])
const handleImportComplete = React.useCallback(() => {
table.resetRowSelection()
setTimeout(() => {
window.location.reload()
}, 500)
}, [table])
// Export 핸들러 메모이제이션
const handleExport = React.useCallback(() => {
exportTableToExcel(table, {
filename: "Document-list",
excludeColumns: ["select", "actions"],
})
}, [table])
return (
<>
<div className="flex items-center gap-2">
{/* SHIP: DOLCE에서 목록 가져오기 */}
<ImportFromDOLCEButton
allDocuments={allDocuments}
projectIds={projectIds} // 미리 계산된 projectIds 전달
onImportComplete={handleImportComplete}
/>
{/* B4 일괄 업로드 버튼 - b4가 true일 때만 표시 */}
{b4 && (
<Button
variant="outline"
size="sm"
onClick={() => setBulkUploadDialogOpen(true)}
className="gap-2"
>
<Upload className="size-4" aria-hidden="true" />
<span className="hidden sm:inline">B4 업로드</span>
</Button>
)}
{/* Export 버튼 (공통) */}
<Button
variant="outline"
size="sm"
onClick={handleExport}
className="gap-2"
>
<Download className="size-4" aria-hidden="true" />
<span className="hidden sm:inline">Export</span>
</Button>
{/* Send to SHI 버튼 (공통) */}
<SendToSHIButton
documents={allDocuments}
onSyncComplete={handleSyncComplete}
projectType={projectType}
/>
</div>
{/* B4 일괄 업로드 다이얼로그 */}
{b4 && (
<BulkB4UploadDialog
open={bulkUploadDialogOpen}
onOpenChange={setBulkUploadDialogOpen}
projectOptions={projectOptions}
/>
)}
</>
)
}
|
