40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
import React from 'react';
|
|
import { useQuery } from 'react-query';
|
|
import api from '../../services/api';
|
|
|
|
export const TaxaSucessoCard: React.FC = () => {
|
|
const { data: stats } = useQuery('taxa-sucesso', async () => {
|
|
const response = await api.get('/dashboard/processos/taxa-sucesso');
|
|
return response.data;
|
|
});
|
|
|
|
if (!stats) return null;
|
|
|
|
const estatisticas = stats || [];
|
|
const total = estatisticas.reduce((acc: number, curr: any) => acc + (curr._count || 0), 0);
|
|
|
|
return (
|
|
<div className="bg-white rounded-lg shadow p-6">
|
|
<h3 className="text-lg font-semibold mb-4">Taxa de Sucesso</h3>
|
|
<div className="flex items-center justify-between">
|
|
<div className="text-3xl font-bold text-green-600">
|
|
{estatisticas.find((s: any) => s.resultado === 'PROCEDENTE')?._count
|
|
? Math.round((estatisticas.find((s: any) => s.resultado === 'PROCEDENTE')._count / total) * 100)
|
|
: 0}%
|
|
</div>
|
|
<div className="text-sm text-gray-500">
|
|
Total julgados: {total}
|
|
</div>
|
|
</div>
|
|
<div className="mt-4 space-y-2">
|
|
{estatisticas.map((item: any) => (
|
|
<div key={item.resultado} className="flex justify-between">
|
|
<span className="text-sm text-gray-600">{item.resultado}</span>
|
|
<span className="text-sm font-medium">{Math.round((item._count / total) * 100)}%</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|