55 lines
1.7 KiB
TypeScript
55 lines
1.7 KiB
TypeScript
import { format } from "date-fns";
|
|
import { ptBR } from "date-fns/locale";
|
|
import { DatajudProcesso } from "../../types/datajud";
|
|
|
|
interface ProcessoInfoProps {
|
|
data: DatajudProcesso;
|
|
}
|
|
|
|
export const ProcessoInfo = ({ data }: ProcessoInfoProps) => {
|
|
return (
|
|
<div className="bg-white rounded-lg shadow p-6 space-y-4">
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<InfoItem label="Classe" value={data.classe.nome} />
|
|
<InfoItem
|
|
label="Data de Ajuizamento"
|
|
value={format(new Date(data.dataAjuizamento), "dd/MM/yyyy", {
|
|
locale: ptBR,
|
|
})}
|
|
/>
|
|
<InfoItem label="Grau" value={data.grau} />
|
|
<InfoItem label="Formato" value={data.formato.nome} />
|
|
<InfoItem label="Sistema" value={data.sistema.nome} />
|
|
<InfoItem label="Órgão Julgador" value={data.orgaoJulgador.nome} />
|
|
</div>
|
|
|
|
{data.assuntos.length > 0 && (
|
|
<div className="mt-4">
|
|
<h4 className="font-medium text-gray-700 mb-2">Assuntos</h4>
|
|
<div className="flex flex-wrap gap-2">
|
|
{data.assuntos.map((assunto) => (
|
|
<span
|
|
key={assunto.codigo}
|
|
className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800"
|
|
>
|
|
{assunto.nome}
|
|
</span>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
function InfoItem({ label, value }: { label: string; value: string }) {
|
|
return (
|
|
<div>
|
|
<dt className="text-sm font-medium text-gray-500">{label}</dt>
|
|
<dd className="mt-1 text-sm text-gray-900">{value}</dd>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default ProcessoInfo;
|