2022-05-16 17:30:12 -03:00

76 lines
2.5 KiB
TypeScript

import React, { useEffect, useState } from 'react'
import Image from 'next/image';
import { useRouter } from 'next/router'
import LoginButton from '../components/buttons/loginButton/LoginButton';
import TextField from '@mui/material/TextField';
import Alert from '@mui/material/Alert';
import { VerifyEmailContainer, VerifyEmailView } from '../styles/layouts/forgotPassword/verifyEmail';
import RenderIf from '../utils/renderIf';
export default function VerifyEmail() {
const [sent, setSent]=useState(false);
const [code, setCode]=useState<string>('')
const [codeStatus, setCodeStatus]=useState<boolean>(null)
const [values, setValues] = React.useState({
password: '',
showPassword: false,
});
const router = useRouter()
const rota = router.pathname
useEffect(() => {
setCode('')
setSent(false)
setCodeStatus(null)
}, [rota])
function verifyConfirmationCode() {
if (code === '0000') {
setTimeout(() => {
router.push('/')
}, 2500);
setCodeStatus(true)
} else {
setCodeStatus(false)
}
}
return (
<VerifyEmailView auth={rota} >
<Image src='/assets/marca1.svg' width={500} height={500} />
<VerifyEmailContainer>
<h1>Bem-Vindo</h1>
<h2>Estratégias Inteligentes em<br /> Gestão de Energia</h2>
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }}label="Email" variant="outlined"/>
<RenderIf isTrue={sent? false : true}>
<LoginButton title='Enviar Email' onClick={() => setSent(true)} />
</RenderIf>
<RenderIf isTrue={sent? true : false}>
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }}label="Codigo de verificação" variant="outlined" onChange={value => setCode(value.target.value)} />
<LoginButton title='Continuar' onClick={() => {verifyConfirmationCode()}} />
<RenderIf isTrue={codeStatus===true? true : false} >
<Alert severity="success">Codigo de veerificação aceito aguarde um instante!</Alert>
</RenderIf>
<RenderIf isTrue={codeStatus===false? true : false} >
<Alert severity="warning">Codigo de verificação invalido tente outro!</Alert>
</RenderIf>
</RenderIf>
<fieldset className="line">
<legend className="text">Ou</legend>
</fieldset>
<p><a href='tel:+55(41) 3012-5900' >+55(41) 3012-5900</a><br/><a href='https://www.energiasmart.com.br' >www.energiasmart.com.br</a></p>
</VerifyEmailContainer>
</VerifyEmailView>
)
}