update Consumo Api

src/components/administrativeTables/ClientsTable.tsx

@@ -1,12 +1,6 @@
-import DeleteIcon from '@mui/icons-material/Delete';
-import FilterListIcon from '@mui/icons-material/FilterList';
 import Box from '@mui/material/Box';
 import Checkbox from '@mui/material/Checkbox';
-import FormControlLabel from '@mui/material/FormControlLabel';
-import IconButton from '@mui/material/IconButton';
 import Paper from '@mui/material/Paper';
-import { alpha } from '@mui/material/styles';
-import Switch from '@mui/material/Switch';
 import Table from '@mui/material/Table';
 import TableBody from '@mui/material/TableBody';
 import TableCell from '@mui/material/TableCell';
@@ -15,13 +9,10 @@ import TableHead from '@mui/material/TableHead';
 import TablePagination from '@mui/material/TablePagination';
 import TableRow from '@mui/material/TableRow';
 import TableSortLabel from '@mui/material/TableSortLabel';
-import Toolbar from '@mui/material/Toolbar';
-import Tooltip from '@mui/material/Tooltip';
-import Typography from '@mui/material/Typography';
 import { visuallyHidden } from '@mui/utils';
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 
-import { ClientTableView, StyledStatus } from './ClientsTableView';
+import { TableView, StyledStatus } from './TableView';
 
 interface Data {
   clientCode: number,
@@ -30,29 +21,6 @@ interface Data {
   status: string,
 }
 
-function createData(
-  clientCode: number,
-  name: string,
-  unity: string,
-  status: string,
-): Data {
-  return {
-    clientCode,
-    name,
-    unity,
-    status,
-  };
-}
-
-const rows = [
-  createData(9500130, 'Copel', 'clique para ver unidades', 'ativo'),
-  createData(9500131, 'Copel', 'clique para ver unidades', 'ativo'),
-  createData(9500132, 'Copel', 'clique para ver unidades', 'ativo'),
-  createData(9500689, 'Copel', 'clique para ver unidades', 'pendente'),
-  createData(9500690, 'Copel', 'clique para ver unidades', 'inativo'),
-  createData(9500691, 'Copel', 'clique para ver unidades', 'inativo'),
-];
-
 function descendingComparator<T>(a: T, b: T, orderBy: keyof T) {
   if (b[orderBy] < a[orderBy]) {
     return -1;
@@ -77,7 +45,7 @@ function getComparator<Key extends keyof any>(
     : (a, b) => -descendingComparator(a, b, orderBy);
 }
 
-function stableSort<T>(array: readonly T[], comparator: (a: T, b: T) => number) {
+function stableSort<T>(array: any, comparator: (a: T, b: T) => number) {
   const stabilizedThis = array.map((el, index) => [el, index] as [T, number]);
   stabilizedThis.sort((a, b) => {
     const order = comparator(a[0], b[0]);
@@ -180,7 +148,12 @@ function EnhancedTableHead(props: EnhancedTableProps) {
   );
 }
 
-export default function ClientTable() {
+interface ClientsTableInterface {
+  clients: any,
+  onChange: any
+}
+
+export default function ClientTable({clients, onChange}: ClientsTableInterface) {
   const [order, setOrder] = useState<Order>('asc');
   const [orderBy, setOrderBy] = useState<keyof Data | string>('status');
   const [selected, setSelected] = useState<readonly string[]>([]);
@@ -199,7 +172,7 @@ export default function ClientTable() {
 
   const handleSelectAllClick = (event: React.ChangeEvent<HTMLInputElement>) => {
     if (event.target.checked) {
-      const newSelecteds = rows.map((n) => n.name);
+      const newSelecteds = clients.map((n) => n.name);
       setSelected(newSelecteds);
       return;
     }
@@ -237,12 +210,16 @@ export default function ClientTable() {
 
   const isSelected = (code: any) => selected.indexOf(code.toString()) !== -1;
 
+  useEffect(() => {
+    onChange(selected)
+  }, [selected])
+
   // Avoid a layout jump when reaching the last page with empty rows.
   const emptyRows =
-    page > 0 ? Math.max(0, (1 + page) * rowsPerPage - rows.length) : 0;
+    page > 0 ? Math.max(0, (1 + page) * rowsPerPage - clients.length) : 0;
 
   return (
-    <ClientTableView>
+    <TableView>
       <Paper sx={{ width: '100%', mb: 2 }}>
         <TableContainer>
           <Table
@@ -256,23 +233,23 @@ export default function ClientTable() {
               orderBy={orderBy}
               onSelectAllClick={handleSelectAllClick}
               onRequestSort={handleRequestSort}
-              rowCount={rows.length}
+              rowCount={clients.length}
             />
             <TableBody>
-              {stableSort(rows, getComparator(order, orderBy))
+              {stableSort(clients, getComparator(order, orderBy))
                 .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
                 .map((row, index) => {
-                  const isItemSelected = isSelected(row.clientCode);
+                  const isItemSelected = isSelected(row.id);
                   const labelId = `enhanced-table-checkbox-${index}`;
 
                   return (
                     <TableRow
                       hover
-                      onClick={(event) => handleClick(event, row.clientCode.toString())}
+                      onClick={(event) => handleClick(event, row.id.toString())}
                       role="checkbox"
                       aria-checked={isItemSelected}
                       tabIndex={-1}
-                      key={row.clientCode}
+                      key={row.id}
                       selected={isItemSelected}
                     >
                       <TableCell padding="checkbox">
@@ -290,11 +267,11 @@ export default function ClientTable() {
                         scope="row"
                         padding="none"
                       >
-                        Unidade - {row.clientCode}
+                        Client - {row.client_id}
                       </TableCell>
                       <TableCell align="left">{row.name}</TableCell>
-                      <TableCell align="left">{row.unity}button</TableCell>
+                      <TableCell align="left">clique aqui para ver as unidades</TableCell>
-                      <TableCell align="left"><StyledStatus status={row.status}>{row.status}</StyledStatus></TableCell>
+                      <TableCell align="left"><StyledStatus status={row.deleted_at? 'inativo' : 'ativo'}> {row.deleted_at? 'inativo' : 'ativo'}</StyledStatus></TableCell>
                     </TableRow>
                   );
                 })}
@@ -313,13 +290,13 @@ export default function ClientTable() {
         <TablePagination
           rowsPerPageOptions={[5, 10, 25]}
           component="div"
-          count={rows.length}
+          count={clients.length}
           rowsPerPage={rowsPerPage}
           page={page}
           onPageChange={handleChangePage}
           onRowsPerPageChange={handleChangeRowsPerPage}
         />
       </Paper>
-    </ClientTableView>
+    </TableView>
   );
 }

src/components/administrativeTables/FaqTable.tsx

@@ -20,7 +20,7 @@ import { GetServerSideProps } from 'next';
 import React, { useEffect, useState } from 'react';
 import getAPIClient from '../../services/ssrApi';
 
-import { ClientTableView, StyledStatus } from './ClientsTableView';
+import { TableView, StyledStatus } from './TableView';
 
 interface Data {
   question: string,
@@ -243,7 +243,7 @@ export default function FaqTable({questionData, onChange}: FaqTableInterface) {
     page > 0 ? Math.max(0, (1 + page) * rowsPerPage - rows.length) : 0;
 
   return (
-    <ClientTableView>
+    <TableView>
       <Paper sx={{ width: '100%', mb: 2 }}>
         <TableContainer>
           <Table
@@ -320,7 +320,7 @@ export default function FaqTable({questionData, onChange}: FaqTableInterface) {
           onRowsPerPageChange={handleChangeRowsPerPage}
         />
       </Paper>
-    </ClientTableView>
+    </TableView>
   );
 }
 

src/components/administrativeTables/NotificationsTable.tsx

@@ -21,7 +21,7 @@ import Typography from '@mui/material/Typography';
 import { visuallyHidden } from '@mui/utils';
 import React, { useState, useEffect } from 'react';
 
-import { ClientTableView, StyledStatus } from './ClientsTableView';
+import { TableView, StyledStatus } from './TableView';
 
 interface Data {
   notification: string,
@@ -179,7 +179,7 @@ interface NotificationData {
 }
 
 interface NotificationsTableInterface{
-  notifications: NotificationData[],
+  notifications: any,
   onChange: any
 }
 
@@ -248,7 +248,7 @@ export default function NotificationsTable({notifications, onChange}: Notificati
   }, [selected])
 
   return (
-    <ClientTableView>
+    <TableView>
       <Paper sx={{ width: '100%', mb: 2 }}>
         <TableContainer>
           <Table
@@ -325,6 +325,6 @@ export default function NotificationsTable({notifications, onChange}: Notificati
           onRowsPerPageChange={handleChangeRowsPerPage}
         />
       </Paper>
-    </ClientTableView>
+    </TableView>
   );
 }

src/components/administrativeTables/TableView.ts

@@ -1,6 +1,6 @@
 import styled from "styled-components";
 
-export const ClientTableView = styled.main`
+export const TableView = styled.main`
   width: 100%;
 
   color: #6A707E;

src/components/graph/Chart.tsx

@@ -71,14 +71,14 @@ export default function Chart({ title, data1, data2, label, subtitle, dataset1,
     labels,
     datasets: [
       {
-        label: dataset1? dataset1 : '2020',
+        label: dataset1? dataset1 : '2021',
-        data: data1.map(value => value),
+        data: data1.map(value => value.custo_unit),
         backgroundColor: '#C2D5FB',
       },
       data2?
       {
-        label: dataset2? dataset2 : '2021',
+        label: dataset2? dataset2 : '2022',
-        data: data2.map(value => value),
+        data: data2.map(value => value.custo_unit),
         backgroundColor: '#255488',
       } : null
     ],

src/components/inputUplaod/inputUpload.tsx

@@ -16,19 +16,16 @@ export default function InputUpload() {
 
   function onImageChange(e: any) {
     setImages([...e.target.files]);
-    console.log(e);
+    // console.log(e);
   }
 
-
-
-
   return (
     <InputUploadView>
 
 <div className='imgContainer'>
         <article>
-     {imageURLS.map((imageSrc) => (
+     {imageURLS.map((imageSrc, index) => (
-          <img  className="image" src={imageSrc} alt="not fount"  />
+          <img key={index} className="image" src={imageSrc} alt="not fount"  />
         ))}
 
        </article>

src/components/sidebar/Sidebar.tsx

@@ -37,7 +37,7 @@ export default function Sidebar() {
 
   const { ['user-role']: role } = parseCookies()
 
-  console.log(role)
+  // console.log(role)
 
   useEffect(() => {
     setViewModal(false)

src/pages/_app.tsx

@@ -59,7 +59,6 @@ function MyApp({ Component, pageProps }: AppProps) {
             <>
               <Sidebar />
               <Component {...pageProps} />
-
             </>
             :
             null

src/pages/administrative/clients.tsx

@@ -1,88 +0,0 @@
-import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
-import Modal from '@mui/material/Modal';
-import TextField from '@mui/material/TextField';
-import Typography from '@mui/material/Typography';
-import { DataGrid, GridColDef, GridValueGetterParams } from '@mui/x-data-grid';
-import React, { useState } from 'react'
-
-import AdministrativeHeader from '../../components/administrativeHeader/AdministrativeHeader';
-import ClientsTable from '../../components/administrativeTables/ClientsTable';
-import BasicButton from '../../components/buttons/basicButton/BasicButton'
-import FaqButton1 from '../../components/buttons/faqButton/FaqButton1';
-import FaqButton2 from '../../components/buttons/faqButton/FaqButton2';
-import Header from '../../components/header/Header'
-import InputUpload from '../../components/inputUplaod/inputUpload';
-import { ClientsView } from '../../styles/layouts/clients/ClientsView';
-import PageTitle from '../../components/pageTitle/PageTitle';
-import ConfirmModal from '../../components/modal/ConfirmModal';
-import { ConfirmModalView } from '../../styles/layouts/modals/confirmModalView';
-
-const style = {
-  position: 'absolute' as const,
-  top: '50%',
-  left: '50%',
-  transform: 'translate(-50%, -50%)',
-  width: 900,
-  height: 500,
-  bgcolor: 'background.paper',
-  border: '2px solid #000',
-  boxShadow: 24,
-  p: 4,
-  overflowY: 'scroll'
-};
-
-export default function clients() {
-  const [open, setOpen] = React.useState(false);
-  const [openModalInativar, setOpenModalInativar] = useState(false)
-  const handleOpen = () => setOpen(true);
-  const handleClose = () => setOpen(false);
-
-  const [openModal, setOpenModal] = useState(false)
-
-  return (
-    <div style={{display: 'flex', flexDirection: 'column', width: '100%'}}>
-      <ClientsView>
-        <Header name='' />
-        <PageTitle title='Clientes' subtitle='Clientes Smart Energia'/>
-          {/* <BasicButton title='Adicionar' onClick={handleOpen}/> */}
-        <div className='buttons'>
-        <button className='btn2' onClick={handleOpen}>Adicionar</button>
-        <button className='btn1' onClick={() => setOpenModalInativar(true)}>Inativar</button>
-        </div>
-        <Modal
-        open={open}
-        onClose={handleClose}
-        aria-labelledby="modal-modal-title"
-        aria-describedby="modal-modal-description"
-        >
-        <Box sx={style}>
-          <h1>Adicionar Cliente</h1>
-          <Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
-          Adicionar Cliente Smart Energia</Typography>
-          <br />
-          <TextField id="outlined-basic" label="Nome" sx={{width:350, ml:5}} variant="outlined" />
-          <TextField id="outlined-basic" label="E-mail/Usuário" sx={{width:350, ml:8}} variant="outlined" />
-          <TextField id="outlined-basic" label="Senha" sx={{width:350, ml:5, mt:2}} variant="outlined" />
-          <TextField id="outlined-basic" label="Confirma Senha" sx={{width:350, ml:8, mt:2}} variant="outlined" />
-          <TextField id="outlined-basic" label="Codigo do Cliente Smart Energia" sx={{width:350, ml:5, mt:2}} variant="outlined" />
-          <InputUpload />
-          <br /><br />
-        <FaqButton1  title='Cancelar' onClick={()=>console.log()} />
-        <FaqButton2  title='Salvar' onClick={()=>console.log()}/>
-        </Box>
-        </Modal>
-        <section>
-          <ClientsTable />
-        </section>
-      </ClientsView>
-
-      <ConfirmModal open={openModalInativar} handleIsClose={(value) => {setOpenModalInativar(value)}}>
-        <ConfirmModalView>
-          <BasicButton title='Confirmar' onClick={() => setOpenModalInativar(true)}/>
-          <BasicButton title='Cancelar' onClick={() => setOpenModalInativar(true)}/>
-        </ConfirmModalView>
-      </ConfirmModal>
-    </div>
-  )
-}

src/pages/administrative/clients/index.tsx

@@ -0,0 +1,237 @@
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Modal from '@mui/material/Modal';
+import TextField from '@mui/material/TextField';
+import Typography from '@mui/material/Typography';
+import React, { useState } from 'react'
+
+import Snackbar from '@mui/material/Snackbar';
+import MuiAlert, { AlertProps } from '@mui/material/Alert';
+import ClientsTable from '../../../components/administrativeTables/ClientsTable';
+import BasicButton from '../../../components/buttons/basicButton/BasicButton'
+import FaqButton1 from '../../../components/buttons/faqButton/FaqButton1';
+import FaqButton2 from '../../../components/buttons/faqButton/FaqButton2';
+import Header from '../../../components/header/Header'
+import InputUpload from '../../../components/inputUplaod/inputUpload';
+import { ClientsView } from '../../../styles/layouts/clients/ClientsView';
+import PageTitle from '../../../components/pageTitle/PageTitle';
+import ConfirmModal from '../../../components/modal/ConfirmModal';
+import { ConfirmModalView } from '../../../styles/layouts/modals/confirmModalView';
+import { api } from '../../../services/api';
+import { parseCookies } from 'nookies';
+import { GetServerSideProps } from 'next';
+import getAPIClient from '../../../services/ssrApi';
+
+const style = {
+  position: 'absolute' as const,
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)',
+  width: 900,
+  height: 500,
+  bgcolor: 'background.paper',
+  border: '2px solid #000',
+  boxShadow: 24,
+  p: 4,
+  overflowY: 'scroll'
+};
+
+const Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(
+  props,
+  ref,
+) {
+  return <MuiAlert elevation={6} ref={ref} variant="filled" {...props} />;
+});
+
+export default function clients({clients}) {
+  const [client, setClient] = useState<any>({
+    name: String,
+    email: String,
+    password: String,
+    password_confirmation: String,
+    client_id: Number
+  })
+  const [selectedClients, setSelectedClients] = useState([])
+
+  const [open, setOpen] = useState(false);
+  const [openModalInativar, setOpenModalInativar] = useState(false)
+  const handleOpen = () => setOpen(true);
+  const handleClose = () => setOpen(false);
+
+  const [openModal, setOpenModal] = useState(false)
+
+  //
+  const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false);
+  const [openSnackError, setOpenSnackError] = useState<boolean>(false);
+  const [openSnackSuccessDelete, setOpenSnackSuccessDelete] = useState<boolean>(false);
+  const [openSnackErrorDelete, setOpenSnackErrorDelete] = useState<boolean>(false);
+
+  const handleCloseSnack = (event?: React.SyntheticEvent | Event, reason?: string) => {
+    if (reason === 'clickaway') {
+      return;
+    }
+
+    setOpenSnackError(false);
+    setOpenSnackSuccess(false);
+  };
+
+  const handleCloseSnackDelete = (event?: React.SyntheticEvent | Event, reason?: string) => {
+    if (reason === 'clickaway') {
+      return;
+    }
+
+    setOpenSnackErrorDelete(false);
+    setOpenSnackSuccessDelete(false);
+  };
+  //
+
+  function handleCreateClient({name, email, password, password_confirmation, client_id}) {
+    api.post('/user', {
+      name,
+      email,
+      password,
+      password_confirmation,
+      client_id
+    }).then(res => {
+      setOpenSnackSuccess(true)
+      setOpenModalInativar(false)
+      window.location.reload()
+    }).catch(res => {
+      setOpenSnackError(true)
+    })
+  }
+  async function handleDeleteClient(id: any) {
+    await id.map(client => {
+      api.delete(`/user/${client}`).then(res => {
+        setOpenSnackSuccessDelete(true)
+        setOpenModalInativar(false)
+        window.location.reload()
+      }).catch(res => setOpenSnackErrorDelete(true))
+    })
+  }
+
+  return (
+    <div style={{display: 'flex', flexDirection: 'column', width: '100%'}}>
+      <Snackbar open={openSnackSuccess} autoHideDuration={4000} onClose={handleCloseSnack}>
+        <Alert onClose={handleCloseSnack} severity="success" sx={{ width: '100%' }}>
+          notificação cadastrada com sucesso!
+        </Alert>
+      </Snackbar>
+      <Snackbar open={openSnackError} autoHideDuration={4000} onClose={handleCloseSnack}>
+        <Alert onClose={handleCloseSnack} severity="error" sx={{ width: '100%' }}>
+          Notificação não cadastrada!
+        </Alert>
+      </Snackbar>
+
+      <Snackbar open={openSnackSuccessDelete} autoHideDuration={4000} onClose={handleCloseSnackDelete}>
+        <Alert onClose={handleCloseSnackDelete} severity="success" sx={{ width: '100%' }}>
+          notificação excluida com sucesso!
+        </Alert>
+      </Snackbar>
+      <Snackbar open={openSnackErrorDelete} autoHideDuration={4000} onClose={handleCloseSnackDelete}>
+        <Alert onClose={handleCloseSnackDelete} severity="error" sx={{ width: '100%' }}>
+          Notificação não excluida!
+        </Alert>
+      </Snackbar>
+
+      <ClientsView>
+        <Header name='' />
+        <PageTitle title='Clientes' subtitle='Clientes Smart Energia'/>
+        <div className='buttons'>
+        <button className='btn2' onClick={handleOpen}>Adicionar</button>
+        <button className='btn1' onClick={() => setOpenModalInativar(true)}>Inativar</button>
+        </div>
+        <section>
+          <ClientsTable clients={clients} onChange={value => {
+            setSelectedClients(value)
+          }}/>
+        </section>
+      </ClientsView>
+
+      <Modal
+      open={open}
+      onClose={handleClose}
+      aria-labelledby="modal-modal-title"
+      aria-describedby="modal-modal-description"
+      >
+      <Box sx={style}>
+        <h1>Adicionar Cliente</h1>
+        <Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
+        Adicionar Cliente Smart Energia</Typography>
+        <br />
+        <TextField id="outlined-basic" label="Nome" sx={{width:350, ml:5}} onChange={(value) => {
+          setClient({
+            ...client,
+            name: value.target.value
+          })
+        }} variant="outlined" />
+        <TextField id="outlined-basic" label="E-mail/Usuário" sx={{width:350, ml:8}} onChange={(value) => {
+          setClient({
+            ...client,
+            email: value.target.value
+          })
+        }} variant="outlined" />
+        <TextField id="outlined-basic" label="Senha" sx={{width:350, ml:5, mt:2}} onChange={(value) => {
+          setClient({
+            ...client,
+            password: value.target.value
+          })
+        }} variant="outlined" />
+        <TextField id="outlined-basic" label="Confirma Senha" sx={{width:350, ml:8, mt:2}} onChange={(value) => {
+          setClient({
+            ...client,
+            password_confirmation: value.target.value
+          })
+        }} variant="outlined" />
+        <TextField id="outlined-basic" label="Codigo do Cliente Smart Energia" sx={{width:350, ml:5, mt:2}} onChange={(value) => {
+          setClient({
+            ...client,
+            client_id: value.target.value
+          })
+        }} variant="outlined" />
+        <InputUpload />
+        <br /><br />
+      <FaqButton1  title='Cancelar' onClick={() => console.log()} />
+      <FaqButton2  title='Salvar' onClick={() => handleCreateClient(client)}/>
+      </Box>
+      </Modal>
+      <ConfirmModal open={openModalInativar} handleIsClose={(value) => {setOpenModalInativar(value)}}>
+        <PageTitle title='Excluir Cliente' subtitle='deseja realmente excluir os clientes selecionadas?'/>
+        <ConfirmModalView>
+          <BasicButton title='Confirmar' onClick={() => handleDeleteClient(selectedClients)}/>
+          <BasicButton title='Cancelar' onClick={() => setOpenModalInativar(true)}/>
+        </ConfirmModalView>
+      </ConfirmModal>
+    </div>
+  )
+}
+
+export const getServerSideProps: GetServerSideProps = async (ctx) => {
+  const apiClient = getAPIClient(ctx)
+  const { ['@smartAuth-token']: token } = parseCookies(ctx)
+
+  let clients = [];
+
+  await apiClient.get('/user').then(res => {
+    console.log(res)
+    clients = res.data.data
+    console.log(clients)
+  }).catch(res => {
+    // console.log(res)
+  })
+
+  if (!token) {
+    return {
+      redirect: {
+        destination: '/',
+        permanent: false
+      }
+    }
+  }
+
+  return {
+    props: {
+      clients,
+    }
+  }
+}

src/pages/administrative/faq/index.tsx

@@ -55,6 +55,7 @@ type FaqInterface = {
 }
 export default function Sidebar({faqData} : any ) {
 
+<<<<<<< HEAD
 
   const [openModalInativar, setOpenModalInativar] = useState<boolean>(false)
   const [openSnackSuccess, setOpenSnackSuccess] = useState<boolean>(false);
@@ -103,6 +104,9 @@ export default function Sidebar({faqData} : any ) {
 
   const [selectedfaq, setSelectedfaq] = useState([])
 
+=======
+export default function Sidebar({faqData}: any) {
+>>>>>>> b045a2e541bdcd6882d728bf6a7d600768b93f1d
   async function handleRegisterNewFaq({question, answer}: FaqInterface) {
     await api.post('/faq', {
       "question": question,
@@ -197,16 +201,14 @@ export default function Sidebar({faqData} : any ) {
 export const getServerSideProps: GetServerSideProps = async (ctx) => {
   const apiClient = getAPIClient(ctx)
   const { ['@smartAuth-token']: token } = parseCookies(ctx)
-  console.log('teste')
+
   let faqData = [];
 
-
+  await apiClient.get('/faq').then(res => {
-await apiClient.get('/faq').then(res => {
+    faqData = res.data.data
-  faqData = res.data.data
+  }).catch(res => {
-}).catch(res => {
+    // console.log(res)
-  console.log(res)
+  })
-})
-  console.table(faqData);
 
   if (!token) {
     return {

src/pages/administrative/index.tsx

@@ -10,7 +10,8 @@ import Header from '../../components/header/Header'
 import ConfirmModal from '../../components/modal/ConfirmModal';
 import Modal from '../../components/modal/Modal';
 import PageTitle from '../../components/pageTitle/PageTitle'
-import { ClientsModalView, ClientsView, ConfirmModalView } from '../../styles/layouts/clients/ClientsView'
+import { ClientsModalView, ClientsView } from '../../styles/layouts/clients/ClientsView'
+import { ConfirmModalView } from '../../styles/layouts/modals/confirmModalView';
 
 export default function clients() {
   const [openModal, setOpenModal] = useState(false)
@@ -18,57 +19,6 @@ export default function clients() {
 
   return (
     <div style={{display: 'flex', flexDirection: 'column', width: '100%'}}>
-      <ClientsView>
-        <Header name='' />
-        <PageTitle title='Clientes' subtitle='Clientes Smart Energia'/>
-
-        <section>
-          <BasicButton title='Adicionar' onClick={() => setOpenModal(true)}/>
-          <BasicButton title='Inativar' onClick={() => setOpenModalInativar(true)}/>
-        </section>
-
-        <section>
-          {/* <DataGrid
-            rows={rows}
-            columns={columns}
-            pageSize={6}
-            rowsPerPageOptions={[6]}
-            checkboxSelection
-          /> */}
-          <ClientsTable />
-        </section>
-      </ClientsView>
-
-      <Modal open={openModal} handleIsClose={(value) => {setOpenModal(value)}}>
-        <ClientsModalView>
-          <PageTitle title='Adicionar Cliente' subtitle='Adicionar Cliente Smart Energia'/>
-          <article>
-            <TextField id="outlined-basic" label="Nome" variant="outlined" style={{width: '90%', marginRight: '20px'}}/>
-            <TextField id="outlined-basic" label="email" variant="outlined" style={{width: '90%', marginRight: '20px'}}/>
-            <TextField id="outlined-basic" label="senha" variant="outlined" style={{width: '90%', marginRight: '20px'}}/>
-            <TextField id="outlined-basic" label="código" variant="outlined" style={{width: '90%', marginRight: '20px'}}/>
-            <BasicButton title='Criar Cliente' onClick={() => console.log()}/>
-            <Button
-              variant="contained"
-              component="label"
-              style={{width: '300px'}}
-            >
-              Logo
-              <input
-                type="file"
-                hidden
-              />
-            </Button>
-          </article>
-        </ClientsModalView>
-      </Modal>
-
-      <ConfirmModal open={openModalInativar} handleIsClose={(value) => {setOpenModalInativar(value)}}>
-        <ConfirmModalView>
-          <BasicButton title='Confirmar' onClick={() => setOpenModalInativar(true)}/>
-          <BasicButton title='Cancelar' onClick={() => setOpenModalInativar(true)}/>
-        </ConfirmModalView>
-      </ConfirmModal>
     </div>
   )
 }

src/pages/administrative/notification/index.tsx

@@ -30,7 +30,6 @@ import BasicButton from '../../../components/buttons/basicButton/BasicButton';
 import { ConfirmModalView } from '../../../styles/layouts/modals/confirmModalView';
 import ConfirmModal from '../../../components/modal/ConfirmModal';
 
-
 const style = {
   position: 'absolute' as const,
   top: '50%',
@@ -149,10 +148,10 @@ export default function notification({clients, notifications}) {
       </Snackbar>
 
       <div className='buttons'>
-      <button className='btn2' onClick={handleOpen}>Disparar nova</button>
+        <button className='btn2' onClick={handleOpen}>Disparar nova</button>
-      <button className='btn1' onClick={() => setOpenModalInativar(true)}>Inativar</button>
+        <button className='btn1' onClick={() => setOpenModalInativar(true)}>Inativar</button>
-
       </div>
+
       <NotificationsTable notifications={notifications} onChange={(value) => setSelectedNotifications(value)}/>
       <Modal
           open={open}
@@ -254,13 +253,13 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
   await apiClient.get('/user').then(res => {
     clients = res.data
   }).catch(res => {
-    console.log(res)
+    // console.log(res)
   })
 
   await apiClient.get('/notification').then(res => {
     notifications = res.data.data
   }).catch(res => {
-    console.log(res)
+    // console.log(res)
   })
 
   if (!token) {

src/pages/costIndicator.tsx

@@ -1,4 +1,6 @@
+import { GetServerSideProps } from 'next'
 import Head from 'next/head'
+import { parseCookies } from 'nookies'
 import React from 'react'
 
 import Chart from '../components/graph/Chart'
@@ -7,9 +9,23 @@ import Header from '../components/header/Header'
 import PageTitle from '../components/pageTitle/PageTitle'
 import { dataEconomiaBruta } from '../services/economiaBruta'
 import { dataEconomiaIndicador } from '../services/economiaIndicador'
+import getAPIClient from '../services/ssrApi'
 import { CostIndicatorView } from '../styles/layouts/economy/costIndicator/CostIndicatorView'
 
-export default function CostIndicator() {
+function addMissingMonths(data) {
+  console.log(data[0].mes.slice(1, 1))
+}
+
+function verifyDataByYear(data) {
+  if (data.length === 12)
+    return true
+  else
+    return false
+}
+
+export default function CostIndicator({graphData}: any) {
+  console.log(graphData.filter((value, index) => value.mes.slice(3, 7).includes('2021')).map(value => value.custo_unit))
+
   return (
     <CostIndicatorView>
       <Head>
@@ -18,8 +34,39 @@ export default function CostIndicator() {
       <Header name='' />
       <PageTitle title='Indicador de Custo' subtitle='Valores em R$/MWh'/>
       <section>
-        <Chart title='Indicador de Custo' subtitle='(Valores em R$/MWh)' data1={dataEconomiaIndicador.data1} data2={dataEconomiaIndicador.data2} label={dataEconomiaIndicador.labels} barLabel />
+        <Chart title='Indicador de Custo' subtitle='(Valores em R$/MWh)' data1={graphData.filter((value, index) => value.mes.slice(3, 7).includes('2021'))}
+        data2={graphData.filter((value, index) => value.mes.slice(3, 7).includes('2022'))}
+        label={['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez']} barLabel />
       </section>
     </CostIndicatorView>
   )
 }
+
+export const getServerSideProps: GetServerSideProps = async (ctx) => {
+  const apiClient = getAPIClient(ctx)
+  const { ['@smartAuth-token']: token } = parseCookies(ctx)
+
+  let graphData = [];
+
+  await apiClient.post('/economy/MWh').then(res => {
+    graphData = res.data.data
+    console.log(graphData[0].mes)
+  }).catch(res => {
+    console.log(res)
+  })
+
+  if (!token) {
+    return {
+      redirect: {
+        destination: '/',
+        permanent: false
+      }
+    }
+  }
+
+  return {
+    props: {
+      graphData,
+    }
+  }
+}

src/pages/dashboard.tsx

@@ -32,7 +32,7 @@ export default function Dashboard() {
       <Header name='' />
 
       <PageTitle title='Visão Geral' subtitle='Bem Vindo a Smart Energia' />
-      <Link href={'pld'}>
+      <Link href='pld'>
         <section className="cardsSection" >
           <MapCard title='R$/MWh' subtitle='abril / 22' date='até 10/10' statistic='' imgSource='/moneyIcon.svg' />
           <MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />

src/pages/faq.tsx

@@ -34,16 +34,14 @@ export default function commonQuestions({faqData}) {
 export const getServerSideProps: GetServerSideProps = async (ctx) => {
   const apiClient = getAPIClient(ctx)
   const { ['@smartAuth-token']: token } = parseCookies(ctx)
-  console.log('teste')
   let faqData = [];
 
 
-await apiClient.get('/faq').then(res => {
+  await apiClient.get('/faq').then(res => {
-  faqData = res.data
+    faqData = res.data
-}).catch(res => {
+  }).catch(res => {
-  console.log(res)
+    // console.log(res)
-})
+  })
-  console.table(faqData);
 
   if (!token) {
     return {

src/pages/index.tsx

@@ -91,7 +91,7 @@ export default function Home() {
             label="Password"
           />
         </FormControl>
-        <Link href='verifyEmail' >Esqueceu a senha ?</Link>
+        <Link href='verifyEmail'>Esqueceu a senha ?</Link>
 
         <LoginButton title='ENTRAR' onClick={() => handleSignIn()}/>
 
@@ -101,7 +101,6 @@ export default function Home() {
 
         <p><a href='tel:+55(41) 3012-5900' >+55(41) 3012-5900</a><br/><a href='https://www.energiasmart.com.br' target="_blank" rel="noreferrer" >www.energiasmart.com.br</a></p>
       </LoginContainer>
-
     </LoginView>
   )
 }

src/pages/notifications.tsx

@@ -34,16 +34,14 @@ export default function Notifications({notificationData}: any) {
 export const getServerSideProps: GetServerSideProps = async (ctx) => {
   const apiClient = getAPIClient(ctx)
   const { ['@smartAuth-token']: token } = parseCookies(ctx)
-  console.log('teste')
+
   let notificationData = [];
 
-
+  await apiClient.get('/notification').then(res => {
-await apiClient.get('/notification').then(res => {
+    notificationData = res.data
-  notificationData = res.data
+  }).catch(res => {
-}).catch(res => {
+    // console.log(res)
-  console.log(res)
+  })
-})
-  console.table(notificationData);
 
   if (!token) {
     return {

src/pages/pld/index.tsx

@@ -1,8 +1,10 @@
 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 { useRouter } from 'next/router'
+import { parseCookies } from 'nookies';
 import React, { useEffect, useState } from 'react'
 
 import BasicButton from '../../components/buttons/basicButton/BasicButton';
@@ -13,10 +15,17 @@ import Header from '../../components/header/Header'
 import PageTitle from '../../components/pageTitle/PageTitle';
 import { EconomiaAcumulada } from '../../services/economiaAcumulada';
 import { EvolucaoPld } from '../../services/evolucaoPld';
+import getAPIClient from '../../services/ssrApi';
 import { GoBack, PldGraphView, PldTableView } from '../../styles/layouts/pld/PldView'
 import RenderIf from '../../utils/renderIf'
 
-export default function region() {
+interface pldInterface {
+  tableData: any,
+  graphByHourData: any,
+  graphByMonthData: any
+}
+
+export default function pld({tableData, graphByHourData, graphByMonthData}: pldInterface) {
   const router = useRouter()
   const { region } = router.query
 
@@ -68,97 +77,19 @@ export default function region() {
               </tr>
             </thead>
             <tbody>
-              <tr>
+              {
-                <td className='tg-gceh'>2101</td>
+                tableData.map(data => {
-                <td className='tg-uulg red'>xxxx</td>
+                  return <>
-                <td className='tg-gceh dullRed'>xxxx</td>
+                    <tr>
-                <td className='tg-gceh dullGreen'>xxxx</td>
+                      <td className='tg-gceh'>{data.year_month_formatted}</td>
-                <td className='tg-uulg red'>xxxx</td>
+                      <td className='tg-uulg red'>{data.nordeste}</td>
-              </tr>
+                      <td className='tg-gceh dullRed'>{data.norte}</td>
-              <tr>
+                      <td className='tg-gceh dullGreen'>{data.sudeste}</td>
-                <td className='tg-hq65'>2102</td>
+                      <td className='tg-uulg red'>{data.sul}</td>
-                <td className='tg-0tzy dullGreen'>xxxx</td>
+                    </tr>
-                <td className='tg-hq65 dullRed'>xxxx</td>
+                  </>
-                <td className='tg-hq65 dullGreen'>xxxx</td>
+                })
-                <td className='tg-0tzy dullGreen'>xxxx</td>
+              }
-              </tr>
-              <tr>
-                <td className="tg-gceh">2103</td>
-                <td className="tg-uulg red">xxxx</td>
-                <td className="tg-gceh dullGreen">xxxx</td>
-                <td className="tg-gceh dullRed">xxxx</td>
-                <td className="tg-gceh dullGreen">xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-hq65'>2104</td>
-                <td className='tg-0tzy dullGreen'>xxxx</td>
-                <td className='tg-hq65 dullRed'>xxxx</td>
-                <td className='tg-hq65 dullRed'>xxxx</td>
-                <td className='tg-0tzy dullGreen'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-gceh'>2105</td>
-                <td className='tg-uulg red'>xxxx</td>
-                <td className='tg-gceh dullGreen'>xxxx</td>
-                <td className='tg-gceh dullGreen'>xxxx</td>
-                <td className='tg-uulg red'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-hq65'>2106</td>
-                <td className='tg-0tzy dullGreen'>xxxx</td>
-                <td className='tg-hq65 dullRed'>xxxx</td>
-                <td className='tg-hq65 red'>xxxx</td>
-                <td className='tg-0tzy green'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-gceh'>2107</td>
-                <td className='tg-uulg red'>xxxx</td>
-                <td className='tg-gceh green'>xxxx</td>
-                <td className='tg-gceh dullRed'>xxxx</td>
-                <td className='tg-uulg red'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-hq65'>2108</td>
-                <td className='tg-0tzy dullGreen'>xxxx</td>
-                <td className='tg-hq65 dullGreen'>xxxx</td>
-                <td className='tg-hq65 green'>xxxx</td>
-                <td className='tg-0tzy dullRed'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-gceh'>2109</td>
-                <td className='tg-uulg red'>xxxx</td>
-                <td className='tg-gceh green'>xxxx</td>
-                <td className='tg-gceh dullRed'>xxxx</td>
-                <td className='tg-uulg red'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-hq65'>2110</td>
-                <td className='tg-0tzy red'>xxxx</td>
-                <td className='tg-hq65 green'>xxxx</td>
-                <td className='tg-hq65 red'>xxxx</td>
-                <td className='tg-0tzy red'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-gceh'>2111</td>
-                <td className='tg-uulg red'>xxxx</td>
-                <td className='tg-gceh dullGreen'>xxxx</td>
-                <td className='tg-gceh green'>xxxx</td>
-                <td className='tg-uulg red'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-hq65'>2112</td>
-                <td className='tg-0tzy green'>xxxx</td>
-                <td className='tg-hq65 dullGreen'>xxxx</td>
-                <td className='tg-hq65 dullRed'>xxxx</td>
-                <td className='tg-0tzy dullGreen'>xxxx</td>
-              </tr>
-              <tr>
-                <td className='tg-gceh'>2021</td>
-                <td className='tg-uulg red'>xxxx</td>
-                <td className='tg-gceh dullRed'>xxxx</td>
-                <td className='tg-gceh dullGreen'>xxxx</td>
-                <td className='tg-uulg red'>xxxx</td>
-              </tr>
               <tr>
                 <td className='tg-gceh'>Mín</td>
                 <td className='tg-uulg'>xxxx</td>
@@ -234,3 +165,31 @@ export default function region() {
     </main>
   )
 }
+
+export const getServerSideProps: GetServerSideProps = async (ctx) => {
+  const apiClient = getAPIClient(ctx)
+  const { ['@smartAuth-token']: token } = parseCookies(ctx)
+
+  let tableData = [];
+
+  await apiClient.post('/pld/list').then(res => {
+    tableData = res.data
+  }).catch(res => {
+    console.log(res)
+  })
+
+  if (!token) {
+    return {
+      redirect: {
+        destination: '/',
+        permanent: false
+      }
+    }
+  }
+
+  return {
+    props: {
+      tableData,
+    }
+  }
+}

src/pages/resumoOperacao.tsx

@@ -49,7 +49,7 @@ export default function ResumoOperacao() {
     // data.unidades.map((value) => {
     //   console.log(`olha o valor ${value.name}`)
     // })
-    console.log(unidade)
+    // console.log(unidade)
     console.log(data.unidades.filter((value, index)=> value.value.includes(unidade)))
   }, [month, unidade])
 
@@ -144,15 +144,9 @@ export default function ResumoOperacao() {
         </tbody>
       </table>
       <div className='btn'>
-        {/* <a href={Teste} download="dowload.csv"> */}
-          {/* <BasicButton title='Baixar PDF'  /> */}
-        {/* </a> */}
-
         <CSVLink data={csvData} filename="Arquivo_Teste_Smart_Energia">
 
-        <BasicButton title='Baixar CSV' onClick={function (): void {
+        <BasicButton title='Baixar CSV' onClick={() => console.log()}/>
-          throw new Error('Function not implemented.');
-        }}/>
         </CSVLink>
       </div>
     </TableView>

src/pages/verifyEmail.tsx

@@ -71,7 +71,7 @@ export default function VerifyEmail() {
           <legend className="text">Ou</legend>
         </fieldset>
 
-        <p><a href='tel:+55(41) 3012-5900' >+55(41) 3012-5900</a><br/><a href='https://www.energiasmart.com.br' >www.energiasmart.com.br</a></p>
+        <p><a href='tel:+55(41)3012-5900' >+55(41) 3012-5900</a><br/><a href='https://www.energiasmart.com.br' >www.energiasmart.com.br</a></p>
 
       </VerifyEmailContainer>
     </VerifyEmailView>