import React, { useState, useEffect } from 'react';
import Table from '../../../../app/components/Table';
import { FiEdit, FiTrash2, FiPlus } from 'react-icons/fi';
const Obrigacoes = () => {
const [obrigacoes, setObrigacoes] = useState([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
const [departamentos, setDepartamentos] = useState({});
const [responsaveis, setResponsaveis] = useState({});
useEffect(() => {
fetchObrigacoes();
fetchDepartamentos();
fetchResponsaveis();
}, []);
const fetchObrigacoes = async () => {
setLoading(true);
try {
const response = await
fetch('[Link]
if (![Link]) {
throw new Error(`Erro na requisição: ${[Link]}`);
}
const data = await [Link]();
if ([Link] && [Link]([Link])) {
setObrigacoes([Link]);
} else {
throw new Error('Formato de resposta inválido');
}
} catch (err) {
setError(`Falha ao carregar as obrigações: ${[Link]}`);
} finally {
setLoading(false);
}
};
const fetchDepartamentos = async () => {
try {
const response = await
fetch('[Link]
if (![Link]) {
throw new Error(`Erro ao buscar departamentos: ${[Link]}`);
}
const data = await [Link]();
const depMap = {};
if ([Link] && [Link]([Link])) {
[Link](dep => {
depMap[[Link]] = [Link];
});
}
setDepartamentos(depMap);
} catch (err) {
const depMap = {};
[Link](item => {
if ([Link] && !depMap[[Link]]) {
depMap[[Link]] = `Departamento ${[Link]}`;
}
});
setDepartamentos(depMap);
}
};
const fetchResponsaveis = async () => {
try {
const response = await
fetch('[Link]
if (![Link]) {
throw new Error(`Erro ao buscar responsáveis: ${[Link]}`);
}
const data = await [Link]();
const respMap = {};
if ([Link] && [Link]([Link])) {
[Link](resp => {
respMap[[Link]] = `${[Link]} | ${[Link]}`;
});
}
setResponsaveis(respMap);
} catch (err) {
const respMap = {};
[Link](item => {
if ([Link] && !respMap[[Link]]) {
respMap[[Link]] = `Responsável ${[Link]}`;
}
});
setResponsaveis(respMap);
}
};
const handleAcaoClick = (item) => {
// Ação para clique em botão de ação
};
const renderizarStatus = (valor) => {
let ehPassivel = valor === true;
return (
<span className={`px-2 py-1 rounded-full text-xs font-medium ${!ehPassivel ?
'bg-blue-100 text-blue-800' : 'bg-red-100 text-red-800'}`}>
{!ehPassivel ? 'NÃO' : 'SIM'}
</span>
);
};
const renderizarConteudo = (coluna, item) => {
if (!item || typeof item !== 'object') {
return '—';
}
if ([Link] === 'acoes') {
return (
<div className="flex space-x-2 justify-center">
<button
className="text-blue-600 hover:text-blue-800"
onClick={(e) => [Link]()}
>
<FiEdit size={18} />
</button>
<button
className="text-red-600 hover:text-red-800"
onClick={(e) => [Link]()}
>
<FiTrash2 size={18} />
</button>
</div>
);
}
if ([Link] === 'passivel_multa') {
return renderizarStatus(item.passivel_multa);
}
if ([Link] === 'departamento') {
return departamentos[[Link]] || `Departamento $
{[Link]}`;
}
if ([Link] === 'responsavel') {
return responsaveis[[Link]] || `Responsável ${[Link]}`;
}
return item[[Link]];
};
const colunas = [
{ campo: 'id', titulo: 'ID', align: 'left' },
{ campo: 'nome', titulo: 'NOME', align: 'left' },
{ campo: 'departamento', titulo: 'DEPARTAMENTO', align: 'left' },
{ campo: 'responsavel', titulo: 'RESPONSÁVEL', align: 'left' },
{ campo: 'passivel_multa', titulo: 'PASSÍVEL DE MULTA?', align: 'left', tipo:
'status' },
{ campo: 'acoes', titulo: 'AÇÕES', align: 'center', tipo: 'acoes' }
];
const handleRowClick = (item) => {
// Ação para clique na linha
};
return (
<div className="p-4">
<div className="mb-4 flex justify-end items-center">
<button
className="flex items-center px-4 py-2 bg-blue-600 text-white rounded-md
hover:bg-blue-700 transition-colors"
onClick={() => {}}
>
<FiPlus className="mr-2" /> Cadastrar
</button>
</div>
{loading && <p className="text-center py-4">Carregando...</p>}
{error && (
<div className="bg-red-100 border border-red-400 text-red-700 px-4 py-3
rounded mb-4">
Erro: {error}
</div>
)}
{!loading && (
<div className="bg-white rounded-lg shadow overflow-hidden">
{[Link](obrigacoes) && [Link] > 0 ? (
<Table
colunas={colunas}
dados={obrigacoes}
onAcaoClick={handleAcaoClick}
renderizarStatus={renderizarStatus}
renderizarConteudo={renderizarConteudo}
onRowClick={handleRowClick}
/>
) : (
<p className="text-center py-4">Nenhuma obrigação encontrada.</p>
)}
</div>
)}
</div>
);
};
export default Obrigacoes;