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

fix

Browse Source
This commit is contained in:
joseCorte-exe 2023-03-02 18:15:20 -03:00
parent a8dd640f39
commit fc460bf343
5 changed files with 360 additions and 310 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

399
src/components/administrativeTables/ClientsTable.tsx
View File

@ -10,23 +10,23 @@ import TablePagination from '@mui/material/TablePagination';
import TableRow from '@mui/material/TableRow'; import TableRow from '@mui/material/TableRow';
import TableSortLabel from '@mui/material/TableSortLabel'; import TableSortLabel from '@mui/material/TableSortLabel';
import { visuallyHidden } from '@mui/utils'; import { visuallyHidden } from '@mui/utils';
import React, { useState, useEffect } from 'react'; import React, { useEffect, useState } from 'react';
import Image from 'next/image' import Image from 'next/image';
import Snackbar from '@mui/material/Snackbar';
import MuiAlert, { AlertProps } from '@mui/material/Alert'; import MuiAlert, { AlertProps } from '@mui/material/Alert';
import Snackbar from '@mui/material/Snackbar';
import Modal from '@mui/material/Modal'; import Modal from '@mui/material/Modal';
import FormData from 'form-data' import { FormControl, InputLabel, MenuItem, Select, TextField, Typography } from '@mui/material';
import { InputUploadView } from '../inputUploadImg/inputUploadView' import FormData from 'form-data';
import { FormControl, InputLabel, MenuItem, Select, TextField, Typography } from '@mui/material' import { InputUploadView } from '../inputUploadImg/inputUploadView';
import { TableView, StyledStatus } from './TableView';
import { api } from '../../services/api'; import { api } from '../../services/api';
import FaqButton1 from '../buttons/faqButton/FaqButton1'; import FaqButton1 from '../buttons/faqButton/FaqButton1';
import FaqButton2 from '../buttons/faqButton/FaqButton2'; import FaqButton2 from '../buttons/faqButton/FaqButton2';
import { StyledStatus, TableView } from './TableView';
const style = { const style = {
position: 'absolute' as const, position: 'absolute' as const,
@ -107,19 +107,19 @@ const headCells: readonly HeadCell[] = [
}, },
{ {
id: 'name', id: 'name',
numeric: true, numeric: false,
disablePadding: false, disablePadding: false,
label: 'name', label: 'name',
}, },
{ {
id: 'unity', id: 'unity',
numeric: true, numeric: false,
disablePadding: false, disablePadding: false,
label: 'unity', label: 'unity',
}, },
{ {
id: 'status', id: 'status',
numeric: true, numeric: false,
disablePadding: false, disablePadding: false,
label: 'status', label: 'status',
}, },
@ -187,9 +187,9 @@ interface ClientsTableInterface {
onChange: any onChange: any
} }
export default function ClientTable({clients, onChange}: ClientsTableInterface) { export default function ClientTable({ clients, onChange }: ClientsTableInterface) {
const [order, setOrder] = useState<Order>('asc'); const [order, setOrder] = useState<Order>('asc');
const [orderBy, setOrderBy] = useState<keyof Data | string>('status'); const [orderBy, setOrderBy] = useState<keyof Data | string>('asc');
const [selected, setSelected] = useState<readonly string[]>([]); const [selected, setSelected] = useState<readonly string[]>([]);
const [page, setPage] = useState<number>(0); const [page, setPage] = useState<number>(0);
const [dense, setDense] = useState<boolean>(false); const [dense, setDense] = useState<boolean>(false);
@ -202,13 +202,12 @@ export default function ClientTable({clients, onChange}: ClientsTableInterface)
const handleOpen = () => setOpen(true); const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false); const handleClose = () => setOpen(false);
const [cod_client, setCod_client] = useState()
const [units, setUnits] = useState([]) const [units, setUnits] = useState([])
function getClientUnits(client_id: number) { function getClientUnits(client_id: number) {
api.post('/units', { api.post('/units', {
"filters": [ "filters": [
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id} { "type": "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id }
], ],
"fields": ["unidade"], "fields": ["unidade"],
"distinct": true "distinct": true
@ -283,64 +282,64 @@ export default function ClientTable({clients, onChange}: ClientsTableInterface)
const emptyRows = const emptyRows =
page > 0 ? Math.max(0, (1 + page) * rowsPerPage - clients.length) : 0; page > 0 ? Math.max(0, (1 + page) * rowsPerPage - clients.length) : 0;
const formData = new FormData() const formData = new FormData()
const [clientEdit, setClientEdit] = useState<any>({ const [clientEdit, setClientEdit] = useState<any>({
name: String, name: String,
email: String, email: String,
password: String, password: String,
password_confirmation: String, password_confirmation: String,
client_id: Number client_id: Number
}) })
const [logo, setLogo] = useState(false) const [logo, setLogo] = useState(false)
const [imageURLS, setImageURLs] = useState([]) const [imageURLS, setImageURLs] = useState([])
const [images, setImages] = useState([] as any) const [images, setImages] = useState([] as any)
const [nivelAcess, setnivelAcess] = useState<any>(2); const [nivelAcess, setnivelAcess] = useState<any>(2);
const [openEditUserModal, setOpenEditUserModal] = useState<any>(2); const [openEditUserModal, setOpenEditUserModal] = useState<any>(false);
const [selectedClient, setSelectedClient] = useState<any>(2); const [selectedClient, setSelectedClient] = useState<any>(2);
useEffect(() => { useEffect(() => {
if (images.length < 1) return if (images.length < 1) return
const newImageUrls: any = [] const newImageUrls: any = []
images.forEach((image: any) => images.forEach((image: any) =>
newImageUrls.push(URL.createObjectURL(image)) newImageUrls.push(URL.createObjectURL(image))
) )
setImageURLs(newImageUrls) setImageURLs(newImageUrls)
}, [images]) }, [images])
function onImageChange(e: any) { function onImageChange(e: any) {
setImages([...e.target.files]) setImages([...e.target.files])
setLogo(e.target.files[0]) setLogo(e.target.files[0])
} }
const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false) const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false)
function handleUpdateClient({ function handleUpdateClient({
name, name,
email, email,
password, password,
password_confirmation, password_confirmation,
client_id client_id
}, id) { }, id) {
formData.append('name', name) formData.append('name', name)
formData.append('email', email) formData.append('email', email)
formData.append('password', password) formData.append('password', password)
formData.append('password_confirmation', password_confirmation) formData.append('password_confirmation', password_confirmation)
formData.append('client_id', client_id) formData.append('client_id', client_id)
formData.append('profile_picture', logo) formData.append('profile_picture', logo)
formData.append('role', nivelAcess) formData.append('role', nivelAcess)
api.put(`/user/${id}`, formData) api.put(`/user/${id}`, formData)
.then((res) => { .then((res) => {
setOpenSnackSuccess(true) setOpenSnackSuccess(true)
setOpenModalInativar(false) setOpenModalInativar(false)
window.location.reload() window.location.reload()
}) })
.catch((res) => { .catch((res) => {
setOpenSnackError(true) setOpenSnackError(true)
}) })
} }
return ( return (
<TableView> <TableView>
@ -398,17 +397,17 @@ export default function ClientTable({clients, onChange}: ClientsTableInterface)
> >
Client - {row.client_id} Client - {row.client_id}
</TableCell> </TableCell>
<TableCell align="left" style={{cursor: 'pointer'}} onClick={() => { <TableCell align="left" style={{ cursor: 'pointer' }} onClick={() => {
setOpenEditUserModal(true) setOpenEditUserModal(true)
setSelectedClient(row) setSelectedClient(row)
setClientEdit(row) setClientEdit(row)
}}>{row.name}</TableCell> }}>{row.name}</TableCell>
<TableCell align="left" style={{cursor: 'pointer'}} onClick={() => { <TableCell align="left" style={{ cursor: 'pointer' }} onClick={() => {
setOpen(true) setOpen(true)
getClientUnits(row.client_id) getClientUnits(row.client_id)
setSelectedClient(row) setSelectedClient(row)
}}>clique aqui para ver as unidades</TableCell> }}>clique aqui para ver as unidades</TableCell>
<TableCell align="left"><StyledStatus status={row.deleted_at? 'inativo' : 'ativo'}> {row.deleted_at? 'inativo' : 'ativo'}</StyledStatus></TableCell> <TableCell align="left"><StyledStatus status={row.deleted_at ? 'inativo' : 'ativo'}> {row.deleted_at ? 'inativo' : 'ativo'}</StyledStatus></TableCell>
</TableRow> </TableRow>
); );
})} })}
@ -435,140 +434,140 @@ export default function ClientTable({clients, onChange}: ClientsTableInterface)
/> />
</Paper> </Paper>
<Modal <Modal
open={openEditUserModal} open={openEditUserModal}
onClose={() => setOpenEditUserModal(false)} onClose={() => setOpenEditUserModal(false)}
aria-labelledby="modal-modal-title" aria-labelledby="modal-modal-title"
aria-describedby="modal-modal-description" aria-describedby="modal-modal-description"
> >
<Box sx={style}> <Box sx={style}>
<h1>Editar Cliente - {selectedClient.name}</h1> <h1>Editar Cliente - {selectedClient.name}</h1>
<Typography <Typography
sx={{ color: 'gray', fontSize: 12 }} sx={{ color: 'gray', fontSize: 12 }}
variant="h5" variant="h5"
gutterBottom gutterBottom
component="div" component="div"
> >
Adicionar Cliente Smart Energia Adicionar Cliente Smart Energia
</Typography> </Typography>
<br /> <br />
<TextField <TextField
id="outlined-basic" id="outlined-basic"
label="Nome" label="Nome"
sx={{ width: 350, ml: 5 }} sx={{ width: 350, ml: 5 }}
onChange={(value) => { onChange={(value) => {
setClientEdit({ setClientEdit({
...clientEdit, ...clientEdit,
name: value.target.value name: value.target.value
}) })
}} }}
variant="outlined" variant="outlined"
/> />
<TextField <TextField
id="outlined-basic" id="outlined-basic"
label="E-mail/Usuário" label="E-mail/Usuário"
value={clientEdit.email} value={clientEdit.email}
sx={{ width: 350, ml: 8 }} sx={{ width: 350, ml: 8 }}
onChange={(value) => { onChange={(value) => {
setClientEdit({ setClientEdit({
...clientEdit, ...clientEdit,
email: value.target.value.toLowerCase() email: value.target.value.toLowerCase()
}) })
}} }}
variant="outlined" variant="outlined"
/> />
<TextField <TextField
id="outlined-basic" id="outlined-basic"
label="Senha" label="Senha"
sx={{ width: 350, ml: 5, mt: 2 }} sx={{ width: 350, ml: 5, mt: 2 }}
onChange={(value) => { onChange={(value) => {
setClientEdit({ setClientEdit({
...clientEdit, ...clientEdit,
password: value.target.value password: value.target.value
}) })
}} }}
variant="outlined" variant="outlined"
/> />
<TextField <TextField
id="outlined-basic" id="outlined-basic"
label="Confirma Senha" label="Confirma Senha"
sx={{ width: 350, ml: 8, mt: 2 }} sx={{ width: 350, ml: 8, mt: 2 }}
onChange={(value) => { onChange={(value) => {
setClientEdit({ setClientEdit({
...clientEdit, ...clientEdit,
password_confirmation: value.target.value password_confirmation: value.target.value
}) })
}} }}
variant="outlined" variant="outlined"
/> />
<TextField <TextField
id="outlined-basic" id="outlined-basic"
label="Codigo do Cliente Smart Energia" label="Codigo do Cliente Smart Energia"
sx={{ width: 350, ml: 5, mt: 2 }} sx={{ width: 350, ml: 5, mt: 2 }}
onChange={(value) => { onChange={(value) => {
setClientEdit({ setClientEdit({
...clientEdit, ...clientEdit,
client_id: value.target.value client_id: value.target.value
}) })
}} }}
variant="outlined" variant="outlined"
/> />
<InputUploadView> <InputUploadView>
<div className="imgContainer"> <div className="imgContainer">
<article> <article>
{imageURLS.map((imageSrc, index) => { {imageURLS.map((imageSrc, index) => {
return <Image return <Image
src={imageSrc} src={imageSrc}
key={index} key={index}
width={30} width={30}
height={30} height={30}
className="image" className="image"
/> />
})} })}
</article> </article>
</div>
<div className="update">
<form action="">
<div>
<label htmlFor="arquivo">
{' '}
<p className="TitleButton"> Enviar foto de Perfil </p>{' '}
</label>
<input
type="file"
name="arquivo"
id="arquivo"
onChange={onImageChange}
/>
</div> </div>
</form> <div className="update">
</div> <form action="">
</InputUploadView> <div>
<label htmlFor="arquivo">
{' '}
<p className="TitleButton"> Enviar foto de Perfil </p>{' '}
</label>
<input
type="file"
name="arquivo"
id="arquivo"
onChange={onImageChange}
/>
</div>
</form>
</div>
</InputUploadView>
<div className='select'> <div className='select'>
<FormControl sx={{ width: 350, ml: 5, mt: 2 }}> <FormControl sx={{ width: 350, ml: 5, mt: 2 }}>
<InputLabel id="demo-select-small">Nivel de acesso</InputLabel> <InputLabel id="demo-select-small">Nivel de acesso</InputLabel>
<Select <Select
labelId="demo-select-small" labelId="demo-select-small"
id="demo-select-small" id="demo-select-small"
value={nivelAcess} value={nivelAcess}
label="Unidade" label="Unidade"
onChange={value => setnivelAcess(value.target.value)} onChange={value => setnivelAcess(value.target.value)}
fullWidth fullWidth
> >
<MenuItem value={1}>Administrador</MenuItem> <MenuItem value={1}>Administrador</MenuItem>
<MenuItem value={2}>Cliente</MenuItem> <MenuItem value={2}>Cliente</MenuItem>
</Select> </Select>
</FormControl> </FormControl>
</div> </div>
<FaqButton1 title="Cancelar" onClick={() => setOpenEditUserModal(false)} /> <FaqButton1 title="Cancelar" onClick={() => setOpenEditUserModal(false)} />
<FaqButton2 <FaqButton2
title="Salvar" title="Salvar"
onClick={() => handleUpdateClient(clientEdit, selectedClient.id)} onClick={() => handleUpdateClient(clientEdit, selectedClient.id)}
/> />
</Box> </Box>
</Modal> </Modal>
<Modal <Modal
@ -576,15 +575,15 @@ export default function ClientTable({clients, onChange}: ClientsTableInterface)
onClose={handleClose} onClose={handleClose}
aria-labelledby="modal-modal-title" aria-labelledby="modal-modal-title"
aria-describedby="modal-modal-description" aria-describedby="modal-modal-description"
> >
<Box sx={style}> <Box sx={style}>
{ {
units.map((units, index) => { units.map((units, index) => {
return <> return <>
<li style={{ <li style={{
listStyle: 'none' listStyle: 'none'
}} key={index}>{units.unidade}</li> }} key={index}>{units.unidade}</li>
<hr /> <hr />
</> </>
}) })
} }

73
src/pages/administrative/clients/index.tsx
View File

@ -1,29 +1,29 @@
import MuiAlert, { AlertProps } from '@mui/material/Alert'
import Box from '@mui/material/Box' import Box from '@mui/material/Box'
import Modal from '@mui/material/Modal' import Modal from '@mui/material/Modal'
import Snackbar from '@mui/material/Snackbar'
import TextField from '@mui/material/TextField' import TextField from '@mui/material/TextField'
import Typography from '@mui/material/Typography' import Typography from '@mui/material/Typography'
import React, { useState, useEffect } from 'react'
import Image from 'next/image' import Image from 'next/image'
import Snackbar from '@mui/material/Snackbar' import React, { useEffect, useState } from 'react'
import MuiAlert, { AlertProps } from '@mui/material/Alert'
import ClientsTable from '../../../components/administrativeTables/ClientsTable' import ClientsTable from '../../../components/administrativeTables/ClientsTable'
import BasicButton from '../../../components/buttons/basicButton/BasicButton' import BasicButton from '../../../components/buttons/basicButton/BasicButton'
import FaqButton1 from '../../../components/buttons/faqButton/FaqButton1' import FaqButton1 from '../../../components/buttons/faqButton/FaqButton1'
import FaqButton2 from '../../../components/buttons/faqButton/FaqButton2' import FaqButton2 from '../../../components/buttons/faqButton/FaqButton2'
import Header from '../../../components/header/Header' import Header from '../../../components/header/Header'
import { ClientsView } from '../../../styles/layouts/clients/ClientsView'
import PageTitle from '../../../components/pageTitle/PageTitle'
import ConfirmModal from '../../../components/modal/ConfirmModal'
import { ConfirmModalView } from '../../../styles/layouts/modals/confirmModalView'
import { api } from '../../../services/api'
import { parseCookies } from 'nookies'
import { GetServerSideProps } from 'next' import { GetServerSideProps } from 'next'
import { parseCookies } from 'nookies'
import ConfirmModal from '../../../components/modal/ConfirmModal'
import PageTitle from '../../../components/pageTitle/PageTitle'
import { api } from '../../../services/api'
import getAPIClient from '../../../services/ssrApi' import getAPIClient from '../../../services/ssrApi'
import { ClientsView } from '../../../styles/layouts/clients/ClientsView'
import { ConfirmModalView } from '../../../styles/layouts/modals/confirmModalView'
import { FormControl, InputLabel, MenuItem, Select } from '@mui/material'
import FormData from 'form-data' import FormData from 'form-data'
import { InputUploadView } from '../../../components/inputUploadImg/inputUploadView' import { InputUploadView } from '../../../components/inputUploadImg/inputUploadView'
import { FormControl, InputLabel, MenuItem, Select } from '@mui/material'
const style = { const style = {
position: 'absolute' as const, position: 'absolute' as const,
@ -70,6 +70,7 @@ export default function clients({ clients, userName }) {
const [nivelAcess, setnivelAcess] = useState<any>(2); const [nivelAcess, setnivelAcess] = useState<any>(2);
const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false) const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false)
const [openSnackError, setOpenSnackError] = useState<boolean>(false) const [openSnackError, setOpenSnackError] = useState<boolean>(false)
const [openSnackWarning, setOpenSnackWarning] = useState<boolean>(false)
const [openSnackSuccessDelete, setOpenSnackSuccessDelete] = const [openSnackSuccessDelete, setOpenSnackSuccessDelete] =
useState<boolean>(false) useState<boolean>(false)
const [openSnackErrorDelete, setOpenSnackErrorDelete] = const [openSnackErrorDelete, setOpenSnackErrorDelete] =
@ -114,6 +115,9 @@ export default function clients({ clients, userName }) {
formData.append('profile_picture', logo) formData.append('profile_picture', logo)
formData.append('role', nivelAcess) formData.append('role', nivelAcess)
if (!name.length || !email.length || !password.length || !password_confirmation.length || !client_id.length || !logo || !nivelAcess.length)
setOpenSnackWarning(true)
api.post('/user', formData) api.post('/user', formData)
.then((res) => { .then((res) => {
setOpenSnackSuccess(true) setOpenSnackSuccess(true)
@ -152,12 +156,6 @@ export default function clients({ clients, userName }) {
setLogo(e.target.files[0]) setLogo(e.target.files[0])
} }
console.table(clients.map(client => {
if (Number.parseInt(client.client_id) === 59641651) return client
return
}))
console.table(clients[417])
return ( return (
<div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}> <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>
<Snackbar <Snackbar
@ -186,6 +184,19 @@ export default function clients({ clients, userName }) {
Cliente não cadastrado! Cliente não cadastrado!
</Alert> </Alert>
</Snackbar> </Snackbar>
<Snackbar
open={openSnackWarning}
autoHideDuration={4000}
onClose={handleCloseSnack}
>
<Alert
onClose={handleCloseSnack}
severity="warning"
sx={{ width: '100%' }}
>
Preencha todos os campos!
</Alert>
</Snackbar>
<Snackbar <Snackbar
open={openSnackSuccessDelete} open={openSnackSuccessDelete}
@ -348,22 +359,22 @@ export default function clients({ clients, userName }) {
<div className='select'> <div className='select'>
<FormControl sx={{ width: 350, ml: 5, mt: 2 }}> <FormControl sx={{ width: 350, ml: 5, mt: 2 }}>
<InputLabel id="demo-select-small">Nivel de acesso</InputLabel> <InputLabel id="demo-select-small">Nivel de acesso</InputLabel>
<Select <Select
labelId="demo-select-small" labelId="demo-select-small"
id="demo-select-small" id="demo-select-small"
value={nivelAcess} value={nivelAcess}
label="Unidade" label="Unidade"
onChange={value => setnivelAcess(value.target.value)} onChange={value => setnivelAcess(value.target.value)}
fullWidth fullWidth
> >
<MenuItem value={1}>Administrador</MenuItem> <MenuItem value={1}>Administrador</MenuItem>
<MenuItem value={2}>Cliente</MenuItem> <MenuItem value={2}>Cliente</MenuItem>
</Select> </Select>
</FormControl> </FormControl>
</div> </div>
<FaqButton1 title="Cancelar" onClick={() => setOpen(false)} /> <FaqButton1 title="Cancelar" onClick={() => setOpen(false)} />
<FaqButton2 <FaqButton2

190
src/pages/dashboard/index.tsx
View File

@ -39,10 +39,12 @@ const style = {
boxShadow: 24, boxShadow: 24,
p: 4, p: 4,
borderRadius: 3 borderRadius: 3,
overflow: 'scroll'
}; };
export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensalGraph, grossMensalYears, acumulatedGraph, mapsInfo, userName, costIndicator} : any) { export default function Dashboard({ grossAnualGraph, grossAnualYears, grossMensalGraph, grossMensalYears, acumulatedGraph, mapsInfo, userName, costIndicator }: any) {
const months = [ const months = [
'Jan', 'Jan',
'Fev', 'Fev',
@ -70,18 +72,18 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
useEffect(() => { useEffect(() => {
let lastDataMensal = '0' let lastDataMensal = '0'
let lastDataAnual = '0' let lastDataAnual = '0'
let index=0 let index = 0
while (index < grossMensalGraph.length) { while (index < grossMensalGraph.length) {
if (!grossMensalGraph[index].dad_estimado && grossMensalGraph[index].economia_acumulada!==null) if (!grossMensalGraph[index].dad_estimado && grossMensalGraph[index].economia_acumulada !== null)
lastDataMensal=grossMensalGraph[index].economia_acumulada lastDataMensal = grossMensalGraph[index].economia_acumulada
index++ index++
} }
setLastDataBrutaMensal(`${parseFloat(lastDataMensal).toFixed(3)}`) setLastDataBrutaMensal(`${parseFloat(lastDataMensal).toFixed(3)}`)
index=0 index = 0
while (index < grossAnualGraph.length) { while (index < grossAnualGraph.length) {
if (!grossAnualGraph[index].dad_estimado) if (!grossAnualGraph[index].dad_estimado)
lastDataAnual=grossAnualGraph[index].economia_acumulada lastDataAnual = grossAnualGraph[index].economia_acumulada
index++ index++
} }
setLastDataBrutaAnual(`${parseFloat(lastDataAnual).toFixed(3)}`) setLastDataBrutaAnual(`${parseFloat(lastDataAnual).toFixed(3)}`)
@ -110,75 +112,113 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
</Link> </Link>
{ {
typeof window === 'undefined' || typeof window === undefined? null : typeof window === 'undefined' || typeof window === undefined ? null :
<> <>
<section className='dashboard'> <section className='dashboard'>
<GraphCard title='Economia Anual' subtitle='Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil'> <GraphCard title='Economia Anual' subtitle='Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil'>
<AccumulatedEconomyTitle value={lastDataBrutaAnualS}/> <AccumulatedEconomyTitle value={lastDataBrutaAnualS} />
<GrossAnualChart title='' subtitle='' <GrossAnualChart title='' subtitle=''
dataset='Consolidada' dataset='Consolidada'
dataProps={grossAnualGraph} dataProps={grossAnualGraph}
label={grossAnualYears} barLabel bruta miniature/> label={grossAnualYears} barLabel bruta miniature />
</GraphCard> </GraphCard>
<GraphCard title='Economia Mensal' subtitle='Economia Bruta Estimada e Acumulada Mensal - Valores em R$ x mil'> <GraphCard title='Economia Mensal' subtitle='Economia Bruta Estimada e Acumulada Mensal - Valores em R$ x mil'>
<AccumulatedEconomyTitle value={lastDataBrutaMensalS}/> <AccumulatedEconomyTitle value={lastDataBrutaMensalS} />
<GrossMensalChart title='' subtitle='' <GrossMensalChart title='' subtitle=''
data1={grossMensalGraph} data1={grossMensalGraph}
data2={grossMensalGraph} data2={grossMensalGraph}
label={months} label={months}
miniature miniature
/> />
</GraphCard> </GraphCard>
<GraphCard title='Custo Mensal Cativo x Livre' subtitle='Comparativo de Custo Estimado - Valores em R$ x mil'> <GraphCard title='Custo Mensal Cativo x Livre' subtitle='Comparativo de Custo Estimado - Valores em R$ x mil'>
<CativoXLivreChart chartData={acumulatedGraph} <CativoXLivreChart chartData={acumulatedGraph}
dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre' dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre'
label={['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']} title='' subtitle='' barLabel hashurado miniature/> label={['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']} title='' subtitle='' barLabel hashurado miniature />
</GraphCard> </GraphCard>
<GraphCard title='Indicador de Custo' subtitle='Indicador de Custo - Valores em R$/MWh'> <GraphCard title='Indicador de Custo' subtitle='Indicador de Custo - Valores em R$/MWh'>
<CostIndicatorChart title='' subtitle='' <CostIndicatorChart title='' subtitle=''
data1={costIndicator?.filter((value, index) => value?.mes.slice(0, 4).includes('2021')).map(value => value?.custo_unit && !!parseInt(value?.custo_unit)? value.custo_unit : null)} data1={costIndicator?.filter((value, index) => value?.mes.slice(0, 4).includes('2021')).map(value => value?.custo_unit && !!parseInt(value?.custo_unit) ? value.custo_unit : null)}
data2={costIndicator?.filter((value, index) => value?.mes.slice(0, 4).includes('2022')).map(value => value?.custo_unit && !!parseInt(value?.custo_unit)? value.custo_unit : null)} data2={costIndicator?.filter((value, index) => value?.mes.slice(0, 4).includes('2022')).map(value => value?.custo_unit && !!parseInt(value?.custo_unit) ? value.custo_unit : null)}
label={months} label={months}
miniature miniature
/> />
</GraphCard> </GraphCard>
</section> </section>
<Modal <Modal
open={terms=='false'} open={terms == 'false'}
aria-labelledby="modal-modal-title" aria-labelledby="modal-modal-title"
aria-describedby="modal-modal-description" aria-describedby="modal-modal-description"
> >
<Box sx={style}> <Box sx={style}>
<Typography id="modal-modal-title" variant="h6" component="h2"> <Typography id="modal-modal-title" variant="h6" component="h2">
Termos de uso Termos de uso
</Typography> </Typography>
<Typography id="modal-modal-description" sx={{ mt: 2 }}> <Typography id="modal-modal-description" sx={{ mt: 2 }}>
<p> <p>
Bem-vindo a Plataforma Web – SMART ENERGIA! Bem-vindo ao Smart Energy View, a Plataforma Web da SMART ENERGIA!
</p> </p>
<p>
Visualize os principais indicadores, dados de economia, resumo de operações, PLD, notícias além de acompanhar o consumo de energia em intervalos mínimos de 5 minutos. <p>
</p> Agora você terá a Gestão da sua Energia na palma da sua mão!!!!
<p> </p>
Conforme nosso contrato de serviços vigente, todas as informações entregues são estritamente privadas, sendo seu sigilo protegido por lei, não podendo ser compartilhadas com terceiros.
</p> <p>
<p> Visualize os principais indicadores, dados de economia, resumo de operações, PLD, notícias além de acompanhar o consumo de energia em intervalos mínimos de 5 minutos.
A divulgação não autorizada das informações adquiridas nesta plataforma (ou seu uso), de forma integral ou parcial, é proibida, não sendo permitido o compartilhamento dos acessos e senhas ou qualquer informação que tiver acesso junto a esta plataforma, sendo que o acesso a esta plataforma é restrito e individual. </p>
</p>
<p> <p>
Ressaltamos que os resultados informados são meramente indicativos. Estamos na última fase de testes da plataforma e em breve também iremos disponibilizar os aplicativos para seu celular, nos sistemas operacionais IOS e Android.
</p> </p>
<BasicButton title="Aceito os termos" onClick={() => {
setCookie(undefined, 'terms', 'true') <p>
setOpen(false) Encontrando qualquer dificuldade, eventuais inconsistências ou dúvidas, nos contate!
}} /> </p>
</Typography>
</Box> <p>
</Modal> Lembrando que conforme nosso contrato de serviços vigente, todas as informações entregues são estritamente privadas, sendo seu sigilo protegido por lei, não podendo ser compartilhadas com terceiros sendo destinadas a seu uso exclusivo.
</> </p>
<p>
A divulgação não autorizada das informações adquiridas nesta plataforma (ou seu uso), de forma integral ou parcial, é proibida, não sendo permitido o compartilhamento dos acessos e senhas ou qualquer informação que tiver acesso junto a esta plataforma, sendo que o acesso a esta plataforma é restrito e individual.
</p>
‌
<p>
Destacamos que os resultados informados são meramente indicativos, não vinculantes a resultados e que as premissas disponibilizadas na plataforma são as mesmas utilizadas nos Energys Reports e estudos encaminhados.
</p>
<p>
<strong>Aproveite essa nova ferramenta de acompanhar sua Gestão de Energia!</strong>
</p>
{/* <p>
Bem-vindo a Plataforma Web – SMART ENERGIA!
</p>
<p>
Visualize os principais indicadores, dados de economia, resumo de operações, PLD, notícias além de acompanhar o consumo de energia em intervalos mínimos de 5 minutos.
</p>
<p>
Conforme nosso contrato de serviços vigente, todas as informações entregues são estritamente privadas, sendo seu sigilo protegido por lei, não podendo ser compartilhadas com terceiros.
</p>
<p>
A divulgação não autorizada das informações adquiridas nesta plataforma (ou seu uso), de forma integral ou parcial, é proibida, não sendo permitido o compartilhamento dos acessos e senhas ou qualquer informação que tiver acesso junto a esta plataforma, sendo que o acesso a esta plataforma é restrito e individual.
</p>
<p>
Ressaltamos que os resultados informados são meramente indicativos.
</p> */}
<BasicButton title="Aceito os termos" onClick={() => {
setCookie(undefined, 'terms', 'true')
setOpen(false)
}} />
</Typography>
</Box>
</Modal>
</>
} }
</DashboardView> </DashboardView>
) )
@ -198,8 +238,8 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
await apiClient.post('/economy/grossAnnual').then(res => { await apiClient.post('/economy/grossAnnual').then(res => {
grossAnualGraph = res.data.data grossAnualGraph = res.data.data
}) })
.then(console.log) .then(console.log)
.catch(console.log) .catch(console.log)
await apiClient.post('/economy/grossMonthly').then(res => { await apiClient.post('/economy/grossMonthly').then(res => {
grossMensalGraph = res.data.data grossMensalGraph = res.data.data

2
src/pages/telemetria/index.tsx
View File

@ -41,7 +41,7 @@ const Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(
}) })
export default function Telemetria({ userName, clients }: any) { export default function Telemetria({ userName, clients }: any) {
const [unity, setUnity] = useState(clients[0].codigo_scde); const [unity, setUnity] = useState(clients[0]?.codigo_scde);
const [startDate, setStartDate] = useState(new Date()); const [startDate, setStartDate] = useState(new Date());
const [endDate, setEndDate] = useState(new Date()); const [endDate, setEndDate] = useState(new Date());
const [month, setMonth] = useState(new Date().getMonth() + 1); const [month, setMonth] = useState(new Date().getMonth() + 1);

6
src/services/ssrApi.ts
View File

@ -1,5 +1,4 @@
import axios, { AxiosRequestConfig } from "axios"; import axios from "axios";
import * as cookie from 'cookie';
import * as express from 'express'; import * as express from 'express';
import * as next from 'next'; import * as next from 'next';
import { parseCookies } from "nookies"; import { parseCookies } from "nookies";
@ -13,7 +12,8 @@ export default function getAPIClient(ctx?: Pick<next.NextPageContext, 'req'> | {
const { '@smartAuth-token': token } = parseCookies(ctx) const { '@smartAuth-token': token } = parseCookies(ctx)
const api = axios.create({ const api = axios.create({
baseURL: "https://api.energiasmart.com.br/api", // baseURL: "https://api.energiasmart.com.br/api",
baseURL: "https://api.energiasmart.klupp.com.br/api",
}); });
api.interceptors.request.use(config => { api.interceptors.request.use(config => {