diff --git a/src/components/TransactionCard.tsx b/src/components/TransactionCard.tsx index fd48a80..eda02ab 100644 --- a/src/components/TransactionCard.tsx +++ b/src/components/TransactionCard.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { ArrowDownIcon, ArrowUpIcon, ShoppingBag, Coffee, Home, Car, Gift } from 'lucide-react'; +import { ArrowDownIcon, ArrowUpIcon, Coffee, Home, Car } from 'lucide-react'; import { cn } from '@/lib/utils'; export type Transaction = { @@ -13,12 +13,9 @@ export type Transaction = { }; const categoryIcons: Record = { - shopping: , - food: , - housing: , - transportation: , - entertainment: , - // Add more categories as needed + 식비: , + 생활비: , + 교통비: , }; interface TransactionCardProps { @@ -39,7 +36,7 @@ const TransactionCard: React.FC = ({ transaction }) => {
- {categoryIcons[category] || } + {categoryIcons[category] || }
diff --git a/src/pages/Analytics.tsx b/src/pages/Analytics.tsx index eb1ece7..0e857cd 100644 --- a/src/pages/Analytics.tsx +++ b/src/pages/Analytics.tsx @@ -1,33 +1,27 @@ + import React, { useState } from 'react'; import NavBar from '@/components/NavBar'; import ExpenseChart from '@/components/ExpenseChart'; import AddTransactionButton from '@/components/AddTransactionButton'; import { BarChart, Bar, XAxis, YAxis, Tooltip, ResponsiveContainer, Legend } from 'recharts'; import { ChevronLeft, ChevronRight } from 'lucide-react'; + const Analytics = () => { const [selectedPeriod, setSelectedPeriod] = useState('이번 달'); - // Sample data for the expense categories + // Updated expense categories to use only the three specified categories const expenseData = [{ name: '식비', value: 350000, color: '#9b87f5' }, { - name: '주거', + name: '생활비', value: 650000, color: '#6e59a5' }, { - name: '교통', - value: 125000, - color: '#81c784' - }, { - name: '취미', - value: 200000, - color: '#64b5f6' - }, { - name: '기타', + name: '교통비', value: 175000, - color: '#e57373' + color: '#81c784' }]; // Sample data for the monthly comparison @@ -56,10 +50,12 @@ const Analytics = () => { income: 2550000, expense: 1740000 }]; + const totalIncome = 2550000; const totalExpense = 1740000; const savings = totalIncome - totalExpense; const savingsPercentage = Math.round(savings / totalIncome * 100); + return
{/* Header */} @@ -157,7 +153,7 @@ const Analytics = () => {

주요 지출 카테고리

- {expenseData.slice(0, 3).map((category, index) =>
+ {expenseData.map((category, index) =>
{
; }; -export default Analytics; \ No newline at end of file + +export default Analytics; diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx index 130bfeb..7bfbbd3 100644 --- a/src/pages/Index.tsx +++ b/src/pages/Index.tsx @@ -19,14 +19,14 @@ const Index = () => { title: '식료품 구매', amount: 25000, date: '오늘, 12:30 PM', - category: 'shopping', + category: '식비', type: 'expense' }, { id: '2', title: '주유소', amount: 50000, date: '어제, 3:45 PM', - category: 'transportation', + category: '교통비', type: 'expense' }, { id: '3', @@ -56,6 +56,7 @@ const Index = () => { } }); + // Updated to only use the three specified categories const categories = [ { title: '식비', current: 240000, total: 400000 }, { title: '생활비', current: 350000, total: 600000 }, diff --git a/src/pages/Transactions.tsx b/src/pages/Transactions.tsx index e4b0cd7..acf9cbc 100644 --- a/src/pages/Transactions.tsx +++ b/src/pages/Transactions.tsx @@ -1,3 +1,4 @@ + import React, { useState } from 'react'; import NavBar from '@/components/NavBar'; import TransactionCard, { Transaction } from '@/components/TransactionCard'; @@ -7,41 +8,41 @@ import { Calendar, Search, ChevronLeft, ChevronRight } from 'lucide-react'; const Transactions = () => { const [selectedMonth, setSelectedMonth] = useState('8월'); - // Sample data - in a real app, this would come from a data source + // Sample data - updated to use only the three specified categories const transactions: Transaction[] = [{ id: '1', title: '식료품 구매', amount: 25000, date: '8월 25일, 12:30 PM', - category: 'shopping', + category: '식비', type: 'expense' }, { id: '2', title: '주유소', amount: 50000, date: '8월 24일, 3:45 PM', - category: 'transportation', + category: '교통비', type: 'expense' }, { id: '4', - title: '아마존 프라임', - amount: 9900, + title: '생필품 구매', + amount: 35000, date: '8월 18일, 6:00 AM', - category: 'entertainment', + category: '생활비', type: 'expense' }, { id: '5', - title: '집세', + title: '월세', amount: 650000, date: '8월 15일, 10:00 AM', - category: 'housing', + category: '생활비', type: 'expense' }, { id: '6', - title: '카페', - amount: 5500, + title: '식당', + amount: 15500, date: '8월 12일, 2:15 PM', - category: 'food', + category: '식비', type: 'expense' }];