Soutenance
continuous-integration/drone/push Build is failing Details

d_yanis 1 year ago
parent 930c0cfb3f
commit a3c9bab5b9

@ -4,7 +4,7 @@
#body { #body {
background-color: var(--second-color); background-color: var(--second-color);
border: 1px solid red; /* border: 1px solid red; */
width: 100%; width: 100%;
height: 100vh; height: 100vh;
display: flex; display: flex;
@ -13,7 +13,7 @@
#content { #content {
width: 85%; width: 85%;
border: 1px yellow solid; /* border: 1px yellow solid; */
height: 100%; height: 100%;
} }

@ -1,47 +1,50 @@
import "../style/settings/settings.css" import "../style/settings/settings.css"
import 'bootstrap/dist/css/bootstrap.min.css'; import 'bootstrap/dist/css/bootstrap.min.css';
import { MainTitle, SecondTitle } from "./component/Title" import { MainTitle, SecondTitle } from "./component/Title"
import {Header} from './template/Header' import { Header } from './template/Header'
import { useState, ChangeEvent, useRef } from "react" import { useState, ChangeEvent, useRef } from "react"
import { User } from "./model/User" import { User } from "./model/User"
import Button from 'react-bootstrap/Button'; import Button from 'react-bootstrap/Button';
import Form from 'react-bootstrap/Form'; import Form from 'react-bootstrap/Form';
import Image from 'react-bootstrap/Image'; import Image from 'react-bootstrap/Image';
import Container from 'react-bootstrap/Container'
import Row from 'react-bootstrap/Row';
import Col from 'react-bootstrap/Col';
import { updateSourceFile } from "typescript"; import { updateSourceFile } from "typescript";
import { fetchAPI } from "../Fetcher"; import { fetchAPI } from "../Fetcher";
import { fetchPOST } from "../Fetcher"; import { fetchPOST } from "../Fetcher";
export default function Settings({user} : {user : User}){ export default function Settings({ user }: { user: User }) {
return ( return (
<div id="main"> <div id="main">
<Header username={user.name} /> <Header username={user.name} />
<Body user={user}/> <Body user={user} />
</div> </div>
) )
} }
function Body({user} : {user : User}) { function Body({ user }: { user: User }) {
return ( return (
<div id="body"> <div id="body">
<div id="content"> <div id="content">
<MainTitle title="Paramètres" id={null}/> <MainTitle title="Paramètres" id={null} />
<AccountSettings user={user} /> <AccountSettings user={user} />
</div> </div>
</div> </div>
) )
} }
function AccountSettings({user} : {user : User}){ function AccountSettings({ user }: { user: User }) {
return ( return (
<div id="account"> <div id="account">
<SecondTitle title="Compte personnel" id={null}/> <SecondTitle title="Compte personnel" id={null} />
<ProfilSettings user={user} /> <ProfilSettings user={user} />
</div> </div>
); );
} }
function ProfilSettings({user} : {user : User}) { function ProfilSettings({ user }: { user: User }) {
// Utilisez useState pour gérer l'état du champ de saisie // Utilisez useState pour gérer l'état du champ de saisie
// const [username, setUsername] = useState({user.username}); // const [username, setUsername] = useState({user.username});
@ -63,37 +66,58 @@ function ProfilSettings({user} : {user : User}) {
const nameRef = useRef<HTMLInputElement>(null); const nameRef = useRef<HTMLInputElement>(null);
const emailRef = useRef<HTMLInputElement>(null); const emailRef = useRef<HTMLInputElement>(null);
const size = "171x180"; const size = "171x180";
const profilePicture = user.profilePicture + "/" + size; const profilePicture = user.profilePicture + "/" + size;
return ( return (
<div id="account"> <Container>
<div id="profil-picture"> <Row>
<Image src={profilePicture}roundedCircle /> <Col>
<Button variant="outline-primary">Changer photo de profil</Button> <Image src={profilePicture} roundedCircle />
</div> <Button variant="outline-primary" onClick={() => alert("En cours de développement...")}>Changer photo de profil</Button>
<div id="account-infos"> </Col>
<Form> <Col>
<Form.Group className="mb-3" controlId="formUsername"> <Form>
<Form.Label className="content">Nom d'utilisateur</Form.Label> <Form.Group className="mb-3" controlId="formUsername">
<Form.Control ref={nameRef} size="sm" defaultValue={user.name}/> <Form.Label className="content">Nom d'utilisateur</Form.Label>
</Form.Group> <Form.Control ref={nameRef} size="sm" defaultValue={user.name} />
<Form.Group className="mb-3" controlId="formEmail"> </Form.Group>
<Form.Label className="content">Adresse mail</Form.Label> <Form.Group className="mb-3" controlId="formEmail">
<Form.Control ref={emailRef} id="control" size="sm" defaultValue={user.email} type="email" placeholder="Password" /> <Form.Label className="content">Adresse mail</Form.Label>
</Form.Group> <Form.Control readOnly onClick={() => alert("En cours de développement...")} ref={emailRef} id="control" size="sm" defaultValue={user.email} type="email" placeholder="Password" />
<Button variant="outline-primary" type="button" onClick={() => updateAccountInfos(nameRef.current!.value, emailRef.current!.value, user)}>Mettre à jour</Button> </Form.Group>
</Form> <Button variant="outline-primary" type="button" onClick={() => updateAccountInfos(nameRef.current!.value, emailRef.current!.value, user)}>Mettre à jour</Button>
</div> </Form>
</div> </Col>
</Row>
</Container>
// <div id="account">
// <div id="profil-picture">
// <Image src={profilePicture}roundedCircle />
// <Button variant="outline-primary">Changer photo de profil</Button>
// </div>
// <div id="account-infos">
// <Form>
// <Form.Group className="mb-3" controlId="formUsername">
// <Form.Label className="content">Nom d'utilisateur</Form.Label>
// <Form.Control ref={nameRef} size="sm" defaultValue={user.name}/>
// </Form.Group>
// <Form.Group className="mb-3" controlId="formEmail">
// <Form.Label className="content">Adresse mail</Form.Label>
// <Form.Control readOnly onClick={() => alert("En cours de développement...")} ref={emailRef} id="control" size="sm" defaultValue={user.email} type="email" placeholder="Password" />
// </Form.Group>
// <Button variant="outline-primary" type="button" onClick={() => updateAccountInfos(nameRef.current!.value, emailRef.current!.value, user)}>Mettre à jour</Button>
// </Form>
// </div>
// </div>
); );
} }
function updateAccountInfos(name : string, email : string, user : User) { function updateAccountInfos(name: string, email: string, user: User) {
fetchAPI("account/update/profile", { fetchAPI("account/update/profile", {
name : name, name: name,
email : email email: email
}); });
fetchPOST("account/update", {}); fetchPOST("account/update", {});
location.reload(); location.reload();

@ -55,8 +55,7 @@ class AuthController {
return HttpResponse::redirect("/home"); return HttpResponse::redirect("/home");
} }
public function displayLogin(): HttpResponse { public function displayLogin(): HttpResponse {
return ViewHttpResponse::twig("display_login.html.twig", []); return ViewHttpResponse::twig("display_login.html.twig", []);
} }

Loading…
Cancel
Save