Atualizações de login
This commit is contained in:
Eduarda-SS
parent
cb2f12ae8d
commit
cf11b2aaf5
27
src/App.js
27
src/App.js
@ -1,15 +1,19 @@
|
||||
// src/App.js
|
||||
//import PerfilSecretaria from "./perfis/perfil_secretaria/PerfilSecretaria";
|
||||
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
||||
import { useState } from "react";
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import Login from "./pages/Login";
|
||||
import Register from "./pages/Register";
|
||||
import Forgot from "./pages/ForgotPassword";
|
||||
import PerfilSecretaria from "./perfis/perfil_secretaria/PerfilSecretaria";
|
||||
import LandingPage from './pages/LandingPage';
|
||||
// Mantenha todas as importações de CSS globais aqui se houver!
|
||||
// import './App.css';
|
||||
// import './index.css';
|
||||
|
||||
function App() {
|
||||
// O estado controla qual view mostrar: false = Landing Page, true = Dashboard
|
||||
const [isInternalView, setIsInternalView] = useState(false);
|
||||
// const [isSecretaria, setIsSecretaria] = useState(false);
|
||||
|
||||
const handleEnterSystem = () => {
|
||||
setIsInternalView(true);
|
||||
@ -19,9 +23,24 @@ function App() {
|
||||
setIsInternalView(false);
|
||||
};
|
||||
|
||||
// if (isSecretaria) {
|
||||
// return <PerfilSecretaria onLogout={() => setIsSecretaria(false)} />;
|
||||
// }
|
||||
|
||||
// Se não estiver na visualização interna, retorna a LandingPage.
|
||||
if (!isInternalView) {
|
||||
return <LandingPage onEnterSystem={handleEnterSystem} />;
|
||||
return (
|
||||
<Router>
|
||||
<Routes>
|
||||
<Route path="/" element={<LandingPage onEnterSystem={handleEnterSystem}/>} />
|
||||
<Route path="/login" element={<Login />} />
|
||||
<Route path="/register" element={<Register />} />
|
||||
<Route path="/forgotPassword" element={<Forgot />} />
|
||||
<Route path="/secretaria/*" element={<PerfilSecretaria />} />
|
||||
<Route path="*" element={<h2>Página não encontrada</h2>} />
|
||||
</Routes>
|
||||
</Router>
|
||||
)
|
||||
}
|
||||
|
||||
// Se estiver na visualização interna, retorna o PerfilSecretaria
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
.card-position {
|
||||
padding-top: 1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.card {
|
||||
margin-bottom: 2.2rem;
|
||||
border: none;
|
||||
|
||||
@ -6,43 +6,43 @@
|
||||
|
||||
{
|
||||
"name":"Início",
|
||||
"url": "/",
|
||||
"url": "/secretaria/inicio",
|
||||
"icon": "house"
|
||||
},
|
||||
|
||||
{
|
||||
"name": "Cadastro de Pacientes",
|
||||
"url": "/pacientes/cadastro",
|
||||
"url": "/secretaria/pacientes/cadastro",
|
||||
"icon": "heart-pulse-fill"
|
||||
},
|
||||
|
||||
{
|
||||
"name": "Cadastro do Médico",
|
||||
"url": "/medicos/cadastro",
|
||||
"url": "/secretaria/medicos/cadastro",
|
||||
"icon": "capsule"
|
||||
},
|
||||
|
||||
{
|
||||
"name": "Lista de Pacientes",
|
||||
"icon": "clipboard-heart-fill",
|
||||
"url": "/pacientes"
|
||||
"url": "/secretaria/pacientes"
|
||||
},
|
||||
|
||||
{
|
||||
"name": "Lista de Médico",
|
||||
"icon": "hospital-fill",
|
||||
"url": "/medicos"
|
||||
"url": "/secretaria/medicos"
|
||||
},
|
||||
{
|
||||
"name": "Agendar consulta",
|
||||
"icon": "calendar-plus-fill",
|
||||
"url": "/agendamento"
|
||||
"url": "/secretaria/agendamento"
|
||||
},
|
||||
|
||||
{
|
||||
"name": "Laudo do Paciente",
|
||||
"icon": "table",
|
||||
"url": "/laudo"
|
||||
"url": "/secretaria/laudo"
|
||||
}
|
||||
|
||||
]
|
||||
56
src/pages/ForgotPassword.jsx
Normal file
56
src/pages/ForgotPassword.jsx
Normal file
@ -0,0 +1,56 @@
|
||||
import React from 'react';
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
function ForgotPassword() {
|
||||
return (
|
||||
<>
|
||||
<div className="mt-3 card-position">
|
||||
<div className="col-lg-5 col-12">
|
||||
<div className="card shadow-sm d-flex justify-content-between align-items-center">
|
||||
<div id="auth-left">
|
||||
<div className="auth-logo">
|
||||
<br />
|
||||
<Link to="/">
|
||||
<h1 className="mb-4 text-center">MediConnect</h1>
|
||||
</Link>
|
||||
</div>
|
||||
<h3 className="auth-title">Esqueci minha senha</h3>
|
||||
<p className="auth-subtitle mb-5">
|
||||
Informe seu e-mail e enviaremos um link para redefinir sua senha.
|
||||
</p>
|
||||
<form action="index.html">
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="email"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="E-mail"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-envelope" />
|
||||
</div>
|
||||
</div>
|
||||
<button className="btn btn-primary btn-block btn-lg shadow-lg mt-5">
|
||||
Enviar
|
||||
</button>
|
||||
</form>
|
||||
<div className="text-center mt-5 text-lg fs-4">
|
||||
<p className="text-gray-600">
|
||||
Lembrou da sua senha?
|
||||
<Link className="font-bold" to={'/login'}>
|
||||
Entrar
|
||||
</Link>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 d-none d-lg-block">
|
||||
<div id="auth-right"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default ForgotPassword;
|
||||
@ -1,9 +1,9 @@
|
||||
// src/pages/LandingPage.jsx
|
||||
|
||||
import React from 'react';
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import './style/LandingPage.css';
|
||||
|
||||
const LandingPage = ({ onEnterSystem }) => {
|
||||
const LandingPage = () => {
|
||||
const navigate = useNavigate();
|
||||
return (
|
||||
// Usa a classe de isolamento CSS
|
||||
<div className="landing-page-public-view">
|
||||
@ -18,7 +18,7 @@ const LandingPage = ({ onEnterSystem }) => {
|
||||
<a href="#services">Serviços</a>
|
||||
<a href="#contact">Contato</a>
|
||||
{/* Botão para entrar no sistema interno */}
|
||||
<button className="access-button" onClick={onEnterSystem}>
|
||||
<button className="access-button" onClick={() => navigate('/login')}>
|
||||
Acessar Sistema
|
||||
</button>
|
||||
</nav>
|
||||
@ -35,7 +35,7 @@ const LandingPage = ({ onEnterSystem }) => {
|
||||
Somos focados em oferecer a melhor experiência para pacientes e a gestão mais eficiente para a clínica.
|
||||
</p>
|
||||
{/* Botão de ação principal: "Acessar Sistema" */}
|
||||
<button className="main-action-button" onClick={onEnterSystem}>
|
||||
<button className="main-action-button" onClick={() => navigate('/login')}>
|
||||
Acessar Sistema
|
||||
</button>
|
||||
</div>
|
||||
|
||||
93
src/pages/Login.jsx
Normal file
93
src/pages/Login.jsx
Normal file
@ -0,0 +1,93 @@
|
||||
import React from 'react';
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
|
||||
function Login() {
|
||||
const navigate = useNavigate();
|
||||
const handleLogin = (e) => {
|
||||
e.preventDefault();
|
||||
// ...login logic...
|
||||
navigate('/secretaria/inicio');
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<div className="mt-3 card-position">
|
||||
<div className="col-lg-5 col-12">
|
||||
<div className="card shadow-sm d-flex justify-content-between align-items-center">
|
||||
<div id="auth-left">
|
||||
<div className="auth-logo">
|
||||
<br />
|
||||
<Link to="/">
|
||||
<h1 className="mb-4 text-center">MediConnect</h1>
|
||||
</Link>
|
||||
</div>
|
||||
<h3 className="auth-title">Entrar</h3>
|
||||
<p className="auth-subtitle mb-5">
|
||||
Entre com os dados que você inseriu durante o registro.
|
||||
</p>
|
||||
<form action="index.html">
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="Username"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-person" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="password"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="Password"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-shield-lock" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-check form-check-lg d-flex align-items-end">
|
||||
<input
|
||||
className="form-check-input me-2"
|
||||
type="checkbox"
|
||||
defaultValue=""
|
||||
id="flexCheckDefault"
|
||||
/>
|
||||
<label
|
||||
className="form-check-label text-gray-600"
|
||||
htmlFor="flexCheckDefault"
|
||||
>
|
||||
Manter-me conectado
|
||||
</label>
|
||||
</div>
|
||||
<button className="btn btn-primary btn-block btn-lg shadow-lg mt-5"
|
||||
onClick={handleLogin}>
|
||||
Entrar
|
||||
</button>
|
||||
</form>
|
||||
<div className="text-center mt-5 text-lg fs-4">
|
||||
<p className="text-gray-600">
|
||||
Não tem uma conta?
|
||||
<Link className="font-bold" to={'/register'}>
|
||||
Cadastre-se
|
||||
</Link>
|
||||
.
|
||||
</p>
|
||||
<p>
|
||||
<Link className="font-bold" to={'/forgotPassword'}>
|
||||
Esqueceu a senha?
|
||||
</Link>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 d-none d-lg-block">
|
||||
<div id="auth-right"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Login;
|
||||
93
src/pages/Register.jsx
Normal file
93
src/pages/Register.jsx
Normal file
@ -0,0 +1,93 @@
|
||||
import React from 'react';
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
|
||||
function Register() {
|
||||
const navigate = useNavigate();
|
||||
const handleLogin = (e) => {
|
||||
e.preventDefault();
|
||||
// ...login logic...
|
||||
navigate('/secretaria/inicio');
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<div className="mt-3 card-position">
|
||||
<div className="col-lg-5 col-12">
|
||||
<div className="card shadow-sm d-flex justify-content-between align-items-center">
|
||||
<div id="auth-left">
|
||||
<div className="auth-logo">
|
||||
<br />
|
||||
<Link to="/">
|
||||
<h1 className="mb-4 text-center">MediConnect</h1>
|
||||
</Link>
|
||||
</div>
|
||||
<h3 className="auth-title">Cadastre-se</h3>
|
||||
<p className="auth-subtitle mb-5">
|
||||
Insira seus dados para se registrar em nosso site.
|
||||
</p>
|
||||
<form action="index.html">
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="E-mail"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-envelope" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="Nome de usuário"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-person" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="password"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="Senha"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-shield-lock" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group position-relative has-icon-left mb-4">
|
||||
<input
|
||||
type="password"
|
||||
className="form-control form-control-xl"
|
||||
placeholder="Confirmar senha"
|
||||
/>
|
||||
<div className="form-control-icon">
|
||||
<i className="bi bi-shield-lock" />
|
||||
</div>
|
||||
</div>
|
||||
<button className="btn btn-primary btn-block btn-lg shadow-lg mt-5"
|
||||
onClick={handleLogin}>
|
||||
Cadastrar
|
||||
</button>
|
||||
</form>
|
||||
<div className="text-center mt-5 text-lg fs-4">
|
||||
<p className="text-gray-600">
|
||||
Já tem uma conta?
|
||||
<Link className="font-bold" to={'/login'}>
|
||||
Entrar
|
||||
</Link>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 d-none d-lg-block">
|
||||
<div id="auth-right"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Register;
|
||||
@ -2,7 +2,6 @@
|
||||
|
||||
/* O seletor .landing-page-public-view ajuda a isolar os estilos */
|
||||
.landing-page-public-view {
|
||||
font-family: Arial, sans-serif;
|
||||
min-height: 100vh;
|
||||
background-color: #f0f2f5;
|
||||
}
|
||||
@ -25,7 +24,7 @@
|
||||
/* Estilo para a logo DENTRO do cabeçalho da Landing Page */
|
||||
.landing-header .logo h1 {
|
||||
font-size: 1.8em;
|
||||
color: #5b56f8;
|
||||
color: #25396f;
|
||||
font-weight: 700;
|
||||
margin: 0; /* Remove margem que pode quebrar o layout */
|
||||
padding: 0; /* Remove padding */
|
||||
@ -42,6 +41,9 @@
|
||||
.nav-menu a:hover {
|
||||
color: #5b56f8;
|
||||
}
|
||||
.nav-menu button:hover {
|
||||
background-color: #4540d6;
|
||||
}
|
||||
|
||||
.access-button {
|
||||
background-color: #5b56f8;
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
// src/perfis/perfil_secretaria/PerfilSecretaria.jsx
|
||||
|
||||
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
||||
//import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
||||
import { Routes, Route } from "react-router-dom";
|
||||
|
||||
import Sidebar from "../../components/Sidebar";
|
||||
import Inicio from "../../pages/Inicio";
|
||||
@ -15,15 +14,14 @@ import EditPage from "../../pages/EditPage";
|
||||
import DoctorDetails from "../../pages/DoctorDetails";
|
||||
import DoctorEditPage from "../../pages/DoctorEditPage";
|
||||
|
||||
function PerfilSecretaria({ onLogout }) {
|
||||
function PerfilSecretaria() {
|
||||
return (
|
||||
<Router>
|
||||
// <Router>
|
||||
<div id="app" className="active">
|
||||
{/* Passamos onLogout para que o botão Sair funcione no menu */}
|
||||
<Sidebar onLogout={onLogout} />
|
||||
<Sidebar />
|
||||
<div id="main">
|
||||
<Routes>
|
||||
<Route path="/" element={<Inicio />} />
|
||||
<Route path="/inicio" element={<Inicio />} />
|
||||
<Route path="/pacientes/cadastro" element={<PatientCadastroManager />} />
|
||||
<Route path="/medicos/cadastro" element={<DoctorCadastroManager />} />
|
||||
<Route path="/pacientes" element={<TablePaciente />} />
|
||||
@ -38,7 +36,7 @@ function PerfilSecretaria({ onLogout }) {
|
||||
</Routes>
|
||||
</div>
|
||||
</div>
|
||||
</Router>
|
||||
// </Router>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user