Login do usuario

src/App.js

@@ -4,6 +4,9 @@ import Sidebar from './components/Sidebar';
 import Table from "./pages/Table"; 
 
 import Inicio from './pages/Inicio';
+import Login from './pages/Login';
+import Register from './pages/Register';
+import ForgotPassword from './pages/ForgotPassword';
 import PatientCadastroManager from './pages/PatientCadastroManager';
 import EditPage from './pages/EditPage';
 import DoctorEditPage from './pages/DoctorEditPage';
@@ -29,6 +32,12 @@ function App() {
         return <Inicio setCurrentPage={setCurrentPage} />;
       case 'agendamento':
         return <Agendamento/>;
+      case 'login':
+        return <Login />;
+      case 'register':
+        return <Register />;
+      case 'forgot-password':
+        return <ForgotPassword />;
       case 'form-layout':
         return <PatientCadastroManager setCurrentPage={setCurrentPage}/>;
       case 'doctor-form-layout':

src/data/sidebar-items.json

@@ -32,17 +32,36 @@
     "name": "Lista de Médico",
     "icon": "hospital-fill",
     "url": "doctor-table"
-  }, 
+  },
+
   {
     "name": "Agendar consulta",
     "icon": "calendar-plus-fill",
     "url": "agendamento"
   },
-  
+
   {
     "name": "Laudo do Paciente",
     "icon": "table",
     "url": "laudo-manager"
+  },
+
+  {
+  "name": "Login",
+  "icon": "gallery-fill",
+  "url": "login"
+  },
+  
+  {
+  "name": "Register",
+  "icon": "gallery-fill",
+  "url": "register"
+  },
+
+  {
+  "name": "ForgotPassword",
+  "icon": "gallery-fill",
+  "url": "forgot-password"
   }
 
 ]

src/pages/ForgotPassword.jsx

@@ -0,0 +1,52 @@
+import React from 'react';
+
+function ForgotPassword() {
+  return (
+    <>
+    <div className="row h-100">
+        <div className="col-lg-5 col-12">
+        <div id="auth-left">
+            <div className="auth-logo">
+            <a href="index.html">
+                <img src="assets/static/images/logo/logo.svg" alt="Logo" />
+            </a>
+            </div>
+            <h1 className="auth-title">Forgot Password</h1>
+            <p className="auth-subtitle mb-5">
+            Input your email and we will send you reset password link.
+            </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="Email"
+                />
+                <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">
+                Send
+            </button>
+            </form>
+            <div className="text-center mt-5 text-lg fs-4">
+            <p className="text-gray-600">
+                Remember your account?{" "}
+                <a href="auth-login.html" className="font-bold">
+                Log in
+                </a>
+                .
+            </p>
+            </div>
+        </div>
+        </div>
+        <div className="col-lg-7 d-none d-lg-block">
+        <div id="auth-right"></div>
+        </div>
+    </div>
+  </>
+ );
+}
+
+export default ForgotPassword;

src/pages/Login.jsx

@@ -0,0 +1,82 @@
+import React from 'react';
+
+function Login() {
+  return (
+    <>
+    <div className="row h-100">
+        <div className="col-lg-5 col-12">
+        <div id="auth-left">
+            <div className="auth-logo">
+            <a href="index.html">
+                <img src="assets/static/images/logo/logo.svg" alt="Logo" />
+            </a>
+            </div>
+            <h1 className="auth-title">Log in.</h1>
+            <p className="auth-subtitle mb-5">
+            Log in with your data that you entered during registration.
+            </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"
+                >
+                Keep me logged in
+                </label>
+            </div>
+            <button className="btn btn-primary btn-block btn-lg shadow-lg mt-5">
+                Log in
+            </button>
+            </form>
+            <div className="text-center mt-5 text-lg fs-4">
+            <p className="text-gray-600">
+                Don't have an account?{" "}
+                <a href="auth-register.html" className="font-bold">
+                Sign up
+                </a>
+                .
+            </p>
+            <p>
+                <a className="font-bold" href="auth-forgot-password.html">
+                Forgot password?
+                </a>
+                .
+            </p>
+            </div>
+        </div>
+        </div>
+        <div className="col-lg-7 d-none d-lg-block">
+        <div id="auth-right"></div>
+        </div>
+    </div>
+  </>
+ );
+}
+
+export default Login;

src/pages/Register.jsx

@@ -0,0 +1,82 @@
+import React from 'react';
+
+function Register() {
+  return (  
+    <>
+    <div className="row h-100">
+        <div className="col-lg-5 col-12">
+        <div id="auth-left">
+            <div className="auth-logo">
+            <a href="index.html">
+                <img src="assets/static/images/logo/logo.svg" alt="Logo" />
+            </a>
+            </div>
+            <h1 className="auth-title">Sign Up</h1>
+            <p className="auth-subtitle mb-5">
+            Input your data to register to our website.
+            </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="Email"
+                />
+                <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="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-group position-relative has-icon-left mb-4">
+                <input
+                type="password"
+                className="form-control form-control-xl"
+                placeholder="Confirm Password"
+                />
+                <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">
+                Sign Up
+            </button>
+            </form>
+            <div className="text-center mt-5 text-lg fs-4">
+            <p className="text-gray-600">
+                Already have an account?{" "}
+                <a href="auth-login.html" className="font-bold">
+                Log in
+                </a>
+                .
+            </p>
+            </div>
+        </div>
+        </div>
+        <div className="col-lg-7 d-none d-lg-block">
+        <div id="auth-right"></div>
+        </div>
+    </div>
+  </>
+ );
+}
+
+export default Register;