Investigate budget display issue

Examine why budget data is not displaying correctly on the expense and analytics screens, despite being saved successfully.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-22 10:53:56 +00:00
parent c92d41e8f0
commit ab86d9b5f9
5 changed files with 223 additions and 75 deletions

View File

@@ -29,13 +29,35 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
const spentAmount = data.spentAmount;
const targetAmount = data.targetAmount;
// 예산 설정 여부 확인 (수정: 0보다 큰지만 확인)
// 로그 추가 - 받은 데이터 확인
useEffect(() => {
console.log(`BudgetTabContent 수신 데이터:`, data);
}, [data]);
// 전역 예산 데이터가 변경되었을 때 로컬 상태 갱신
useEffect(() => {
const handleBudgetDataUpdated = () => {
console.log(`BudgetTabContent: 전역 예산 데이터 이벤트 감지, 현재 targetAmount=${targetAmount}`);
// 입력 폼이 열려있고 예산이 설정된 경우 폼 닫기
if (showBudgetInput && targetAmount > 0) {
console.log('예산이 설정되어 입력 폼을 닫습니다.');
setShowBudgetInput(false);
}
};
window.addEventListener('budgetDataUpdated', handleBudgetDataUpdated);
return () => window.removeEventListener('budgetDataUpdated', handleBudgetDataUpdated);
}, [showBudgetInput, targetAmount]);
// 예산 설정 여부 확인 - 데이터 targetAmount가 실제로 0보다 큰지 확인
const isBudgetSet = targetAmount > 0;
// 디버깅을 위한 로그 추가
useEffect(() => {
console.log(`BudgetTabContent 렌더링: targetAmount=${targetAmount}, isBudgetSet=${isBudgetSet}`);
}, [targetAmount, isBudgetSet]);
if (isBudgetSet && showBudgetInput) {
console.log('예산이 설정되었으므로 입력 폼을 닫습니다.');
setShowBudgetInput(false);
}
}, [isBudgetSet, showBudgetInput]);
// 실제 백분율 계산 (초과해도 실제 퍼센트로 표시)
const actualPercentage = targetAmount > 0 ? Math.round((spentAmount / targetAmount) * 100) : 0;
@@ -116,12 +138,16 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
// 예산 버튼 클릭 핸들러 - 토글 기능 추가
const toggleBudgetInput = () => {
console.log('예산 입력 폼 토글. 현재 상태:', showBudgetInput, '예산 설정 여부:', isBudgetSet);
setShowBudgetInput(prev => !prev);
};
// 예산 여부에 따른 텍스트 결정
const budgetButtonText = isBudgetSet ? "예산 수정하기" : "예산 입력하기";
// 화면에 표시할 내용 - 디버깅을 위한 로그 추가
console.log(`BudgetTabContent 렌더링: targetAmount=${targetAmount}, isBudgetSet=${isBudgetSet}, 표시될 화면:`, isBudgetSet ? "예산 진행 상황" : "예산 입력하기 버튼");
return (
<div>
{isBudgetSet ? (