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

Merge branch 'telemetry' into 'dev'

Browse Source 
fixing charts fonst and add more features

See merge request kluppsoftware/smart-energia-web!129
This commit is contained in:
José Corte 2022-08-09 12:26:02 +00:00
commit ae19d9550f
32 changed files with 144 additions and 260 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
next.config.js
View File

@ -6,7 +6,7 @@ const nextConfig = {
styledComponents: true, styledComponents: true,
}, },
images: { images: {
domains: ["kluppdevelopment.s3.sa-east-1.amazonaws.com"] domains: ["kluppdevelopment.s3.sa-east-1.amazonaws.com", "api.energiasmart.com.br"]
} }
} }

4
src/components/graph/DemRegXDemConChart.tsx
View File

@ -95,7 +95,7 @@ export function DemRegXDemConChart({
}, },
ticks: { ticks: {
font: { font: {
size: 16 size: window.innerWidth/80
} }
}, },
}, },
@ -105,7 +105,7 @@ export function DemRegXDemConChart({
}, },
ticks: { ticks: {
font: { font: {
size: 16 size: window.innerWidth/80
} }
}, },
}, },

4
src/components/graph/DiscretizedConsumptionChart.tsx
View File

@ -43,7 +43,7 @@ export function DiscretizedConsumptionChart({ title, subtitle, dataProps, label,
}, },
ticks: { ticks: {
font: { font: {
size: 16 size: window.innerWidth/80
} }
}, },
}, },
@ -53,7 +53,7 @@ export function DiscretizedConsumptionChart({ title, subtitle, dataProps, label,
}, },
ticks: { ticks: {
font: { font: {
size: 16 size: window.innerWidth/80
} }
}, },
}, },

4
src/components/graph/cativoXLivreChart/index.tsx
View File

@ -85,7 +85,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, dataset1,
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },
@ -95,7 +95,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, dataset1,
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },

12
src/components/graph/costIndicatorChart/index.tsx
View File

@ -43,22 +43,24 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
responsive: true, responsive: true,
scales: { scales: {
x: { x: {
// stacked: false,
grid: { grid: {
display: false display: false
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },
y: { y: {
stacked: false,
grid: { grid: {
display: false display: false
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },
@ -101,6 +103,12 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
label: '2021', label: '2021',
data: data1?.map(value => value.custo_unit>0? value.custo_unit : null), data: data1?.map(value => value.custo_unit>0? value.custo_unit : null),
borderRadius: 8, borderRadius: 8,
datalabels: {
backgroundColor: 'white',
borderRadius: 8,
opacity: .8,
offset: -5
},
backgroundColor: (value, ctx) => { backgroundColor: (value, ctx) => {
if (value.dad_estimado) if (value.dad_estimado)
return draw('diagonal-right-left', '#C2d5fb'); return draw('diagonal-right-left', '#C2d5fb');

4
src/components/graph/fatorPotenciaChart.tsx
View File

@ -53,7 +53,7 @@ export default function FatorPotenciaChart({ title, subtitle, data1, data2, labe
}, },
ticks: { ticks: {
font: { font: {
size: 16 size: window.innerWidth/80
} }
}, },
}, },
@ -63,7 +63,7 @@ export default function FatorPotenciaChart({ title, subtitle, data1, data2, labe
}, },
ticks: { ticks: {
font: { font: {
size: 16 size: window.innerWidth/80
} }
}, },
}, },

4
src/components/graph/grossAnualChart/GrossAnualChart.tsx
View File

@ -46,7 +46,7 @@ export function GrossAnualChart({ title, subtitle, dataProps, label, dataset, ba
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },
@ -57,7 +57,7 @@ export function GrossAnualChart({ title, subtitle, dataProps, label, dataset, ba
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },

21
src/components/graph/grossMensalChart/GrossMensalChart.tsx
View File

@ -1,4 +1,4 @@
import React from 'react' import React, { useEffect, useState } from 'react'
import { Bar, Line, Chart as ChartJs } from 'react-chartjs-2'; import { Bar, Line, Chart as ChartJs } from 'react-chartjs-2';
import { import {
@ -44,11 +44,20 @@ interface ChartInterface {
export default function GrossMensalChart({ title, data1, data2, label, subtitle, miniature }: ChartInterface) { export default function GrossMensalChart({ title, data1, data2, label, subtitle, miniature }: ChartInterface) {
function spacement(string) { function spacement(string) {
const spaces = string.length===1?'' : string.length===2? '' : string.length===3? ' ' : string.length===4? ' ' : string.length===5? ' ' : '' const spaces = string.length===1?'' : string.length===2? '' : string.length===3? ' ' : string.length===4? ' ' : string.length===5? ' ' : ''
// const spaces = string.length===1?'' : string.length===2? '⠀⠀⠀⠀' : string.length===3? '⠀⠀⠀' : string.length===4? '⠀⠀' : string.length===5? '⠀' : ''
return spaces return spaces
} }
const [lastDataS, setLastData] = useState('')
useEffect(() => {
let lastData = '0'
let index=0
while (index < data1.length) {
data1[index].dad_estimado? lastData=data1[index].economia_acumulada : null
index++
setLastData(`economia acumulada: R$ ${parseFloat(lastData).toFixed(3)}`)
}
}, [data1])
const options: any = { const options: any = {
responsive: true, responsive: true,
scales: { scales: {
@ -58,7 +67,7 @@ export default function GrossMensalChart({ title, data1, data2, label, subtitle,
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },
@ -68,7 +77,7 @@ export default function GrossMensalChart({ title, data1, data2, label, subtitle,
}, },
ticks: { ticks: {
font: { font: {
size: !miniature? 16 : 10 size: !miniature? window.innerWidth/80 : window.innerWidth/100
} }
}, },
}, },
@ -101,7 +110,7 @@ export default function GrossMensalChart({ title, data1, data2, label, subtitle,
}, },
title: { title: {
display: true, display: true,
text: '', text: ''
}, },
}, },
}; };

7
src/components/header/Header.tsx
View File

@ -1,9 +1,6 @@
import React, { useContext, useEffect, useState } from 'react' import React, { useContext, useEffect, useState } from 'react'
import Image from 'next/image'; import Image from 'next/image';
import Avatar from '@mui/material/Avatar';
import TextField from '@mui/material/TextField';
import { HeaderView } from './HeaderView' import { HeaderView } from './HeaderView'
import { parseCookies } from 'nookies'; import { parseCookies } from 'nookies';
import { GetServerSideProps } from 'next'; import { GetServerSideProps } from 'next';
@ -27,7 +24,9 @@ export default function Header({name, admin, children}: headerInterface) {
<section> <section>
{ {
!admin && profile_picture? !admin && profile_picture?
<Image src={profile_picture} height={100} width={108}/> <div className='logoContainer'>
<img src={profile_picture} alt=''/>
</div>
: :
<Image src='/assets/marca1.png' height={75} width={108}/> <Image src='/assets/marca1.png' height={75} width={108}/>
} }

13
src/components/header/HeaderView.ts
View File

@ -30,6 +30,19 @@ export const HeaderView = styled.header`
} }
} }
.logoContainer {
display: flex;
align-items: center;
justify-content: center;
width: 40%;
img {
width: 100%;
height: auto;
}
}
section { section {
display: flex; display: flex;
align-items: center; align-items: center;

23
src/pages/chartTelemetry/index.tsx
View File

@ -15,9 +15,6 @@ import DiscretizedConsumptionChartLine from '../../components/graph/DiscretizedC
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import { DemRegXDemConChart } from '../../components/graph/DemRegXDemConChart' import { DemRegXDemConChart } from '../../components/graph/DemRegXDemConChart'
import RenderIf from '../../utils/renderIf' import RenderIf from '../../utils/renderIf'
import { getPowerFactorData } from '../../services/charts/telemetry/getPowerFactor'
import { getDemand } from '../../services/charts/telemetry/getDemand'
import { getDiscretization } from '../../services/charts/telemetry/getDiscretization'
export default function chartTelemetry({userName}) { export default function chartTelemetry({userName}) {
const [fatorPotenciaData, setFatorPotenciaData] = useState([]); const [fatorPotenciaData, setFatorPotenciaData] = useState([]);
@ -31,30 +28,10 @@ export default function chartTelemetry({userName}) {
const {startDate, endDate, unity, discretization} = router.query const {startDate, endDate, unity, discretization} = router.query
const { '@smartAuth-token': token } = parseCookies()
function getChartsData() { function getChartsData() {
console.log(token)
// getPowerFactorData("PRAXCUENTR101P", "2022-01-01", "2022-01-31", "med_5min") // getPowerFactorData("PRAXCUENTR101P", "2022-01-01", "2022-01-31", "med_5min")
// .then(result => setFatorPotenciaData(result)) // .then(result => setFatorPotenciaData(result))
// .catch(exception => console.log('exeption', exception)) // .catch(exception => console.log('exeption', exception))
// getDiscretization("PRAXCUENTR101P", "2022-01-01", "2022-01-31", "med_5min")
// .then(result => setDiscretizedConsumptionDataReativa(result))
// .catch(exception => console.log(exception))
// getDiscretization("PRAXCUENTR101P", "2022-01-01", "2022-01-31", "med_5min")
// .then(result => setDiscretizedConsumptionData(result))
// .catch(exception => console.log(exception))
// getDemand("PRAXCUENTR101P", "2022-01-01", "2022-01-31", "med_5min")
// .then(result => setDemRegXDemCon(result))
// .catch(exception => console.log(exception))
// setFatorPotenciaData(res.data.data)
// setDiscretizedConsumptionDataReativa(res.data.data)
// setDiscretizedConsumptionData(res.data.data)
// setDemRegXDemCon(res.data.data)
} }
useEffect(() => { useEffect(() => {

45
src/pages/consumption/index.tsx
View File

@ -1,45 +0,0 @@
import { GetServerSideProps } from 'next'
import Head from 'next/head'
import { parseCookies } from 'nookies'
import React from 'react'
import Chart from '../../components/graph/Chart'
import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle'
import { dataEconomiaIndicador } from '../../services/economiaIndicador'
import { ConsumptionView } from '../../styles/layouts/consumption/ConsumptionView'
export default function Consumption({userName}: any) {
return (
<ConsumptionView>
<Head>
<title>Smart Energia - Consumo</title>
</Head>
<Header name={userName} />
<PageTitle title='Consumo' subtitle='Análise de Consumo'/>
<section>
<Chart title='Indicador de Custo' subtitle='(Valores em R$/MWh)' data1={dataEconomiaIndicador.data1} data2={dataEconomiaIndicador.data2} label={dataEconomiaIndicador.labels} />
</section>
</ConsumptionView>
)
}
export const getServerSideProps: GetServerSideProps = async (ctx) => {
const { ['@smartAuth-token']: token } = parseCookies(ctx)
const { ['user-name']: userName } = parseCookies(ctx)
if (!token) {
return {
redirect: {
destination: '/',
permanent: false
}
}
}
return {
props: {
userName
}
}
}

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

@ -1,4 +1,4 @@
import React from 'react' import React, { useEffect, useState } from 'react'
import { DashboardView } from '../../styles/layouts/dashboard/DashboardView' import { DashboardView } from '../../styles/layouts/dashboard/DashboardView'
@ -7,26 +7,15 @@ import GraphCard from '../../components/graph/graphCard/ChartCard'
import Header from '../../components/header/Header' import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle' import PageTitle from '../../components/pageTitle/PageTitle'
import Link from 'next/link' import Link from 'next/link'
import LineChart from '../../components/graph/LineChart'
import { SingleBar } from '../../components/graph/SingleBar'
import { dataEconomiaBruta } from '../../services/economiaBruta'
import { dataEconomiaIndicador } from '../../services/economiaIndicador'
import { EconomiaAcumulada } from '../../services/economiaAcumulada'
import Chart from '../../components/graph/Chart'
import { LineBarChart } from '../../components/graph/LineBarChart'
import { LineBarChart2 } from '../../components/graph/LineBarChart2'
import { ConsumoEstimado } from '../../services/consumoEstimado'
import Head from 'next/head'
import recoverUserInformation from '../../services/auth'
import { parseCookies } from 'nookies' import { parseCookies } from 'nookies'
import { GetServerSideProps } from 'next' import { GetServerSideProps } from 'next'
import getAPIClient from '../../services/ssrApi' import getAPIClient from '../../services/ssrApi'
import Chart2 from '../../components/graph/Chart2'
import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart' import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart'
import CostIndicatorChart from '../../components/graph/costIndicatorChart' import CostIndicatorChart from '../../components/graph/costIndicatorChart'
import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart' import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart'
import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart' import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart'
import Head from 'next/head'
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 = [
@ -44,6 +33,27 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
'Dez' 'Dez'
] ]
const [lastDataBrutaMensalS, setLastDataBrutaMensal] = useState('')
const [lastDataBrutaAnualS, setLastDataBrutaAnual] = useState('')
useEffect(() => {
let lastDataMensal = '0'
let lastDataAnual = '0'
let index=0
while (index < grossMensalGraph.length) {
if (!grossMensalGraph[index].dad_estimado && grossMensalGraph[index].economia_acumulada!==null)
lastDataMensal=grossMensalGraph[index].economia_acumulada
index++
}
setLastDataBrutaMensal(`economia acumulada: R$ ${parseFloat(lastDataMensal).toFixed(3)}`)
index=0
while (index < grossAnualGraph.length) {
if (!grossAnualGraph[index].dad_estimado)
lastDataAnual=grossAnualGraph[index].economia_acumulada
index++
}
setLastDataBrutaAnual(`economia acumulada: R$ ${parseFloat(lastDataAnual).toFixed(3)}`)
}, [])
return ( return (
<DashboardView> <DashboardView>
<Head> <Head>
@ -69,6 +79,7 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
<> <>
<section className='dashboard'> <section className='dashboard'>
<GraphCard title='Economia Bruta Anual' subtitle='Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil'> <GraphCard title='Economia Bruta Anual' subtitle='Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil'>
<p style={{color: '#254F7F'}}>{lastDataBrutaAnualS}</p>
<GrossAnualChart title='' subtitle='' <GrossAnualChart title='' subtitle=''
dataset='Consolidada' dataset='Consolidada'
dataProps={grossAnualGraph} dataProps={grossAnualGraph}
@ -76,6 +87,7 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
</GraphCard> </GraphCard>
<GraphCard title='Economia Bruta Mensal' subtitle='Economia Bruta Estimada e Acumulada Mensal - Valores em R$ x mil'> <GraphCard title='Economia Bruta Mensal' subtitle='Economia Bruta Estimada e Acumulada Mensal - Valores em R$ x mil'>
<p style={{color: '#254F7F'}}>{lastDataBrutaMensalS}</p>
<GrossMensalChart title='' subtitle='' <GrossMensalChart title='' subtitle=''
data1={grossMensalGraph} data1={grossMensalGraph}
data2={grossMensalGraph} data2={grossMensalGraph}
@ -87,7 +99,7 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
<GraphCard title='Cativo x Livre Mensal' subtitle='Comparativo de Custo Estimado - Valores em R$ x mil'> <GraphCard title='Cativo x Livre Mensal' 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={ConsumoEstimado.label} 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'>

65
src/pages/economy/index.tsx
View File

@ -1,39 +1,26 @@
import Fab from '@mui/material/Fab';
import FormControl from '@mui/material/FormControl'; import FormControl from '@mui/material/FormControl';
import InputLabel from '@mui/material/InputLabel'; import InputLabel from '@mui/material/InputLabel';
import MenuItem from '@mui/material/MenuItem'; import MenuItem from '@mui/material/MenuItem';
import Select, { SelectChangeEvent } from '@mui/material/Select'; import Select from '@mui/material/Select';
import { GetServerSideProps } from 'next'; import { GetServerSideProps } from 'next';
import Head from 'next/head'; import Head from 'next/head';
import Link from 'next/link';
import { parseCookies } from 'nookies'; import { parseCookies } from 'nookies';
import React, { useContext, useEffect, useState } from 'react' import React, { useContext, useEffect, useState } from 'react'
import BasicButton from '../../components/buttons/basicButton/BasicButton';
import { LineBarChart } from '../../components/graph/LineBarChart';
import LineChart from '../../components/graph/LineChart';
import Header from '../../components/header/Header' import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle'; import PageTitle from '../../components/pageTitle/PageTitle';
import { api } from '../../services/api'; import { api } from '../../services/api';
import { EvolucaoPld } from '../../services/evolucaoPld';
import getAPIClient from '../../services/ssrApi'; import getAPIClient from '../../services/ssrApi';
import { GoBack, PldGraphView, PldTableView, TableHeader } from '../../styles/layouts/pld/PldView' import { TableHeader } from '../../styles/layouts/pld/PldView'
import RenderIf from '../../utils/renderIf' import RenderIf from '../../utils/renderIf'
import Tabs from '@mui/material/Tabs'; import Tabs from '@mui/material/Tabs';
import Tab from '@mui/material/Tab'; import Tab from '@mui/material/Tab';
import NavigationIcon from '@mui/icons-material/Navigation';
import TextField from '@mui/material/TextField';
import { DesktopDatePicker } from '@mui/x-date-pickers/DesktopDatePicker';
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
import { MenuContext } from '../../contexts/menu/MenuContext'; import { MenuContext } from '../../contexts/menu/MenuContext';
import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart'; import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart';
import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart'; import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart';
import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart'; import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart';
import { ConsumoEstimado } from '../../services/consumoEstimado';
import CostIndicatorChart from '../../components/graph/costIndicatorChart'; import CostIndicatorChart from '../../components/graph/costIndicatorChart';
import { EconomyView } from '../../styles/layouts/economy/economy'; import { EconomyView } from '../../styles/layouts/economy/economy';
@ -60,6 +47,26 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
'Dez' 'Dez'
] ]
const [lastDataBrutaMensalS, setLastDataBrutaMensal] = useState('')
useEffect(() => {
let lastData = '0'
let index=0
if (economyMenu) {
while (index < brutaMensal.length) {
if (!brutaMensal[index].dad_estimado)
lastData=brutaMensal[index].economia_acumulada
index++
}
} else {
while (index < anual.length) {
if (!anual[index].dad_estimado)
lastData=brutaMensal[index].economia_acumulada
index++
}
}
setLastDataBrutaMensal(`economia acumulada: R$ ${parseFloat(lastData).toFixed(3)}`)
}, [economyMenu])
useEffect(() => { useEffect(() => {
api.post('/economy/estimates', unity!==''?{ api.post('/economy/estimates', unity!==''?{
"filters": [ "filters": [
@ -67,21 +74,14 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
] ]
}:{}).then(res => { }:{}).then(res => {
setCatLivDataState(res.data.data) setCatLivDataState(res.data.data)
}).catch(res => {
// console.log(res)
}) })
}, [unity])
useEffect(() => {
api.post('/economy/MWh', unity!==''?{ api.post('/economy/MWh', unity!==''?{
"filters": [ "filters": [
{"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity!=="default"? null : unity} {"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity!=="default"? null : unity}
] ]
}:{}).then(res => { }:{}).then(res => {
setIndicatorDataState(res.data.data) setIndicatorDataState(res.data.data)
console.log('res', res.data.data)
}).catch(res => {
// console.log(res)
}) })
}, [unity]) }, [unity])
@ -103,18 +103,23 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
<Tab label="Custo R$/MWh"/> <Tab label="Custo R$/MWh"/>
</Tabs> </Tabs>
</TableHeader> </TableHeader>
<article>
{ {
economyMenu === 0? economyMenu === 0 || economyMenu === 1?
<p style={{marginLeft: '3%'}}>Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil</p> <p>Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil</p>
:
economyMenu === 1?
<p style={{marginLeft: '3%'}}>Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil</p>
: :
economyMenu === 2? economyMenu === 2?
<p style={{marginLeft: '3%'}}>Comparativo de Custo Estimado - Valores em R$ x mil</p> <p>Comparativo de Custo Estimado - Valores em R$ x mil</p>
: :
<p style={{marginLeft: '3%'}}>Indicador de Custo - Valores em R$/MWh</p> <p>Indicador de Custo - Valores em R$/MWh</p>
} }
<p>{
economyMenu===0 || economyMenu===1?
lastDataBrutaMensalS
:
null
}</p>
</article>
{ {
typeof window === 'undefined' || typeof window === undefined? null : typeof window === 'undefined' || typeof window === undefined? null :
<> <>
@ -165,7 +170,7 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
<section> <section>
<CativoXLivreChart chartData={unity!==''? catLivDataState : catLiv} <CativoXLivreChart chartData={unity!==''? catLivDataState : catLiv}
dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre' dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre'
label={ConsumoEstimado.label} title='' subtitle='' barLabel hashurado/> label={['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']} title='' subtitle='' barLabel hashurado/>
</section> </section>
</RenderIf> </RenderIf>

3
src/pages/estimatedCost/index.tsx
View File

@ -12,7 +12,6 @@ import Select from '@mui/material/Select';
import Header from '../../components/header/Header' import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle' import PageTitle from '../../components/pageTitle/PageTitle'
import { ConsumoEstimado } from '../../services/consumoEstimado'
import getAPIClient from '../../services/ssrApi' import getAPIClient from '../../services/ssrApi'
import { EstimatedCostView } from '../../styles/layouts/economy/estimatedCost/EstimatedCostView' import { EstimatedCostView } from '../../styles/layouts/economy/estimatedCost/EstimatedCostView'
@ -65,7 +64,7 @@ export default function EstimatedCost({graphData, userName, clients}: any) {
<section> <section>
<CativoXLivreChart chartData={unity!==null? graphDataState : graphData} <CativoXLivreChart chartData={unity!==null? graphDataState : graphData}
dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre' dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre'
label={ConsumoEstimado.label} title='' subtitle='' barLabel hashurado/> label={['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']} title='' subtitle='' barLabel hashurado/>
</section> </section>
</EstimatedCostView> </EstimatedCostView>
) )

3
src/pages/grossSavings/index.tsx
View File

@ -3,12 +3,9 @@ import Head from 'next/head'
import { parseCookies } from 'nookies' import { parseCookies } from 'nookies'
import React from 'react' import React from 'react'
import Chart from '../../components/graph/Chart'
import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart' import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart'
import { SingleBar } from '../../components/graph/SingleBar'
import Header from '../../components/header/Header' import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle' import PageTitle from '../../components/pageTitle/PageTitle'
import { dataEconomiaBruta } from '../../services/economiaBruta'
import getAPIClient from '../../services/ssrApi' import getAPIClient from '../../services/ssrApi'
import { GrossSavingsView } from '../../styles/layouts/economy/grossSavings/GrossSavings' import { GrossSavingsView } from '../../styles/layouts/economy/grossSavings/GrossSavings'

4
src/pages/pld/index.tsx
View File

@ -5,7 +5,6 @@ import MenuItem from '@mui/material/MenuItem';
import Select, { SelectChangeEvent } from '@mui/material/Select'; import Select, { SelectChangeEvent } from '@mui/material/Select';
import { GetServerSideProps } from 'next'; import { GetServerSideProps } from 'next';
import Head from 'next/head'; import Head from 'next/head';
import Link from 'next/link';
import { parseCookies } from 'nookies'; import { parseCookies } from 'nookies';
import React, { useContext, useEffect, useState } from 'react' import React, { useContext, useEffect, useState } from 'react'
@ -15,9 +14,8 @@ import LineChart from '../../components/graph/LineChart';
import Header from '../../components/header/Header' import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle'; import PageTitle from '../../components/pageTitle/PageTitle';
import { api } from '../../services/api'; import { api } from '../../services/api';
import { EvolucaoPld } from '../../services/evolucaoPld';
import getAPIClient from '../../services/ssrApi'; import getAPIClient from '../../services/ssrApi';
import { GoBack, PldGraphView, PldTableMinMaxView, PldTableView, TableHeader } from '../../styles/layouts/pld/PldView' import { PldGraphView, PldTableMinMaxView, PldTableView, TableHeader } from '../../styles/layouts/pld/PldView'
import RenderIf from '../../utils/renderIf' import RenderIf from '../../utils/renderIf'
import Tabs from '@mui/material/Tabs'; import Tabs from '@mui/material/Tabs';

7
src/pages/resumoOperacao/index.tsx
View File

@ -7,18 +7,13 @@ import { GetServerSideProps } from 'next';
import Head from 'next/head'; import Head from 'next/head';
import { parseCookies } from 'nookies'; import { parseCookies } from 'nookies';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
// import Teste from '../files/teste.csv';
import { CSVDownload, CSVLink } from "react-csv";
import BasicButton from '../../components/buttons/basicButton/BasicButton'; import BasicButton from '../../components/buttons/basicButton/BasicButton';
import Header from '../../components/header/Header'; import Header from '../../components/header/Header';
import PageTitle from '../../components/pageTitle/PageTitle'; import PageTitle from '../../components/pageTitle/PageTitle';
import Sidebar from '../../components/sidebar/Sidebar';
import { api } from '../../services/api'; import { api } from '../../services/api';
// import { dados } from '../services/DadosTabelaResumoOperacao';
import data from '../../services/dados.json'
import getAPIClient from '../../services/ssrApi'; import getAPIClient from '../../services/ssrApi';
import { Pagination, TableBodyView, TableHeader, TableView } from '../../styles/layouts/ResumoOperacao/ResumoOperacaoView'; import { TableBodyView, TableHeader, TableView } from '../../styles/layouts/ResumoOperacao/ResumoOperacaoView';
import Fab from '@mui/material/Fab'; import Fab from '@mui/material/Fab';

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

@ -45,7 +45,7 @@ export default function Telemetria({userName, clients}: any) {
const [unity, setUnity] = useState(''); const [unity, setUnity] = useState('');
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 [discretization, setDiscretization] = useState(''); const [discretization, setDiscretization] = useState('1_hora');
const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false) const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false)
const [openSnackError, setOpenSnackError] = useState<boolean>(false) const [openSnackError, setOpenSnackError] = useState<boolean>(false)

10
src/services/DadosTabelaResumoOperacao.js
View File

@ -1,10 +0,0 @@
// {
// "unidades": [
// { "value": "unidade1", "name": "Unidade-1", "operacao": "Compra", "montante": "130,00", "contraparte": "cOPEL COM I5", "preco": "234,67", "valorNF": "38.257,15" },
// { "value": "unidade2", "name": "Unidade-2", "operacao": "Compra", "montante": "20,00", "contraparte": "EMEWE I5", "preco": "234,67", "valorNF": "38.257,15"},
// { "value": "unidade3", "name": "Unidade-3", "operacao": "Compra", "montante": "30,00", "contraparte": "EMEWE I5", "preco": "234,67", "valorNF": "38.257,15" },
// { "value": "unidade4", "name": "Unidade-4", "operacao": "Compra", "montante": "40,00", "contraparte": "COPEL COM I5", "preco": "234,67", "valorNF": "38.257,15" },
// { "value": "unidade5", "name": "Unidade-5", "operacao": "Compra", "montante": "500,00","contraparte": "COPEL COM I5", "preco": "234,67", "valorNF": "38.257,15" },
// { "value": "unidade6", "name": "Unidade-6", "operacao": "Compra", "montante": "300,00", "contraparte": "COPEL COM I5", "preco":"234,67", "valorNF": "965,95" }
// ]
// }

12
src/services/consumoDiscretizadoBar.js
View File

@ -1,12 +0,0 @@
export const ConsumoDecretizadoBar = {
data:
[1, 3, 4, 7, 10, 14, 17, 20, 23, 25, 28, 31, 34, 37, 40, 43, 46, 49, 53, 56, 58, 60, 63, 66,
69, 72, 76, 79, 82, 86, 90, 93, 97, 103, 106, 109, 112, 116, 120, 124, 127, 130, 134, 138, 142, 145, 148, 152,
155, 158, 161, 164, 168, 172, 176, 200, 203, 206, 209, 213, 217, 221, 223, 226, 229, 231, 234, 238, 240, 244, 248
],
label:
['0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22',
'0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22',
'0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22']
}

14
src/services/consumoDiscretizadoLine.js
View File

@ -1,14 +0,0 @@
export const ConsumoDecretizadoLine = {
data: [100, 120, 110, 130, 140, 130, 150, 300, 400, 410, 420, 430, 435, 440, 440, 420, 400, 420, 420, 415, 300, 280, 280, 200,
100, 120, 110, 130, 140, 130, 150, 300, 400, 410, 420, 430, 435, 440, 440, 420, 400, 420, 420, 415, 300, 280, 280, 200,
100, 120, 110, 130, 140, 130, 150, 300, 400, 410, 420, 430, 435, 440, 440, 420, 400, 420, 420, 415, 300, 280, 280, 200,
100, 120, 110, 130, 140, 130, 150, 300, 400, 410, 420, 430, 435, 440, 440, 420, 400, 420, 420, 415, 300, 280, 280, 200,],
data1: [600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 290, 290, 290,
600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 290, 290, 290,
600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 290, 290, 290,],
label1:['0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0',
'0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0',
'0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0', ]
}

6
src/services/consumoEstimado.js
View File

@ -1,6 +0,0 @@
export const ConsumoEstimado = {
data: [245,202, 176, 150, 102, 138, 155, 177, 228, 161, 316, 335],
data1: [214, 167, 129, 114, 68, 99, 116, 129, 183, 93, 165, 164],
data2: [31, 35, 47, 37, 39, 39, 48, 45, 68, 151, 171],
label: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']
}

10
src/services/dados.json
View File

@ -1,10 +0,0 @@
{
"unidades": [
{ "value": "unidade1", "name": "Unidade-1", "operacao": "Compra", "montante": "130,00", "contraparte": "cOPEL COM I5", "preco": "234,67", "valorNF": "38.257,15" },
{ "value": "unidade2", "name": "Unidade-2", "operacao": "Compra", "montante": "20,00", "contraparte": "EMEWE I5", "preco": "234,67", "valorNF": "38.257,15"},
{ "value": "unidade3", "name": "Unidade-3", "operacao": "Compra", "montante": "30,00", "contraparte": "EMEWE I5", "preco": "234,67", "valorNF": "38.257,15" },
{ "value": "unidade4", "name": "Unidade-4", "operacao": "Compra", "montante": "40,00", "contraparte": "COPEL COM I5", "preco": "234,67", "valorNF": "38.257,15" },
{ "value": "unidade5", "name": "Unidade-5", "operacao": "Compra", "montante": "500,00","contraparte": "COPEL COM I5", "preco": "234,67", "valorNF": "38.257,15" },
{ "value": "unidade6", "name": "Unidade-6", "operacao": "Compra", "montante": "300,00", "contraparte": "COPEL COM I5", "preco":"234,67", "valorNF": "965,95" }
]
}

15
src/services/economiaAcumulada.js
View File

@ -1,15 +0,0 @@
export const EconomiaAcumulada = {
data : [872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294],
data1 : [1445, 1615],
data2 : [872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294, 872],
data3: [9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9],
data4: [6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6],
data5: [3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3],
data6: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
label: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez'],
label1: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24'],
label3: ['0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8',]
}

4
src/services/economiaBruta.js
View File

@ -1,4 +0,0 @@
export const dataEconomiaBruta = {
data: [872, 1615, 2196, 2930, 3838, 4814, 5700],
labels: ['2020', '2021', '2022', '2023', '2024', '2025', '2026']
}

6
src/services/economiaBruta.json
View File

@ -1,6 +0,0 @@
{
"consolidada": [],
"2020": [],
"2021": [],
"labels": [2020, 2021, 2022, 2023, 2024, 2025, 2026]
}

5
src/services/economiaIndicador.js
View File

@ -1,5 +0,0 @@
export const dataEconomiaIndicador = {
data1: [591, 552, 527, 1138, 529, 478, 456, 515, 526, 731, 890, 742],
data2: [714, 683, 547, 575, 660, 628, 699, 751, 819, 700],
labels: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez']
}

8
src/services/evolucaoPld.js
View File

@ -1,8 +0,0 @@
export const EvolucaoPld = {
data :[97.00, 98.00, 99.00, 100.00, 105.00, 113.00, 116.00, 120.00, 123.00, 120.00, 120.00, 118.00, 113.00, 101.00, 100.00, 98.00,
98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00],
data1 :[97.00, 98.00, 99.00, 100.00, 105.00, 113.00, 116.00, 120.00, 123.00, 120.00, 120.00, 118.00, 113.00, 101.00, 100.00, 98.00,
98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00],
label: ['1', '2', '3', '4', '5', '6', '7', '8', '8', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30']
}

8
src/services/fatorPotencia.js
View File

@ -1,8 +0,0 @@
export const FatorPotencia = {
data : [1.00, 1.00, 1.00, -0.96, -0.96, 0.97, 0.98, 0.95, 0.94, 0.98, 0.95, 0.95, 0.98, 1.01, 1.05, 1.00, 1.00, 0.95, 0.97, 0.97, 0.97, 0.97, 0.97, 0.97, 0.98, 1.00, 0.97, 0.97, 0.97, 0.97, 0.97, 0.96, 0.95, 0.94, 0.95, 0.95,],
data1 : [90, 90, 90, 90, 90, 90, 90, 90, 90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90 ,90, 90, 90],
data2 : [.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98,.98],
label1: ['0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22', '0', '2', '4', '6', '8', '10', '12', '14', '16', '18', '20', '22'],
}

15
src/styles/layouts/economy/economy.ts
View File

@ -28,4 +28,19 @@ export const EconomyView = styled.main`
.chartBox { .chartBox {
} }
article {
display: flex;
align-items: center;
justify-content: space-between;
p {
:first-child {
margin-left: '3%'
}
:last-child {
color: #254F7F;
}
}
}
` `

0
src/txt.txt
View File