summaryrefslogtreecommitdiff
path: root/components/client-data-table/data-table-toolbar.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'components/client-data-table/data-table-toolbar.tsx')
-rw-r--r--components/client-data-table/data-table-toolbar.tsx100
1 files changed, 100 insertions, 0 deletions
diff --git a/components/client-data-table/data-table-toolbar.tsx b/components/client-data-table/data-table-toolbar.tsx
new file mode 100644
index 00000000..286cffd6
--- /dev/null
+++ b/components/client-data-table/data-table-toolbar.tsx
@@ -0,0 +1,100 @@
+"use client"
+
+import * as React from "react"
+import type { DataTableAdvancedFilterField } from "@/types/table"
+import { type Table } from "@tanstack/react-table"
+
+import { cn } from "@/lib/utils"
+import { ClientDataTableViewOptions } from "./data-table-view-options"
+import { Button } from "../ui/button"
+import { Download } from "lucide-react"
+
+import { exportTableToExcel } from "@/lib/export_all"
+import { ClientDataTableSortList } from "./data-table-sort-list"
+import { ClientDataTableGroupList } from "./data-table-group-list"
+import { ClientDataTableAdvancedFilter } from "./data-table-filter-list"
+
+interface DataTableAdvancedToolbarProps<TData>
+ extends React.HTMLAttributes<HTMLDivElement> {
+ table: Table<TData>
+ filterFields: DataTableAdvancedFilterField<TData>[]
+ debounceMs?: number
+ shallow?: boolean
+ children?: React.ReactNode
+}
+
+export function ClientDataTableAdvancedToolbar<TData>({
+ table,
+ filterFields = [],
+ debounceMs = 300,
+ shallow = true,
+ children,
+ className,
+ ...props
+}: DataTableAdvancedToolbarProps<TData>) {
+
+ // 전체 엑셀 내보내기
+ const handleExportAll = async () => {
+ try {
+ await exportTableToExcel(table, {
+ filename: "my-data",
+ onlySelected: false,
+ excludeColumns: ["select", "actions", "validation", "requestedAmount", "update"],
+ useGroupHeader: false,
+ allPages: true,
+
+ })
+ } catch (err) {
+ console.error("Export error:", err)
+ // 필요하면 토스트나 알림 처리
+ }
+ }
+
+
+
+ return (
+ <div
+ className={cn(
+ "flex w-full items-center justify-between gap-2 overflow-auto p-1",
+ className
+ )}
+ {...props}
+ >
+ {/* 왼쪽: 필터 & 정렬 & 뷰 옵션 */}
+ <div className="flex items-center gap-2">
+ <ClientDataTableAdvancedFilter
+ table={table}
+ filterFields={filterFields}
+ />
+ <ClientDataTableSortList table={table} />
+ <ClientDataTableViewOptions table={table} />
+ <ClientDataTableGroupList table={table}/>
+ <Button variant="outline" size="sm" onClick={handleExportAll}>
+ <Download className="size-4" />
+ {/* i18n 버튼 문구 */}
+ <span className="hidden sm:inline">
+ {"Export All" }
+ </span>
+ </Button>
+ </div>
+
+ {/* 오른쪽: Export 버튼 + children */}
+ <div className="flex items-center gap-2">
+
+
+ {/* 자식 컴포넌트(추가 버튼 등) */}
+ {children}
+
+ {/* 선택된 행만 내보내기 버튼 예시 (필요 시 주석 해제) */}
+ {/*
+ <Button variant="outline" size="sm" onClick={handleExportSelected}>
+ <Download className="size-4" />
+ <span className="hidden sm:inline">
+ {t("common.exportSelected", { defaultValue: "Export Selected" })}
+ </span>
+ </Button>
+ */}
+ </div>
+ </div>
+ )
+} \ No newline at end of file