blob: 758d9ed7b9d42606a4e951ee5b7e041d3fe9cd1b (
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
|
"use client";
import * as React from "react";
import { getComplianceResponsesWithPagination } from "@/lib/compliance/services";
import { ComplianceResponsesTable } from "./compliance-responses-table";
import { ComplianceResponseStats } from "./compliance-response-stats";
interface ComplianceResponsesPageClientProps {
templateId: number;
promises?: Promise<[{ data: any[]; pageCount: number }, any]>;
isInfiniteMode: boolean;
}
export function ComplianceResponsesPageClient({
templateId,
promises,
isInfiniteMode
}: ComplianceResponsesPageClientProps) {
// 페이지네이션 모드 데이터
const paginationData = promises ? React.use(promises) : null;
const responses = paginationData ? paginationData[0] : { data: [], pageCount: 0 };
const stats = paginationData ? paginationData[1] : {
inProgress: 0,
completed: 0,
reviewed: 0,
total: 0,
};
const [statusFilter, setStatusFilter] = React.useState<'all' | 'IN_PROGRESS' | 'COMPLETED' | 'REVIEWED'>('all');
// 필터링된 데이터
const filteredData = React.useMemo(() => {
if (statusFilter === 'all') {
return responses.data;
}
return responses.data.filter(item => item.status === statusFilter);
}, [responses.data, statusFilter]);
// 통계 카드 클릭 핸들러
const handleFilterChange = (filter: 'all' | 'IN_PROGRESS' | 'COMPLETED' | 'REVIEWED') => {
setStatusFilter(filter);
};
return (
<>
{/* 응답 통계 카드 */}
<div className="mb-6">
<ComplianceResponseStats
stats={stats}
onFilterChange={handleFilterChange}
currentFilter={statusFilter}
/>
</div>
{/* 응답 테이블 */}
<ComplianceResponsesTable
templateId={templateId}
promises={Promise.resolve([{ data: filteredData, pageCount: Math.ceil(filteredData.length / 10) }])}
/>
</>
);
}
|
