Fix: Incorrect card expense and category page issues
Corrected the expense card on the dashboard to accurately reflect card expenses. Added month/year filter to the categories page. Verified and adjusted the category summary to ensure all transactions are included and correctly categorized.
This commit is contained in:
parent
386ceb6792
commit
45e0bd3c71
@ -62,7 +62,7 @@ const DashboardSummaryCards: React.FC<DashboardSummaryCardsProps> = ({ resumo, f
|
||||
<p className="text-base sm:text-xl xl:text-2xl font-bold text-red-600 leading-tight">
|
||||
{resumo ? formatCurrency(resumo.totalDespesas) : 'R$ 0,00'}
|
||||
</p>
|
||||
{resumo && resumo.totalCartoes > 0 && (
|
||||
{resumo && resumo.totalCartoes && resumo.totalCartoes > 0 && (
|
||||
<div className="pt-1 border-t border-red-200">
|
||||
<p className="text-xs text-red-500">
|
||||
<span className="font-medium">Cartões: </span>
|
||||
|
||||
@ -6,6 +6,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@
|
||||
import { useToast } from "@/hooks/use-toast";
|
||||
import { getCategorySummary } from '@/services/transacao';
|
||||
import { CategorySummary } from '@/types/financialTypes';
|
||||
import { MonthFilter } from "@/components/filters/MonthFilter";
|
||||
|
||||
interface CategoryCard {
|
||||
nome: string;
|
||||
@ -17,13 +18,19 @@ interface CategoryCard {
|
||||
const Categorias = () => {
|
||||
const [categories, setCategories] = useState<CategorySummary[]>([]);
|
||||
const [filtro, setFiltro] = useState<'despesa' | 'receita'>('despesa');
|
||||
const [selectedMonth, setSelectedMonth] = useState(() => {
|
||||
const now = new Date();
|
||||
return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}`;
|
||||
});
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const { toast } = useToast();
|
||||
|
||||
const loadCategories = async () => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const data = await getCategorySummary(filtro);
|
||||
console.log("Carregando categorias com filtro:", filtro, "mês:", selectedMonth);
|
||||
const data = await getCategorySummary(filtro, selectedMonth);
|
||||
console.log("Categorias carregadas:", data);
|
||||
setCategories(data);
|
||||
} catch (error) {
|
||||
console.error("Erro ao carregar categorias:", error);
|
||||
@ -39,7 +46,7 @@ const Categorias = () => {
|
||||
|
||||
useEffect(() => {
|
||||
loadCategories();
|
||||
}, [filtro]);
|
||||
}, [filtro, selectedMonth]);
|
||||
|
||||
const formatCurrency = (value: number) => {
|
||||
return new Intl.NumberFormat('pt-BR', {
|
||||
@ -59,12 +66,18 @@ const Categorias = () => {
|
||||
<div className="space-y-6">
|
||||
<div className="flex justify-between items-center">
|
||||
<h1 className="text-2xl font-bold">Categorias</h1>
|
||||
<div className="flex items-center gap-3">
|
||||
<MonthFilter
|
||||
selectedMonth={selectedMonth}
|
||||
onMonthChange={setSelectedMonth}
|
||||
/>
|
||||
<Select disabled>
|
||||
<SelectTrigger className="w-32">
|
||||
<SelectValue placeholder="Carregando..." />
|
||||
</SelectTrigger>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
{[1, 2, 3, 4, 5, 6].map((i) => (
|
||||
<Card key={i} className="animate-pulse">
|
||||
@ -87,6 +100,10 @@ const Categorias = () => {
|
||||
<div className="flex justify-between items-center">
|
||||
<h1 className="text-2xl font-bold">Categorias</h1>
|
||||
<div className="flex items-center gap-3">
|
||||
<MonthFilter
|
||||
selectedMonth={selectedMonth}
|
||||
onMonthChange={setSelectedMonth}
|
||||
/>
|
||||
<span className="text-sm text-gray-600">Filtrar por:</span>
|
||||
<Select value={filtro} onValueChange={(value: 'despesa' | 'receita') => setFiltro(value)}>
|
||||
<SelectTrigger className="w-32">
|
||||
@ -141,7 +158,7 @@ const Categorias = () => {
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>
|
||||
Resumo de Categorias ({filtro === 'despesa' ? 'Despesas' : 'Receitas'})
|
||||
Resumo de Categorias ({filtro === 'despesa' ? 'Despesas' : 'Receitas'}) - {selectedMonth}
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
@ -190,7 +207,7 @@ const Categorias = () => {
|
||||
<Card>
|
||||
<CardContent className="text-center py-12">
|
||||
<p className="text-gray-500">
|
||||
Nenhuma categoria encontrada para {filtro === 'despesa' ? 'despesas' : 'receitas'}.
|
||||
Nenhuma categoria encontrada para {filtro === 'despesa' ? 'despesas' : 'receitas'} no mês {selectedMonth}.
|
||||
</p>
|
||||
<p className="text-sm text-gray-400 mt-2">
|
||||
Adicione algumas transações para ver as categorias aqui.
|
||||
|
||||
Loading…
Reference in New Issue
Block a user