Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Rede De Mentores
Frontend
Commits
8ead62b8
Commit
8ead62b8
authored
Jun 24, 2020
by
Gustavo Vidaletti
Browse files
WIP: Listagem Usuarios
parent
4b835ea7
Changes
8
Hide whitespace changes
Inline
Side-by-side
src/components/RedeHeader/RedeHeader.jsx
View file @
8ead62b8
...
...
@@ -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
(
'
/
'
);
}
...
...
src/pages/listagemUsuarios/StyledComponents/ControleFlutuante.jsx
0 → 100644
View file @
8ead62b8
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
;
src/pages/listagemUsuarios/StyledComponents/Tabela.jsx
0 → 100644
View file @
8ead62b8
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
;
src/pages/listagemUsuarios/StyledComponents/Titulo.jsx
0 → 100644
View file @
8ead62b8
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
;
src/pages/listagemUsuarios/StyledComponents/index.jsx
0 → 100644
View file @
8ead62b8
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
;
src/pages/listagemUsuarios/listagemUsuarios.jsx
0 → 100644
View file @
8ead62b8
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
;
src/routes.js
View file @
8ead62b8
...
...
@@ -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
>
);
...
...
src/services/user.js
View file @
8ead62b8
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
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment