From 57d9c909a09ffd15320fbdb3482e411eccd62240 Mon Sep 17 00:00:00 2001
From: joseCorte-exe <josecorte-corte@hotmail.com>
Date: Wed, 13 Jul 2022 11:27:57 -0300
Subject: [PATCH] fixing qualifiers

---
 src/components/graph/LineBarChart.tsx         |  8 +-
 .../graph/costIndicatorChart/index.tsx        |  2 +-
 .../graph/grossAnualChart/GrossAnualChart.tsx | 12 +--
 .../grossMensalChart/GrossMensalChart.tsx     |  8 +-
 src/components/sidebar/Sidebar.tsx            |  2 +-
 src/pages/dashboard/index.tsx                 | 16 +--
 src/pages/economy/index.tsx                   |  4 +-
 src/pages/pld/index.tsx                       | 97 ++++++++++++++-----
 src/pages/resumoOperacao/index.tsx            |  6 +-
 src/styles/layouts/pld/PldView.ts             |  5 +-
 10 files changed, 95 insertions(+), 65 deletions(-)

diff --git a/src/components/graph/LineBarChart.tsx b/src/components/graph/LineBarChart.tsx
index 945da91..39f026d 100644
--- a/src/components/graph/LineBarChart.tsx
+++ b/src/components/graph/LineBarChart.tsx
@@ -114,7 +114,7 @@ export function LineBarChart({ title, subtitle, data1, data2, data3, label, red,
     },
   };
 
-  console.log(label.length)
+  console.log(data3)
 
   const data = data2? {
     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,
@@ -146,7 +146,7 @@ export function LineBarChart({ title, subtitle, data1, data2, data3, label, red,
         backgroundColor: (value, ctx) => {
           return hashurado? parseInt(value.dataIndex+1) <= currentTime.getMonth()? '#255488' : pattern.draw('diagonal', '#255488') : '#255488'
         },
-        data: data2.map(value => value.value),
+        data: data3.map(value => value.value),
       },
     ],
   } : {
@@ -158,8 +158,8 @@ export function LineBarChart({ title, subtitle, data1, data2, data3, label, red,
         borderColor: red?
         '#f00' : '#0c9200',
         borderWidth: 2,
-        fill: false,
-        data: data1.map(value => value.value),
+        fill: true,
+        data: data1.map(value => value),
       },
       {
         type: 'bar' as const,
diff --git a/src/components/graph/costIndicatorChart/index.tsx b/src/components/graph/costIndicatorChart/index.tsx
index c1cb013..387a840 100644
--- a/src/components/graph/costIndicatorChart/index.tsx
+++ b/src/components/graph/costIndicatorChart/index.tsx
@@ -63,7 +63,7 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
           dataArr.map(data => {
               sum += data;
           });
-          const result = `${parseInt(value).toLocaleString('pt-br')}`
+          const result = `${(parseFloat(value)/10).toLocaleString('pt-br').slice(0, 4)}`
 
           return value==null? null : result
         },
diff --git a/src/components/graph/grossAnualChart/GrossAnualChart.tsx b/src/components/graph/grossAnualChart/GrossAnualChart.tsx
index ee7f3b1..c8dadb4 100644
--- a/src/components/graph/grossAnualChart/GrossAnualChart.tsx
+++ b/src/components/graph/grossAnualChart/GrossAnualChart.tsx
@@ -29,15 +29,11 @@ interface SingleBarInterface{
   bruta?: boolean | undefined
 }
 
-export function GrossAnulChart({ title, subtitle, dataProps, label, dataset, barLabel, miniature, bruta }: SingleBarInterface) {
+export function GrossAnualChart({ title, subtitle, dataProps, label, dataset, barLabel, miniature, bruta }: SingleBarInterface) {
   function spacement(string) {
-    let spaces = '⠀'
-    let i=Math.abs(string)
+    const spaces = string.length===1?'' : string.length===2? '⠀⠀⠀⠀' : string.length===3? '⠀⠀⠀' : string.length===4? '⠀⠀' : string.length===5? '⠀' : ''
 
-    while (i <= 1) {
-      i--
-      spaces = spaces + `⠀`
-    }
+    console.log(string.length)
 
     return spaces
   }
@@ -75,7 +71,7 @@ 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')}${spacement(parseInt(value).toLocaleString('pt-br'))}`
 
           return value==null? null : result
         },
diff --git a/src/components/graph/grossMensalChart/GrossMensalChart.tsx b/src/components/graph/grossMensalChart/GrossMensalChart.tsx
index 3a20a45..6a184f3 100644
--- a/src/components/graph/grossMensalChart/GrossMensalChart.tsx
+++ b/src/components/graph/grossMensalChart/GrossMensalChart.tsx
@@ -43,13 +43,9 @@ interface ChartInterface {
 
 export default function GrossMensalChart({ title, data1, data2, label, subtitle, miniature }: ChartInterface) {
   function spacement(string) {
-    let spaces = '⠀'
-    let i=Math.abs(string)
+    const spaces = string.length===1?'' : string.length===2? '⠀⠀⠀⠀' : string.length===3? '⠀⠀⠀' : string.length===4? '⠀⠀' : string.length===5? '⠀' : ''
 
-    while (i <= 1) {
-      i--
-      spaces = spaces + `⠀`
-    }
+    console.log(string.length)
 
     return spaces
   }
diff --git a/src/components/sidebar/Sidebar.tsx b/src/components/sidebar/Sidebar.tsx
index b87ed41..325241f 100644
--- a/src/components/sidebar/Sidebar.tsx
+++ b/src/components/sidebar/Sidebar.tsx
@@ -119,7 +119,7 @@ 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>
-            <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>
+            <Link href='/economy'><li onClick={() => setEconomiaDrawer(!economiaDrawer)} className={router.pathname=='/economy'? '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>
diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx
index 2654097..8660d94 100644
--- a/src/pages/dashboard/index.tsx
+++ b/src/pages/dashboard/index.tsx
@@ -23,7 +23,7 @@ import { parseCookies } from 'nookies'
 import { GetServerSideProps } from 'next'
 import getAPIClient from '../../services/ssrApi'
 import Chart2 from '../../components/graph/Chart2'
-import { GrossAnulChart } from '../../components/graph/grossAnualChart/GrossAnualChart'
+import { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart'
 import CostIndicatorChart from '../../components/graph/costIndicatorChart'
 import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart'
 import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart'
@@ -55,7 +55,7 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
 
       <Link href='pld'>
         <section className="cardsSection" >
-          <MapCard title='R$/MWh' subtitle='' date={`período - ${new Date().toLocaleDateString()}`} statistic='' imgSource='/moneyIcon.svg' />
+          <MapCard title='R$/MWh' subtitle='' date={`${new Date().getUTCMonth()+1}/${new Date().getUTCFullYear()}`} statistic='' imgSource='/moneyIcon.svg' />
           {
             mapsInfo.map(value => {
               return <MapCard key={value.submarket} title='S' subtitle={value.submarket} statistic={parseFloat(value.value).toFixed(2)} imgSource='/SUL.svg' />
@@ -66,13 +66,8 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
 
       <section className='dashboard'>
         <GraphCard title='Economia Bruta Anual' subtitle='Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil'>
-          {/* <SingleBar title='' subtitle=''
-          dataset='Consolidada'
-          dataProps={grossAnualGraph}
-          label={grossAnualYears} barLabel miniature/> */}
-          <GrossAnulChart title='' subtitle=''
+          <GrossAnualChart title='' subtitle=''
             dataset='Consolidada'
-
             dataProps={grossAnualGraph}
             label={grossAnualYears} barLabel bruta miniature/>
         </GraphCard>
@@ -93,11 +88,6 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
         </GraphCard>
 
         <GraphCard title='Indicador de Custo' subtitle='Indicador de Custo - Valores em R$/MWh'>
-          {/* <Chart title='' subtitle=''
-          data1={costIndicator.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
-          // data1={graphData}
-          data2={costIndicator.filter((value, index) => value.mes.slice(4, 8).includes('2022'))}
-          label={costIndicator.map(value => value.mes.slice(0, 3))} miniature/> */}
           <CostIndicatorChart title='' subtitle=''
             data1={costIndicator.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
             // data1={graphData}
diff --git a/src/pages/economy/index.tsx b/src/pages/economy/index.tsx
index 86869a0..a3bdd42 100644
--- a/src/pages/economy/index.tsx
+++ b/src/pages/economy/index.tsx
@@ -30,7 +30,7 @@ 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 { GrossAnualChart } from '../../components/graph/grossAnualChart/GrossAnualChart';
 import GrossMensalChart from '../../components/graph/grossMensalChart/GrossMensalChart';
 import { CativoXLivreChart } from '../../components/graph/cativoXLivreChart';
 import { ConsumoEstimado } from '../../services/consumoEstimado';
@@ -106,7 +106,7 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
 
       <RenderIf isTrue={economyMenu===0}>
         <section>
-          <GrossAnulChart title='' subtitle=''
+          <GrossAnualChart title='' subtitle=''
             dataset='Consolidada'
 
             dataProps={anual}
diff --git a/src/pages/pld/index.tsx b/src/pages/pld/index.tsx
index f5dfb7b..6de55b9 100644
--- a/src/pages/pld/index.tsx
+++ b/src/pages/pld/index.tsx
@@ -83,11 +83,9 @@ 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, "row": true},
-          {"type" : "=", "field" : "pld.submercado", "value": select}
+          {"type" : "=", "field" : "year_month_formatted", "value": month},
+          {"type" : "=", "field" : "submarket", "value": select}
         ],
       "order": [{ "field": "day_calc", "direction": "asc" }]
     }).then(res => {
@@ -185,8 +183,9 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
   function htmlToCSV(html, filename) {
     const data = [];
     const rows = document.querySelectorAll("table tr");
+    // const rows = document.getElementsByClassName('tabela');
 
-    for (let i = 0; i < rows.length; i++) {
+    for (let i = rows.length/2; i < rows.length; i++) {
       const row = [], cols: any = rows[i].querySelectorAll("td, th");
 
       for (let j = 0; j < cols.length; j++) {
@@ -196,7 +195,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
       data.push(row.join(";"));
     }
 
-    downloadCSVFile(data.join("\n").replace('(R$/MWh)', ''), filename);
+    downloadCSVFile(data.join("\n"), filename);
   }
 
   useEffect(() => {
@@ -236,7 +235,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
 
       <RenderIf isTrue={pldMenu===0}>
         <PldTableView>
-          <table className="tg">
+          <table className='tg'>
             <thead>
               <tr>
                 <th className='tg-8oo6'>Mês</th>
@@ -262,20 +261,6 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
               }
             </tbody>
           </table>
-          {/* <section>
-            <article onClick={() => setPage(1)} className="btn btn-1">
-            <svg height='100px'>
-              <rect x="0" y="0" fill="none" width="100%" height="100%"/>
-            </svg>
-              <p>Valores Diários</p>
-            </article>
-            <article onClick={() => setPage(2)} className="btn btn-1">
-              <svg height='100px'>
-                <rect x="0" y="0" fill="none" width="100%" height="100%"/>
-              </svg>
-              <p>Valores Horários</p>
-            </article>
-          </section> */}
         </PldTableView>
         <PldTableMinMaxView>
           <table className='tg'>
@@ -318,9 +303,73 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
             </tbody>
           </table>
         </PldTableMinMaxView>
+
+        <PldTableView display={false}>
+          <table className="tg tabela" style={{display: 'none'}}>
+            <thead>
+              <tr className='tr'>
+                <th className='tg-8oo6'>Mês</th>
+                <th className='tg-8oo6'>Nordeste</th>
+                <th className='tg-8oo6'>Norte</th>
+                <th className='tg-8oo6'>Sudeste</th>
+                <th className='tg-8oo6'>Sul</th>
+              </tr>
+            </thead>
+            <tbody>
+              {
+                tableData.data.map(data => {
+                  return <>
+                    <tr className={`${data.year_month_formatted==year_Month? 'actual' : ''} tr`}>
+                      <td className='tg-gceh'>{data.year_month_formatted}</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>
+                  </>
+                })
+              }
+              {
+                tableData.result.map((data, index) => {
+                  if (index === 0) {
+                    return <>
+                      <tr className='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 className='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 className='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>
+        </PldTableView>
       </RenderIf>
 
-      {/* grafico de grafico por seleção de data (mês)*/}
+      {/* grafico de grafico por seleção de data (mês) (diario)*/}
       <RenderIf isTrue={pldMenu===1}>
         <PldGraphView>
           <section className='toolsbar'>
@@ -376,7 +425,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
               </FormControl>
           </section>
           <LineBarChart
-          data1={dataByDay} data3={dataByDay}
+          data1={dataByDay.map(value => value.mmovel)} data3={dataByDay}
           dataset1={'Média'} dataset2={'barra1'} dataset3={'Diario'}
           label={dataByDay.map((value, index) => {
             return value.day_formatted
@@ -385,7 +434,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
         </PldGraphView>
       </RenderIf>
 
-      {/* grafico de grafico por seleção de data INTEIRA*/}
+      {/* grafico de grafico por seleção de data INTEIRA (horario)*/}
       <RenderIf isTrue={pldMenu===2}>
         <PldGraphView>
           <section className='toolsbar2'>
diff --git a/src/pages/resumoOperacao/index.tsx b/src/pages/resumoOperacao/index.tsx
index 27d4b85..5a006b8 100644
--- a/src/pages/resumoOperacao/index.tsx
+++ b/src/pages/resumoOperacao/index.tsx
@@ -28,11 +28,9 @@ export default function ResumoOperacao({tableData, clients, userName, clientMont
   const csvData = tableData;
 
   const [month, setMonth] = useState('');
-  const [unidade, setUnidade] = useState('');
+  const [unidade, setUnidade] = useState(clients[0].cod_smart_unidade);
   const [tableDataState, setTableDataState] = useState<any>([]);
 
-  const monthLabels = ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez']
-
   const { ['user-id']: id } = parseCookies()
 
   const handleChangeMonth = (event: SelectChangeEvent) => {
@@ -120,7 +118,7 @@ export default function ResumoOperacao({tableData, clients, userName, clientMont
                 <Select
                   labelId="demo-simple-select-label"
                   id="demo-simple-select"
-                  value={clients.length > 1? unidade : clients[0]}
+                  value={unidade}
                   label="Unidade"
                   onChange={handleChangeUnidade}
                   fullWidth
diff --git a/src/styles/layouts/pld/PldView.ts b/src/styles/layouts/pld/PldView.ts
index e4c1557..f84af69 100644
--- a/src/styles/layouts/pld/PldView.ts
+++ b/src/styles/layouts/pld/PldView.ts
@@ -41,7 +41,6 @@ export const PldTableMinMaxView = styled.div`
     word-break:normal;
   }
 
-
   .tg th{
     border-color:#DDDFE1;
     border-style:solid;
@@ -208,7 +207,9 @@ export const PldTableMinMaxView = styled.div`
     padding: 0!important;
   }
 `
-export const PldTableView = styled.div`
+
+export const PldTableView = styled.div<{display?: boolean}>`
+  display: ${props => props.display? 'none' : 'block'};
   width: 100%;
 
   border-radius: 8px!important;