ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor budget calculation logic

Browse Source 
Modify budget calculation to use monthly input as the base and adjust tab order.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-22 11:53:18 +00:00
parent 69ab5e4c73
commit 94595ec6c8
5 changed files with 36 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/BudgetProgressCard.tsx
View File

@@ -53,8 +53,8 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
// 초기 탭 설정을 위한 효과
useEffect(() => {
if (!selectedTab) {
console.log("초기 탭 설정: monthly");
setSelectedTab('monthly');
console.log("초기 탭 설정: daily");
setSelectedTab('daily');
}
}, []);
@@ -76,7 +76,7 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
monthly: budgetData.monthly.targetAmount
});
// 탭 값 업데이트 (주간 탭은 별도 처리 없이 직접 사용)
// 탭 값 업데이트
setSelectedTab(value);
};
@@ -89,7 +89,7 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
return (
<div className="neuro-card mb-6 overflow-hidden w-full">
<Tabs defaultValue="monthly" value={selectedTab} onValueChange={handleTabChange} className="w-full">
<Tabs defaultValue="daily" value={selectedTab} onValueChange={handleTabChange} className="w-full">
<TabsList className="grid grid-cols-3 mb-4 bg-transparent">
<TabsTrigger
value="daily"
@@ -97,18 +97,18 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
>
오늘
</TabsTrigger>
<TabsTrigger
value="monthly"
className="data-[state=active]:shadow-[inset_4px_4px_8px_rgba(209,217,230,0.9),inset_-4px_-4px_8px_rgba(255,255,255,0.9)] data-[state=active]:bg-transparent data-[state=active]:font-medium transition-all duration-200"
>
월간
</TabsTrigger>
<TabsTrigger
value="weekly"
className="data-[state=active]:shadow-[inset_4px_4px_8px_rgba(209,217,230,0.9),inset_-4px_-4px_8px_rgba(255,255,255,0.9)] data-[state=active]:bg-transparent data-[state=active]:font-medium transition-all duration-200"
>
주간
</TabsTrigger>
<TabsTrigger
value="monthly"
className="data-[state=active]:shadow-[inset_4px_4px_8px_rgba(209,217,230,0.9),inset_-4px_-4px_8px_rgba(255,255,255,0.9)] data-[state=active]:bg-transparent data-[state=active]:font-medium transition-all duration-200"
>
월간
</TabsTrigger>
</TabsList>
<div className="text-sm text-gray-600 mb-2 px-1">지출 / 예산</div>

13
src/contexts/budget/hooks/useBudgetGoalUpdate.ts
View File

@@ -34,7 +34,7 @@ export const useBudgetGoalUpdate = (
// 현재 최신 예산 데이터 로드 (다른 곳에서 변경되었을 수 있음)
const currentBudgetData = safelyLoadBudgetData();
// 예산 데이터 업데이트
// 예산 데이터 업데이트 - 월간 기준으로 계산
const updatedBudgetData = calculateUpdatedBudgetData(currentBudgetData, type, amount);
console.log('새 예산 데이터 계산됨:', updatedBudgetData);
@@ -46,7 +46,7 @@ export const useBudgetGoalUpdate = (
// 이벤트 발생시켜 다른 컴포넌트에 알림
window.dispatchEvent(new Event('budgetDataUpdated'));
// 1초 후 데이터 갱신 이벤트 한 번 더 발생 (UI 갱신 확실히 하기 위함)
// 시간차를 두고 이벤트 추가 발생 (UI 갱신 확실히 하기 위함)
setTimeout(() => {
window.dispatchEvent(new Event('budgetDataUpdated'));
window.dispatchEvent(new StorageEvent('storage', {
@@ -55,15 +55,6 @@ export const useBudgetGoalUpdate = (
}));
}, 500);
// 2초 후 데이터 갱신 이벤트 한 번 더 발생
setTimeout(() => {
window.dispatchEvent(new Event('budgetDataUpdated'));
window.dispatchEvent(new StorageEvent('storage', {
key: 'budgetData',
newValue: JSON.stringify(updatedBudgetData)
}));
}, 2000);
console.log('예산 목표 업데이트 완료:', updatedBudgetData);
// 성공 메시지 표시

2
src/contexts/budget/hooks/useBudgetState.ts
View File

@@ -9,7 +9,7 @@ import { safelyLoadBudgetData } from '../budgetUtils';
export const useBudgetState = () => {
// 초기 데이터 로드 시 safelyLoadBudgetData 함수 사용
const [budgetData, setBudgetData] = useState<BudgetData>(safelyLoadBudgetData());
const [selectedTab, setSelectedTab] = useState<BudgetPeriod>("daily");
const [selectedTab, setSelectedTab] = useState<BudgetPeriod>("daily"); // 초기값을 daily로 변경
const [isInitialized, setIsInitialized] = useState(false);
const [lastUpdateTime, setLastUpdateTime] = useState(0);

17
src/contexts/budget/hooks/useExtendedBudgetUpdate.ts
View File

@@ -17,9 +17,20 @@ export const useExtendedBudgetUpdate = (
) => {
console.log('확장 예산 업데이트 시작:', type, amount, newCategoryBudgets);
// 예산 업데이트
console.log(`예산 업데이트: 타입=${type}, 금액=${amount}`);
handleBudgetUpdate(type, amount);
// 항상 입력값을 월간 기준으로 변환하여 예산 업데이트
let monthlyAmount = amount;
if (type === 'weekly') {
// 주간 예산을 월간으로 변환 (4.345주/월)
monthlyAmount = Math.round(amount * 4.345);
} else if (type === 'daily') {
// 일일 예산을 월간으로 변환 (30일/월)
monthlyAmount = Math.round(amount * 30);
}
// 월간 기준으로 예산 업데이트
console.log(`예산 업데이트: 원래 타입=${type}, 금액=${amount}, 변환된 월간 금액=${monthlyAmount}`);
handleBudgetUpdate('monthly', monthlyAmount);
// 카테고리 예산 업데이트 (제공된 경우)
if (newCategoryBudgets) {

20
src/contexts/budget/utils/budgetCalculation.ts
View File

@@ -21,24 +21,22 @@ export const calculateUpdatedBudgetData = (
let weeklyAmount = 0;
let dailyAmount = 0;
// 입력된 타입에 따라 적절한 예산 금액 설정
// 항상 월간 예산을 기준으로 계산 (어떤 타입이 입력되든)
if (type === 'monthly') {
// 월간 예산이 입력된 경우 - 이를 기준으로 주간/일일 계산
monthlyAmount = amount;
weeklyAmount = Math.round(monthlyAmount / 4.345);
dailyAmount = 4000000; // 일일 예산 고정 값
} else if (type === 'weekly') {
// 주간 예산이 입력된 경우 - 이를 기준으로 월간 계산, 일일은 고정값
weeklyAmount = amount;
monthlyAmount = amount; // 주간 예산을 월간 예산으로 직접 사용
dailyAmount = 4000000; // 일일 예산 고정 값
// 주간 예산이 입력된 경우 - 이를 월간으로 환산 (4.345주/월 기준)
monthlyAmount = Math.round(amount * 4.345);
} else if (type === 'daily') {
// 일일 예산이 입력된 경우 - 고정값 사용
dailyAmount = 4000000; // 일일 예산 고정 값
weeklyAmount = Math.round(dailyAmount * 7);
monthlyAmount = Math.round(dailyAmount * 30);
// 일일 예산이 입력된 경우 - 이를 월간으로 환산 (30일/월 기준)
monthlyAmount = Math.round(amount * 30);
}
// 월간 예산을 기준으로 주간/일일 예산 계산
weeklyAmount = Math.round(monthlyAmount / 4.345); // 한 달 평균 4.345주
dailyAmount = Math.round(monthlyAmount / 30); // 한 달 평균 30일
console.log(`최종 예산 계산 결과: 월간=${monthlyAmount}원, 주간=${weeklyAmount}원, 일일=${dailyAmount}원`);
// 로그에 이전 예산 데이터 출력