first commit

src/components/dashboard/stats/TarefasStats.tsx

@@ -0,0 +1,61 @@
+import React from 'react';
+import { useQuery } from 'react-query';
+import { Card } from '../Card';
+import api from '../../../services/api';
+
+export const TarefasStats: React.FC = () => {
+  const { data: stats } = useQuery('tarefasStats', async () => {
+    try {
+      const response = await api.get('/dashboard/tarefas/stats');
+      return response.data;
+    } catch (error) {
+      console.error('Erro ao buscar estatísticas:', error);
+      return {
+        pendentes: 0,
+        atrasadas: 0,
+        concluidas: 0,
+        total: 0,
+        taxaConclusao: 0,
+        porStatus: { PENDENTE: 0 }
+      };
+    }
+  });
+
+  const defaultStats = {
+    pendentes: 0,
+    atrasadas: 0,
+    concluidas: 0,
+    total: 0,
+    taxaConclusao: 0,
+    porStatus: { PENDENTE: 0 }
+  };
+
+  const safeStats = stats || defaultStats;
+
+  return (
+    <div className="grid gap-4">
+      <Card
+        title="Tarefas Pendentes"
+        value={safeStats.porStatus?.PENDENTE || 0}
+        trend={safeStats.atrasadas}
+        trendLabel="atrasadas"
+        icon="ClipboardDocumentList"
+        color="yellow"
+      />
+      <Card
+        title="Para Hoje"
+        value={safeStats.pendentes || 0}
+        icon="Clock"
+        color="blue"
+      />
+      <Card
+        title="Concluídas (Mês)"
+        value={safeStats.concluidas || 0}
+        trend={safeStats.taxaConclusao}
+        trendLabel="taxa de conclusão"
+        icon="CheckCircle"
+        color="green"
+      />
+    </div>
+  );
+};