|
|
@ -2,11 +2,11 @@ import React, { useEffect, useState } from "react"; |
|
|
import PropTypes from "prop-types"; |
|
|
import PropTypes from "prop-types"; |
|
|
import Table from 'antd/lib/table'; |
|
|
import Table from 'antd/lib/table'; |
|
|
import Tag from 'antd/lib/tag'; |
|
|
import Tag from 'antd/lib/tag'; |
|
|
import notification from 'antd/lib/notification' |
|
|
|
|
|
|
|
|
import notification from 'antd/lib/notification'; |
|
|
|
|
|
|
|
|
const TabelaPessoas = ({ buttonRef, text, click }) => { |
|
|
const TabelaPessoas = ({ buttonRef, text, click }) => { |
|
|
const [tabelaDados, setTabelaDados ] = useState([]); |
|
|
|
|
|
const [carregando, setCarregando ] = useState(false); |
|
|
|
|
|
|
|
|
const [ tabelaDados, setTabelaDados ] = useState([]); |
|
|
|
|
|
const [ carregando, setCarregando ] = useState(false); |
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
setCarregando(true); |
|
|
setCarregando(true); |
|
|
@ -15,7 +15,7 @@ const TabelaPessoas = ({ buttonRef, text, click }) => { |
|
|
notification["error"]({ |
|
|
notification["error"]({ |
|
|
message: 'Tabela de Pessoas', |
|
|
message: 'Tabela de Pessoas', |
|
|
description: |
|
|
description: |
|
|
'Houve uma falha ao carregar a tabela das pessoas..', |
|
|
|
|
|
|
|
|
'Houve uma falha ao carregar a tabela das pessoas...', |
|
|
style: { |
|
|
style: { |
|
|
marginTop: 100 |
|
|
marginTop: 100 |
|
|
} |
|
|
} |
|
|
@ -25,51 +25,51 @@ const TabelaPessoas = ({ buttonRef, text, click }) => { |
|
|
method: "GET", |
|
|
method: "GET", |
|
|
url: "/services/pessoas", |
|
|
url: "/services/pessoas", |
|
|
credentials: "include", |
|
|
credentials: "include", |
|
|
sucess: (response) => { |
|
|
|
|
|
if(response.json) { |
|
|
|
|
|
|
|
|
success: (response) => { |
|
|
|
|
|
if (response.json) { |
|
|
setTabelaDados(response.json); |
|
|
setTabelaDados(response.json); |
|
|
setCarregando(false); |
|
|
setCarregando(false); |
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
|
|
|
} else { |
|
|
fail(); |
|
|
fail(); |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
fail: (e) => { |
|
|
fail: (e) => { |
|
|
console.log("Erro ao carregar dados"); |
|
|
|
|
|
|
|
|
console.log("Pessoas Fail.", e); |
|
|
fail(); |
|
|
fail(); |
|
|
} |
|
|
} |
|
|
}) |
|
|
|
|
|
|
|
|
}); |
|
|
}, []) |
|
|
}, []) |
|
|
|
|
|
|
|
|
const columns = [ |
|
|
const columns = [ |
|
|
{ |
|
|
{ |
|
|
title: 'Nome', |
|
|
title: 'Nome', |
|
|
dataIndex:'nome', |
|
|
|
|
|
key:'nome' |
|
|
|
|
|
|
|
|
dataIndex: 'nome', |
|
|
|
|
|
key: 'nome' |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
title: 'Cidade', |
|
|
title: 'Cidade', |
|
|
dataIndex:'cidade', |
|
|
|
|
|
key:'cidade' |
|
|
|
|
|
|
|
|
dataIndex: 'cidade', |
|
|
|
|
|
key: 'cidade' |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
title: 'Comunidades', |
|
|
title: 'Comunidades', |
|
|
dataIndex:'comunidades', |
|
|
|
|
|
key:'comunidades', |
|
|
|
|
|
|
|
|
dataIndex: 'comunidades', |
|
|
|
|
|
key: 'comunidades', |
|
|
render: (comunidades, data) => <> |
|
|
render: (comunidades, data) => <> |
|
|
{ |
|
|
{ |
|
|
comunidades.map((comunidade) => |
|
|
comunidades.map((comunidade) => |
|
|
<Tag key={comunidade.nome}>{comunidade.nome}</Tag>) |
|
|
|
|
|
|
|
|
<Tag key={comunidade.nome}>{comunidade.nome}</Tag> |
|
|
|
|
|
) |
|
|
} |
|
|
} |
|
|
</> |
|
|
</> |
|
|
} |
|
|
} |
|
|
] |
|
|
|
|
|
|
|
|
]; |
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
|
|
|
|
return ( |
|
|
<div> |
|
|
<div> |
|
|
<Table columns={columns} dataSource ={tabelaDados} loading ={carregando} /> |
|
|
|
|
|
|
|
|
<Table columns={ columns } dataSource={ tabelaDados } loading={carregando} /> |
|
|
</div> |
|
|
</div> |
|
|
) |
|
|
|
|
|
|
|
|
); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
TabelaPessoas.propTypes = { |
|
|
TabelaPessoas.propTypes = { |
|
|
|