Smart Energia - Resumo de Operação

import Box from '@mui/material/Box'; 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 { parseCookies } from 'nookies'; import React, { useEffect, useState } from 'react'; // import Teste from '../files/teste.csv'; import { CSVDownload, CSVLink } from "react-csv"; import BasicButton from '../../components/buttons/basicButton/BasicButton'; import Header from '../../components/header/Header'; import PageTitle from '../../components/pageTitle/PageTitle'; import Sidebar from '../../components/sidebar/Sidebar'; import { api } from '../../services/api'; // import { dados } from '../services/DadosTabelaResumoOperacao'; import data from '../../services/dados.json' import getAPIClient from '../../services/ssrApi'; import { Pagination, TableBodyView, TableHeader, TableView } from '../../styles/layouts/ResumoOperacao/ResumoOperacaoView'; 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(''); const [unidade, setUnidade] = useState(''); const [tableDataState, setTableDataState] = useState([]); 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); }; const handleChangeUnidade = (event: SelectChangeEvent) => { 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"); download_link.download = filename; download_link.href = window.URL.createObjectURL(csv_file); download_link.style.display = "none"; document.body.appendChild(download_link); download_link.click(); } function htmlToCSV(html, filename) { const data = []; const rows = document.querySelectorAll("table tr"); for (let i = 0; i < rows.length; i++) { const row = [], cols: any = rows[i].querySelectorAll("td, th"); for (let j = 0; j < cols.length; j++) { row.push(cols[j].innerText); } data.push(row.join(";")); } downloadCSVFile(data.join("\n"), filename); } useEffect(() => { console.log(unidade) if (unidade!=='' || month!==''){ api.post('/operation/summary', month && !unidade? { "filters": [ {"type" : "=", "field": "mes", "value": month} ] } : !month && unidade? { "filters": [ {"type" : "=", "field": "dados_te.cod_smart_unidade", "value": unidade} ] } : month && unidade? { "filters": [ {"type" : "=", "field": "mes", "value": month}, {"type" : "=", "field": "dados_te.cod_smart_unidade", "value": unidade} ] } : {} ).then(res => { setTableDataState(res.data.data) }).catch(res => console.log(res)) } else { setTableDataState(tableData) } }, [month, unidade]) useEffect(() => { window?.addEventListener('scroll', getPageYAfterScroll); }, []) return ( Smart Energia - Resumo de Operação

Unidades

Mês

{ const html = document.querySelector("table").outerHTML; htmlToCSV(html, "resumo_operacao.csv"); }}/>

{ tableDataState?.map((value, index) => { if (value.mes.slice(4,7) != '2020') return }) }

Mês	Unidade	Operação	Contraparte	Montante (MWh)	Preço(R$/MWh)	ValorNF/Crédito(R$)
{value.mes}	{value.cod_smart_unidade}	{value.operacao}	{value.contraparte}	{parseFloat(value.montante_nf).toLocaleString('pt-br')}	{parseFloat(value.preco_nf).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}	{parseFloat(value.nf_c_icms).toLocaleString('pt-br',{style: 'currency', currency: 'BRL', minimumFractionDigits: 2})}

{pageYPosition > 300 && } ) } export const getServerSideProps: GetServerSideProps = async (ctx) => { const apiClient = getAPIClient(ctx) const { ['@smartAuth-token']: token } = parseCookies(ctx) const { ['user-client_id']: client_id } = parseCookies(ctx) const { ['user-name']: userName } = parseCookies(ctx) let tableData = []; let clientMonth = []; await apiClient.post('/operation/summary', { "filters": [] }).then(res => { tableData = res.data.data }) let clients = []; await apiClient.post('/operation', { "filters": [ {"type" : ">=", "field":"dados_te.mes", "value":1, "interval": "year"} ], "fields": ["mes"], "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) }) if (!token) { return { redirect: { destination: '/', permanent: false } } } return { props: { tableData, clients, clientMonth, userName } } }