Commit 8ead62b8 authored by Gustavo Vidaletti's avatar Gustavo Vidaletti
Browse files

WIP: Listagem Usuarios

parent 4b835ea7
......@@ -27,7 +27,7 @@ const RedeHeader = (props) => {
useEffect(() => { // ComponentDidMount
setTitle(''); // TODO: Tirar esse setTitle();
const tknValue = sessionStorage.getItem('token');
const path = props.location.pathname;
const path = props && props.location && props.location.pathname ? props.location.pathname : '';
if (!tknValue && excludedPaths.indexOf(path) === -1 && !String(path).match(/(nova-senha\/.*)/)) {
history.push('/');
}
......
import styled from 'styled-components';
import COLOR from '../../../utils/colors.constants';
const ControleFlutuante = styled.div`
position: fixed;
top: 80px;
left: 12px;
background-color: #FFFFFF;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
border-radius: 4px;
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{
border-color: ${COLOR.AZUL};
}
`;
export default ControleFlutuante;
import styled from 'styled-components';
import COLOR from '../../../utils/colors.constants';
const Tabela = styled.table`
border-collapse: collapse;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
user-select: none;
margin-bottom: 80px;
thead{
background-color: ${COLOR.AZUL};
color: #FFFFFF;
tr > th{
color: white;
padding: 16px 8px;
}
tr > .select-cell {
text-align: right;
}
}
tbody{
tr{
transition: background-color 0.4s ease;
&:nth-child(even){
background-color: #EFEFEF;
}
&:hover{
background-color: #DEDEDE;
}
td{
padding: 16px;
}
}
}
`;
export default Tabela;
import styled from 'styled-components';
import COLOR from '../../../utils/colors.constants';
const Titulo = styled.div`
font-size: 2.5rem;
text-align: center;
padding: 40px;
color: ${COLOR.AZUL};
font-weight: 600;
`;
export default Titulo;
import styled from 'styled-components';
const StyledContainer = styled.div`
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
height: calc(100vh - 75px);
`;
export default StyledContainer;
import React, { useState, useEffect } from 'react';
import { useSnackbar } from 'notistack';
import { Container, Select, MenuItem, FormControl, InputLabel } from '@material-ui/core';
import StyledContainer from './StyledComponents';
import Titulo from './StyledComponents/Titulo';
import Tabela from './StyledComponents/Tabela';
import ControleFlutuante from './StyledComponents/ControleFlutuante';
import { getAll } from '../../services/user';
function ListagemUsuarios() {
const { enqueueSnackbar } = useSnackbar();
const [usuarios, setUsuarios] = useState([]);
const [tipo, setTipo] = useState(1);
const enqueue = (msg = '', variant = 'error', autoHideDuration = 2500) => {
enqueueSnackbar(msg, { variant, autoHideDuration });
};
useEffect(() => {
const tkn = sessionStorage.getItem('token');
getAll(
{ headers: { Authorization: `Bearer ${tkn}` } },
).then((resp) => setUsuarios(resp))
.catch(() => enqueue('Erro ao pesquisar usuários!'));
}, []);
return (
<Container>
<StyledContainer>
<ControleFlutuante>
<FormControl variant="outlined">
<Select
value={tipo}
onChange={(e) => setTipo(e.target.value)}
>
<MenuItem value={1}>Mentores</MenuItem>
<MenuItem value={2}>Mentorados</MenuItem>
</Select>
</FormControl>
</ControleFlutuante>
<Titulo>Listagem de Usuários</Titulo>
<Tabela>
<thead>
<tr>
<th>Nome</th>
<th>Email</th>
<th>CPF</th>
<th>Telefone</th>
<th>Tipo</th>
</tr>
</thead>
<tbody>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Teste</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
<tr>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
</tr>
<tr>
<td>Testeeeeeeeeeeee</td>
<td>Teste</td>
<td>Teste</td>
<td>Testeeeeeeeeeeee</td>
<td>Testeeeeeeeeeeee</td>
</tr>
</tbody>
</Tabela>
</StyledContainer>
</Container >
);
}
export default ListagemUsuarios;
......@@ -13,6 +13,7 @@ import Administrador from './pages/adm/Adm';
import Mentorado from './pages/mentorado/Mentorado';
import RedeHeader from './components/RedeHeader/RedeHeader';
import NovaSenha from './pages/novaSenha/novaSenha';
import ListagemUsuarios from './pages/listagemUsuarios/listagemUsuarios';
export default function Routes() {
return (
......@@ -33,6 +34,7 @@ export default function Routes() {
<Route path="/administrador" component={Administrador} />
<Route path="/mentorado" component={Mentorado} />
<Route path="/nova-senha/:id" component={NovaSenha} />
<Route path="/listagem-usuarios" component={ListagemUsuarios} />
</Switch>
</BrowserRouter>
);
......
import { client as Http } from './http';
export const login = (data) => Http.post('/login', data);
export const getAll = (data) => Http.get('/allUsers', data);
export const cadastrarUsuario = (data) => Http.post('/users', data);
export const esqueceuSenha = (data) => Http.post('/passwordRecuperationLink', data);
export const resetarSenha = (data) => Http.post('/setPassword', data);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment