Merge branch 'fix/chartsFixs' into 'dev'

Fix/charts fixs

See merge request kluppsoftware/smart-energia-web!106
This commit is contained in:
José Corte 2022-07-11 19:46:33 +00:00
commit 38f46fdebe
33 changed files with 1340 additions and 478 deletions

View File

@ -36,6 +36,7 @@
"axios": "^0.27.2",
"chart.js": "^3.7.1",
"chartjs-plugin-datalabels": "^2.0.0",
"chartjs-plugin-style": "^0.5.0",
"date-fns": "^2.28.0",
"eslint-plugin-react": "^7.29.4",
"eslit": "^6.0.0",
@ -58,6 +59,7 @@
"react-icons": "^4.3.1",
"react-input-mask": "^2.0.4",
"react-pdf-thumbnail": "^0.1.0",
"sharp": "^0.30.7",
"styled-components": "^5.3.5",
"tinymce": "^6.0.3",
"yup": "^0.32.11"

View File

@ -21,9 +21,6 @@ export default function GradientButton({ title, description, orange, purple, gre
return (
<GradientButtonView color={orange? 'orange' : purple? 'purple' : green? 'green' : 'orange'} onClick={() => handleClick()}>
<svg>
<rect x="0" y="0" fill="none" width="100%" height="100%"/>
</svg>
<p></p>
<p>{description}</p>
</GradientButtonView>

View File

@ -37,33 +37,9 @@ export const GradientButtonView = styled.button`
transform: scale(1.1);
}
svg {
width: 404px;
left: 0;
position: absolute;
top: 0;
height: 110px;
}
rect {
fill: none;
stroke: #fff;
stroke-width: 2;
stroke-dasharray: 422, 0;
transition: all 0.35s linear;
}
:hover {
background: rgba($red, 0);
letter-spacing: 1px;
rect {
stroke-width: 5;
stroke-dasharray: 15, 310;
stroke-dashoffset: 48;
transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
}
}
* {
@ -72,15 +48,6 @@ export const GradientButtonView = styled.button`
}
p {
:first-child {
font-family: 'Poppins';
font-style: normal;
font-weight: 700;
font-size: calc(20px);
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
:last-child {
font-family: 'Poppins';
font-style: normal;
font-weight: 700;
@ -88,5 +55,4 @@ export const GradientButtonView = styled.button`
text-transform: uppercase;
}
}
`

View File

@ -114,8 +114,10 @@ export function LineBarChart({ title, subtitle, data1, data2, data3, label, red,
},
};
console.log(label.length)
const data = data2? {
labels,
labels: label.length < 28? ['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', '31'] : label,
datasets: [
{
type: 'line' as const,

View File

@ -93,7 +93,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
plugins: {
datalabels: {
display: true,
color: barLabel? 'black' : "rgba(255, 255, 255, 0)",
color: '#255488',
// backgroundColor: '#255488',
anchor: "end",
offset: -20,
@ -107,7 +107,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
dataArr.map(data => {
sum += data;
});
const result = `${(parseFloat(value)).toLocaleString('pt-br')}`
const result = `${(parseInt(value)).toLocaleString('pt-br')}`
return value==null? null : result
}
@ -136,7 +136,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
},
borderWidth: 2,
fill: false,
data: chartData.map(value => value.economia_mensal),
data: chartData.map(value => parseInt(value.economia_mensal)),
},
{
type: 'bar' as const,
@ -146,7 +146,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
},
data: chartData.map(value => {
if (!value.dad_estimado)
return value.custo_cativo
return parseInt(value.custo_cativo)
}),
},
{
@ -158,7 +158,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
},
data: chartData.map(value => {
if (!value.dad_estimado)
return value.custo_livre
return parseInt(value.custo_livre)
}),
},
{
@ -167,7 +167,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
backgroundColor: pattern.draw('diagonal', '#C2D5FB'),
data: chartData.map(value => {
if (value.dad_estimado)
return value.custo_cativo
return parseInt(value.custo_cativo)
}),
},
{
@ -176,7 +176,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
backgroundColor: pattern.draw('diagonal', '#255488'),
data: chartData.map(value => {
if (value.dad_estimado)
return value.custo_livre
return parseInt(value.custo_livre)
}),
}
],

View File

@ -43,13 +43,11 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
responsive: true,
scales: {
x: {
stacked: true,
grid: {
display: false
}
},
y: {
stacked: true,
grid: {
display: false
}
@ -58,7 +56,7 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
plugins: {
datalabels: {
display: true,
color: 'black',
color: '#255488',
formatter: (value, ctx) => {
let sum = 0;
const dataArr = ctx.chart.data.datasets[0].data;

View File

@ -6,6 +6,7 @@ import { Bar, Chart } from 'react-chartjs-2';
import { GrossAnualChartView } from './GrossAnualChartView';
import ChartTitle from '../ChartTitle';
import { blue } from '@mui/material/colors';
ChartJS.register(
CategoryScale,
@ -74,24 +75,24 @@ export function GrossAnulChart({ title, subtitle, dataProps, label, dataset, bar
sum += data;
});
const percentage = (dataProps[ctx.dataIndex].econ_percentual*100).toFixed(0)+"%";
const result = `${spacement(parseInt(value).toLocaleString('pt-br'))}${percentage}\n${parseInt(value).toLocaleString('pt-br')}`
const result = `${spacement(parseInt(value).toLocaleString('pt-br'))} ${percentage}\n${parseInt(value).toLocaleString('pt-br')}`
return value==null? null : result
},
display: true,
color: barLabel? 'black' : "rgba(255, 255, 255, 0)",
color: '#255488',
anchor: "end",
offset: -60,
align: "start",
font: {
size: !miniature? 22 : 10
size: !miniature? 22 : 10,
}
},
legend: {
position: 'bottom' as const,
labels: {
font: {
size: 16
size: 12,
}
}
},
@ -115,6 +116,8 @@ export function GrossAnulChart({ title, subtitle, dataProps, label, dataset, bar
{
type: 'bar',
label: dataset,
stacked: true,
data: dataProps.map((value, index) => {
if (!value.dad_estimado)
return parseFloat(value.economia_acumulada).toFixed(2)
@ -125,14 +128,12 @@ export function GrossAnulChart({ title, subtitle, dataProps, label, dataset, bar
},
{
type: 'bar',
stacked: true,
label: 'Estimado',
data: dataProps.map((value, index) => {
if (value.dad_estimado)
return parseFloat(value.economia_acumulada).toFixed(2)
}),
datalabels: {
display: false
},
backgroundColor: (value, ctx) => {
return draw('diagonal-right-left', '#C2d5fb');
},
@ -143,7 +144,7 @@ export function GrossAnulChart({ title, subtitle, dataProps, label, dataset, bar
return (
<GrossAnualChartView>
<ChartTitle title={title} subtitle={subtitle} />
<Chart options={options} data={data} type='bar'/>
<Chart options={options} data={data} type='bar' height={150}/>
</GrossAnualChartView>
)
}

View File

@ -73,7 +73,7 @@ export default function GrossMensalChart({ title, data1, data2, label, subtitle,
plugins: {
datalabels: {
display: true,
color: 'black',
color: '#255488',
formatter: (value, ctx) => {
let sum = 0;
const dataArr = ctx.chart.data.datasets[0].data;
@ -132,7 +132,7 @@ export default function GrossMensalChart({ title, data1, data2, label, subtitle,
<ChartTitle title={title} subtitle={subtitle} />
<ChartJs
options={options}
data={data} type={'bar'} />
data={data} type={'bar'} height={'156'}/>
</GrossMensalChartView>
)
}

View File

@ -1,14 +1,11 @@
import styled from "styled-components"
export const GrossMensalChartView = styled.div`
width: 100%;
width: 90%;
div{
/* margin-top: 10px; */
}
transform: translateY(-25px);
@media (max-width: 900px) {
min-width: 20rem
}
`

View File

@ -2,13 +2,17 @@ import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import Modal from '@mui/material/Modal';
import Typography from '@mui/material/Typography';
import { GetServerSideProps } from 'next';
import Image from 'next/image'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { parseCookies } from 'nookies';
import React, { useContext, useEffect, useState } from 'react'
import { AuthContext } from '../../contexts/AuthContext';
import { MenuContext } from '../../contexts/menu/MenuContext';
import { api } from '../../services/api';
import RenderIf from '../../utils/renderIf';
@ -30,6 +34,8 @@ const style = {
};
export default function Sidebar() {
const {pldMenu, setPldMenu, economyMenu, setEconomyMenu} = useContext(MenuContext)
const [open, setOpen] = useState(false);
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
@ -37,6 +43,8 @@ export default function Sidebar() {
const { signOut } = useContext(AuthContext)
const [ economiaDrawer, setEconomiaDrawer ] = useState(false)
const [ pldDrawer, setPldDrawer ] = useState(false)
const [ notificationsCount, setNotificationsCount ] = useState<number>(0)
const [ viewModal, setViewModal ] = useState(false)
@ -81,11 +89,16 @@ export default function Sidebar() {
aria-describedby="modal-modal-description"
>
<Box sx={style}>
<Typography id="modal-modal-title" variant="h6" component="h2">
<ModalContainer>
<Image src='/assets/marca1.png' width={250} height={200}/>
<Typography id="modal-modal-title" variant="subtitle2" component="p" style={{color: 'gray'}}>
Deseja realmente sair ?
</Typography>
<Link href='/'><Button variant="contained" sx={{mt:5}} onClick={() => signOut()}>Sim</Button></Link>
<Button variant="contained" onClick={handleClose} color="error" sx={{mt:5 ,ml:1}}>Não</Button>
<article>
<Link href='/'><button onClick={() => signOut()}>Sair</button></Link>
<button onClick={handleClose} color="error">Voltar</button>
</article>
</ModalContainer>
</Box>
</Modal>
</ul>
@ -97,7 +110,7 @@ export default function Sidebar() {
</RenderIf>
<RenderIf isTrue={role === '2'}>
<SidebarView economiaDrawer={economiaDrawer} modalOpen={viewModal} >
<SidebarView economiaDrawer={economiaDrawer} pldDrawer={pldDrawer} modalOpen={viewModal} >
<div className='hamburger' onClick={() => setViewModal(!viewModal)} >
<Image src='/assets/hamburgerModal.svg' width={55} height={55} />
</div>
@ -106,17 +119,22 @@ export default function Sidebar() {
</div>
<ul>
<Link href='/dashboard'><li className={router.pathname=='/dashboard'? 'actualPath' : null} ><Image src='/assets/sidebar/dashboardIcon.svg' width={25} height={25} />{'Visão Geral'}</li></Link>
<li onClick={() => setEconomiaDrawer(!economiaDrawer)} className={router.pathname=='/grossSavings' || router.pathname=='/accumulatedSavings' || router.pathname=='/estimatedCost' || router.pathname=='/costIndicator' ? 'actualPath' : null } ><Image src='/assets/sidebar/economyIcon.svg' width={25} height={25} />{'Economia >'}</li>
<div className='economiaDrawer drawer' >
<Link href='/grossSavings'><li className={router.pathname=='/grossSavings'? 'actualPathDrawer' : null}>Economia Bruta Anual</li></Link>
<Link href='/accumulatedSavings'><li className={router.pathname=='/accumulatedSavings'? 'actualPathDrawer' : null}>Economia Bruta Mensal</li></Link>
<Link href='/estimatedCost'><li className={router.pathname=='/estimatedCost'? 'actualPathDrawer' : null}>Cativo x Livre Mensal</li></Link>
<Link href='/costIndicator'><li className={router.pathname=='/costIndicator'? 'actualPathDrawer' : null}>Custo R$/MWh</li></Link>
</div>
<Link href='/economy'><li onClick={() => setEconomiaDrawer(!economiaDrawer)} className={router.pathname=='/grossSavings' || router.pathname=='/accumulatedSavings' || router.pathname=='/estimatedCost' || router.pathname=='/costIndicator' ? 'actualPath' : null } ><Image src='/assets/sidebar/economyIcon.svg' width={25} height={25} />{'Economia'}</li></Link>
{/* <div className='economiaDrawer drawer'>
<Link href='/economy'><li onClick={() => setEconomyMenu(0)} className={economyMenu===0? 'actualPathDrawer' : null}>Economia Bruta Anual</li></Link>
<Link href='/economy'><li onClick={() => setEconomyMenu(1)} className={economyMenu===1? 'actualPathDrawer' : null}>Economia Bruta Mensal</li></Link>
<Link href='/economy'><li onClick={() => setEconomyMenu(2)} className={economyMenu===2? 'actualPathDrawer' : null}>Cativo x Livre Mensal</li></Link>
<Link href='/economy'><li onClick={() => setEconomyMenu(3)} className={economyMenu===3? 'actualPathDrawer' : null}>Custo R$/MWh</li></Link>
</div> */}
<Link href='/telemetria'><li className={router.pathname=='/telemetria'? 'actualPath' : null}><Image src='/assets/sidebar/telemetryIcon.svg' width={25} height={25} />{'Telemetria'}</li></Link>
<Link href='/resumoOperacao'><li className={router.pathname=='/resumoOperacao'? 'actualPath' : null} ><Image src='/assets/sidebar/summaryOperationsIcon.svg' width={25} height={25} />{'Resumo de Op. '}</li></Link>
<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='/pld'><li className={router.pathname=='/pld'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'PLD'}</li></Link>
<li onClick={() => setPldDrawer(!pldDrawer)} className={router.pathname=='/pld'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'PLD >'}</li>
<div className='pldDrawer drawer'>
<Link href='/pld'><li onClick={() => setPldMenu(0)} className={pldMenu==0? 'actualPathDrawer' : null}>PLD Histórico</li></Link>
<Link href='/pld'><li onClick={() => setPldMenu(1)} className={pldMenu===1? 'actualPathDrawer' : null}>Valores Diários</li></Link>
<Link href='/pld'><li onClick={() => setPldMenu(2)} className={pldMenu===2? 'actualPathDrawer' : null}>Valores Horários</li></Link>
</div>
<Link href='/industryInfo'><li className={router.pathname=='/industryInfo'? '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='/notifications'><li className={router.pathname=='/notifications'? 'actualPath' : null}><Image src='/assets/sidebar/notificationsIcon.svg' width={25} height={25} />{'Notificações'}<div className='notification' style={{display: notificationsCount<=0||notificationsCount===undefined? 'none' : 'inherit'}}><p>{notificationsCount}</p></div></li></Link>
@ -132,7 +150,7 @@ export default function Sidebar() {
<Box sx={style}>
<ModalContainer>
<Image src='/assets/marca1.png' width={250} height={200}/>
<Typography id="modal-modal-title" variant="h6" component="h2">
<Typography id="modal-modal-title" variant="subtitle2" component="p" style={{color: 'gray'}}>
Deseja realmente sair ?
</Typography>
<article>

View File

@ -2,7 +2,8 @@ import styled from 'styled-components'
interface SidebarViewInterface {
economiaDrawer: boolean | null,
modalOpen: boolean | null
modalOpen: boolean | null,
pldDrawer?: boolean | undefined
}
export const SidebarView = styled.nav<SidebarViewInterface>`
@ -92,6 +93,9 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
.economiaDrawer {
display: ${props => props.economiaDrawer? 'block' : 'none'};
}
.pldDrawer {
display: ${props => props.pldDrawer? 'block' : 'none'};
}
}
aside {
@ -254,7 +258,7 @@ export const ModalContainer = styled.div`
margin-top: 4em;
button {
width: 10em;
height: 4em;
height: 3em;
cursor: pointer;

View File

@ -0,0 +1,22 @@
import React, { createContext, useState } from "react";
type AuthContextType = {
pldMenu: number,
setPldMenu: any,
economyMenu: number,
setEconomyMenu: any
}
export const MenuContext = createContext({} as AuthContextType)
export function MenuProvider({children}: {children: React.ReactNode}) {
const [pldMenu, setPldMenu] = useState<number>(0)
const [economyMenu, setEconomyMenu] = useState<number>(0)
return (
<MenuContext.Provider value={{pldMenu, setPldMenu, economyMenu, setEconomyMenu}}>
{children}
</MenuContext.Provider>
)
}

View File

@ -19,6 +19,7 @@ import '../styles/nprogress/nprogress.css'
import { GetServerSideProps } from 'next'
import { parseCookies } from 'nookies'
import getAPIClient from '../services/ssrApi'
import { MenuProvider } from '../contexts/menu/MenuContext'
export function MyApp({ Component, pageProps, notificationsCount }: AppProps | any) {
const router = useRouter()
@ -45,6 +46,7 @@ export function MyApp({ Component, pageProps, notificationsCount }: AppProps | a
return (
<AuthProvider>
<MenuProvider>
<AppView>
<Head>
<link rel="icon" type="imagem/png" href="/assets/logose.png" />
@ -64,6 +66,7 @@ export function MyApp({ Component, pageProps, notificationsCount }: AppProps | a
null
}
</AppView>
</MenuProvider>
</AuthProvider>
)
}

View File

@ -12,7 +12,7 @@ export default function aboutUs({userName, text}) {
return (
<AboutUsView>
<Head>
<title>Smart Energia - About Us</title>
<title>Smart Energia - Sobre s</title>
</Head>
<Header name={userName}/>

View File

@ -20,10 +20,10 @@ import { getDemand } from '../../services/charts/telemetry/getDemand'
import { getDiscretization } from '../../services/charts/telemetry/getDiscretization'
export default function chartTelemetry({userName}) {
const [fatorPotenciaData, setFatorPotenciaData] = useState(null);
const [demRegXDemCon, setDemRegXDemCon] = useState(null);
const [discretizedConsumptionData, setDiscretizedConsumptionData] = useState(null);
const [discretizedConsumptionDataReativa, setDiscretizedConsumptionDataReativa] = useState(null);
const [fatorPotenciaData, setFatorPotenciaData] = useState([]);
const [demRegXDemCon, setDemRegXDemCon] = useState([]);
const [discretizedConsumptionData, setDiscretizedConsumptionData] = useState([]);
const [discretizedConsumptionDataReativa, setDiscretizedConsumptionDataReativa] = useState([]);
const { ['user-cod_client']: cod_client } = parseCookies()
@ -37,19 +37,19 @@ export default function chartTelemetry({userName}) {
console.log(token)
getPowerFactorData("PRAXCUENTR101P", "2022-01-01", "2022-01-31", "med_5min")
.then(result => setFatorPotenciaData(result))
.catch(exception => console.log(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 => 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))
// 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))
// 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)
@ -70,7 +70,7 @@ export default function chartTelemetry({userName}) {
<PageTitle title='Telemetria - Graficos' subtitle='Gráficos' />
<section className='chartContainer'>
{
demRegXDemCon==null?
demRegXDemCon===null?
<div id="preloader_1">
<span></span>
<span></span>
@ -82,12 +82,13 @@ export default function chartTelemetry({userName}) {
<>
<RenderIf isTrue={discretization!=='1_dia' && discretization!=='1_mes'}>
{/* <RenderIf isTrue={true}> */}
<div>
<DiscretizedConsumptionChart title={
discretization==='5_min'? 'Consumo discretizado em 5 minutos' :
discretization==='15_min'? 'Consumo discretizado em 15 minutos' : discretization==='1_hora'? 'Consumo discretizado em 1 hora' : 'Consumo discretizado em 1 dia'
} subtitle='' dataProps={discretizedConsumptionData} label={discretizedConsumptionData.map(value => value.minut)} dataset={'Consumo'} dataset1='Estimado' month/>
<p style={{alignSelf: 'center', textAlign: 'center'}}>{`Mês - ${startDate.toString().split('-')[2]}/${startDate.toString().split('-')[1]}/${startDate.toString().split('-')[0]}`}</p>
<p style={{alignSelf: 'center', textAlign: 'center'}}>{`Mês - ${startDate}`}</p>
</div>
<div>
@ -100,7 +101,9 @@ export default function chartTelemetry({userName}) {
</RenderIf>
<div>
<DemRegXDemConChart data1={demRegXDemCon} data2={demRegXDemCon} dataset1={'Demanda contratada + 5%'} dataset2={'barra1'} dataset3={'Demanda Registrada'} label={demRegXDemCon.map(value => value.hora)} title='Demanda Contratada X Registrada' subtitle='' red/>
<DemRegXDemConChart data1={demRegXDemCon} data2={demRegXDemCon}
dataset1={'Demanda contratada + 5%'} dataset2={'barra1'} dataset3={'Demanda Registrada'}
label={demRegXDemCon.map(value => value.hora)} title='Demanda Contratada X Registrada' subtitle='' red/>
</div>
<div>

View File

@ -1,7 +1,7 @@
import { GetServerSideProps } from 'next'
import Head from 'next/head'
import { parseCookies } from 'nookies'
import React, { useState } from 'react'
import React, { useEffect, useState } from 'react'
// material ui imports
import MenuItem from '@mui/material/MenuItem';
@ -14,6 +14,7 @@ import Header from '../../components/header/Header'
import PageTitle from '../../components/pageTitle/PageTitle'
import getAPIClient from '../../services/ssrApi'
import { CostIndicatorView } from '../../styles/layouts/economy/costIndicator/CostIndicatorView'
import { api } from '../../services/api';
export default function CostIndicator({graphData, userName, clients}: any) {
const [unity, setUnity] = useState('');
@ -33,6 +34,21 @@ export default function CostIndicator({graphData, userName, clients}: any) {
'Dez'
]
const [graphDataState, setGraphDataState] = useState([]);
useEffect(() => {
api.post('/economy/estimates', unity!==''?{
"filters": [
{"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity}
]
}:{}).then(res => {
setGraphDataState(res.data.data)
console.log()
}).catch(res => {
// console.log(res)
})
}, [unity])
return (
<CostIndicatorView>
<Head>
@ -55,15 +71,19 @@ export default function CostIndicator({graphData, userName, clients}: any) {
{/* <MenuItem value="RSZFNAENTR101P">RSZFNAENTR101P</MenuItem> COMENTARIO DE OPÇAO COM DADOS TESTES */}
{
clients.map((value) => {
return <MenuItem key={1} value={value.codigo_scde}>{value.cod_smart_unidade}</MenuItem>
return <MenuItem key={1} value={value.cod_smart_unidade}>{value.unidade}</MenuItem>
})
}
</Select>
</FormControl>
<section>
<CostIndicatorChart title='' subtitle=''
data1={graphData.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
data2={graphData.filter((value, index) => value.mes.slice(4, 8).includes('2022'))}
data1={unity!==''? graphDataState.filter((value, index) => value.mes.slice(4, 8).includes('2021'))
:
graphData.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
data2={unity!==''? graphDataState.filter((value, index) => value.mes.slice(4, 8).includes('2022'))
:
graphData.filter((value, index) => value.mes.slice(4, 8).includes('2022'))}
label={months}
/>
</section>
@ -75,7 +95,8 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
const apiClient = getAPIClient(ctx)
const { ['@smartAuth-token']: token } = parseCookies(ctx)
const { ['user-name']: userName } = parseCookies(ctx)
const { ['user-client_id']: id } = parseCookies(ctx)
const { ['user-client_id']: client_id } = parseCookies(ctx)
let graphData = [];
@ -83,12 +104,16 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
await apiClient.post('/units', {
"filters": [
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]},
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": id}
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id},
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]}
],
"fields": ["cod_smart_unidade", "codigo_scde"],
"fields": [
"unidade",
"cod_smart_unidade",
"codigo_scde"],
"distinct": true
}).then(res => {
}).then(res => {
console.log(res.data.data)
clients = res.data.data
}).catch(res => {
// console.log(res)

View File

@ -26,6 +26,7 @@ import Chart2 from '../../components/graph/Chart2'
import { GrossAnulChart } from '../../components/graph/grossAnualChart/GrossAnualChart'
import CostIndicatorChart from '../../components/graph/costIndicatorChart'
import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart'
import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart'
export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensalGraph, grossMensalYears, acumulatedGraph, mapsInfo, userName, costIndicator} : any) {
const months = [
@ -46,7 +47,7 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
return (
<DashboardView>
<Head>
<title>Smart Energia - Dashboard</title>
<title>Smart Energia - Visão Geral</title>
</Head>
<Header name={userName}>
<PageTitle title='Visão Geral' subtitle='Bem Vindo a Smart Energia' />
@ -77,10 +78,12 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
</GraphCard>
<GraphCard title='Economia Bruta Mensal' subtitle='Economia Bruta Estimada e Acumulada Mensal - Valores em R$ x mil' singleBar>
<Chart2 title='' subtitle=''
data1={grossMensalGraph.filter((value, index) => value.mes.slice(3, 8).includes('2021'))}
data2={grossMensalGraph.filter((value, index) => value.mes.slice(3, 8).includes('2022'))}
label={months} miniature/>
<GrossMensalChart title='' subtitle=''
data1={grossMensalGraph}
data2={grossMensalGraph}
label={grossMensalGraph.map((value) => value.mes)}
miniature
/>
</GraphCard>
<GraphCard title='Cativo x Livre Mensal' subtitle='Comparativo de Custo Estimado - Valores em R$ x mil' singleBar>

271
src/pages/economy/index.tsx Normal file
View File

@ -0,0 +1,271 @@
import Fab from '@mui/material/Fab';
import FormControl from '@mui/material/FormControl';
import InputLabel from '@mui/material/InputLabel';
import MenuItem from '@mui/material/MenuItem';
import Select, { SelectChangeEvent } from '@mui/material/Select';
import { GetServerSideProps } from 'next';
import Head from 'next/head';
import Link from 'next/link';
import { parseCookies } from 'nookies';
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 PageTitle from '../../components/pageTitle/PageTitle';
import { api } from '../../services/api';
import { EvolucaoPld } from '../../services/evolucaoPld';
import getAPIClient from '../../services/ssrApi';
import { GoBack, PldGraphView, PldTableView, TableHeader } from '../../styles/layouts/pld/PldView'
import RenderIf from '../../utils/renderIf'
import Tabs from '@mui/material/Tabs';
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 { GrossAnulChart } from '../../components/graph/grossAnualChart/GrossAnualChart';
import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart';
import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart';
import { ConsumoEstimado } from '../../services/consumoEstimado';
import CostIndicatorChart from '../../components/graph/costIndicatorChart';
export default function economy({userName, anual, years, brutaMensal, yearsBrutaMensal, catLiv, clients, indicatorCost}: any) {
const {economyMenu, setEconomyMenu} = useContext(MenuContext)
const [unity, setUnity] = useState<string>('');
const [catLivDataState, setCatLivDataState] = useState(null);
const [indicatorDataState, setIndicatorDataState] = useState(null);
const months = [
'Jan',
'Fev',
'Mar',
'Abr',
'Mai',
'Jun',
'Jul',
'Ago',
'Set',
'Out',
'Nov',
'Dez'
]
useEffect(() => {
api.post('/economy/estimates', unity!==''?{
"filters": [
{"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity}
]
}:{}).then(res => {
setCatLivDataState(res.data.data)
console.log()
}).catch(res => {
// console.log(res)
})
}, [unity])
useEffect(() => {
api.post('/economy/estimates', unity!==''?{
"filters": [
{"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity}
]
}:{}).then(res => {
setIndicatorDataState(res.data.data)
console.log()
}).catch(res => {
// console.log(res)
})
}, [unity])
return (
<main style={{width: '100%'}}>
<Head>
<title>Smart Energia - PLD</title>
</Head>
<div id='title'/>
<Header name={userName}>
<PageTitle title='Economia' subtitle='Graficos de economia'/>
</Header>
<TableHeader>
<Tabs value={economyMenu} onChange={(e, nv) => setEconomyMenu(nv)} aria-label="">
<Tab label="Bruta Anual"/>
<Tab label="Bruta Mensal"/>
<Tab label="Cativo x Livre Mensal"/>
<Tab label="Custo R$/MWh"/>
</Tabs>
</TableHeader>
<RenderIf isTrue={economyMenu===0}>
<section>
<GrossAnulChart title='' subtitle=''
dataset='Consolidada'
dataProps={anual}
label={years} barLabel bruta
/>
</section>
</RenderIf>
<RenderIf isTrue={economyMenu===1}>
<GrossMensalChart title='' subtitle=''
data1={brutaMensal}
data2={brutaMensal}
label={yearsBrutaMensal}
/>
</RenderIf>
<RenderIf isTrue={economyMenu===2}>
<FormControl sx={{ m: 1, minWidth: 120, width: 200 }} size="small">
<InputLabel id="demo-select-small">Unidade</InputLabel>
<Select
labelId="demo-select-small"
id="demo-select-small"
value={unity}
label="Unidade"
onChange={value => setUnity(value.target.value)}
fullWidth
>
<MenuItem value="">Todas</MenuItem>
{/* <MenuItem value="RSZFNAENTR101P">RSZFNAENTR101P</MenuItem> !!OPÇAO COM DADOS TESTES!! */}
{
clients.map((value) => {
return <MenuItem key={1} value={value.cod_smart_unidade}>{value.unidade}</MenuItem>
})
}
</Select>
</FormControl>
<section>
<CativoXLivreChart chartData={unity!==''? catLivDataState : catLiv}
dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre'
label={ConsumoEstimado.label} title='' subtitle='' barLabel hashurado/>
</section>
</RenderIf>
<RenderIf isTrue={economyMenu===3}>
<FormControl sx={{ m: 1, minWidth: 120, width: 200 }} size="small">
<InputLabel id="demo-select-small">Unidade</InputLabel>
<Select
labelId="demo-select-small"
id="demo-select-small"
value={unity}
label="Unidade"
onChange={value => setUnity(value.target.value)}
fullWidth
>
<MenuItem value="">Todas</MenuItem>
{/* <MenuItem value="RSZFNAENTR101P">RSZFNAENTR101P</MenuItem> COMENTARIO DE OPÇAO COM DADOS TESTES */}
{
clients.map((value) => {
return <MenuItem key={1} value={value.cod_smart_unidade}>{value.unidade}</MenuItem>
})
}
</Select>
</FormControl>
<section>
<CostIndicatorChart title='' subtitle=''
data1={unity!=''? indicatorDataState?.filter((value, index) => value.mes.slice(4, 8).includes('2021'))
:
indicatorCost?.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
data2={unity!=''? indicatorDataState?.filter((value, index) => value.mes.slice(4, 8).includes('2022'))
:
indicatorCost?.filter((value, index) => value.mes.slice(4, 8).includes('2022'))}
label={months}
/>
</section>
</RenderIf>
</main>
)
}
export const getServerSideProps: GetServerSideProps = async (ctx) => {
const apiClient = getAPIClient(ctx)
const { ['@smartAuth-token']: token } = parseCookies(ctx)
const { ['user-name']: userName } = parseCookies(ctx)
const { ['user-client_id']: client_id } = parseCookies(ctx)
let anual = [];
await apiClient.post('/economy/grossAnnual').then(res => {
anual = res.data.data
}).catch(res => {
// console.log(res)
})
const years = anual.map((value) => value.ano)
let brutaMensal = [];
await apiClient.post('/economy/grossMonthly').then(res => {
brutaMensal = res.data.data
// console.log(graphData[0].mes)
}).catch(res => {
// console.log(res)
})
const yearsBrutaMensal = brutaMensal.map((value) => value.mes)
let catLiv = [];
let clients = [];
await apiClient.post('/units', {
"filters": [
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id},
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]}
],
"fields": [
"unidade",
"cod_smart_unidade",
"codigo_scde"],
"distinct": true
}).then(res => {
console.log(res.data.data)
clients = res.data.data
}).catch(res => {
// console.log(res)
})
await apiClient.post('/economy/estimates').then(res => {
catLiv = res.data.data
}).catch(res => {
// console.log(res)
})
let indicatorCost = []
await apiClient.post('/economy/MWh').then(res => {
indicatorCost = res.data.data
}).catch(res => {
// console.log(res)
})
if (!token) {
return {
redirect: {
destination: '/',
permanent: false
}
}
}
return {
props: {
userName,
anual,
years,
brutaMensal,
yearsBrutaMensal,
catLiv,
clients,
indicatorCost
}
}
}

View File

@ -1,7 +1,7 @@
import { GetServerSideProps } from 'next'
import Head from 'next/head'
import { parseCookies } from 'nookies'
import React, { useState } from 'react'
import React, { useEffect, useState } from 'react'
import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart'
// material ui imports
@ -16,8 +16,25 @@ import { ConsumoEstimado } from '../../services/consumoEstimado'
import getAPIClient from '../../services/ssrApi'
import { EstimatedCostView } from '../../styles/layouts/economy/estimatedCost/EstimatedCostView'
import { api } from '../../services/api'
export default function EstimatedCost({graphData, userName, clients}: any) {
const [unity, setUnity] = useState('');
const [unity, setUnity] = useState<string>(null);
const [graphDataState, setGraphDataState] = useState(null);
useEffect(() => {
api.post('/economy/estimates', unity!==''?{
"filters": [
{"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity}
]
}:{}).then(res => {
setGraphDataState(res.data.data)
console.log()
}).catch(res => {
// console.log(res)
})
}, [unity])
return (
<EstimatedCostView>
@ -41,13 +58,13 @@ export default function EstimatedCost({graphData, userName, clients}: any) {
{/* <MenuItem value="RSZFNAENTR101P">RSZFNAENTR101P</MenuItem> !!OPÇAO COM DADOS TESTES!! */}
{
clients.map((value) => {
return <MenuItem key={1} value={value.codigo_scde}>{value.cod_smart_unidade}</MenuItem>
return <MenuItem key={1} value={value.cod_smart_unidade}>{value.unidade}</MenuItem>
})
}
</Select>
</FormControl>
<section>
<CativoXLivreChart chartData={graphData}
<CativoXLivreChart chartData={unity!==null? graphDataState : graphData}
dataset1="Economia (R$)" dataset2='Est. Cativo' dataset3='Est. Livre'
label={ConsumoEstimado.label} title='' subtitle='' barLabel hashurado/>
</section>
@ -59,19 +76,23 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
const apiClient = getAPIClient(ctx)
const { ['@smartAuth-token']: token } = parseCookies(ctx)
const { ['user-name']: userName } = parseCookies(ctx)
const { ['user-client_id']: id } = parseCookies(ctx)
const { ['user-client_id']: client_id } = parseCookies(ctx)
let graphData = [];
let clients = [];
await apiClient.post('/units', {
"filters": [
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]},
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": id}
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id},
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]}
],
"fields": ["cod_smart_unidade", "codigo_scde"],
"fields": [
"unidade",
"cod_smart_unidade",
"codigo_scde"],
"distinct": true
}).then(res => {
}).then(res => {
console.log(res.data.data)
clients = res.data.data
}).catch(res => {
// console.log(res)

View File

@ -7,7 +7,7 @@ import { GetServerSideProps } from 'next';
import Head from 'next/head';
import Link from 'next/link';
import { parseCookies } from 'nookies';
import React, { useEffect, useState } from 'react'
import React, { useContext, useEffect, useState } from 'react'
import BasicButton from '../../components/buttons/basicButton/BasicButton';
import { LineBarChart } from '../../components/graph/LineBarChart';
@ -17,7 +17,7 @@ import PageTitle from '../../components/pageTitle/PageTitle';
import { api } from '../../services/api';
import { EvolucaoPld } from '../../services/evolucaoPld';
import getAPIClient from '../../services/ssrApi';
import { GoBack, PldGraphView, PldTableView, TableHeader } from '../../styles/layouts/pld/PldView'
import { GoBack, PldGraphView, PldTableMinMaxView, PldTableView, TableHeader } from '../../styles/layouts/pld/PldView'
import RenderIf from '../../utils/renderIf'
import Tabs from '@mui/material/Tabs';
@ -29,6 +29,7 @@ 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';
interface pldInterface {
tableData: any,
@ -39,6 +40,8 @@ interface pldInterface {
}
export default function pld({tableData, userName, clientMonth}: pldInterface) {
const {pldMenu, setPldMenu} = useContext(MenuContext)
const dateFormated = new Date()
const year_Month = `0${dateFormated.getMonth()+1}/${dateFormated.getFullYear()}`
@ -47,9 +50,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
const [select, setSelect] = useState('SUDESTE');
// rendering page
const [page, setPage] = useState<number>(0)
const [month, setMonth] = useState<string>((dateFormated.getUTCMonth()+1).toString())
const [month, setMonth] = useState<any>(new Date().toLocaleDateString().slice(3, 10))
const [dataByDay, setDataByDay] = useState([])
@ -69,6 +70,8 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
};
const handleChangeDay = (event: SelectChangeEvent) => {
setMonth(event.target.value);
console.log(new Date().toLocaleDateString().slice(3, 10))
console.log('select', event.target.value)
};
const handleChangeDate = (newValue: Date | null) => {
@ -78,11 +81,12 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
};
function getDataByDay() {
console.log(month)
api.post('/pld/daily', {
"limit": 20,
"offset": 0,
"filters": [
{"type" : "=", "field" : "mes_ref", "value": `${month}/2022`, "row": true},
{"type" : "=", "field" : "mes_ref", "value": month, "row": true},
{"type" : "=", "field" : "pld.submercado", "value": select}
],
"order": [{ "field": "day_calc", "direction": "asc" }]
@ -98,7 +102,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
"limit": 20,
"offset": 0,
"filters": [
{"type" : "=", "field" : "dia_num", "value": date, "row": true},
{"type" : "=", "field" : "dia_num", "value": date.toLocaleDateString().split('/').reverse().join('-'), "row": true},
{"type" : "=", "field" : "submercado", "value": "SUL"}
],
"order": [{ "field": "hour", "direction": "asc" }]
@ -112,7 +116,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
"limit": 20,
"offset": 0,
"filters": [
{"type" : "=", "field" : "dia_num", "value": date, "row": true},
{"type" : "=", "field" : "dia_num", "value": date.toLocaleDateString().split('/').reverse().join('-'), "row": true},
{"type" : "=", "field" : "submercado", "value": "SUDESTE"}
],
"order": [{ "field": "hour", "direction": "asc" }]
@ -126,7 +130,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
"limit": 20,
"offset": 0,
"filters": [
{"type" : "=", "field" : "dia_num", "value": date, "row": true},
{"type" : "=", "field" : "dia_num", "value": date.toLocaleDateString().split('/').reverse().join('-'), "row": true},
{"type" : "=", "field" : "submercado", "value": "NORTE"}
],
"order": [{ "field": "hour", "direction": "asc" }]
@ -140,7 +144,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
"limit": 20,
"offset": 0,
"filters": [
{"type" : "=", "field" : "dia_num", "value": date, "row": true},
{"type" : "=", "field" : "dia_num", "value": date.toLocaleDateString().split('/').reverse().join('-'), "row": true},
{"type" : "=", "field" : "submercado", "value": "NORDESTE"}
],
"order": [{ "field": "hour", "direction": "asc" }]
@ -192,13 +196,9 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
data.push(row.join(";"));
}
downloadCSVFile(data.join("\n"), filename);
downloadCSVFile(data.join("\n").replace('(R$/MWh)', ''), filename);
}
// const handleTabChange = (event: React.SyntheticEvent, newValue: number) => {
// setPages(newValue);
// };
useEffect(() => {
getDataByHour()
getDataByDay()
@ -210,33 +210,36 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
}, [])
return (
<main style={{width: '100%',}}>
<main style={{width: '100%'}}>
<Head>
<title>Smart Energia - PLD</title>
</Head>
<div id='title'/>
<Header name={userName}>
<PageTitle title='PLD Histórico' subtitle='Tabela de consumo PLD'/>
<PageTitle title='PLD' subtitle='Evolução PLD - Valores em R$/MWh'/>
</Header>
<TableHeader>
<Tabs value={page} onChange={(e, nv) => setPage(nv)} aria-label="">
<Tabs value={pldMenu} onChange={(e, nv) => setPldMenu(nv)} aria-label="">
<Tab label="Pld Histórico"/>
<Tab label="Valores Diários"/>
<Tab label="Valores Horários"/>
</Tabs>
<div className='btnDownload'>
<RenderIf isTrue={pldMenu === 0}>
<BasicButton onClick={() => {
const html = document.querySelector("table").outerHTML;
htmlToCSV(html, "tabela_PLD.csv");
}} title='Download'/>
</RenderIf>
</div>
</TableHeader>
<RenderIf isTrue={page===0}>
<RenderIf isTrue={pldMenu===0}>
<PldTableView>
<table className="tg">
<thead>
<tr>
<th className='tg-8oo6'>Mês<p>(R$/MWh)</p></th>
<th className='tg-8oo6'>Mês</th>
<th className='tg-8oo6'>Nordeste<p>(R$/MWh)</p></th>
<th className='tg-8oo6'>Norte<p>(R$/MWh)</p></th>
<th className='tg-8oo6'>Sudeste<p>(R$/MWh)</p></th>
@ -249,59 +252,17 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
return <>
<tr className={data.year_month_formatted==year_Month? 'actual' : ''}>
<td className='tg-gceh'>{data.year_month_formatted}</td>
<td className={`tg-uulg`}>{parseFloat(data.nordeste).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className={`tg-gceh`}>{parseFloat(data.norte).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className={`tg-gceh`}>{parseFloat(data.sudeste).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className={`tg-uulg`}>{parseFloat(data.sul).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className={`tg-uulg`}>{parseFloat(data.nordeste).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className={`tg-gceh`}>{parseFloat(data.norte).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className={`tg-gceh`}>{parseFloat(data.sudeste).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className={`tg-uulg`}>{parseFloat(data.sul).toLocaleString('pt-br',{currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
</tr>
</>
})
}
<tr>
<td style={{borderColor: 'transparent'}}></td>
<td style={{borderColor: 'transparent'}}></td>
<td style={{borderColor: 'transparent'}}></td>
<td style={{borderColor: 'transparent'}}></td>
<td style={{borderColor: 'transparent'}}></td>
</tr>
{
tableData.result.map((data, index) => {
if (index === 0) {
return <>
<tr>
<td className='tg-gceh'>Máximo</td>
<td className='tg-uulg'>{parseFloat(data.nordeste_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.norte_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.sudeste_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-uulg'>{parseFloat(data.sul_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
</tr>
</>
} else if (index===1) {
return <>
<tr>
<td className='tg-gceh'>Mínimo</td>
<td className='tg-uulg'>{parseFloat(data.nordeste_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.norte_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.sudeste_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-uulg'>{parseFloat(data.sul_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
</tr>
</>
} else if (index===2) {
return <>
<tr>
<td className='tg-gceh'>Desv. Padrão</td>
<td className='tg-uulg'>{parseFloat(data.nordeste_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.norte_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.sudeste_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-uulg'>{parseFloat(data.sul_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
</tr>
</>
}
})
}
</tbody>
</table>
<section>
{/* <section>
<article onClick={() => setPage(1)} className="btn btn-1">
<svg height='100px'>
<rect x="0" y="0" fill="none" width="100%" height="100%"/>
@ -314,12 +275,53 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
</svg>
<p>Valores Horários</p>
</article>
</section>
</section> */}
</PldTableView>
<PldTableMinMaxView>
<table className='tg'>
<tbody>
{
tableData.result.map((data, index) => {
if (index === 0) {
return <>
<tr>
<td style={{borderTopLeftRadius: 8}} className='tg-gceh'>Máximo</td>
<td className='tg-uulg'>{parseFloat(data.nordeste_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.norte_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.sudeste_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className='tg-uulg'>{parseFloat(data.sul_max).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
</tr>
</>
} else if (index===1) {
return <>
<tr>
<td className='tg-gceh'>Mínimo</td>
<td className='tg-uulg'>{parseFloat(data.nordeste_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.norte_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className='tg-gceh'>{parseFloat(data.sudeste_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
<td className='tg-uulg'>{parseFloat(data.sul_min).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2})}</td>
</tr>
</>
} else if (index===2) {
return <>
<tr>
<td className='tg-gceh' style={{borderBottomColor: 'transparent'}}>Desv. Padrão</td>
<td className='tg-uulg' style={{borderBottomColor: 'transparent'}}>{parseFloat(data.nordeste_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh' style={{borderBottomColor: 'transparent'}}>{parseFloat(data.norte_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-gceh' style={{borderBottomColor: 'transparent'}}>{parseFloat(data.sudeste_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td className='tg-uulg' style={{borderBottomColor: 'transparent'}}>{parseFloat(data.sul_desv_pad).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
</tr>
</>
}
})
}
</tbody>
</table>
</PldTableMinMaxView>
</RenderIf>
{/* grafico de grafico por seleção de data (mês)*/}
<RenderIf isTrue={page===1}>
<RenderIf isTrue={pldMenu===1}>
<PldGraphView>
<section className='toolsbar'>
<div className='select'>
@ -358,12 +360,16 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
<MenuItem value={'0'}>Nenhum</MenuItem>
{
clientMonth.sort((a, b) => {
if (parseFloat(a.mes_ref.slice(3,4)) > parseFloat(b.mes_ref.slice(3,4))) return 1
if (parseFloat(a.mes_ref.slice(3,4)) < parseFloat(b.mes_ref.slice(3,4))) return -1
if (parseFloat(a.mes_ref.slice(0, 2)) < parseFloat(b.mes_ref.slice(0, 2)))
if (parseFloat(a.mes_ref.slice(3, 7)) > parseFloat(b.mes_ref.slice(3, 7))) return -1
else return 1
if (parseFloat(a.mes_ref.slice(0, 2)) > parseFloat(b.mes_ref.slice(0, 2)))
if (parseFloat(a.mes_ref.slice(3, 7)) < parseFloat(b.mes_ref.slice(3, 7))) return 1
else return -1
return 0
}).map((data, index) => {
return <MenuItem key={index} value={data.mes_ref.slice(2, 4)}>{data.mes_ref}</MenuItem>
return <MenuItem key={index} value={data.mes_ref}>{data.mes_ref}</MenuItem>
})
}
</Select>
@ -372,17 +378,18 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
<LineBarChart
data1={dataByDay} data3={dataByDay}
dataset1={'Média'} dataset2={'barra1'} dataset3={'Diario'}
label={EvolucaoPld.label}
label={dataByDay.map((value, index) => {
return value.day_formatted
})}
title='' subtitle='' />
</PldGraphView>
</RenderIf>
{/* grafico de grafico por seleção de data INTEIRA*/}
<RenderIf isTrue={page===2}>
<RenderIf isTrue={pldMenu===2}>
<PldGraphView>
<section className='toolsbar2'>
<p>Selecione a data: </p>
{/* <input type="date" data-date={date} data-date-format="DD MMMM YYYY" value={date} onChange={(value) => setDate(value.target.value)}/> */}
{/* <p>Selecione a data: </p> */}
<LocalizationProvider dateAdapter={AdapterDateFns} localeText={'pt-BR'} adapterLocale='pt-BR'>
<div className='select datePicker'>
<DesktopDatePicker
@ -397,13 +404,13 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
</section>
<LineChart data1={nordeste} data2={norte} data3={sudeste} data4={sul}
dataset1='NORDESTE' dataset2='NORTE' dataset3='SUDESTE' dataset4='SUL'
title={date? `Período - ${date.toLocaleDateString()}` : null}
title={''}
subtitle='' label={['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24']}
/>
</PldGraphView>
</RenderIf>
{pageYPosition > 300 && <a href="#title" style={{position: 'fixed', right: '50px', bottom: '100px'}}>
<Fab sx={{backgroundColor: "#254F7F"}} aria-label="add">
<Fab aria-label="add">
<NavigationIcon />
</Fab>
</a>}

View File

@ -18,9 +18,13 @@ import { api } from '../../services/api';
// import { dados } from '../services/DadosTabelaResumoOperacao';
import data from '../../services/dados.json'
import getAPIClient from '../../services/ssrApi';
import { Pagination, TableHeader, TableView } from '../../styles/layouts/ResumoOperacao/ResumoOperacaoView';
import { Pagination, TableBodyView, TableHeader, TableView } from '../../styles/layouts/ResumoOperacao/ResumoOperacaoView';
export default function ResumoOperacao({tableData, clientsData, userName, clientMonth}: any) {
import Fab from '@mui/material/Fab';
import NavigationIcon from '@mui/icons-material/Navigation';
export default function ResumoOperacao({tableData, clients, userName, clientMonth}: any) {
const csvData = tableData;
const [month, setMonth] = useState('');
@ -29,6 +33,8 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
const monthLabels = ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez']
const { ['user-id']: id } = parseCookies()
const handleChangeMonth = (event: SelectChangeEvent) => {
setMonth(event.target.value);
};
@ -36,6 +42,13 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
setUnidade(event.target.value);
};
const [ pageYPosition, setPageYPosition ] = useState(0);
function getPageYAfterScroll(){
setPageYPosition(window.scrollY);
console.log(window.scrollY)
}
function downloadCSVFile(csv, filename) {
const csv_file = new Blob(["\ufeff",csv], {type: "text/csv"});
const download_link = document.createElement("a");
@ -60,7 +73,7 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
}
useEffect(() => {
console.log(month)
console.log(unidade)
if (unidade!=='' || month!==''){
api.post('/operation/summary', month && !unidade? {
"filters": [
@ -80,14 +93,16 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
} : {}
).then(res => {
setTableDataState(res.data.data)
}).catch(res => {
// console.log(res)
})
}).catch(res => console.log(res))
} else {
setTableDataState(tableData)
}
}, [month, unidade])
useEffect(() => {
window?.addEventListener('scroll', getPageYAfterScroll);
}, [])
return (
<TableView>
<Head>
@ -97,25 +112,23 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
<PageTitle title='Resumo de Operações' subtitle='Operações de compra e venda - Mensal' />
</Header>
<TableHeader>
<article>
<h3>Filtrar por Unidade e/ou Mês</h3>
<article id='select'>
<div className='select'>
<div>
<p>Selecionar unidade:</p>
<FormControl fullWidth>
<InputLabel id="demo-simple-select-labels">Unidades</InputLabel>
<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={unidade}
value={clients.length > 1? unidade : clients[0]}
label="Unidade"
onChange={handleChangeUnidade}
fullWidth
>
<MenuItem key={1} value={''}>Todas</MenuItem>
{
clientsData.map((value) => {
return <MenuItem key={1} value={value.cod_smart_unidade}>{value.cod_smart_unidade}</MenuItem>
clients.map((value) => {
return <MenuItem key={value.cod_smart_unidade} value={value.cod_smart_unidade}>{value.unidade}</MenuItem>
})
}
</Select>
@ -123,7 +136,6 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
</div>
<div>
<p>Selecionar mês:</p>
<FormControl fullWidth>
<InputLabel id="demo-simple-select-label">Mês</InputLabel>
<Select
@ -136,8 +148,17 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
>
<MenuItem value={''}>Todos</MenuItem>
{
clientMonth.map((value) => {
return <MenuItem key={1} value={value.mes}>{value.mes}</MenuItem>
clientMonth.sort((a, b) => {
if (parseFloat(a.mes.slice(0, 2)) < parseFloat(b.mes.slice(0, 2)))
if (parseFloat(a.mes.slice(3, 7)) > parseFloat(b.mes.slice(3, 7))) return -1
else return 1
if (parseFloat(a.mes.slice(0, 2)) > parseFloat(b.mes.slice(0, 2)))
if (parseFloat(a.mes.slice(3, 7)) < parseFloat(b.mes.slice(3, 7))) return 1
else return -1
return 0
}).map((value) => {
return <MenuItem key={value.mes} value={value.mes}>{value.mes}</MenuItem>
})
}
</Select>
@ -152,38 +173,42 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
}}/>
</article>
</TableHeader>
<TableBodyView>
<table className="tg">
<thead>
<tr>
<th className='tg-8oo6'>Mês </th>
<th className='tg-8oo6'>Unidade </th>
<th className='tg-8oo6'>Operação</th>
<th className='tg-8oo6'>Montante (MWh)</th>
<th className='tg-8oo6'>Contraparte</th>
<th className='tg-8oo6'>Montante (MWh)</th>
<th className='tg-8oo6'>Preço(R$/MWh)</th>
<th className='tg-8oo6'>ValorNF/Crédito(R$)</th>
</tr>
</thead>
<tbody>
{
tableDataState.map((value, index) => {
tableDataState?.map((value, index) => {
if (value.mes.slice(4,7) != '2020')
return <tr>
<td key={index} className='tg-gceh'>{value.mes}</td>
<td key={index} className='tg-gceh'>{value.cod_smart_unidade}</td>
<td key={index} className='tg-gceh'>{value.operacao}</td>
<td key={index} className='tg-gceh'>{parseFloat(value.montante_nf).toLocaleString('pt-br')}</td>
<td key={index} className='tg-gceh'>{value.contraparte}</td>
<td key={index} className='tg-gceh'>{parseFloat(value.preco_nf).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td key={index} className='tg-gceh'>{parseFloat(value.nf_c_icms).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td key={value.mes} className='tg-gceh'>{value.mes}</td>
<td key={value.cod_smart_unidade} className='tg-gceh'>{value.cod_smart_unidade}</td>
<td key={value.operacao} className='tg-gceh'>{value.operacao}</td>
<td key={value.contraparte} className='tg-gceh'>{value.contraparte}</td>
<td key={value.montante_nf} className='tg-gceh'>{parseFloat(value.montante_nf).toLocaleString('pt-br')}</td>
<td key={value.preco_nf} className='tg-gceh'>{parseFloat(value.preco_nf).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
<td key={value.nf_c_icms} className='tg-gceh'>{parseFloat(value.nf_c_icms).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}</td>
</tr>
})
}
</tbody>
</table>
<div className='btn'>
</div>
</TableBodyView>
{pageYPosition > 300 && <a href="#select" style={{position: 'fixed', right: '50px', bottom: '100px'}}>
<Fab aria-label="add">
<NavigationIcon />
</Fab>
</a>}
</TableView>
)
}
@ -191,34 +216,19 @@ export default function ResumoOperacao({tableData, clientsData, userName, client
export const getServerSideProps: GetServerSideProps = async (ctx) => {
const apiClient = getAPIClient(ctx)
const { ['@smartAuth-token']: token } = parseCookies(ctx)
const { ['user-id']: id } = parseCookies(ctx)
const { ['user-client_id']: client_id } = parseCookies(ctx)
const { ['user-name']: userName } = parseCookies(ctx)
let tableData = [];
let clientsData = [];
let clientMonth = [];
await apiClient.post('/operation/summary', {
"filters": []
}).then(res => {
tableData = res.data.data
}).catch(res => {
// console.log(res)
})
await apiClient.post('/units', {
"filters": [
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]},
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": id}
],
"fields": ["cod_smart_unidade", "codigo_scde"],
"distinct": true
}).then(res => {
console.log(res.data.data)
clientsData = res.data.data
}).catch(res => {
console.log(res)
})
let clients = [];
await apiClient.post('/operation', {
"filters": [
@ -228,6 +238,21 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
"distinct": true
}).then(res => {
clientMonth = res.data.data
})
await apiClient.post('/units', {
"filters": [
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id},
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]}
],
"fields": [
"unidade",
"cod_smart_unidade",
"codigo_scde"],
"distinct": true
}).then(res => {
console.log(res.data)
clients = res.data.data
}).catch(res => {
// console.log(res)
})
@ -244,7 +269,7 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
return {
props: {
tableData,
clientsData,
clients,
clientMonth,
userName
}

View File

@ -122,9 +122,11 @@ export default function Telemetria({userName, clients}: any) {
);
const handleChangeStartDate = (newValue: Date | null) => {
console.log(newValue)
setStartDate(newValue)
};
const handleChangeEndDate = (newValue: Date | null) => {
console.log(newValue)
setEndDate(newValue)
};
@ -251,7 +253,7 @@ export default function Telemetria({userName, clients}: any) {
<section>
<div className='select'>
<p className='title' >Unidade</p>
<FormControl sx={{ m: 1, minWidth: 120, width: 200 }} size="small">
<FormControl sx={{ minWidth: 120, width: 200 }} size="small">
<InputLabel id="demo-select-small">Unidade</InputLabel>
<Select
labelId="demo-select-small"
@ -259,6 +261,7 @@ export default function Telemetria({userName, clients}: any) {
value={unity}
label="Unidade"
onChange={value => setUnity(value.target.value)}
sx={{height: 63, mb: 0.5}}
fullWidth
>
<MenuItem value="">
@ -267,48 +270,13 @@ export default function Telemetria({userName, clients}: any) {
{/* <MenuItem value="RSZFNAENTR101P">RSZFNAENTR101P</MenuItem> COMENTARIO DE OPÇAO COM DADOS TESTES */}
{
clients.map((value) => {
return <MenuItem key={1} value={value.codigo_scde}>{value.cod_smart_unidade}</MenuItem>
return <MenuItem key={1} value={value.codigo_scde}>{value.unidade}</MenuItem>
})
}
</Select>
</FormControl>
</div>
{/* <div className='select'>
<p className='title' >Data inicial</p>
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value={startDate}
onChange={(value) => setStartDate(value.target.value)} min="2021-01-01"/>
</div> */}
<LocalizationProvider dateAdapter={AdapterDateFns}>
<div className='select datePicker'>
<p className='title' >Data inicial</p>
<DesktopDatePicker
label="Date desktop"
inputFormat="dd/MM/yyyy"
value={startDate}
onChange={handleChangeStartDate}
renderInput={(params) => <TextField {...params}/>}
/>
</div>
<div className='select datePicker'>
<p className='title' >Data final</p>
<DesktopDatePicker
label="Date desktop"
inputFormat="dd/MM/yyyy"
value={endDate}
onChange={handleChangeEndDate}
renderInput={(params) => <TextField {...params} sx={{ml: 1}}/>}
/>
</div>
</LocalizationProvider>
{/* <div className='select'>
<p className='title' >Data final</p>
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value={endDate}
onChange={(value) => setEndDate(value.target.value)} min="2021-01-01"/>
</div> */}
<div className='select'>
<p className='title' >Discretização</p>
<FormControl sx={{ m: 1, minWidth: 120, width: 200 }} size="small">
@ -319,6 +287,7 @@ export default function Telemetria({userName, clients}: any) {
value={discretization}
label="Unidade"
onChange={value => setDiscretization(value.target.value)}
sx={{height: 63, mb: 0.5}}
fullWidth
>
<MenuItem value="">
@ -332,6 +301,40 @@ export default function Telemetria({userName, clients}: any) {
</Select>
</FormControl>
</div>
<LocalizationProvider dateAdapter={AdapterDateFns}>
<div className='select datePicker'>
<p className='title' >Data inicial</p>
<DesktopDatePicker
label="Date desktop"
inputFormat="dd/MM/yyyy"
value={startDate}
onChange={handleChangeStartDate}
renderInput={(params) => <TextField {...params}/>}
/>
</div>
<div className='select datePicker' style={{marginRight: 10}}>
<p className='title' >Data final</p>
<DesktopDatePicker
label="Date desktop"
inputFormat="dd/MM/yyyy"
value={endDate}
maxDate={discretization === '1_mes'? new Date(startDate).setUTCFullYear(startDate.getUTCFullYear()+2)
:
discretization === '1_dia'?new Date(startDate).setUTCFullYear(startDate.getUTCFullYear()+2)
:
discretization === '1_hora'?new Date(startDate).setUTCMonth(startDate.getUTCMonth()+1)
:
discretization === '15_min'?new Date(startDate).setUTCDate(startDate.getUTCDate()+7)
:
new Date(startDate).setUTCDate(startDate.getUTCDate()+1)
}
onChange={(newValue: any) => handleChangeEndDate(newValue)}
renderInput={(params) => <TextField {...params} sx={{ml: 1}}/>}
/>
</div>
</LocalizationProvider>
<BasicButton title='Selecionar!' onClick={() => {
setSend(true)
getTableData()
@ -413,19 +416,24 @@ export default function Telemetria({userName, clients}: any) {
export const getServerSideProps: GetServerSideProps = async (ctx) => {
const { ['@smartAuth-token']: token } = parseCookies(ctx)
const { ['user-name']: userName } = parseCookies(ctx)
const { ['user-client_id']: id } = parseCookies(ctx)
const { ['user-client_id']: client_id } = parseCookies(ctx)
const apiClient = getAPIClient(ctx)
let clients = []
await apiClient.post('/units', {
"filters": [
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]},
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": id}
{"type" : "=", "field": "dados_cadastrais.cod_smart_cliente", "value": client_id},
{"type" : "not_in", "field": "dados_cadastrais.codigo_scde", "value":["0P"]}
],
"fields": ["cod_smart_unidade", "codigo_scde"],
"fields": [
"unidade",
"cod_smart_unidade",
"codigo_scde"],
"distinct": true
}).then(res => {
console.log(res.data)
clients = res.data.data
}).catch(res => {
// console.log(res)

View File

@ -8,14 +8,14 @@ export async function getDemand(
discretization: string
) {
const { '@smartAuth-token': token } = parseCookies()
const { data } = await axios.post('https://smart-energia-api.herokuapp.com/api/telemetry/powerFactor', {
const { data } = await axios.post('https://smart-energia-api.herokuapp.com/api/telemetry/demand', {
"filters": [
{"type" : "=", "field": `${discretization}.ponto`, "value": unity},
{"type" : "between", "field": ["dia_num"], "value": [startDate, endDate]}
]
}, {
headers: {
'Authorization': `Bearer ${token}`
'Authorization': `Bearer 1260|RHfh3uMsEfHwCTqxKOhy1CEIr34UIln9OFdf5Fc8`
}
})

View File

@ -8,14 +8,14 @@ export async function getDiscretization(
discretization: string
) {
const { '@smartAuth-token': token } = parseCookies()
const { data } = await axios.post('https://smart-energia-api.herokuapp.com/api/telemetry/powerFactor', {
const { data } = await axios.post('https://smart-energia-api.herokuapp.com/api/telemetry/discretization', {
"type": discretization,
"filters": [
{"type" : "=", "field": "med_5min.ponto", "value": unity}
]
}, {
headers: {
'Authorization': `Bearer ${token}`
'Authorization': `Bearer 1260|RHfh3uMsEfHwCTqxKOhy1CEIr34UIln9OFdf5Fc8`
}
}
)

View File

@ -9,14 +9,14 @@ export async function getPowerFactorData(
) {
const { '@smartAuth-token': token } = parseCookies()
console.log(token.replace(/"/g, ''))
const { data } = await axios.post('https://smart-energia-api.herokuapp.com/api/telemetry/powerFactor', {
const { data } = await axios.post('http://smart-energia-api.herokuapp.com/api/telemetry/powerFactor', {
"filters": [
{"type" : "=", "field": "med_5min.ponto", "value": "PRAXCUENTR101P"},
{"type" : "between", "field": "dia_num", "value": ["2022-01-01", "2022-01-31"]}
]
}, {
}, {
headers: {
'Authorization': `Bearer ${token}`
'Authorization': `Bearer 1292|E4jbc5ZWmgCCBMOVn4PvPx56MUbf4nUg5MNgxjmP`
}
})
return data.data

View File

@ -52,16 +52,15 @@ export const GlobalStyle = createGlobalStyle`
.MuiInputBase-input,
.MuiInputBase-inputAdornedEnd,
.css-nxo287-MuiInputBase-input-MuiOutlinedInput-input{
/* background-color: red!important; */
/* border: none!important;
outline: 0 */
height: 45px;
/* background-color: red; */
/* position: relative; */
height:68px;
}
.MuiFormControl-root,
.MuiTextField-root,
.css-1u3bzj6-MuiFormControl-root-MuiTextField-root {
margin-top: 8px;
/* margin-top: 8px; */
}
.MuiOutlinedInput-input,
@ -84,10 +83,37 @@ export const GlobalStyle = createGlobalStyle`
.MuiIconButton-edgeEnd,
.MuiIconButton-sizeMedium,
.css-1yq5fb3-MuiButtonBase-root-MuiIconButton-root {
margin-bottom: 5px;
width: 30px;
height: 30px;
}
}
.MuiInputLabel-root
.MuiInputLabel-formControl, .MuiInputLabel-animated,
.MuiInputLabel-shrink,
.MuiInputLabel-outlined,
.MuiFormLabel-root,
.MuiFormLabel-colorPrimary,
.MuiFormLabel-filled,
.css-1sumxir-MuiFormLabel-root-MuiInputLabel-root {
color: rgba(0, 0, 0, 0.6);
font-family: "Roboto","Helvetica","Arial",sans-serif;
font-weight: 400;
font-size: 1rem;
line-height: 1.4375em;
letter-spacing: 0.00938em;
padding: 0;
position: relative;
display: block;
transform-origin: top left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: calc(133% - 24px);
position: absolute;
left: 0;
user-select: none;
z-index: 1;
pointer-events: auto;
}
`;

View File

@ -60,45 +60,14 @@ export const TableView = styled.div`
background-color: #254F7F;
}
.tg .tg-uulg{
background-color:#efefef;
color:#abafb3;
font-size:14px;
text-align:center;
vertical-align:top
}
.tg .tg-gceh{
background-color:#efefef;
background-color: transparent;
color:#6a707e;
font-size:14px;
text-align:center;
vertical-align:top;
}
.tg .tg-0tzy{
color:#abafb3;
font-size:14px;
text-align:center;
vertical-align:top
}
.tg .tg-hq65{color:#6a707e;
font-size:14px;
text-align:center;
vertical-align:top
}
.tg .tg-baqh{
text-align:center;
vertical-align:top
}
.tg .tg-0lax{
text-align:left;
vertical-align:top
}
.tg .tg-womg{
background-color:#dddfe1;
text-align:center;
vertical-align:top
}
h3{
font-weight: 600;
@ -112,18 +81,25 @@ export const TableView = styled.div`
width: 10rem;
}
table, th:last-child{
table, th {
vertical-align: middle;
}
table, th:last-child {
border: transparent;
border-top-right-radius: 20px;
border-top-right-radius: 8px;
}
table, th:first-child {
border: transparent;
border-top-left-radius: 20px;
border-top-left-radius: 8px;
}
.radius {
background-color: red!important;
table, td {
border: transparent;
border-top-left-radius: 8px;
text-overflow: ellipsis;
}
`;
@ -191,3 +167,35 @@ export const NewTableLine = styled.section`
margin: 0 0 10px 0;
}
`
export const TableBodyView = styled.section`
border-radius: 8px;
background-color: #EFEFEF;
width: 100%;
border: rgb(221,223,225);
border-style:solid;
border-width: 1px;
tr {
:last-child {
/* background-color: red; */
border-bottom-color: transparent;
td {
:first-child {
border-left-color: transparent;
border-bottom-color: transparent;
/* background-color: red; */
}
:last-child {
border-right-color: transparent;
border-bottom-color: transparent;
}
}
}
}
`

View File

@ -171,9 +171,6 @@ export const TelemetriaView = styled.main`
input {
width: 15rem;
height: 2.5rem;
padding: 14px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-weight: 400;
@ -219,6 +216,18 @@ export const TelemetriaView = styled.main`
justify-content: center;
flex-direction: column;
height: 10em;
:nth-child(1) {
label {
margin-top: 10px;
}
}
:nth-child(2) {
label {
margin-top: 10px;
}
}
}
}
`;

View File

@ -10,8 +10,5 @@ export const AccumulatedSavingsView = styled.main`
display: flex;
justify-content: center;
align-items: center;
canvas {
}
}
`

View File

@ -6,16 +6,6 @@ export const GrossSavingsView = styled.main`
width: 100%;
span {
color: #969BA0;
font-family: 'Poppins';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 24px;
}
section {
display: flex;
justify-content: center;

View File

@ -1,23 +1,26 @@
import styled from "styled-components"
export const PldTableView = styled.main`
export const PldTableMinMaxView = styled.div`
width: 100%;
border-radius: 8px!important;
border-color:#DDDFE1;
border-style:solid;
border-width: 1px;
background-color: #EFEFEF;
margin-top: 15px;
table {
p {
font-size: 12px;
}
thead {
border-radius: 8px!important;
}
}
.actual {
font-weight: bold!important;
background-color: red!important;
}
.tg{
@ -25,7 +28,6 @@ export const PldTableView = styled.main`
border-spacing:0;
font-family:Poppins;
width: 100%;
}
.tg td{
@ -39,6 +41,7 @@ export const PldTableView = styled.main`
word-break:normal;
}
.tg th{
border-color:#DDDFE1;
border-style:solid;
@ -53,7 +56,7 @@ export const PldTableView = styled.main`
.tg .tg-8oo6{
font-size:20px;
text-align:center;
vertical-align:top;
vertical-align:center;
padding: 10px 18px;
text-align: center;
@ -62,70 +65,35 @@ export const PldTableView = styled.main`
background-color: #254F7F;
}
.tg .tg-uulg{
background-color:#efefef;
font-size:14px;
text-align:center;
vertical-align:top
vertical-align:top;
:first-child {
background-color: red;
}
:last-child {
border-right-color: transparent;
}
}
.tg .tg-gceh{
background-color:#efefef;
font-size:14px;
text-align:center;
vertical-align:top
vertical-align:top;
:first-child {
border-left-color: transparent;
}
.tg .tg-0tzy{
font-size:14px;
text-align:center;
vertical-align:top
}
.tg .tg-hq65{
font-size:14px;
text-align:center;
vertical-align:top
}
.tg .tg-baqh{
text-align:center;
vertical-align:top
}
.tg .tg-0lax{
text-align:left;
vertical-align:top
}
.tg .tg-womg{
background-color:#dddfe1;
text-align:center;
vertical-align:top
}
.green {
background-color: #0F9D58!important;
color: black!important;
}
.dullGreen {
background-color: #AED094!important;
color: black!important;
}
.red {
background-color: #DB4437!important;
color: black!important;
}
.dullRed {
background-color: #FFAA95!important;
color: black!important;
}
table, th:last-child{
border: transparent;
border-top-right-radius: 20px;
border-top-right-radius: 8px;
}
table, th:first-child {
border: transparent;
border-top-left-radius: 20px;
border-top-left-radius: 8px;
}
h3{
@ -227,6 +195,226 @@ export const PldTableView = styled.main`
transform: translateY(-6px);
}
}
.space {
background-color: #F7F7F7;
border-color: transparent;
border-bottom-color: #DDDFE1;
height: 15px!important;
padding: 0!important;
}
`
export const PldTableView = styled.div`
width: 100%;
border-radius: 8px!important;
border-color:#DDDFE1;
border-style:solid;
border-width: 1px;
background-color: #EFEFEF;
margin-top: 38px;
table {
p {
font-size: 12px;
}
}
.actual {
font-weight: bold!important;
}
.tg{
border-collapse:collapse;
border-spacing:0;
font-family:Poppins;
width: 100%;
}
.tg td{
border-color:#DDDFE1;
border-style:solid;
border-width:1px;
font-family:Poppins;
font-size: 10px;
overflow:hidden;
padding:17px 30px;
word-break:normal;
}
.tg th{
border-color:#DDDFE1;
border-style:solid;
border-width:1px;
font-family:Poppins;
font-size:10px;
font-weight:500;
overflow:hidden;
padding:10px 5px;
word-break:normal;
}
.tg .tg-8oo6{
font-size:20px;
text-align:center;
vertical-align:center;
padding: 10px 18px;
text-align: center;
color: white;
background-color: #254F7F;
}
.tg .tg-uulg{
font-size:14px;
text-align:center;
vertical-align:top;
:first-child {
background-color: red;
}
:last-child {
border-right-color: transparent;
}
}
.tg .tg-gceh{
font-size:14px;
text-align:center;
vertical-align:top;
:first-child {
border-left-color: transparent;
}
}
table, th:last-child{
border: transparent;
border-top-right-radius: 8px;
}
table, th:first-child {
border: transparent;
border-top-left-radius: 8px;
}
h3{
font-weight: 600;
font-size: 22px;
line-height: 54px;
color: #254F7F;
}
.images {
display: flex;
justify-content: space-around;
align-items: center;
margin: 40px;
}
section {
display: flex;
justify-content: center;
align-items: center;
article {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 40%;
height: 8rem;
margin: 40px;
background: #255488;
color: white;
border-radius: 8px;
box-shadow: 0 0 11px rgba(0, 0, 0, 0.2) ;
-webkit-box-shadow: 0 0 11px rgba(0, 0, 0, 0.2) ;
-moz-box-shadow: 0 0 11px rgba(0, 0, 0, 0.2) ;
cursor: pointer;
background: darken($red, 1.5%);
background: linear-gradient(200.69deg, #254f7f 9%, #3183e0 98%), #FFFFFF;
:hover {
transition: all 0.2s linear;
transform: scale(1.1);
}
svg {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
rect {
fill: none;
stroke: #fff;
stroke-width: 2;
stroke-dasharray: 422, 0;
transition: all 0.35s linear;
}
}
.btn-1:hover {
background: rgba($red, 0);
letter-spacing: 1px;
rect {
stroke-width: 5;
stroke-dasharray: 15, 310;
stroke-dashoffset: 48;
transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
}
}
}
footer {
label {
cursor: pointer;
margin: 20px;
}
}
.btnDownload{
width: fit-content;
margin-bottom: 15px;
:hover {
position: relative;
transition: all 0.2s linear;
transform: translateY(-6px);
}
}
.space {
background-color: #F7F7F7;
border-color: transparent;
border-bottom-color: #DDDFE1;
height: 15px!important;
padding: 0!important;
}
`
export const PldGraphView = styled.main`
@ -257,27 +445,33 @@ export const PldGraphView = styled.main`
flex-direction: row;
padding-bottom: 13px;
p {
margin: 0;
}
}
.toolsbar2 {
display: flex;
justify-content: center;
justify-content: flex-start;
align-items: flex-start!important;
flex-direction: column;
margin-bottom: 9px;
/* transform: translateY(-8px); */
p {
margin: 0;
}
}
input {
width: 20rem;
width: 16.6rem;
height: 3.5rem;
padding: 14px;
/* padding: 14px; */
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-weight: 400;
@ -307,6 +501,8 @@ export const PldGraphView = styled.main`
width: 100%;
}
footer {
label {
cursor: pointer;

View File

@ -19,7 +19,7 @@
"isolatedModules": true,
"jsx": "preserve"
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "additional.d.ts"],
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "additional.d.ts", "src/contexts/economy/EconomyContext.tss"],
"exclude": [
"node_modules"
]

283
yarn.lock
View File

@ -1880,6 +1880,11 @@ balanced-match@^1.0.0:
version "1.0.2"
resolved "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz"
base64-js@^1.3.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
bin-links@^3.0.0:
version "3.0.1"
resolved "https://registry.yarnpkg.com/bin-links/-/bin-links-3.0.1.tgz#cc70ffb481988b22c527d3e6e454787876987a49"
@ -1895,6 +1900,15 @@ binary-extensions@^2.2.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
bl@^4.0.3:
version "4.1.0"
resolved "https://registry.yarnpkg.com/bl/-/bl-4.1.0.tgz#451535264182bec2fbbc83a62ab98cf11d9f7b3a"
integrity sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==
dependencies:
buffer "^5.5.0"
inherits "^2.0.4"
readable-stream "^3.4.0"
brace-expansion@^1.1.7:
version "1.1.11"
resolved "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz"
@ -1924,6 +1938,14 @@ browserslist@^4.20.2, browserslist@^4.20.3:
node-releases "^2.0.3"
picocolors "^1.0.0"
buffer@^5.5.0:
version "5.7.1"
resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.7.1.tgz#ba62e7c13133053582197160851a8f648e99eed0"
integrity sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==
dependencies:
base64-js "^1.3.1"
ieee754 "^1.1.13"
builtins@^5.0.0:
version "5.0.1"
resolved "https://registry.yarnpkg.com/builtins/-/builtins-5.0.1.tgz#87f6db9ab0458be728564fa81d876d8d74552fa9"
@ -1987,15 +2009,50 @@ chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.2:
ansi-styles "^4.1.0"
supports-color "^7.1.0"
"chart.js@>= 2.6.0 < 3":
version "2.9.4"
resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.4.tgz#0827f9563faffb2dc5c06562f8eb10337d5b9684"
integrity sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==
dependencies:
chartjs-color "^2.1.0"
moment "^2.10.2"
chart.js@^3.7.1:
version "3.7.1"
resolved "https://registry.npmjs.org/chart.js/-/chart.js-3.7.1.tgz"
chartjs-color-string@^0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
dependencies:
color-name "^1.0.0"
chartjs-color@^2.1.0:
version "2.4.1"
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
dependencies:
chartjs-color-string "^0.6.0"
color-convert "^1.9.3"
chartjs-plugin-datalabels@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/chartjs-plugin-datalabels/-/chartjs-plugin-datalabels-2.0.0.tgz#caacefb26803d968785071eab012dde8746c5939"
integrity sha512-WBsWihphzM0Y8fmQVm89+iy99mmgejmj5/jcsYqwxSioLRL/zqJ4Scv/eXq5ZqvG3TpojlGzZLeaOaSvDm7fwA==
chartjs-plugin-style@^0.5.0:
version "0.5.0"
resolved "https://registry.yarnpkg.com/chartjs-plugin-style/-/chartjs-plugin-style-0.5.0.tgz#ba31deb016cf0d29c73e420bb40778f89cdfabd4"
integrity sha512-QWMWRGpkexgMTHZg2l1OVtnSkElGNAM0MchozG/ucU6NW0xXINS/YsIE2tl7nG1nwZA2FH/myVbI4uMguIAXPA==
dependencies:
chart.js ">= 2.6.0 < 3"
chownr@^1.1.1:
version "1.1.4"
resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.4.tgz#6fc9d7b42d32a583596337666e7d08084da2cc6b"
integrity sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==
chownr@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/chownr/-/chownr-2.0.0.tgz#15bfbe53d2eab4cf70f18a8cd68ebe5b3cb1dece"
@ -2064,7 +2121,7 @@ cmd-shim@^5.0.0:
dependencies:
mkdirp-infer-owner "^2.0.0"
color-convert@^1.9.0:
color-convert@^1.9.0, color-convert@^1.9.3:
version "1.9.3"
resolved "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz"
dependencies:
@ -2080,14 +2137,30 @@ color-name@1.1.3:
version "1.1.3"
resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz"
color-name@~1.1.4:
color-name@^1.0.0, color-name@~1.1.4:
version "1.1.4"
resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz"
color-string@^1.9.0:
version "1.9.1"
resolved "https://registry.yarnpkg.com/color-string/-/color-string-1.9.1.tgz#4467f9146f036f855b764dfb5bf8582bf342c7a4"
integrity sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==
dependencies:
color-name "^1.0.0"
simple-swizzle "^0.2.2"
color-support@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
color@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/color/-/color-4.2.3.tgz#d781ecb5e57224ee43ea9627560107c0e0c6463a"
integrity sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==
dependencies:
color-convert "^2.0.1"
color-string "^1.9.0"
colorette@^2.0.16:
version "2.0.16"
resolved "https://registry.npmjs.org/colorette/-/colorette-2.0.16.tgz"
@ -2218,6 +2291,18 @@ debuglog@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
decompress-response@^6.0.0:
version "6.0.0"
resolved "https://registry.yarnpkg.com/decompress-response/-/decompress-response-6.0.0.tgz#ca387612ddb7e104bd16d85aab00d5ecf09c66fc"
integrity sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==
dependencies:
mimic-response "^3.1.0"
deep-extend@^0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac"
integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==
deep-is@^0.1.3:
version "0.1.4"
resolved "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz"
@ -2247,6 +2332,11 @@ depd@^1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
detect-libc@^2.0.0, detect-libc@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-2.0.1.tgz#e1897aa88fa6ad197862937fbc0441ef352ee0cd"
integrity sha512-463v3ZeIrcWtdgIg6vI6XUncguvr2TnGl4SzDXinkt9mSLpBJKXT3mW6xT3VQdDN11+WVs29pgvivTc4Lp8v+w==
dezalgo@^1.0.0:
version "1.0.4"
resolved "https://registry.yarnpkg.com/dezalgo/-/dezalgo-1.0.4.tgz#751235260469084c132157dfa857f386d4c33d81"
@ -2310,6 +2400,13 @@ encoding@^0.1.13:
dependencies:
iconv-lite "^0.6.2"
end-of-stream@^1.1.0, end-of-stream@^1.4.1:
version "1.4.4"
resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0"
integrity sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==
dependencies:
once "^1.4.0"
env-paths@^2.2.0:
version "2.2.1"
resolved "https://registry.yarnpkg.com/env-paths/-/env-paths-2.2.1.tgz#420399d416ce1fbe9bc0a07c62fa68d67fd0f8f2"
@ -2597,6 +2694,11 @@ execa@^5.1.1:
signal-exit "^3.0.3"
strip-final-newline "^2.0.0"
expand-template@^2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/expand-template/-/expand-template-2.0.3.tgz#6e14b3fcee0f3a6340ecb57d2e8918692052a47c"
integrity sha512-XYfuKMvj4O35f/pOXLObndIRvyQ+/+6AhODh+OKWj9S9498pHHn/IMszH+gt0fBCRWMNfk1ZSp5x3AifmnI2vg==
faker@5.5.3:
version "5.5.3"
resolved "https://registry.npmjs.org/faker/-/faker-5.5.3.tgz"
@ -2679,6 +2781,11 @@ form-data@^4.0.0:
combined-stream "^1.0.8"
mime-types "^2.1.12"
fs-constants@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/fs-constants/-/fs-constants-1.0.0.tgz#6be0de9be998ce16af8afc24497b9ee9b7ccd9ad"
integrity sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==
fs-extra@^10.1.0:
version "10.1.0"
resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-10.1.0.tgz#02873cfbc4084dde127eaa5f9905eef2325d1abf"
@ -2751,6 +2858,11 @@ get-user-locale@^1.2.0:
dependencies:
lodash.once "^4.1.1"
github-from-package@0.0.0:
version "0.0.0"
resolved "https://registry.yarnpkg.com/github-from-package/-/github-from-package-0.0.0.tgz#97fb5d96bfde8973313f20e8288ef9a167fa64ce"
integrity sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==
glob-parent@^5.1.2:
version "5.1.2"
resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
@ -2924,6 +3036,11 @@ iconv-lite@^0.6.2:
dependencies:
safer-buffer ">= 2.1.2 < 3.0.0"
ieee754@^1.1.13:
version "1.2.1"
resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352"
integrity sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==
ignore-walk@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/ignore-walk/-/ignore-walk-5.0.1.tgz#5f199e23e1288f518d90358d461387788a154776"
@ -2960,7 +3077,7 @@ inflight@^1.0.4:
once "^1.3.0"
wrappy "1"
inherits@2, inherits@^2.0.3:
inherits@2, inherits@^2.0.3, inherits@^2.0.4:
version "2.0.4"
resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz"
@ -2968,6 +3085,11 @@ ini@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/ini/-/ini-3.0.0.tgz#2f6de95006923aa75feed8894f5686165adc08f1"
ini@~1.3.0:
version "1.3.8"
resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.8.tgz#a29da425b48806f34767a4efce397269af28432c"
integrity sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==
init-package-json@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/init-package-json/-/init-package-json-3.0.2.tgz#f5bc9bac93f2bdc005778bc2271be642fecfcd69"
@ -3011,6 +3133,11 @@ is-arrayish@^0.2.1:
version "0.2.1"
resolved "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz"
is-arrayish@^0.3.1:
version "0.3.2"
resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.3.2.tgz#4574a2ae56f7ab206896fb431eaeed066fdf8f03"
integrity sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==
is-bigint@^1.0.1:
version "1.0.4"
resolved "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz"
@ -3522,6 +3649,11 @@ mimic-fn@^2.1.0:
version "2.1.0"
resolved "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz"
mimic-response@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-3.1.0.tgz#2d1d59af9c1b129815accc2c46a022a5ce1fa3c9"
integrity sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==
minimatch@^3.0.4, minimatch@^3.1.1, minimatch@^3.1.2:
version "3.1.2"
resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
@ -3534,7 +3666,7 @@ minimatch@^5.0.1:
dependencies:
brace-expansion "^2.0.1"
minimist@^1.2.0, minimist@^1.2.6:
minimist@^1.2.0, minimist@^1.2.3, minimist@^1.2.6:
version "1.2.6"
resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz"
@ -3592,6 +3724,11 @@ minizlib@^2.1.1, minizlib@^2.1.2:
minipass "^3.0.0"
yallist "^4.0.0"
mkdirp-classic@^0.5.2, mkdirp-classic@^0.5.3:
version "0.5.3"
resolved "https://registry.yarnpkg.com/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz#fa10c9115cc6d8865be221ba47ee9bed78601113"
integrity sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==
mkdirp-infer-owner@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/mkdirp-infer-owner/-/mkdirp-infer-owner-2.0.0.tgz#55d3b368e7d89065c38f32fd38e638f0ab61d316"
@ -3604,6 +3741,11 @@ mkdirp@^1.0.3, mkdirp@^1.0.4:
version "1.0.4"
resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
moment@^2.10.2:
version "2.29.4"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz#3dbe052889fe7c1b2ed966fcb3a77328964ef108"
integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==
ms@2.0.0:
version "2.0.0"
resolved "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
@ -3629,6 +3771,11 @@ nanoid@^3.1.30:
version "3.3.4"
resolved "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz"
napi-build-utils@^1.0.1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/napi-build-utils/-/napi-build-utils-1.0.2.tgz#b1fddc0b2c46e380a0b7a76f984dd47c41a13806"
integrity sha512-ONmRUqK7zj7DWX0D9ADe03wbwOBZxNAfF20PlGfCWQcD3+/MakShIHrMqx9YwPTfxDdF1zLeL+RGZiR9kGMLdg==
natural-compare@^1.4.0:
version "1.4.0"
resolved "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz"
@ -3659,6 +3806,18 @@ next@12.1.6:
"@next/swc-win32-ia32-msvc" "12.1.6"
"@next/swc-win32-x64-msvc" "12.1.6"
node-abi@^3.3.0:
version "3.22.0"
resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-3.22.0.tgz#00b8250e86a0816576258227edbce7bbe0039362"
integrity sha512-u4uAs/4Zzmp/jjsD9cyFYDXeISfUWaAVWshPmDZOFOv4Xl4SbzTXm53I04C2uRueYJ+0t5PEtLH/owbn2Npf/w==
dependencies:
semver "^7.3.5"
node-addon-api@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-5.0.0.tgz#7d7e6f9ef89043befdb20c1989c905ebde18c501"
integrity sha512-CvkDw2OEnme7ybCykJpVcKH+uAOLV2qLqiyla128dN9TkEWfrYmxG6C2boDe5KcNQqZF3orkqzGgOMvZ/JNekA==
node-gyp@^9.0.0:
version "9.0.0"
resolved "https://registry.yarnpkg.com/node-gyp/-/node-gyp-9.0.0.tgz#e1da2067427f3eb5bb56820cb62bc6b1e4bd2089"
@ -3929,7 +4088,7 @@ object.values@^1.1.5:
define-properties "^1.1.3"
es-abstract "^1.19.1"
once@^1.3.0:
once@^1.3.0, once@^1.3.1, once@^1.4.0:
version "1.4.0"
resolved "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
dependencies:
@ -4088,6 +4247,24 @@ postcss@8.4.5:
picocolors "^1.0.0"
source-map-js "^1.0.1"
prebuild-install@^7.1.1:
version "7.1.1"
resolved "https://registry.yarnpkg.com/prebuild-install/-/prebuild-install-7.1.1.tgz#de97d5b34a70a0c81334fd24641f2a1702352e45"
integrity sha512-jAXscXWMcCK8GgCoHOfIr0ODh5ai8mj63L2nWrjuAgXE6tDyYGnx4/8o/rCgU+B4JSyZBKbeZqzhtwtC3ovxjw==
dependencies:
detect-libc "^2.0.0"
expand-template "^2.0.3"
github-from-package "0.0.0"
minimist "^1.2.3"
mkdirp-classic "^0.5.3"
napi-build-utils "^1.0.1"
node-abi "^3.3.0"
pump "^3.0.0"
rc "^1.2.7"
simple-get "^4.0.0"
tar-fs "^2.0.0"
tunnel-agent "^0.6.0"
prelude-ls@^1.2.1:
version "1.2.1"
resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz"
@ -4138,6 +4315,14 @@ property-expr@^2.0.4:
resolved "https://registry.yarnpkg.com/property-expr/-/property-expr-2.0.5.tgz#278bdb15308ae16af3e3b9640024524f4dc02cb4"
integrity sha512-IJUkICM5dP5znhCckHSv30Q4b5/JA5enCtkRHYaOVOAocnH/1BQEYTC5NMfT3AVl/iXKdr3aqQbQn9DxyWknwA==
pump@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/pump/-/pump-3.0.0.tgz#b4a2116815bde2f4e1ea602354e8c75565107a64"
integrity sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==
dependencies:
end-of-stream "^1.1.0"
once "^1.3.1"
punycode@^2.1.0:
version "2.1.1"
resolved "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz"
@ -4150,6 +4335,16 @@ queue-microtask@^1.2.2:
version "1.2.3"
resolved "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz"
rc@^1.2.7:
version "1.2.8"
resolved "https://registry.yarnpkg.com/rc/-/rc-1.2.8.tgz#cd924bf5200a075b83c188cd6b9e211b7fc0d3ed"
integrity sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==
dependencies:
deep-extend "^0.6.0"
ini "~1.3.0"
minimist "^1.2.0"
strip-json-comments "~2.0.1"
react-calendar@^3.7.0:
version "3.7.0"
resolved "https://registry.yarnpkg.com/react-calendar/-/react-calendar-3.7.0.tgz#951d56e91afb33b1c1e019cb790349fbffcc6894"
@ -4247,7 +4442,7 @@ read@1, read@^1.0.7, read@~1.0.7:
dependencies:
mute-stream "~0.0.4"
readable-stream@^3.6.0:
readable-stream@^3.1.1, readable-stream@^3.4.0, readable-stream@^3.6.0:
version "3.6.0"
resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.0.tgz#337bbda3adc0706bd3e024426a286d4b4b2c9198"
dependencies:
@ -4388,14 +4583,14 @@ rxjs@^7.5.5:
dependencies:
tslib "^2.1.0"
safe-buffer@^5.0.1, safe-buffer@~5.2.0:
version "5.2.1"
resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6"
safe-buffer@~5.1.1:
version "5.1.2"
resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz"
safe-buffer@~5.2.0:
version "5.2.1"
resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6"
"safer-buffer@>= 2.1.2 < 3.0.0":
version "2.1.2"
resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
@ -4432,6 +4627,20 @@ shallowequal@^1.1.0:
version "1.1.0"
resolved "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz"
sharp@^0.30.7:
version "0.30.7"
resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.30.7.tgz#7862bda98804fdd1f0d5659c85e3324b90d94c7c"
integrity sha512-G+MY2YW33jgflKPTXXptVO28HvNOo9G3j0MybYAHeEmby+QuD2U98dT6ueht9cv/XDqZspSpIhoSW+BAKJ7Hig==
dependencies:
color "^4.2.3"
detect-libc "^2.0.1"
node-addon-api "^5.0.0"
prebuild-install "^7.1.1"
semver "^7.3.7"
simple-get "^4.0.1"
tar-fs "^2.1.1"
tunnel-agent "^0.6.0"
shebang-command@^2.0.0:
version "2.0.0"
resolved "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz"
@ -4454,6 +4663,27 @@ signal-exit@^3.0.2, signal-exit@^3.0.3, signal-exit@^3.0.7:
version "3.0.7"
resolved "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz"
simple-concat@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/simple-concat/-/simple-concat-1.0.1.tgz#f46976082ba35c2263f1c8ab5edfe26c41c9552f"
integrity sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==
simple-get@^4.0.0, simple-get@^4.0.1:
version "4.0.1"
resolved "https://registry.yarnpkg.com/simple-get/-/simple-get-4.0.1.tgz#4a39db549287c979d352112fa03fd99fd6bc3543"
integrity sha512-brv7p5WgH0jmQJr1ZDDfKDOSeWWg+OVypG99A/5vYGPqJ6pxiaHLy8nxtFjBA7oMa01ebA9gfh1uMCFqOuXxvA==
dependencies:
decompress-response "^6.0.0"
once "^1.3.1"
simple-concat "^1.0.0"
simple-swizzle@^0.2.2:
version "0.2.2"
resolved "https://registry.yarnpkg.com/simple-swizzle/-/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
integrity sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==
dependencies:
is-arrayish "^0.3.1"
slash@^3.0.0:
version "3.0.0"
resolved "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz"
@ -4615,6 +4845,11 @@ strip-json-comments@^3.1.0, strip-json-comments@^3.1.1:
version "3.1.1"
resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz"
strip-json-comments@~2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
integrity sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==
styled-components@^5.3.5:
version "5.3.5"
resolved "https://registry.npmjs.org/styled-components/-/styled-components-5.3.5.tgz"
@ -4658,6 +4893,27 @@ supports-preserve-symlinks-flag@^1.0.0:
version "1.0.0"
resolved "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz"
tar-fs@^2.0.0, tar-fs@^2.1.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/tar-fs/-/tar-fs-2.1.1.tgz#489a15ab85f1f0befabb370b7de4f9eb5cbe8784"
integrity sha512-V0r2Y9scmbDRLCNex/+hYzvp/zyYjvFbHPNgVTKfQvVrb6guiE/fxP+XblDNR011utopbkex2nM4dHNV6GDsng==
dependencies:
chownr "^1.1.1"
mkdirp-classic "^0.5.2"
pump "^3.0.0"
tar-stream "^2.1.4"
tar-stream@^2.1.4:
version "2.2.0"
resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-2.2.0.tgz#acad84c284136b060dc3faa64474aa9aebd77287"
integrity sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==
dependencies:
bl "^4.0.3"
end-of-stream "^1.4.1"
fs-constants "^1.0.0"
inherits "^2.0.3"
readable-stream "^3.1.1"
tar@^6.1.0, tar@^6.1.11, tar@^6.1.2:
version "6.1.11"
resolved "https://registry.yarnpkg.com/tar/-/tar-6.1.11.tgz#6760a38f003afa1b2ffd0ffe9e9abbd0eab3d621"
@ -4731,6 +4987,13 @@ tsutils@^3.21.0:
dependencies:
tslib "^1.8.1"
tunnel-agent@^0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.6.0.tgz#27a5dea06b36b04a0a9966774b290868f0fc40fd"
integrity sha512-McnNiV1l8RYeY8tBgEpuodCC1mLUdbSN+CYBL7kJsJNInOP8UjDDEwdk6Mw60vdLLrr5NHKZhMAOSrR2NZuQ+w==
dependencies:
safe-buffer "^5.0.1"
type-check@^0.4.0, type-check@~0.4.0:
version "0.4.0"
resolved "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz"