Smart/smartEnergyView-frontend
2
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

✨ add forgot password and pld pages

Browse Source
This commit is contained in:
joseCorte-exe 2022-05-16 17:30:12 -03:00
parent 5d28dbe930
commit b224c837cd
14 changed files with 298 additions and 262 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/assets/logout.svg
View File

@ -1,3 +1,3 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill="none" stroke="#FFF" stroke-width="2" d="M13,9 L13,2 L1,2 L1,22 L13,22 L13,15 M22,12 L5,12 M17,7 L22,12 L17,17"/>
<path fill="none" stroke="#F00" stroke-width="2" d="M13,9 L13,2 L1,2 L1,22 L13,22 L13,15 M22,12 L5,12 M17,7 L22,12 L17,17"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 222 B

After

Width:  |  Height:  |  Size: 222 B

2
src/components/mapCard/MapCard.tsx
View File

@ -14,7 +14,6 @@ export default function MapCard({ title, subtitle, statistic, imgSource }: MapCa
const route = title==='R$/MWh'? '/consumption': `pld/${title.slice(0,2).toLocaleLowerCase()}-${title.slice(3,5).toLocaleLowerCase()}`
return (
<Link href={route} >
<MapCardView>
<Image src={imgSource} width={110} height={110}/>
<div>
@ -33,6 +32,5 @@ export default function MapCard({ title, subtitle, statistic, imgSource }: MapCa
</article>
</div>
</MapCardView>
</Link>
)
}

2
src/components/mapCard/MapCardView.ts
View File

@ -9,8 +9,6 @@ export const MapCardView = styled.figure`
margin-right: 25px;
cursor: pointer;
* {
margin: 0;
padding: 0;

2
src/components/sidebar/Sidebar.tsx
View File

@ -38,7 +38,7 @@ export default function Sidebar() {
<Link href='/news'><li className={router.pathname=='/news'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'Notícias >'}</li></Link>
<Link href='#'><li className={router.pathname=='/sectorialInfo'? 'actualPath' : null}><Image src='/assets/sidebar/sectorialInfoIcon.svg' width={25} height={25} />{'Info Setorial >'}</li></Link>
<Link href='/consumption'><li className={router.pathname=='/consumption'? 'actualPath' : null} ><Image src='/assets/sidebar/consumptionIcon.svg' width={25} height={25} />{'Consumo'}</li></Link>
<Link href='#'><li className={router.pathname=='/notification'? 'actualPath' : null}><Image src='/assets/sidebar/notificationsIcon.svg' width={25} height={25} />{'Notificação >'}</li></Link>
<Link href='/notifications'><li className={router.pathname=='/notification'? 'actualPath' : null}><Image src='/assets/sidebar/notificationsIcon.svg' width={25} height={25} />{'Notificação >'}</li></Link>
<Link href='/aboutUs'><li className={router.pathname=='/aboutUs'? 'actualPath' : null}><Image src='/assets/sidebar/dashboardIcon.svg' width={25} height={25} />{'Sobre Nós >'}</li></Link>
<Link href='/faq'><li className={router.pathname=='/faq'? 'actualPath' : null}><Image src='/assets/sidebar/saqIcon.svg' width={25} height={25} />{'FAQ >'}</li></Link>
<Link href='/'><button><Image src='/assets/logout.svg' width={25} height={25} />{'Sair'}</button></Link>

3
src/components/sidebar/SidebarView.ts
View File

@ -130,7 +130,6 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
width: 10rem;
height: 3rem;
background-color: red;
border-style: none;
border-radius: 6px;
@ -138,7 +137,7 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
font-family: 'Poppins';
font-weight: 600;
font-size: 99.98%;
color: #fff;
color: #f00;
cursor: pointer;
}

17
src/pages/dashboard.tsx
View File

@ -6,19 +6,22 @@ import MapCard from '../components/mapCard/MapCard'
import GraphCard from '../components/graph/graphCard/ChartCard'
import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import Link from 'next/link'
export default function Dashboard() {
return (
<DashboardView>
<Header name='' />
<PageTitle title='Visão Geral' subtitle='Bem Vindo a Smart Energia' />
<section className="cardsSection" >
<MapCard title='R$/MWh' subtitle='abril / 22' statistic='' imgSource='/moneyIcon.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
</section>
<Link href={'pld'} >
<section className="cardsSection" >
<MapCard title='R$/MWh' subtitle='abril / 22' statistic='' imgSource='/moneyIcon.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
</section>
</Link>
<section className='dashboard'>
<GraphCard title='Consumo' subtitle='Gráfico de Consumo' consumption={25} />

4
src/pages/forgotPassword.tsx
View File

@ -25,8 +25,8 @@ export default function ForgotPassword() {
<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="Senha" onChange={value => setPassword(value.target.value)} variant="outlined"/>
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }} label="Confirmar Senha" onChange={value => setConfirmPassword(value.target.value)} variant="outlined"/>
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }} value={password} label="Senha" onChange={value => setPassword(value.target.value)} variant="outlined"/>
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }} value={confirmPassword} label="Confirmar Senha" onChange={value => setConfirmPassword(value.target.value)} variant="outlined"/>
<LoginButton title='Redefinir Senha' onClick={() => router.push('/')} />

27
src/pages/notifications.tsx Normal file
View File

@ -0,0 +1,27 @@
import React from 'react'
import CommonQuestionsCard from '../components/faqQuestionsCard/FaqQuestionsCard'
import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import { FaqView } from '../styles/layouts/commonQuestions/FaqView'
export default function Notifications() {
return (
<FaqView>
<Header name='' />
<PageTitle title='Notifications' subtitle='' />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<section className='CommonQuestionsSection' >
<CommonQuestionsCard />
<hr />
<CommonQuestionsCard />
<hr />
<CommonQuestionsCard />
<hr />
<CommonQuestionsCard />
<hr />
<CommonQuestionsCard />
<hr />
</section>
</FaqView>
)
}

229
src/pages/pld/[region].tsx
View File

@ -1,229 +0,0 @@
import React, { useEffect, useState } from 'react'
import Image from 'next/Image'
import { useRouter } from 'next/router'
import Header from '../../components/header/Header'
import MenuItem from '@mui/material/MenuItem';
import Select, { SelectChangeEvent } from '@mui/material/Select';
import { PldGraphView, PldTableView } from '../../styles/layouts/pld/PldView'
import RenderIf from '../../utils/renderIf'
import BasicButton from '../../components/buttons/basicButton/BasicButton';
import Chart from '../../components/graph/Chart';
export default function region() {
const router = useRouter()
const { region } = router.query
const [page, setPage] = useState<number>(1)
const [age, setAge] = React.useState('');
const handleChange = (event: SelectChangeEvent) => {
setAge(event.target.value);
};
useEffect(() => {
console.log(page)
}, [page])
return (
<main style={{
width: '100%',
}}>
<Header name='' />
<RenderIf isTrue={page===1? true : false}>
<PldTableView>
<section className='images' >
<Image src='/assets/logo.svg' width={150} height={150} />
<Image src='/assets/logo.svg' width={150} height={150} />
</section>
<table className="tg">
<thead>
<tr>
<th className='tg-8oo6'>Mês</th>
<th className='tg-8oo6'>Nordeste</th>
<th className='tg-8oo6'>Norte</th>
<th className='tg-8oo6'>Sudeste</th>
<th className='tg-8oo6'>Sul</th>
</tr>
</thead>
<tbody>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>122,269</td>
<td className='tg-gceh'>COPEL COM I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>110,348</td>
<td className='tg-hq65'>EMEWE I5</td>
<td className='tg-0tzy'>190,16</td>
</tr>
<tr>
<td className="tg-gceh">Unidade - 9500130</td>
<td className="tg-uulg">Compra</td>
<td className="tg-gceh">13,074</td>
<td className="tg-gceh">PACTO COMERCIALIZADORA I5</td>
<td className="tg-gceh">300,36</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>133,117</td>
<td className='tg-hq65'>COPEL COM I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>120,138</td>
<td className='tg-gceh'>EMEWE I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>14,897</td>
<td className='tg-hq65'>PACTO COMERCIALIZADORA I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>120,138</td>
<td className='tg-gceh'>EMEWE I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>14,897</td>
<td className='tg-hq65'>PACTO COMERCIALIZADORA I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>120,138</td>
<td className='tg-gceh'>EMEWE I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>14,897</td>
<td className='tg-hq65'>PACTO COMERCIALIZADORA I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>120,138</td>
<td className='tg-gceh'>EMEWE I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>14,897</td>
<td className='tg-hq65'>PACTO COMERCIALIZADORA I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>120,138</td>
<td className='tg-gceh'>EMEWE I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>14,897</td>
<td className='tg-hq65'>PACTO COMERCIALIZADORA I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
<tr>
<td className='tg-gceh'>Unidade - 9500130</td>
<td className='tg-uulg'>Compra</td>
<td className='tg-gceh'>120,138</td>
<td className='tg-gceh'>EMEWE I5</td>
<td className='tg-uulg'>234,67</td>
</tr>
<tr>
<td className='tg-hq65'>Unidade - 9500130</td>
<td className='tg-0tzy'>Compra</td>
<td className='tg-hq65'>14,897</td>
<td className='tg-hq65'>PACTO COMERCIALIZADORA I5</td>
<td className='tg-0tzy'>300,36</td>
</tr>
</tbody>
</table>
<section>
<article>
<p>Valores Diarios: </p>
<p>R$100,00</p>
</article>
<article>
<p>Valores Horários: </p>
<p>R$100,00</p>
</article>
</section>
</PldTableView>
</RenderIf>
<RenderIf isTrue={page===2? true : false}>
<PldGraphView>
<section className='images' >
<Image src='/assets/logo.svg' width={150} height={150} />
<Image src='/assets/logo.svg' width={150} height={150} />
</section>
<section className='toolsbar'>
<div className='select'>
<Select
value={age}
onChange={handleChange}
displayEmpty
sx={{
width: '100%'
}}
>
<MenuItem value={0}>Filial 3</MenuItem>
<MenuItem value={10}>Filial 3</MenuItem>
<MenuItem value={20}>Twenty</MenuItem>
<MenuItem value={30}>Thirty</MenuItem>
</Select>
</div>
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09"/>
<BasicButton title='Download (csv)' />
</section>
<Chart title='' />
</PldGraphView>
</RenderIf>
<RenderIf isTrue={page===3? true : false}>
<PldGraphView>
<section className='images' >
<Image src='/assets/logo.svg' width={150} height={150} />
<Image src='/assets/logo.svg' width={150} height={150} />
</section>
<section className='toolsbar'>
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09"/>
<BasicButton title='Download (csv)' />
</section>
<Chart title='' />
</PldGraphView>
</RenderIf>
<footer>
<label onClick={() => page>1? setPage(page-1) : null} >voltar {page} </label>
<label onClick={() => page<3? setPage(page+1) : null} >avançar</label>
</footer>
</main>
)
}

217
src/pages/pld/index.tsx Normal file
View File

@ -0,0 +1,217 @@
import React, { useEffect, useState } from 'react'
import Image from 'next/Image'
import { useRouter } from 'next/router'
import Header from '../../components/header/Header'
import MenuItem from '@mui/material/MenuItem';
import Select, { SelectChangeEvent } from '@mui/material/Select';
import { GoBack, PldGraphView, PldTableView } from '../../styles/layouts/pld/PldView'
import RenderIf from '../../utils/renderIf'
import BasicButton from '../../components/buttons/basicButton/BasicButton';
import Chart from '../../components/graph/Chart';
import PageTitle from '../../components/pageTitle/PageTitle';
import Link from 'next/link';
export default function region() {
const router = useRouter()
const { region } = router.query
const [page, setPage] = useState<string>('table')
const [age, setAge] = React.useState('');
const handleChange = (event: SelectChangeEvent) => {
setAge(event.target.value);
};
useEffect(() => {
console.log(page)
}, [page])
return (
<main style={{
width: '100%',
}}>
<Header name='' />
<RenderIf isTrue={page==='table'? true : false}>
<Link href='/dashboard' >{'< voltar para visão geral'}</Link>
<PageTitle title='Tabela de consumo Pld' subtitle=''/>
<PldTableView>
<table className="tg">
<thead>
<tr>
<th className='tg-8oo6'>Mês</th>
<th className='tg-8oo6'>Nordeste</th>
<th className='tg-8oo6'>Norte</th>
<th className='tg-8oo6'>Sudeste</th>
<th className='tg-8oo6'>Sul</th>
</tr>
</thead>
<tbody>
<tr>
<td className='tg-gceh'>2101</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-hq65'>2102</td>
<td className='tg-0tzy'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-0tzy'>xxxx</td>
</tr>
<tr>
<td className="tg-gceh">2103</td>
<td className="tg-uulg">xxxx</td>
<td className="tg-gceh">xxxx</td>
<td className="tg-gceh">xxxx</td>
<td className="tg-gceh">xxxx</td>
</tr>
<tr>
<td className='tg-hq65'>2104</td>
<td className='tg-0tzy'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-0tzy'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>2105</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-hq65'>2106</td>
<td className='tg-0tzy'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-0tzy'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>2107</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-hq65'>2108</td>
<td className='tg-0tzy'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-0tzy'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>2109</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-hq65'>2110</td>
<td className='tg-0tzy'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-0tzy'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>2111</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-hq65'>2112</td>
<td className='tg-0tzy'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-hq65'>xxxx</td>
<td className='tg-0tzy'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>2021</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>Mín</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>Max</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
<tr>
<td className='tg-gceh'>Desv Pad</td>
<td className='tg-uulg'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-gceh'>xxxx</td>
<td className='tg-uulg'>xxxx</td>
</tr>
</tbody>
</table>
<section>
<article onClick={() => setPage('perMouth')}>
<p>Valores Diarios: R$100,00</p>
</article>
<article onClick={() => setPage('perDate')}>
<p>Valores Horários: R$100,00</p>
</article>
</section>
</PldTableView>
</RenderIf>
<RenderIf isTrue={page==='perMouth'? true : false}>
<GoBack onClick={() => setPage('table')}>{'< voltar para tabela pld'}</GoBack>
<PageTitle title='Consumo por mês' subtitle=''/>
<PldGraphView>
<section className='toolsbar'>
<div className='select'>
<Select
value={age}
onChange={handleChange}
displayEmpty
sx={{
width: '100%'
}}
>
<MenuItem value={0}>Filial 3</MenuItem>
<MenuItem value={10}>Filial 3</MenuItem>
<MenuItem value={20}>Twenty</MenuItem>
<MenuItem value={30}>Thirty</MenuItem>
</Select>
</div>
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09"/>
<BasicButton title='Download (csv)' />
</section>
<Chart title='' />
</PldGraphView>
</RenderIf>
<RenderIf isTrue={page==='perDate'? true : false}>
<GoBack onClick={() => setPage('table')}>{'< voltar para tabela pld'}</GoBack>
<PldGraphView>
<PageTitle title='Consumo por dia' subtitle=''/>
<section className='toolsbar'>
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09"/>
<BasicButton title='Download (csv)' />
</section>
<Chart title='' />
</PldGraphView>
</RenderIf>
</main>
)
}

45
src/pages/verifyEmail.tsx
View File

@ -5,14 +5,15 @@ import { useRouter } from 'next/router'
import LoginButton from '../components/buttons/loginButton/LoginButton';
import TextField from '@mui/material/TextField';
import {AiOutlineEyeInvisible, AiOutlineEye} from 'react-icons/ai';
import Alert from '@mui/material/Alert';
import { ForgotPasswordContainer, ForgotPasswordView } from '../styles/layouts/forgotPassword/ForgotPasswordView';
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 [code, setCode]=useState<string>('')
const [codeStatus, setCodeStatus]=useState<boolean>(null)
const [values, setValues] = React.useState({
password: '',
@ -22,17 +23,23 @@ export default function VerifyEmail() {
const router = useRouter()
const rota = router.pathname
useEffect(() => {
if (code === '0000') {
router.push('/forgotPassword')
}
}, [code])
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} />
@ -41,14 +48,20 @@ export default function VerifyEmail() {
<h2>Estratégias Inteligentes em<br /> Gestão de Energia</h2>
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }}label="Email" variant="outlined"/>
{
sent?
<TextField id="outlined-basic" sx={{ m: 1, width: '90%' }}label="Codigo de verificação" variant="outlined" onChange={value => setCode(value.target.value)} />
:
null
}
<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>

2
src/styles/app/AppView.ts
View File

@ -3,6 +3,8 @@ import styled from 'styled-components'
export const AppView = styled.main`
display: flex;
height: 100%;
margin: 0 0 10rem 0;
padding: 0;

2
src/styles/layouts/dashboard/DashboardView.ts
View File

@ -27,6 +27,8 @@ export const DashboardView = styled.main`
box-shadow: 0px 0px 15px -3px rgba(0,0,0,0.1);
border-radius: 10px;
cursor: pointer;
}
.dashboard {

6
src/styles/layouts/pld/PldView.ts
View File

@ -118,6 +118,8 @@ export const PldTableView = styled.main`
-webkit-box-shadow: 0 0 11px rgba(0, 0, 0, 0.2) ;
-moz-box-shadow: 0 0 11px rgba(0, 0, 0, 0.2) ;
background: #F8F8F8;
cursor: pointer;
}
}
@ -182,3 +184,7 @@ export const PldGraphView = styled.main`
}
}
`
export const GoBack = styled.label`
cursor: pointer
`