GringoElPepito/hsp-gdh-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updating frontend

Browse Source
This commit is contained in:
GringoElPepito
2024-04-19 00:36:17 +02:00
parent 9a39e4cfdc
commit d358c0ac2e
13 changed files with 239 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/dashboard/admin/index.jsx
View File

@@ -8,7 +8,7 @@ function Admin({user,setUser}) {
const [page, setPage] = useState("home");
const links = [
{page:"home",name:"Accueil"},
{page:"appointment",name:"Rendez-vous"},
config.appointmentOn ? {page:"appointment",name:"Rendez-vous"} : null,
config.prescriptionOn ? {page:"prescription",name:"Préscriptions"} : null,
{page:"medical-file",name:"Dossier Médical"},
{page:"user",name:"Utilisateurs"},
@@ -16,7 +16,7 @@ function Admin({user,setUser}) {
{page:"patient",name:"Patients"},
{page:"hospital",name:"Hôpitaux"},
{page:"service",name:"Services"},
{page:"profil",name:"Profil"}
config.profilOn ? {page:"profil",name:"Profil"} : null
];
return(

44
src/components/dashboard/doctor/appointment/index.jsx
View File

@@ -0,0 +1,44 @@
import HeadTitle from "../../head-title";
import ItemList from "./item-list";
import MenuDisplay from "../../menu-display";
import { useState, useEffect } from "react";
import { get } from "../../../../modules/fetchManager";
import DeleteMenu from "../../delete-menu";
function Appointment({user}) {
const [appointments, setAppointments] = useState([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
const [deleteMenu, setDeleteMenu] = useState(false);
useEffect(() => {
if(loading && !error && appointments.length === 0){
get('doctors/@me/appointments', user.token)
.then((data) => {
setLoading(false);
if(data.status === 404) {
setError("Aucun rendez-vous trouvé");
return;
}
if(data.status === 500) {
setError("Erreur serveur, veuillez réessayer plus tard");
return;
}
setAppointments(data.JSON);
});
}
},[user]);
return (
<div>
<HeadTitle title="Appointment" />
<MenuDisplay loading={loading} error={error} data={appointments} ItemList={ItemList} setDeleteMenu={setDeleteMenu}/>
{ deleteMenu ? <DeleteMenu deleteMenu={deleteMenu} setDeleteMenu={setDeleteMenu} user={user} link={"doctors/@me/appointments"} element={"ce rendez-vous"}/> : null }
</div>
);
}
export default Appointment;

19
src/components/dashboard/doctor/appointment/item-list/index.jsx Normal file
View File

@@ -0,0 +1,19 @@
import DeleteButton from "../../../delete-button";
function ItemList({item, setDeleteMenu}) {
const date = new Date(item.date);
return (
<div className="text-xl bg-cyan-300 p-4 w-full flex flex-row">
<div className="w-3/4">
<h3 className="text-3xl py-2">{item.name} - {date.getDay() > 9 ? date.getDay() : "0"+date.getDay()}/{date.getMonth() > 9 ? date.getMonth() : "0"+date.getMonth()}/{date.getFullYear()},{item.time.substring(0,item.time.length-3)}</h3>
<p>{item.gender} - {item.first_name} {item.last_name} </p>
</div>
<div className="flex flex-row items-center justify-beetween gap-4">
{/* <ModifyButton setModifyMenu={setModifyMenu} item={item} /> */}
<DeleteButton setDeleteMenu={setDeleteMenu} id={item.id} />
</div>
</div>
);
}
export default ItemList;

4
src/components/dashboard/doctor/home/index.jsx
View File

@@ -1,12 +1,14 @@
import HeadTitle from "../../head-title";
import Services from "./services";
import Hospitals from "./hospitals";
import config from "../../../../config";
function Home({user}) {
return(
<div className="flex flex-col gap-6">
<HeadTitle title="Accueil"/>
<div className="flex flex-row justify-between">
{config.affectationOn ?
<div className="flex flex-col gap-6 w-1/2 items-center">
<div className="text-2xl">
<h2>Affectation</h2>
@@ -15,7 +17,7 @@ function Home({user}) {
<Services user={user}/>
<Hospitals user={user}/>
</div>
</div>
</div> : null}
<div className="flex flex-col gap-6 w-1/2 items-center">
</div>

4
src/components/dashboard/doctor/index.jsx
View File

@@ -7,10 +7,10 @@ function Doctor({user, setUser}) {
const [page, setPage] = useState("home");
const links = [
{page:"home",name:"Accueil"},
{page:"appointment",name:"Rendez-vous"},
config.appointmentOn ? {page:"appointment",name:"Rendez-vous"} : null,
config.prescriptionOn ? {page:"prescription",name:"Préscriptions"} : null,
{page:"medical-file",name:"Dossier Médical"},
{page:"profil",name:"Profil"}
config.profilOn ? {page:"profil",name:"Profil"} : null
];
return (

2
src/components/dashboard/menu-display/index.jsx
View File

@@ -2,7 +2,7 @@ import Container from "../container"
import Loader from "../loader"
import ListDisplay from "../list-display"
function MenuDisplay({loading, error, data, ItemList, setDeleteMenu, setModifyMenu,user = null,setDetailMenu = null}) {
function MenuDisplay({loading, error, data, ItemList, setDeleteMenu = null, setModifyMenu = null,user = null,setDetailMenu = null}) {
return(
<Container>
{ loading ? <Loader color={true}/> : null }

5
src/components/dashboard/patient/appointment/index.jsx
View File

@@ -5,12 +5,14 @@ import Create from "./create";
import CreateButton from "../../createButton";
import ItemList from "./item-list";
import MenuDisplay from "../../menu-display";
import DeleteMenu from "../../delete-menu";
function Appointment({user}) {
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
const [appointments, setAppointments] = useState([]);
const [createMenu, setCreateMenu] = useState(false);
const [deleteMenu, setDeleteMenu] = useState(false);
// if(loading && !error && appointments.length === 0){
@@ -42,8 +44,9 @@ function Appointment({user}) {
<div className="flex justify-center items-center mt-10">
<CreateButton setCreateMenu={setCreateMenu} nameMenu="Prendre Rendez-Vous"/>
</div>
<MenuDisplay loading={loading} error={error} data={appointments} ItemList={ItemList}/>
<MenuDisplay loading={loading} error={error} data={appointments} ItemList={ItemList} setDeleteMenu={setDeleteMenu}/>
{ createMenu ? <Create setCreateMenu={setCreateMenu} user={user}/> : null }
{ deleteMenu ? <DeleteMenu deleteMenu={deleteMenu} setDeleteMenu={setDeleteMenu} user={user} link={"patients/@me/appointments"} element={"ce rendez-vous"}/> : null }
</div>
);
}

18
src/components/dashboard/patient/appointment/item-list/index.jsx
View File

@@ -1,4 +1,6 @@
function ItemList({item}) {
import DeleteButton from "../../../delete-button";
function ItemList({item, setDeleteMenu}) {
const date = new Date(item.date);
return (
<div className="text-xl bg-cyan-300 p-4 w-full flex flex-row">
@@ -6,16 +8,10 @@ function ItemList({item}) {
<h3 className="text-3xl py-2">{item.name} - {date.getDay() > 9 ? date.getDay() : "0"+date.getDay()}/{date.getMonth() > 9 ? date.getMonth() : "0"+date.getMonth()}/{date.getFullYear()},{item.time.substring(0,item.time.length-3)}</h3>
<p>Dr.{item.first_name} {item.last_name}, {item.email} - {item.phone}</p>
</div>
{/* <div className="flex flex-row items-center justify-beetween gap-4">
<div className="flex flex-col items-center justify-beetween gap-4">
{!item.is_verified ? <button className="bg-green-500 text-white px-4 py-2 rounded-lg" onClick={onClick}>Vérifier</button> : null}
<button className="bg-blue-500 text-white px-4 py-2 rounded-lg" onClick={() => setDetailMenu(item)}>Détails</button>
</div>
<div className="flex flex-col items-center justify-beetween gap-4">
<ModifyButton setModifyMenu={setModifyMenu} item={item} />
<DeleteButton setDeleteMenu={setDeleteMenu} id={item.id} />
</div>
</div> */}
<div className="flex flex-col items-center justify-beetween gap-4">
{/* <ModifyButton setModifyMenu={setModifyMenu} item={item} /> */}
<DeleteButton setDeleteMenu={setDeleteMenu} id={item.id} />
</div>
</div>
);
}

4
src/components/dashboard/patient/index.jsx
View File

@@ -7,10 +7,10 @@ function Patient({user,setUser}) {
const [page, setPage] = useState("home");
const links = [
{page:"home",name:"Accueil"},
{page:"appointment",name:"Rendez-vous"},
config.appointmentOn ? {page:"appointment",name:"Rendez-vous"} : null,
config.prescriptionOn ? {page:"prescription",name:"Préscriptions"} : null,
{page:"medical-file",name:"Dossier Médical"},
{page:"profil",name:"Profil"}
config.profilOn ? {page:"profil",name:"Profil"} : null,
]
return (

37
src/components/dashboard/patient/profil/index.jsx
View File

@@ -1,9 +1,44 @@
import HeadTitle from "../../head-title";
import { useState, useEffect } from "react";
import { get } from "../../../../modules/fetchManager";
import UserForm from '../../user-form';
import PatientForm from "./patient-form";
function Profil({user}) {
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
const [profile, setProfile] = useState(false);
useEffect(() => {
get('patients/@me', user.token)
.then((data) => {
setLoading(false);
if(data.status === 404) {
setError("Aucun rendez-vous trouvé");
return;
}
if(data.status === 500) {
setError("Erreur serveur, veuillez réessayer plus tard");
return;
}
setProfile(data.JSON);
console.log(profile);
});
},[user]);
function Profil() {
return (
<div>
<HeadTitle title="Votre Profil"/>
{loading ? <div>Chargement...</div> : null}
{error ? <div className="text-red-500">{error}</div> : null}
{profile ?
<div className="flex flex-row justify-center items-center">
<UserForm user={user} />
<PatientForm profile={profile} user={user} />
</div>
: null}
</div>
);
}

64
src/components/dashboard/patient/profil/patient-form.jsx Normal file
View File

@@ -0,0 +1,64 @@
import { useForm } from "react-hook-form";
import SubmitButton from "../../submit-button";
import { put } from "../../../../modules/fetchManager";
import { useState,useEffect } from "react";
function PatientForm({user, profile}) {
const { register, handleSubmit } = useForm();
const [gender, setGender] = useState(null);
const onSubmit = (data) => {
data.user_id = user.data.id;
put('patients/@me', data, user.token)
.then((data) => {
console.log(data);
if(data.status === 200){
alert("Profil mis à jour");
return;
}
alert("Erreur lors de la mise à jour");
return;
});
};
useEffect(() => {
if(profile.gender === 'M') setGender('Homme');
if(profile.gender === 'F') setGender('Femme');
if(profile.gender === 'O') setGender('Autre');
},[user]);
return(
<form action="" className="flex flex-col gap-6 w-1/2 items-center" onSubmit={handleSubmit(onSubmit)}>
<div>
<h2 className="text-center text-2xl">Profil patient</h2>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="date_of_birth">Date de naissance</label>
<input type='date' {...register('date_of_birth', {required: true,value: profile.date_of_birth.substring(0,10)})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="gender">Genre : acutellement {gender}</label>
<select value={profile.gender} {...register("gender", {required: true})} className="rounded-md focus:outline-none border-gray-500 border">
<option value="M">Homme</option>
<option value="F">Femme</option>
<option value="O">Autre</option>
</select>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="address">Adresse</label>
<input {...register('address', {required: true, value: profile.address})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="insurance_number">Numéro d'assurance</label>
<input value={profile.insurance_number} {...register('insurance_number', {required: true})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="social_security_number">Numéro de sécurité social</label>
<input value={profile.social_security_number} {...register('social_security_number', {required: true})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<SubmitButton />
</form>
)
}
export default PatientForm;

46
src/components/dashboard/user-form/index.jsx Normal file
View File

@@ -0,0 +1,46 @@
import { useForm } from "react-hook-form";
import { put } from "../../../modules/fetchManager";
import SubmitButton from "../submit-button";
function UserForm({user}) {
const { register, handleSubmit } = useForm();
const onSubmit = (data) => {
put('users/@me', data, user.token)
.then((data) => {
if(data.status === 200){
alert("Profil mis à jour");
return;
}
alert("Erreur lors de la mise à jour");
return;
});
};
return(
<form action="" className="flex flex-col gap-6 w-1/2 items-center" onSubmit={handleSubmit(onSubmit)}>
<h2 className="text-center text-2xl">Profil utilisateur</h2>
<div className="flex flex-col gap-4">
<label htmlFor="last_name">Nom</label>
<input value={user.data.last_name} {...register('last_name', {required: true})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="firstname">Prénom</label>
<input value={user.data.first_name} {...register('first_name', {required: true})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="email">Email</label>
<input value={user.data.email} {...register('email', {required: true})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<div className="flex flex-col gap-4">
<label htmlFor="phone">Téléphone</label>
<input value={user.data.phone} {...register('phone', {required: true})} className="rounded-md focus:outline-none border-gray-500 border"/>
</div>
<SubmitButton />
</form>
);
}
export default UserForm;

9
src/config.sample.js Normal file
View File

@@ -0,0 +1,9 @@
const config = {
api: "http://127.0.0.1:3000/api",
prescriptionOn: true,
appointmentOn: true,
profilOn: true,
affectationOn: true,
}
export default config;