e4af3232dd
- CEO 대시보드: 일일보고, 접대비, 복리후생 섹션 개선 - CEO 대시보드: 상세 모달 기능 확장 - 카드거래조회: 기능 및 타입 확장 - 알림설정: 항목 설정 다이얼로그 추가 - 회사정보관리: 컴포넌트 개선 - 모바일 오버플로우 테스트 계획서 추가 (Galaxy Fold 대응) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import { Card, CardContent } from '@/components/ui/card';
|
|
import { SectionTitle, AmountCardItem, CheckPointItem } from '../components';
|
|
import type { WelfareData } from '../types';
|
|
|
|
interface WelfareSectionProps {
|
|
data: WelfareData;
|
|
onCardClick?: (cardId: string) => void;
|
|
}
|
|
|
|
export function WelfareSection({ data, onCardClick }: WelfareSectionProps) {
|
|
return (
|
|
<Card>
|
|
<CardContent className="p-6">
|
|
<SectionTitle title="복리후생비 현황" badge="info" />
|
|
|
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 mb-4">
|
|
{data.cards.map((card) => (
|
|
<AmountCardItem
|
|
key={card.id}
|
|
card={card}
|
|
onClick={onCardClick ? () => onCardClick(card.id) : undefined}
|
|
/>
|
|
))}
|
|
</div>
|
|
|
|
{data.checkPoints.length > 0 && (
|
|
<div className="border-t pt-4 space-y-1">
|
|
{data.checkPoints.map((cp) => (
|
|
<CheckPointItem key={cp.id} checkpoint={cp} />
|
|
))}
|
|
</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
} |