first commit
This commit is contained in:
rodrigo committed
commit
c9fb67e751
423 files changed
+53287
No files matched your search
@@ -0,0 +1,176 @@
|
||||
import React from "react";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { Processo } from "../../types/entities";
|
||||
import { useProcessos } from "../../hooks/useProcessos";
|
||||
import { formatNumeroProcesso } from "../../utils/formatters";
|
||||
import { DocumentTextIcon, ClockIcon } from "@heroicons/react/24/outline";
|
||||
|
||||
interface ProcessosListProps {
|
||||
searchTerm: string;
|
||||
onEdit: (processo: Processo) => void;
|
||||
}
|
||||
|
||||
const resultadoLabel = {
|
||||
NAO_JULGADO: 'Não Julgado',
|
||||
PROCEDENTE: 'Procedente',
|
||||
PARCIALMENTE_PROCEDENTE: 'Parcialmente Procedente',
|
||||
IMPROCEDENTE: 'Improcedente',
|
||||
SEM_ANALISE_MERITO: 'Sem Análise de Mérito'
|
||||
};
|
||||
|
||||
const resultadoColor = {
|
||||
NAO_JULGADO: 'bg-gray-100 text-gray-800',
|
||||
PROCEDENTE: 'bg-green-100 text-green-800',
|
||||
PARCIALMENTE_PROCEDENTE: 'bg-yellow-100 text-yellow-800',
|
||||
IMPROCEDENTE: 'bg-red-100 text-red-800',
|
||||
SEM_ANALISE_MERITO: 'bg-gray-100 text-gray-800'
|
||||
};
|
||||
|
||||
const getResultadoColor = (resultado: string) => {
|
||||
return resultadoColor[resultado as keyof typeof resultadoColor] || 'bg-gray-100 text-gray-800';
|
||||
};
|
||||
|
||||
export const ProcessosList: React.FC<ProcessosListProps> = ({
|
||||
searchTerm,
|
||||
onEdit,
|
||||
}) => {
|
||||
const navigate = useNavigate();
|
||||
const { processos, isLoading } = useProcessos();
|
||||
|
||||
const filteredProcessos = processos.filter(
|
||||
(processo) =>
|
||||
processo.numero.includes(searchTerm) ||
|
||||
processo.nomeContraparte
|
||||
?.toLowerCase()
|
||||
.includes(searchTerm.toLowerCase()),
|
||||
);
|
||||
|
||||
const getResultadoDisplay = (processo: Processo) => {
|
||||
if (!processo.resultado || !resultadoLabel[processo.resultado as keyof typeof resultadoLabel]) {
|
||||
return (
|
||||
<span className="px-2 py-1 text-xs rounded-full bg-gray-100 text-gray-800">
|
||||
Não Julgado
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<span className={`px-2 py-1 text-xs rounded-full ${getResultadoColor(processo.resultado)}`}>
|
||||
{resultadoLabel[processo.resultado as keyof typeof resultadoLabel]}
|
||||
</span>
|
||||
);
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return <div className="animate-pulse">Carregando...</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="overflow-x-auto">
|
||||
<table className="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
|
||||
<thead className="bg-gray-50">
|
||||
<tr>
|
||||
<th
|
||||
scope="col"
|
||||
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"
|
||||
>
|
||||
Processo
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"
|
||||
>
|
||||
Natureza
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"
|
||||
>
|
||||
Parte
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"
|
||||
>
|
||||
Status
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase"
|
||||
>
|
||||
Próximos Prazos
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider"
|
||||
>
|
||||
Resultado
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-gray-200">
|
||||
{filteredProcessos.map((processo) => (
|
||||
<tr
|
||||
key={processo.id}
|
||||
onClick={() => navigate(`/processos/${processo.id}`)}
|
||||
className="hover:bg-gray-50 cursor-pointer"
|
||||
>
|
||||
<td className="px-6 py-4">
|
||||
<div className="flex items-center">
|
||||
<DocumentTextIcon className="h-10 w-10 text-gray-400" />
|
||||
<div className="ml-4">
|
||||
<div className="text-sm font-medium text-gray-900">
|
||||
{formatNumeroProcesso(processo.numero)}
|
||||
</div>
|
||||
<div className="text-sm text-gray-500">
|
||||
{processo.orgaoJulgador}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 text-sm text-gray-500">
|
||||
{processo.natureza}
|
||||
</td>
|
||||
<td className="px-6 py-4">
|
||||
<div className="text-sm text-gray-900">
|
||||
{processo.tipoParteCliente === "AUTOR" ? "Autor" : "Réu"}
|
||||
</div>
|
||||
<div className="text-sm text-gray-500">
|
||||
{processo.nomeContraparte}
|
||||
</div>
|
||||
</td>
|
||||
<td className="px-6 py-4">
|
||||
<span
|
||||
className={`px-2 py-1 text-xs rounded-full ${
|
||||
processo.statusAtividade === "ATIVO"
|
||||
? "bg-green-100 text-green-800"
|
||||
: processo.statusAtividade === "BAIXADO"
|
||||
? "bg-blue-100 text-blue-800"
|
||||
: processo.statusAtividade === "SUSPENSO"
|
||||
? "bg-yellow-100 text-yellow-800"
|
||||
: "bg-gray-100 text-gray-800"
|
||||
}`}
|
||||
>
|
||||
{processo.statusAtividade}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-6 py-4">
|
||||
{processo.diligencias?.length > 0 ? (
|
||||
<div className="flex items-center text-sm text-gray-500">
|
||||
<ClockIcon className="h-4 w-4 mr-1" />
|
||||
{processo.diligencias.length} prazos
|
||||
</div>
|
||||
) : (
|
||||
<span className="text-sm text-gray-500">Sem prazos</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="px-6 py-4 whitespace-nowrap">
|
||||
{getResultadoDisplay(processo)}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
Reference in new issue
Block a user