add auth and user role
This commit is contained in:
parent
95d33f1ccd
commit
55a206bd3a
@ -40,6 +40,7 @@
|
||||
"install": "^0.13.0",
|
||||
"next": "12.1.6",
|
||||
"nookies": "^2.5.2",
|
||||
"notistack": "^2.0.5",
|
||||
"npm": "^8.10.0",
|
||||
"nprogress": "^0.2.0",
|
||||
"patternomaly": "^1.3.2",
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
import Box from '@mui/material/Box';
|
||||
import Button from '@mui/material/Button';
|
||||
import Modal from '@mui/material/Modal';
|
||||
import Stack from '@mui/material/Stack';
|
||||
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, { useEffect, useState } from 'react'
|
||||
|
||||
import RenderIf from '../../utils/renderIf';
|
||||
@ -34,9 +35,9 @@ export default function Sidebar() {
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const user = {
|
||||
role: 'admin'
|
||||
}
|
||||
const { ['user-role']: role } = parseCookies()
|
||||
|
||||
console.log(role)
|
||||
|
||||
useEffect(() => {
|
||||
setViewModal(false)
|
||||
@ -44,7 +45,7 @@ export default function Sidebar() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<RenderIf isTrue={user.role === 'admin'}>
|
||||
<RenderIf isTrue={role === '1'}>
|
||||
<SidebarView economiaDrawer={economiaDrawer} modalOpen={viewModal} >
|
||||
<div className='hamburger' onClick={() => setViewModal(!viewModal)} >
|
||||
<Image src='/assets/hamburgerModal.svg' width={60} height={60} />
|
||||
@ -57,22 +58,6 @@ export default function Sidebar() {
|
||||
<Link href='/administrative/general'><li className={router.pathname=='/administrative/general'? 'actualPath' : null} ><Image src='/assets/sidebar/dashboardIcon.svg' width={25} height={25} />{'Visão Geral'}</li></Link>
|
||||
<Link href='/administrative/faq'><li className={router.pathname=='/administrative/faq' ? 'actualPath' : null } ><Image src='/assets/sidebar/saqIcon.svg' width={25} height={25} />{'FAQ >'}</li></Link>
|
||||
<Link href='/administrative/notification'><li className={router.pathname=='/administrative/notifications'? 'actualPath' : null}><Image src='/assets/sidebar/notificationsIcon.svg' width={25} height={25} />{'Notificações >'}<div className='notification'><p>25</p></div></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='/administrative/grossSavings'><li className={router.pathname=='/grossSavings'? 'actualPathDrawer' : null}>Economia Bruta</li></Link>
|
||||
<Link href='/administrative/accumulatedSavings'><li className={router.pathname=='/accumulatedSavings'? 'actualPathDrawer' : null}>Economia Acumulada</li></Link>
|
||||
<Link href='/administrative/estimatedCost'><li className={router.pathname=='/estimatedCost'? 'actualPathDrawer' : null}>Custo Estimado</li></Link>
|
||||
<Link href='/administrative/costIndicator'><li className={router.pathname=='/costIndicator'? 'actualPathDrawer' : null}>Custo R/MWh</li></Link>
|
||||
</div> */}
|
||||
{/* <Link href='/administrative/telemetria'><li className={router.pathname=='/telemetria'? 'actualPath' : null}><Image src='/assets/sidebar/telemetryIcon.svg' width={25} height={25} />{'Telemetria >'}</li></Link>
|
||||
<Link href='/administrative/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='/administrative/news'><li className={router.pathname=='/news'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'Notícias >'}</li></Link>
|
||||
<Link href='/administrative/pld'><li className={router.pathname=='/pld'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'PLD >'}</li></Link>
|
||||
<Link href='/administrative/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='/administrative/notifications'><li className={router.pathname=='/notifications'? 'actualPath' : null}><Image src='/assets/sidebar/notificationsIcon.svg' width={25} height={25} />{'Notificações >'}<div className='notification'><p>25</p></div></li></Link>
|
||||
<Link href='/administrative/aboutUs'><li className={router.pathname=='/aboutUs'? 'actualPath' : null}><Image src='/assets/sidebar/aboutUs.svg' width={25} height={25} />{'Sobre Nós >'}</li></Link>
|
||||
<Link href='/administrative/faq'><li className={router.pathname=='/faq'? 'actualPath' : null}><Image src='/assets/sidebar/saqIcon.svg' width={25} height={25} />{'FAQ >'}</li></Link> */}
|
||||
<button onClick={handleOpen}><Image src='/assets/logout.svg' width={25} height={25} />{'Sair'}</button>
|
||||
<Modal
|
||||
open={open}
|
||||
@ -95,7 +80,7 @@ export default function Sidebar() {
|
||||
</aside>
|
||||
</SidebarView>
|
||||
</RenderIf>
|
||||
<RenderIf isTrue={user.role === 'client'}>
|
||||
<RenderIf isTrue={role === '2'}>
|
||||
<SidebarView economiaDrawer={economiaDrawer} modalOpen={viewModal} >
|
||||
<div className='hamburger' onClick={() => setViewModal(!viewModal)} >
|
||||
<Image src='/assets/hamburgerModal.svg' width={60} height={60} />
|
||||
|
||||
@ -40,7 +40,7 @@ export function AuthProvider({children}: {children: React.ReactNode}) {
|
||||
maxAge: 60 * 60 * 1, // 1 hour
|
||||
})
|
||||
|
||||
// setCookie(undefined, 'user-role', user.role)
|
||||
setCookie(undefined, 'user-role', user.role)
|
||||
|
||||
api.defaults.headers['Authorization'] = `Bearer ${token}`
|
||||
|
||||
|
||||
@ -25,8 +25,8 @@ import getAPIClient from '../../../services/ssrApi';
|
||||
import { GetServerSideProps } from 'next';
|
||||
import { parseCookies } from 'nookies';
|
||||
import Notifications from '../../notifications';
|
||||
import Snackbar from '@mui/material/Snackbar/Snackbar';
|
||||
import Alert from '@mui/material/Alert/Alert';
|
||||
import Snackbar from '@mui/material/Snackbar';
|
||||
import MuiAlert, { AlertProps } from '@mui/material/Alert';
|
||||
|
||||
const style = {
|
||||
position: 'absolute' as const,
|
||||
@ -42,6 +42,13 @@ const style = {
|
||||
overflowY: 'scroll'
|
||||
};
|
||||
|
||||
const Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(
|
||||
props,
|
||||
ref,
|
||||
) {
|
||||
return <MuiAlert elevation={6} ref={ref} variant="filled" {...props} />;
|
||||
});
|
||||
|
||||
const icon = <CheckBoxOutlineBlankIcon fontSize="small" />;
|
||||
const checkedIcon = <CheckBoxIcon fontSize="small" />;
|
||||
|
||||
@ -68,6 +75,15 @@ export default function notification({clients, notifications}) {
|
||||
const handleOpen = () => setOpen(true);
|
||||
const handleClose = () => setOpen(false);
|
||||
|
||||
const handleCloseSnack = (event?: React.SyntheticEvent | Event, reason?: string) => {
|
||||
if (reason === 'clickaway') {
|
||||
return;
|
||||
}
|
||||
|
||||
setOpenSnackError(false);
|
||||
};
|
||||
|
||||
|
||||
async function handleRegisterNewNotification({title, body, users}: NotificationInterface) {
|
||||
await api.post('/notification', {
|
||||
title,
|
||||
@ -84,6 +100,17 @@ export default function notification({clients, notifications}) {
|
||||
<Header name=''/>
|
||||
<PageTitle title='Notificações' subtitle='Notificações'/>
|
||||
|
||||
<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>
|
||||
|
||||
<div className='buttons'>
|
||||
<button className='btn2' onClick={handleOpen}>Disparar nova</button>
|
||||
|
||||
@ -168,16 +195,6 @@ export default function notification({clients, notifications}) {
|
||||
</Box>
|
||||
</Modal>
|
||||
<NotificationsTable notifications={notifications}/>
|
||||
<Snackbar open={openSnackSuccess} autoHideDuration={6000} onClose={handleClose}>
|
||||
<Alert onClose={handleClose} severity="success" sx={{ width: '100%' }}>
|
||||
This is a success message!
|
||||
</Alert>
|
||||
</Snackbar>
|
||||
<Snackbar open={openSnackError} autoHideDuration={6000} onClose={handleClose}>
|
||||
<Alert onClose={handleClose} severity="error" sx={{ width: '100%' }}>
|
||||
This is a success message!
|
||||
</Alert>
|
||||
</Snackbar>
|
||||
</FaqView>
|
||||
)
|
||||
}
|
||||
|
||||
@ -27,12 +27,13 @@ export async function signInRequest(data: SignInRequestData) {
|
||||
"password": data.password,
|
||||
"device_name": "test"
|
||||
}).then(res => {
|
||||
// console.log(res.data.user.roles.pivot.role_id)
|
||||
user = {
|
||||
name: res.data.user.name,
|
||||
email: res.data.user.email,
|
||||
client_id: res.data.user.client_id,
|
||||
id: res.data.user.id,
|
||||
role: res.data.user.roles.role_id
|
||||
role: res.data.user.roles[0].pivot.role_id
|
||||
}
|
||||
token = res.data.token
|
||||
}).catch(res => {
|
||||
@ -40,8 +41,14 @@ export async function signInRequest(data: SignInRequestData) {
|
||||
})
|
||||
|
||||
return {
|
||||
token,
|
||||
user
|
||||
token: token,
|
||||
user: {
|
||||
name: user?.name,
|
||||
email: user?.email,
|
||||
client_id: user?.client_id,
|
||||
id: user?.id,
|
||||
role: user?.role
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -55,13 +62,18 @@ export default async function recoverUserInformation(id) {
|
||||
email: res.data.user.email,
|
||||
client_id: res.data.user.client_id,
|
||||
id: res.data.user.id,
|
||||
role: res.data.user.roles.role_id
|
||||
role: res.data.user.roles[0].pivot.role_id
|
||||
}
|
||||
}).catch(res => {
|
||||
console.log(res)
|
||||
})
|
||||
|
||||
return {
|
||||
user
|
||||
user: {
|
||||
name: user?.name,
|
||||
email: user?.email,
|
||||
client_id: user?.client_id,
|
||||
id: user?.id
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1994,7 +1994,7 @@ clone@^1.0.2:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/clone/-/clone-1.0.4.tgz#da309cc263df15994c688ca902179ca3c7cd7c7e"
|
||||
|
||||
clsx@^1.0.4, clsx@^1.1.1:
|
||||
clsx@^1.0.4, clsx@^1.1.0, clsx@^1.1.1:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz"
|
||||
|
||||
@ -3616,6 +3616,13 @@ normalize-path@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz"
|
||||
|
||||
notistack@^2.0.5:
|
||||
version "2.0.5"
|
||||
resolved "https://registry.yarnpkg.com/notistack/-/notistack-2.0.5.tgz#8eb53720453f6e02182cd0e6784ced630a7bb7e6"
|
||||
dependencies:
|
||||
clsx "^1.1.0"
|
||||
hoist-non-react-statics "^3.3.0"
|
||||
|
||||
npm-audit-report@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/npm-audit-report/-/npm-audit-report-3.0.0.tgz#1bf3e531208b5f77347c8d00c3d9badf5be30cd6"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user