diff --git a/src/Components/PasswordRecoveryComponents/Default.js b/src/Components/PasswordRecoveryComponents/Default.js
index ddbb4f43a3128596508fa1696a5fe4aa59820015..e7a45389a59a27e43ad925db4290a48d12b2c856 100644
--- a/src/Components/PasswordRecoveryComponents/Default.js
+++ b/src/Components/PasswordRecoveryComponents/Default.js
@@ -6,7 +6,7 @@ export default function Default (props) {
return (
<div style={{overflow:"hidden", display:"inline-block"}}>
<h2 style={{fontSize:"32px", fontWeight:"200", marginBottom:"20px"}}>Vamos encontrar a sua conta</h2>
- <form onSubmit={(e) => props.onSubmit(e)}>
+ <form onSubmit={(e) => { e.preventDefault(); props.onSubmit(e); }}>
<FormInput
inputType={"text"}
name={"email"}
diff --git a/src/Pages/ChangePasswordPage.js b/src/Pages/ChangePasswordPage.js
new file mode 100644
index 0000000000000000000000000000000000000000..cf552c07180f6e589cb39e9c697c50f4df2641cc
--- /dev/null
+++ b/src/Pages/ChangePasswordPage.js
@@ -0,0 +1,335 @@
+import React, { useState } from "react";
+import { BackgroundDiv } from '../Components/TabPanels/StyledComponents.js'
+import Paper from '@material-ui/core/Paper'
+import styled from 'styled-components'
+import FormInput from "../Components/FormInput.js"
+import { CompletarCadastroButton } from '../Components/TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js'
+import ValidateUserInput from '../Components/HelperFunctions/FormValidationFunction.js'
+import CustomizedBreadcrumbs from '../Components/TabPanels/Breadcrumbs.js'
+import { putRequest } from '../Components/HelperFunctions/getAxiosConfig'
+import Snackbar from '@material-ui/core/Snackbar'
+import MuiAlert from '@material-ui/lab/Alert'
+import Grid from '@material-ui/core/Grid'
+import IconButton from '@material-ui/core/IconButton'
+import VisibilityIcon from '@material-ui/icons/Visibility'
+import VisibilityOffIcon from '@material-ui/icons/VisibilityOff'
+
+function Alert(props) {
+ return <MuiAlert elevation={6} variant="filled" {...props} />;
+}
+
+export default function ChangePasswordPage(props) {
+
+ const [error, setError] = useState(false)
+ const [success, setSuccess] = useState(false)
+ const [time, setTime] = useState(5)
+
+ const [formPassword, setPassword] = useState(
+ {
+ key: false,
+ hidePass: true,
+ value: ""
+ }
+ )
+
+ const [formPasswordConfirmation, setPasswordConfirmation] = useState(
+ {
+ key: false,
+ hidePass: true,
+ value: ""
+ }
+ )
+
+ const [snackInfo, setSnackInfo] = useState({
+ open: false,
+ text: "",
+ severity: "",
+ });
+
+ const handleChange = (e, field) => {
+ const userInput = e.target.value;
+ const flag = ValidateUserInput('password', userInput);
+
+ if (field === "password") {
+ setPassword({
+ ...formPassword,
+ key: flag,
+ value: userInput
+ })
+ } else {
+ setPasswordConfirmation({
+ ...formPasswordConfirmation,
+ key: flag,
+ value: userInput
+ })
+ }
+
+ }
+
+ const onSubmit = () => {
+ const flag = ValidateUserInput('confirmation', formPassword.value, formPasswordConfirmation.value);
+
+ if (flag === true) {
+ const snackInfo = {
+ open: true,
+ text: "As senhas inseridas não são iguais",
+ severity: "warning",
+ }
+ handleSnackInfo(snackInfo)
+ } else {
+ //console.log("senha bate");
+ if (!formPassword.key && !formPasswordConfirmation.key) {
+ console.log("senha bate");
+
+ const urlParams = new URLSearchParams(window.location.search);
+ const clientId = urlParams.get("client_id");
+ const config = urlParams.get("config");
+ const expiry = urlParams.get("expiry");
+ const resetPassword = urlParams.get("reset_password");
+ const token = urlParams.get("token");
+ const uid = urlParams.get("uid");
+
+ const url = `/auth/password`
+
+ const payload = {
+ "password": formPassword.value,
+ "password_confirmation": formPasswordConfirmation.value,
+ "client": clientId,
+ "config": config,
+ "expiry": expiry,
+ "reset_password": resetPassword,
+ "access-token": token,
+ "uid": uid
+ }
+
+ putRequest(
+ url,
+ payload,
+ () => {
+ setSuccess(true)
+ let count = 0;
+ const snackInfo = {
+ open: true,
+ text: "Sua senha foi atualizada!",
+ severity: "success",
+ }
+ handleSnackInfo(snackInfo)
+ const intervalId = setInterval(() => {
+ count++;
+ setTime((previousTime) => previousTime - 1)
+ if (count === 5) {
+ window.location.href = "/"
+ clearInterval(intervalId)
+ }
+ }, 1000)
+ },
+ (error) => {
+ setError(true)
+ let count = 0;
+ const snackInfo = {
+ open: true,
+ text: "Houve um erro durante a requisição de troca de senha",
+ severity: "error",
+ }
+ handleSnackInfo(snackInfo)
+ const intervalId = setInterval(() => {
+ count++;
+ setTime((previousTime) => previousTime - 1)
+ if (count === 5) {
+ window.location.href = "/"
+ clearInterval(intervalId)
+ }
+ }, 1000)
+ }
+ )
+ }
+ }
+ }
+
+ const handleSnackInfo = (info) => {
+ setSnackInfo({ ...info })
+ }
+
+ const handleCloseSnack = () => {
+ const snackInfo = {
+ open: false,
+ text: "",
+ severity: "",
+ }
+ handleSnackInfo(snackInfo)
+ }
+
+ const handleStateHideFormPass = () => {
+ setPassword({
+ ...formPassword,
+ hidePass: !formPassword.hidePass
+ })
+ }
+
+ const handleStateHideConfFormPass = () => {
+ setPasswordConfirmation({
+ ...formPasswordConfirmation,
+ hidePass: !formPasswordConfirmation.hidePass
+ })
+ }
+
+ if (error)
+ return (
+ <BackgroundDiv>
+ <Snackbar
+ open={snackInfo.open}
+ autoHideDuration={6000}
+ onClose={handleCloseSnack}
+ anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+ >
+ <Alert onClose={handleCloseSnack} severity={snackInfo.severity}>
+ {snackInfo.text}
+ </Alert>
+ </Snackbar>
+ <div>
+ <CustomizedBreadcrumbs
+ values={["Recuperar senha", "Alterar senha"]}
+ />
+ </div>
+ <div style={{ justifyContent: "center", textAlign: "center", maxWidth: "600px", margin: "auto" }}>
+ <Paper elevation={3}>
+ <CardDiv>
+ <div style={{ overflow: "hidden", display: "inline-block" }}>
+ <h2 style={{ fontSize: "32px", fontWeight: "200", marginBottom: "20px", lineHeight: '35px' }}>
+ Ocorreu um erro. Por favor, tente novamente mais tarde. Você será redirecionado para a home em... <StyledTimer>{time}</StyledTimer>
+ </h2>
+ </div>
+ </CardDiv>
+ </Paper>
+ </div>
+ </BackgroundDiv>
+ )
+ else if (success)
+ return (
+ <BackgroundDiv>
+ <Snackbar
+ open={snackInfo.open}
+ autoHideDuration={6000}
+ onClose={handleCloseSnack}
+ anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+ >
+ <Alert onClose={handleCloseSnack} severity={snackInfo.severity}>
+ {snackInfo.text}
+ </Alert>
+ </Snackbar>
+ <div>
+ <CustomizedBreadcrumbs
+ values={["Recuperar senha", "Alterar senha"]}
+ />
+ </div>
+ <div style={{ justifyContent: "center", textAlign: "center", maxWidth: "600px", margin: "auto" }}>
+ <Paper elevation={3}>
+ <CardDiv>
+ <div style={{ overflow: "hidden", display: "inline-block" }}>
+ <h2 style={{ fontSize: "32px", fontWeight: "200", marginBottom: "20px", lineHeight: '35px' }}>
+ Sua senha foi alterada com sucesso. Você será redirecionado para a home em... <StyledTimer>{time}</StyledTimer>
+ </h2>
+ </div>
+ </CardDiv>
+ </Paper>
+ </div>
+ </BackgroundDiv>
+ )
+ else
+ return (
+ <BackgroundDiv>
+ <Snackbar
+ open={snackInfo.open}
+ autoHideDuration={6000}
+ onClose={handleCloseSnack}
+ anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+ >
+ <Alert onClose={handleCloseSnack} severity={snackInfo.severity}>
+ {snackInfo.text}
+ </Alert>
+ </Snackbar>
+ <div>
+ <CustomizedBreadcrumbs
+ values={["Recuperar senha", "Alterar senha"]}
+ />
+ </div>
+ <div style={{ justifyContent: "center", textAlign: "center", maxWidth: "600px", margin: "auto" }}>
+ <Paper elevation={3}>
+ <CardDiv>
+ <div style={{ overflow: "hidden", display: "inline-block" }}>
+ <h2 style={{ fontSize: "32px", fontWeight: "200", marginBottom: "20px" }}>Confirme a nova senha</h2>
+ <form onSubmit={(e) => { e.preventDefault(); onSubmit(e); }}>
+ <Grid container direction='row' alignItems='center' spacing={1}>
+ <Grid item xs={10}>
+ <FormInput
+ inputType={formPassword.hidePass ? "password" : ""}
+ name={"senha"}
+ value={formPassword.value}
+ placeholder={"Senha"}
+ handleChange={e => handleChange(e, 'password')}
+ required={true}
+ error={formPassword.key}
+ help={formPassword.key ? (formPassword.value.length === 0 ? "Faltou digitar sua senha." : "A senha precisa ter no mÃnimo 8 caracteres.") : ""}
+ />
+ </Grid>
+ <Grid item xs={2}>
+ {
+ formPassword.hidePass ?
+ <IconButton onClick={handleStateHideFormPass}>
+ <VisibilityIcon />
+ </IconButton>
+ :
+ <IconButton onClick={handleStateHideFormPass}>
+ <VisibilityOffIcon />
+ </IconButton>
+ }
+ </Grid>
+ </Grid>
+ <br />
+ <Grid container direction='row' alignItems='center' spacing={1}>
+ <Grid item xs={10}>
+ <FormInput
+ inputType={formPasswordConfirmation.hidePass ? "password" : ""}
+ name={"confirme a senha"}
+ value={formPasswordConfirmation.value}
+ placeholder={"Confirme a senha"}
+ handleChange={e => handleChange(e, 'confirmation')}
+ required={true}
+ error={formPasswordConfirmation.key}
+ help={formPasswordConfirmation.key ? (formPasswordConfirmation.value.length === 0 ? "Faltou confirmar sua senha." : "A confirmação precisa ser igual a senha.") : ""}
+ />
+ </Grid>
+ <Grid item xs={2}>
+ {
+ formPasswordConfirmation.hidePass ?
+ <IconButton onClick={handleStateHideConfFormPass}>
+ <VisibilityIcon />
+ </IconButton>
+ :
+ <IconButton onClick={handleStateHideConfFormPass}>
+ <VisibilityOffIcon />
+ </IconButton>
+ }
+ </Grid>
+ </Grid>
+ <div style={{ display: "flex", justifyContent: "center" }}>
+ <CompletarCadastroButton type="submit" >ATUALIZAR SENHA</CompletarCadastroButton>
+ </div>
+ </form>
+ </div>
+ </CardDiv>
+ </Paper>
+ </div>
+ </BackgroundDiv>
+ )
+}
+
+const CardDiv = styled.div`
+ background-color : #fff;
+ box-shadow : 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
+ padding : 20px 30px;
+ margin : 50px 0;
+`
+const StyledTimer = styled.span`
+ color: #00bcd4;
+`
\ No newline at end of file
diff --git a/src/Pages/PasswordRecoveryPage.js b/src/Pages/PasswordRecoveryPage.js
index 010a164ba112a342e7e01e14fc2c5ba2bc38a1ff..4a6b25728b3353b725ab5ad31287d67b3baf7abc 100644
--- a/src/Pages/PasswordRecoveryPage.js
+++ b/src/Pages/PasswordRecoveryPage.js
@@ -42,13 +42,13 @@ export default function PasswordRecoveryPage (props) {
handleChangeSwitch((data.success ? "success" : "error"))
}
const onSubmit = (e) => {
- e.stopPropagation()
+ e.preventDefault()
const url = `/auth/password`
const payload = {
"email" : formEmail.value,
- "redirect_url" : "https://plataformaintegrada.mec.gov.br/recuperar-senha#/alterar-senha"
+ "redirect_url" : "http://localhost:4000/recuperar-senha/alterar-senha" // ### arrumar "https://plataformaintegrada.mec.gov.br/recuperar-senha/alterar-senha"
}
postRequest(url, payload, handleSuccessfulSubmit, (error) => {console.log(error)})
@@ -77,7 +77,7 @@ export default function PasswordRecoveryPage (props) {
return (
<>
<BackgroundDiv>
- <div style={{minWidth:"1170px"}}>
+ <div>
<CustomizedBreadcrumbs
values={["Recuperar senha"]}
/>