Title Reactive Done
parent
3c966bb346
commit
a6d380862f
|
@ -1,7 +1,6 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import PageTitle from "../../PageTitle/PageTitle";
|
import PageTitle from "../../PageTitle/PageTitle";
|
||||||
|
|
||||||
|
|
||||||
import MainContainerStyled, {
|
import MainContainerStyled, {
|
||||||
TitleContainerStyled,
|
TitleContainerStyled,
|
||||||
ContentContainerStyled,
|
ContentContainerStyled,
|
||||||
|
|
|
@ -63,7 +63,7 @@ const MenuComponent = () => {
|
||||||
<MenuItem icon={<Tickets />} text="Tickets" to="/tickets" hover={hover} />
|
<MenuItem icon={<Tickets />} text="Tickets" to="/tickets" hover={hover} />
|
||||||
<MenuItem icon={<Contact />} text="Contatos" to="/contacts" hover={hover} />
|
<MenuItem icon={<Contact />} text="Contatos" to="/contacts" hover={hover} />
|
||||||
<MenuItem icon={<Reminder />} text="Lembretes" to="/schedulesReminder" hover={hover} />
|
<MenuItem icon={<Reminder />} text="Lembretes" to="/schedulesReminder" hover={hover} />
|
||||||
<MenuItem icon={<FastAanswer />} text="Respostas" to="" hover={hover} />
|
<MenuItem icon={<FastAanswer />} text="Respostas" to="/quickAnswers" hover={hover} />
|
||||||
<Divider />
|
<Divider />
|
||||||
<MenuItem icon={<Users />} text="Usuários" to="/users" hover={hover} />
|
<MenuItem icon={<Users />} text="Usuários" to="/users" hover={hover} />
|
||||||
<MenuItem icon={<Rows />} text="Filas" to="/Queues" hover={hover} />
|
<MenuItem icon={<Rows />} text="Filas" to="/Queues" hover={hover} />
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
import { useLocation } from "react-router-dom";
|
||||||
import { PageTitleStyled } from "./PageTitle.style";
|
import { PageTitleStyled } from "./PageTitle.style";
|
||||||
|
|
||||||
import UserBtn from "./UserBtn/UserBtn";
|
import UserBtn from "./UserBtn/UserBtn";
|
||||||
|
@ -7,15 +8,57 @@ import { AuthContext } from "../../context/Auth/AuthContext";
|
||||||
import logo from "../../assets/images/Logo.png";
|
import logo from "../../assets/images/Logo.png";
|
||||||
|
|
||||||
const PageTitle = () => {
|
const PageTitle = () => {
|
||||||
|
const path = useLocation();
|
||||||
|
const [title,setTitle] = React.useState()
|
||||||
const [modal, setModal] = React.useState(false);
|
const [modal, setModal] = React.useState(false);
|
||||||
const { user } = React.useContext(AuthContext);
|
const { user } = React.useContext(AuthContext);
|
||||||
|
|
||||||
|
|
||||||
|
console.log(path.pathname);
|
||||||
|
|
||||||
|
React.useEffect(()=>{
|
||||||
|
switch (path.pathname) {
|
||||||
|
case "/tickets":
|
||||||
|
setTitle("Tickets");
|
||||||
|
break;
|
||||||
|
case "/contacts":
|
||||||
|
setTitle("Contatos");
|
||||||
|
break;
|
||||||
|
case "/schedulesReminder":
|
||||||
|
setTitle("Lembretes");
|
||||||
|
break;
|
||||||
|
case "/quickAnswers":
|
||||||
|
setTitle("Respostas Rápidas");
|
||||||
|
break;
|
||||||
|
case "/users":
|
||||||
|
setTitle("Usuários");
|
||||||
|
break;
|
||||||
|
case "/Queues":
|
||||||
|
setTitle("Filas");
|
||||||
|
break;
|
||||||
|
case "/connections":
|
||||||
|
setTitle("Conexões");
|
||||||
|
break;
|
||||||
|
case "/report":
|
||||||
|
setTitle("Relatórios");
|
||||||
|
break;
|
||||||
|
case "/super":
|
||||||
|
setTitle("Supervisão");
|
||||||
|
break;
|
||||||
|
case "/Settings":
|
||||||
|
setTitle("Configurações");
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
setTitle("Dashboard");
|
||||||
|
}
|
||||||
|
},[path])
|
||||||
|
|
||||||
const handleModal = () => {
|
const handleModal = () => {
|
||||||
setModal(!modal);
|
setModal(!modal);
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<PageTitleStyled>
|
<PageTitleStyled>
|
||||||
<h1>PageTitle</h1>
|
<h1>{title}</h1>
|
||||||
<UserBtn user={user} img={logo} modal={modal} modalSet={handleModal} />
|
<UserBtn user={user} img={logo} modal={modal} modalSet={handleModal} />
|
||||||
</PageTitleStyled>
|
</PageTitleStyled>
|
||||||
);
|
);
|
||||||
|
|
|
@ -15,12 +15,9 @@ import UserImg from "../../assets/images/User/user.jpg";
|
||||||
|
|
||||||
const UserModal = ({ modal, click }) => {
|
const UserModal = ({ modal, click }) => {
|
||||||
const { user } = React.useContext(AuthContext);
|
const { user } = React.useContext(AuthContext);
|
||||||
|
const InitalState = { name: user.name, email: user.email, profile: user.profile };
|
||||||
|
const [userData, setUserData] = React.useState(InitalState);
|
||||||
|
|
||||||
const initalData = {
|
|
||||||
name: user.name,
|
|
||||||
email: user.email,
|
|
||||||
perfil:user.profile,
|
|
||||||
}
|
|
||||||
console.log(user);
|
console.log(user);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -28,8 +25,20 @@ const UserModal = ({ modal, click }) => {
|
||||||
<UserModalStyled>
|
<UserModalStyled>
|
||||||
<UserModalComponent img={UserImg} desc="Clique na imagem para alterar" />
|
<UserModalComponent img={UserImg} desc="Clique na imagem para alterar" />
|
||||||
<FormComponent method="get">
|
<FormComponent method="get">
|
||||||
<InputComponent id="nome" label="Nome" type="text" value={initalData.name}/>
|
<InputComponent
|
||||||
<InputComponent id="email" label="E-mail" type="email" value={initalData.email}/>
|
id="nome"
|
||||||
|
label="Nome"
|
||||||
|
type="text"
|
||||||
|
value={userData.name}
|
||||||
|
onChange={(event) => setUserData({name:event.target.data})}
|
||||||
|
/>
|
||||||
|
<InputComponent
|
||||||
|
id="email"
|
||||||
|
label="E-mail"
|
||||||
|
type="email"
|
||||||
|
value={userData.email}
|
||||||
|
onChange={(event) => setUserData({email:event.target.data})}
|
||||||
|
/>
|
||||||
<InputComponent id="password" label="Senha" type="password" />
|
<InputComponent id="password" label="Senha" type="password" />
|
||||||
<UserBtns>
|
<UserBtns>
|
||||||
<BtnComponent text="Cancelar" onClick={click} />
|
<BtnComponent text="Cancelar" onClick={click} />
|
||||||
|
|
|
@ -8,11 +8,7 @@ import MenuComponent from "../components/Menu/MenuComponent";
|
||||||
|
|
||||||
const LoggedInLayout = ({ children }) => {
|
const LoggedInLayout = ({ children }) => {
|
||||||
const { handleLogout, loading, isAuth } = React.useContext(AuthContext);
|
const { handleLogout, loading, isAuth } = React.useContext(AuthContext);
|
||||||
const logout = (e) => {
|
|
||||||
handleLogout();
|
|
||||||
};
|
|
||||||
const { user } = React.useContext(AuthContext);
|
|
||||||
console.log(user.name);
|
|
||||||
|
|
||||||
if (loading) {
|
if (loading) {
|
||||||
return <Loading />;
|
return <Loading />;
|
||||||
|
|
Loading…
Reference in New Issue