diff --git a/package.json b/package.json index 8db45c3..5d02330 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "@mui/material": "^5.6.4", "@mui/x-data-grid": "^5.11.0", "@mui/x-date-pickers": "^5.0.0-alpha.3", + "@types/react-csv": "^1.1.2", "@typescript-eslint/eslint-plugin": "^5.22.0", "@typescript-eslint/parser": "^5.22.0", "chart.js": "^3.7.1", @@ -40,6 +41,7 @@ "react": "18.1.0", "react-calendar": "^3.7.0", "react-chartjs-2": "^4.1.0", + "react-csv": "^2.2.2", "react-dom": "18.1.0", "react-icons": "^4.3.1", "styled-components": "^5.3.5" diff --git a/src/components/buttons/basicButton/BasicButtonView.ts b/src/components/buttons/basicButton/BasicButtonView.ts index 26f514a..f086fa0 100644 --- a/src/components/buttons/basicButton/BasicButtonView.ts +++ b/src/components/buttons/basicButton/BasicButtonView.ts @@ -4,7 +4,7 @@ export const BasicButtonView = styled.button` display: flex; justify-content: center; align-items: center; - margin-top: 10px; + margin-top: 1px; width: 140px; height: 45px; diff --git a/src/components/buttons/gradientButton/GradientButtonView.ts b/src/components/buttons/gradientButton/GradientButtonView.ts index 84a3c0a..eec6e29 100644 --- a/src/components/buttons/gradientButton/GradientButtonView.ts +++ b/src/components/buttons/gradientButton/GradientButtonView.ts @@ -21,9 +21,9 @@ export const GradientButtonView = styled.button` 'linear-gradient(200.86deg, #F48665 8.03%, #F48665 91.97%), #FFFFFF' : props.color === 'purple'? - 'linear-gradient(200.69deg, #9A56FF 8.53%, #D78AFD 91.47%), #FFFFFF' + 'linear-gradient(200.69deg, #9A56FF 9%, #D78AFD 98%), #FFFFFF' : - 'linear-gradient(200.69deg, #23BDB8 8.53%, #43E794 91.47%), #FFFFFF' + 'linear-gradient(200.69deg, #23BDB8 8.53%, #43E794 98%), #FFFFFF' }; box-shadow: 0.5px 3px 10px rgba(119, 119, 119, 0.1); diff --git a/src/components/sidebar/Sidebar.tsx b/src/components/sidebar/Sidebar.tsx index b073e5a..2fc0bfd 100644 --- a/src/components/sidebar/Sidebar.tsx +++ b/src/components/sidebar/Sidebar.tsx @@ -2,10 +2,33 @@ import React, { useState, useEffect } from 'react' import { useRouter } from 'next/router' import Image from 'next/image' import Link from 'next/link' +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; +import Modal from '@mui/material/Modal'; +import Stack from '@mui/material/Stack'; + + import { SidebarView } from './SidebarView' +const style = { + position: 'absolute' as 'absolute', + top: '50%', + left: '50%', + transform: 'translate(-50%, -50%)', + width: 400, + bgcolor: 'background.paper', + border: '2px solid #000', + boxShadow: 24, + p: 4, +}; + export default function Sidebar() { + const [open, setOpen] = React.useState(false); + const handleOpen = () => setOpen(true); + const handleClose = () => setOpen(false); + const [ economiaDrawer, setEconomiaDrawer ] = useState(false) const [ viewModal, setViewModal ] = useState(false) @@ -36,12 +59,27 @@ export default function Sidebar() {
  • {'Telemetria >'}
  • {'Resumo de Op. '}
  • {'Notícias >'}
    • +
  • {'PLD >'}
  • {'Info Setorial >'}
    • {/*
  • {'Consumo'}
    • */}
  • {'Notificações >'}
  • {'Sobre Nós >'}
  • {'FAQ >'}
    • - + + + + + Deseja realmente sair ? + + + + +