From 48f5c58f4a4025a122401581c58ed4ce2b5341fa Mon Sep 17 00:00:00 2001 From: Mariela Date: Thu, 11 Aug 2022 00:55:45 -0600 Subject: [PATCH] login for user type --- web-ui/web-react/src/App.js | 183 ++++++++++-------- web-ui/web-react/src/AppMenu.js | 5 +- web-ui/web-react/src/AppTopbar.js | 13 ++ .../src/components/LoginLocalStorage.js | 4 + web-ui/web-react/src/components/MenuAdmin.js | 5 + .../src/components/MenuAdminCommunity.js | 119 ++++++++++++ web-ui/web-react/src/index.js | 4 +- web-ui/web-react/src/routes/Routes.js | 29 ++- 8 files changed, 273 insertions(+), 89 deletions(-) create mode 100644 web-ui/web-react/src/components/MenuAdminCommunity.js diff --git a/web-ui/web-react/src/App.js b/web-ui/web-react/src/App.js index 349d6c11..b7c804b0 100644 --- a/web-ui/web-react/src/App.js +++ b/web-ui/web-react/src/App.js @@ -1,6 +1,6 @@ import React, { useState, useEffect, useRef } from 'react'; import classNames from 'classnames'; -import { Route, useLocation } from 'react-router-dom'; +import { BrowserRouter, Switch, Route, useLocation } from 'react-router-dom'; import { CSSTransition } from 'react-transition-group'; import { AppTopbar } from './AppTopbar'; @@ -50,6 +50,10 @@ import './assets/demo/Demos.scss'; import './assets/layout/layout.scss'; import './App.scss'; import LogIn from './components/LogIn'; +import { useCookies } from "react-cookie"; +import LoginLocalStorage from './components/LoginLocalStorage'; + + const App = () => { const [layoutMode, setLayoutMode] = useState('static'); @@ -62,8 +66,9 @@ const App = () => { const [mobileTopbarMenuActive, setMobileTopbarMenuActive] = useState(false); const copyTooltipRef = useRef(); const location = useLocation(); + const [cookies, setCookies] = useCookies(); - const handleLogout=()=>{ + const handleLogout = () => { localStorage.clear(); window.location.reload(); } @@ -117,24 +122,6 @@ const App = () => { } const onToggleMenuClick = (event) => { - menuClick = true; - - if (isDesktop()) { - if (layoutMode === 'overlay') { - if (mobileMenuActive === true) { - setOverlayMenuActive(true); - } - - setOverlayMenuActive((prevState) => !prevState); - setMobileMenuActive(false); - } - else if (layoutMode === 'static') { - setStaticMenuInactive((prevState) => !prevState); - } - } - else { - setMobileMenuActive((prevState) => !prevState); - } event.preventDefault(); } @@ -166,18 +153,50 @@ const App = () => { return window.innerWidth >= 992; } + const menu2 = [ + { + label: 'Home', + items: [ + { label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/' }, + { label: 'Administradores del sistema', icon: 'pi pi-fw pi-id-card', to: '/administradoresSistema' }, + { label: 'Administradores de comunidad', icon: 'pi pi-fw pi-id-card', to: '/administradoresComunidad' }, + { label: 'Comunidadades', icon: 'pi pi-fw pi-id-card', to: '/comunidadesViviendas' }, + ] + } + ] + + + const menu3 = [ + { + label: 'Home', + items: [ + { label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/' }, + { label: 'Inquilinos', icon: 'pi pi-fw pi-id-card', to: '/inquilinos' }, + { label: 'Guardas de seguridad', icon: 'pi pi-fw pi-id-card', to: '/guardasSeguridad' }, + ] + }, + ] + + function menu4() { + if (cookies.type == '1') { + return menu2; + } else if (cookies.type == '2') { + return menu3; + } + } + const menu = [ { label: 'Home', items: [ - {label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/'}, - {label: 'Administradores del sistema', icon: 'pi pi-fw pi-id-card', to: '/administradoresSistema'}, - {label: 'Administradores de comunidad', icon: 'pi pi-fw pi-id-card', to: '/administradoresComunidad'}, - {label: 'Guardas de seguridad', icon: 'pi pi-fw pi-id-card', to: '/guardasSeguridad'}, - {label: 'Comunidadades', icon: 'pi pi-fw pi-id-card', to: '/comunidadesViviendas'}, - {label: 'Inquilinos', icon: 'pi pi-fw pi-id-card', to: '/inquilinos'}, - {label: 'Log in', icon: 'pi pi-fw pi-id-card', to: '/logIn'}, - {label: 'Log out', icon: 'pi pi-fw pi-id-card', to: '/logOut'} + { label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/' }, + { label: 'Administradores del sistema', icon: 'pi pi-fw pi-id-card', to: '/administradoresSistema' }, + { label: 'Administradores de comunidad', icon: 'pi pi-fw pi-id-card', to: '/administradoresComunidad' }, + { label: 'Guardas de seguridad', icon: 'pi pi-fw pi-id-card', to: '/guardasSeguridad' }, + { label: 'Comunidadades', icon: 'pi pi-fw pi-id-card', to: '/comunidadesViviendas' }, + { label: 'Inquilinos', icon: 'pi pi-fw pi-id-card', to: '/inquilinos' }, + { label: 'Log in', icon: 'pi pi-fw pi-id-card', to: '/logIn' }, + { label: 'Log out', icon: 'pi pi-fw pi-id-card', to: '/logOut' } ] }, { @@ -282,7 +301,6 @@ const App = () => { else element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); } - const wrapperClass = classNames('layout-wrapper', { 'layout-overlay': layoutMode === 'overlay', 'layout-static': layoutMode === 'static', @@ -295,60 +313,69 @@ const App = () => { }); return ( -
- - + + + -
- -
+
+ -
-
- } /> - - - - - - - - - - - - - - - - - } /> - - - - - - - - - - - - + + +
+ +
+ +
+
+ + } /> + + + + + + + + + + + + + + {/**/} + + + } /> + + + + + + + + + + + + +
+ + +
+ + + + +
+
+ + - -
- - - - -
- -
); } diff --git a/web-ui/web-react/src/AppMenu.js b/web-ui/web-react/src/AppMenu.js index 7ee0e07e..7c81bc73 100644 --- a/web-ui/web-react/src/AppMenu.js +++ b/web-ui/web-react/src/AppMenu.js @@ -109,10 +109,7 @@ export const AppMenu = (props) => { return (
- - primeblocks - +
); } diff --git a/web-ui/web-react/src/AppTopbar.js b/web-ui/web-react/src/AppTopbar.js index 40e350b1..02c59e06 100644 --- a/web-ui/web-react/src/AppTopbar.js +++ b/web-ui/web-react/src/AppTopbar.js @@ -1,9 +1,21 @@ import React from 'react'; import { Link } from 'react-router-dom'; import classNames from 'classnames'; +import Cookies from 'universal-cookie'; + +const cookies = new Cookies(); export const AppTopbar = (props) => { + function cerrarSesion() { + cookies.remove('id', { path: "/" }); + cookies.remove('email', { path: "/" }); + cookies.remove('name', { path: "/" }); + cookies.remove('type', { path: "/" }); + cookies.remove('community_id', { path: "/" }); + window.location.href = '/login'; + } + return (
@@ -37,6 +49,7 @@ export const AppTopbar = (props) => { Profile +
diff --git a/web-ui/web-react/src/components/LoginLocalStorage.js b/web-ui/web-react/src/components/LoginLocalStorage.js index 2fe0332f..4e3fa806 100644 --- a/web-ui/web-react/src/components/LoginLocalStorage.js +++ b/web-ui/web-react/src/components/LoginLocalStorage.js @@ -52,6 +52,10 @@ class LoginLocalStorage extends Component { cookies.set('id', user._id, { path: "/" }); cookies.set('name', user.name, { path: "/" }); cookies.set('email', user.email, { path: "/" }); + cookies.set('type', user.user_type, { path: "/" }); + if(user.user_type != '1') { + cookies.set('community_id', user.community_id, { path: "/" }); + } alert(`Bienvenido ${user.name}`); window.location.href = "/"; } else { diff --git a/web-ui/web-react/src/components/MenuAdmin.js b/web-ui/web-react/src/components/MenuAdmin.js index e22ef17d..334ccf04 100644 --- a/web-ui/web-react/src/components/MenuAdmin.js +++ b/web-ui/web-react/src/components/MenuAdmin.js @@ -6,6 +6,7 @@ import Communities from '../components/ComunidadViviendas'; import Dashboard from '../templates/Dashboard'; import { BrowserRouter, Switch, Route } from 'react-router-dom'; import { AppMenu } from '../AppMenu'; +import { CSSTransition } from 'react-transition-group'; const cookies = new Cookies(); @@ -59,6 +60,7 @@ class MenuAdmin extends Component { cookies.remove('id', { path: "/" }); cookies.remove('email', { path: "/" }); cookies.remove('name', { path: "/" }); + cookies.remove('type', { path: "/" }); window.location.href = '/login'; } @@ -89,6 +91,9 @@ class MenuAdmin extends Component {

+ +
+ ); } diff --git a/web-ui/web-react/src/components/MenuAdminCommunity.js b/web-ui/web-react/src/components/MenuAdminCommunity.js new file mode 100644 index 00000000..db982561 --- /dev/null +++ b/web-ui/web-react/src/components/MenuAdminCommunity.js @@ -0,0 +1,119 @@ +import React, { Component } from 'react'; +import Cookies from 'universal-cookie'; +import Inquilinos from './Inquilinos'; +import GuardasSeguridad from './GuardasSeguridad'; +import Dashboard from '../templates/Dashboard'; +import { BrowserRouter, Switch, Route } from 'react-router-dom'; +import { AppMenu } from '../AppMenu'; + +const cookies = new Cookies(); + +const menu = [ + { + label: 'Home', + items: [ + { label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/' }, + { label: 'Inquilinos', icon: 'pi pi-fw pi-id-card', to: '/inquilinos' }, + { label: 'Guardas de seguridad', icon: 'pi pi-fw pi-id-card', to: '/guardasSeguridad' }, + ] + }, +]; + +class MenuAdminCommunity extends Component { + + constructor() { + super() + this.state = { + layoutColorMode: 'light', + layoutMode: 'static', + menuClick: false, + mobileTopbarMenuClick: false, + overlayMenuActive: false, + mobileMenuActive: false + } + + } + + onSidebarClick = () => { + this.setState({ + menuClick: true + }) + + } + + onMenuItemClick = (event) => { + if (!event.item.items) { + this.setState({ + overlayMenuActive: false, + mobileMenuActive: false + }) + + } + } + + cerrarSesion = () => { + cookies.remove('id', { path: "/" }); + cookies.remove('email', { path: "/" }); + cookies.remove('name', { path: "/" }); + cookies.remove('type', { path: "/" }); + cookies.remove('community_id', { path: "/" }); + window.location.href = '/login'; + } + + componentDidMount() { + if (!cookies.get('email')) { + window.location.href = "/login"; + } + } + + + onWrapperClick = (event) => { + if (!this.state.menuClick) { + this.setState({ + overlayMenuActive: false, + mobileMenuActive: false + }) + } + + if (!this.state.mobileTopbarMenuClick) { + this.setState({ + mobileTopbarMenuClick: false, + }) + } + + this.setState({ + mobileTopbarMenuClick: false, + menuClick: false + }) + } + + render() { + + return ( + +
+ +
+ Menu Principal +
+ + + +
+ +
+
+ } /> + + +
+ +
+
+
+
+ ); + } +} + +export default MenuAdminCommunity; \ No newline at end of file diff --git a/web-ui/web-react/src/index.js b/web-ui/web-react/src/index.js index 3e9cb72d..61aad4f9 100644 --- a/web-ui/web-react/src/index.js +++ b/web-ui/web-react/src/index.js @@ -3,7 +3,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; //import * as serviceWorker from './serviceWorker'; -import { HashRouter, Route } from 'react-router-dom' +import { HashRouter, Route, Router } from 'react-router-dom' import ScrollToTop from './ScrollToTop'; import Routes from './routes/Routes'; @@ -12,7 +12,7 @@ import Routes from './routes/Routes'; ReactDOM.render( - + , document.getElementById('root') diff --git a/web-ui/web-react/src/routes/Routes.js b/web-ui/web-react/src/routes/Routes.js index bebacd7b..cb0800ec 100644 --- a/web-ui/web-react/src/routes/Routes.js +++ b/web-ui/web-react/src/routes/Routes.js @@ -1,17 +1,36 @@ -import React from 'react'; -import {BrowserRouter, Switch, Route} from 'react-router-dom'; +import React, { useEffect, useRef } from 'react'; +import { BrowserRouter, Switch, Route } from 'react-router-dom'; import App from '../App'; import LoginLocalStorage from '../components/LoginLocalStorage'; import MenuAdmin from '../components/MenuAdmin'; import Menu from '../pages/Menu'; +import MenuAdminCommunity from '../components/MenuAdminCommunity'; +import { useCookies } from "react-cookie"; + + function Routes() { - + const [cookies, setCookies] = useCookies(); + + + function getMenu() { + console.log(cookies.type) + switch(cookies.type) { + case '1': + return + case '2': + return + + } + } + + return ( - - + + + );