diff --git a/src/components/BudgetProgressCard.tsx b/src/components/BudgetProgressCard.tsx index b683855..7d66b92 100644 --- a/src/components/BudgetProgressCard.tsx +++ b/src/components/BudgetProgressCard.tsx @@ -1,17 +1,14 @@ - import React, { useState } from 'react'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; import { Check, ChevronDown, ChevronUp } from 'lucide-react'; import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'; - interface BudgetData { targetAmount: number; spentAmount: number; remainingAmount: number; } - interface BudgetProgressCardProps { budgetData: { daily: BudgetData; @@ -24,7 +21,6 @@ interface BudgetProgressCardProps { calculatePercentage: (spent: number, target: number) => number; onSaveBudget: (type: 'daily' | 'weekly' | 'monthly', amount: number) => void; } - const BudgetProgressCard: React.FC = ({ budgetData, selectedTab, @@ -33,8 +29,7 @@ const BudgetProgressCard: React.FC = ({ calculatePercentage, onSaveBudget }) => { - return ( -
+ return
@@ -51,59 +46,39 @@ const BudgetProgressCard: React.FC = ({
지출 / 예산
- onSaveBudget('daily', amount)} - /> + onSaveBudget('daily', amount)} /> - onSaveBudget('weekly', amount)} - /> + onSaveBudget('weekly', amount)} /> - onSaveBudget('monthly', amount)} - /> + onSaveBudget('monthly', amount)} />
-
- ); +
; }; - interface BudgetTabContentProps { data: BudgetData; formatCurrency: (amount: number) => string; calculatePercentage: (spent: number, target: number) => number; onSaveBudget: (amount: number) => void; } - -const BudgetTabContent: React.FC = ({ - data, - formatCurrency, +const BudgetTabContent: React.FC = ({ + data, + formatCurrency, calculatePercentage, onSaveBudget }) => { const percentage = calculatePercentage(data.spentAmount, data.targetAmount); const [isOpen, setIsOpen] = useState(false); const [budgetInput, setBudgetInput] = useState(data.targetAmount.toString()); - const handleInputChange = (value: string) => { // Remove all non-numeric characters const numericValue = value.replace(/[^0-9]/g, ''); setBudgetInput(numericValue); }; - const handleSave = () => { const amount = parseInt(budgetInput, 10) || 0; onSaveBudget(amount); @@ -114,9 +89,7 @@ const BudgetTabContent: React.FC = ({ const formatWithCommas = (amount: string) => { return amount.replace(/\B(?=(\d{3})+(?!\d))/g, ','); }; - - return ( -
+ return

{formatCurrency(data.spentAmount)}

@@ -124,12 +97,9 @@ const BudgetTabContent: React.FC = ({
-
= 90 ? "bg-yellow-400" : "bg-neuro-income" - }`} - /> +
= 90 ? "bg-yellow-400" : "bg-neuro-income"}`} />
@@ -147,27 +117,14 @@ const BudgetTabContent: React.FC = ({
- 예산 목표 설정하기 - {isOpen ? ( - - ) : ( - - )} + 예산 설정하기 + {isOpen ? : }
- handleInputChange(e.target.value)} - placeholder="목표 금액 입력" - className="neuro-pressed" - /> -
@@ -175,8 +132,6 @@ const BudgetTabContent: React.FC = ({
-
- ); +
; }; - -export default BudgetProgressCard; +export default BudgetProgressCard; \ No newline at end of file