mirror of
https://github.com/ets-cfuhrman-pfe/EvalueTonSavoir.git
synced 2025-08-11 21:23:54 -04:00
base of login
This commit is contained in:
parent
8d31bc8f8c
commit
b9af549624
5 changed files with 103 additions and 38 deletions
|
|
@ -1,9 +1,9 @@
|
||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
import './authselection.css';
|
import './authselection.css';
|
||||||
|
import SimpleLogin from './SimpleLogin';
|
||||||
|
|
||||||
const AuthSelection: React.FC = () => {
|
const AuthSelection: React.FC = () => {
|
||||||
const [simpleLoginData, setSimpleLoginData] = useState({ username: '', password: '' });
|
|
||||||
const [authData, setAuthData] = useState<any>(null); // Stocke les données d'auth
|
const [authData, setAuthData] = useState<any>(null); // Stocke les données d'auth
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
|
@ -22,17 +22,6 @@ const AuthSelection: React.FC = () => {
|
||||||
fetchAuthData(); // Appel de la fonction pour récupérer les données
|
fetchAuthData(); // Appel de la fonction pour récupérer les données
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const handleSimpleLoginChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
||||||
const { name, value } = e.target;
|
|
||||||
setSimpleLoginData((prev) => ({ ...prev, [name]: value }));
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSimpleLoginSubmit = (e: React.FormEvent) => {
|
|
||||||
e.preventDefault();
|
|
||||||
// Logique d'authentification pour Simple Login
|
|
||||||
console.log('Simple Login Data:', simpleLoginData);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleAuthLogin = (provider: string) => {
|
const handleAuthLogin = (provider: string) => {
|
||||||
window.location.href = 'http://localhost:3000/api/auth/' + provider;
|
window.location.href = 'http://localhost:3000/api/auth/' + provider;
|
||||||
};
|
};
|
||||||
|
|
@ -44,25 +33,7 @@ const AuthSelection: React.FC = () => {
|
||||||
{/* Formulaire de connexion Simple Login */}
|
{/* Formulaire de connexion Simple Login */}
|
||||||
{authData && authData['simple-login'] && (
|
{authData && authData['simple-login'] && (
|
||||||
<div className="form-container">
|
<div className="form-container">
|
||||||
<form onSubmit={handleSimpleLoginSubmit}>
|
<SimpleLogin/>
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
name="username"
|
|
||||||
placeholder="Nom d'utilisateur"
|
|
||||||
value={simpleLoginData.username}
|
|
||||||
onChange={handleSimpleLoginChange}
|
|
||||||
required
|
|
||||||
/>
|
|
||||||
<input
|
|
||||||
type="password"
|
|
||||||
name="password"
|
|
||||||
placeholder="Mot de passe"
|
|
||||||
value={simpleLoginData.password}
|
|
||||||
onChange={handleSimpleLoginChange}
|
|
||||||
required
|
|
||||||
/>
|
|
||||||
<button type="submit">Se connecter</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
|
||||||
94
client/src/pages/AuthSelection/SimpleLogin.tsx
Normal file
94
client/src/pages/AuthSelection/SimpleLogin.tsx
Normal file
|
|
@ -0,0 +1,94 @@
|
||||||
|
import { useNavigate, Link } from 'react-router-dom';
|
||||||
|
|
||||||
|
// JoinRoom.tsx
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
|
||||||
|
import './simpleLogin.css';
|
||||||
|
import { TextField } from '@mui/material';
|
||||||
|
import LoadingButton from '@mui/lab/LoadingButton';
|
||||||
|
|
||||||
|
import LoginContainer from '../../components/LoginContainer/LoginContainer'
|
||||||
|
import ApiService from '../../services/ApiService';
|
||||||
|
|
||||||
|
const SimpleLogin: React.FC = () => {
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
const [email, setEmail] = useState('');
|
||||||
|
const [password, setPassword] = useState('');
|
||||||
|
|
||||||
|
const [connectionError, setConnectionError] = useState<string>('');
|
||||||
|
const [isConnecting] = useState<boolean>(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
return () => {
|
||||||
|
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const login = async () => {
|
||||||
|
const result = await ApiService.login(email, password);
|
||||||
|
|
||||||
|
if (result != true) {
|
||||||
|
setConnectionError(result);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
navigate("/teacher/Dashboard")
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<LoginContainer
|
||||||
|
title=''
|
||||||
|
error={connectionError}>
|
||||||
|
|
||||||
|
<TextField
|
||||||
|
label="Email"
|
||||||
|
variant="outlined"
|
||||||
|
value={email}
|
||||||
|
onChange={(e) => setEmail(e.target.value)}
|
||||||
|
placeholder="Nom d'utilisateur"
|
||||||
|
sx={{ marginBottom: '1rem' }}
|
||||||
|
fullWidth
|
||||||
|
/>
|
||||||
|
|
||||||
|
<TextField
|
||||||
|
label="Mot de passe"
|
||||||
|
variant="outlined"
|
||||||
|
type="password"
|
||||||
|
value={password}
|
||||||
|
onChange={(e) => setPassword(e.target.value)}
|
||||||
|
placeholder="Nom de la salle"
|
||||||
|
sx={{ marginBottom: '1rem' }}
|
||||||
|
fullWidth
|
||||||
|
/>
|
||||||
|
|
||||||
|
<LoadingButton
|
||||||
|
loading={isConnecting}
|
||||||
|
onClick={login}
|
||||||
|
variant="contained"
|
||||||
|
sx={{ marginBottom: `${connectionError && '2rem'}` }}
|
||||||
|
disabled={!email || !password}
|
||||||
|
>
|
||||||
|
Login
|
||||||
|
</LoadingButton>
|
||||||
|
|
||||||
|
<div className="login-links">
|
||||||
|
|
||||||
|
<Link to="/teacher/resetPassword">
|
||||||
|
Réinitialiser le mot de passe
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<Link to="/teacher/register">
|
||||||
|
Créer un compte
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</LoginContainer>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SimpleLogin;
|
||||||
0
client/src/pages/AuthSelection/simpleLogin.css
Normal file
0
client/src/pages/AuthSelection/simpleLogin.css
Normal file
|
|
@ -3,14 +3,18 @@ version: '3'
|
||||||
services:
|
services:
|
||||||
|
|
||||||
frontend:
|
frontend:
|
||||||
image: fuhrmanator/evaluetonsavoir-frontend:latest
|
build:
|
||||||
|
context: ./server
|
||||||
|
dockerfile: Dockerfile
|
||||||
container_name: frontend
|
container_name: frontend
|
||||||
ports:
|
ports:
|
||||||
- "5173:5173"
|
- "5173:5173"
|
||||||
restart: always
|
restart: always
|
||||||
|
|
||||||
backend:
|
backend:
|
||||||
image: fuhrmanator/evaluetonsavoir-backend:latest
|
build:
|
||||||
|
context: ./server
|
||||||
|
dockerfile: Dockerfile
|
||||||
container_name: backend
|
container_name: backend
|
||||||
ports:
|
ports:
|
||||||
- "3000:3000"
|
- "3000:3000"
|
||||||
|
|
|
||||||
|
|
@ -151,15 +151,11 @@ class AuthConfig {
|
||||||
|
|
||||||
if (providerConfig.type === 'oauth') {
|
if (providerConfig.type === 'oauth') {
|
||||||
passportConfig[providerName] = {
|
passportConfig[providerName] = {
|
||||||
type: providerConfig.type,
|
type: providerConfig.type
|
||||||
authorizationUrl: providerConfig.OAUTH_AUTHORIZATION_URL,
|
|
||||||
callbackUrl: providerConfig.OAUTH_CALLBACK_URL,
|
|
||||||
};
|
};
|
||||||
} else if (providerConfig.type === 'oidc') {
|
} else if (providerConfig.type === 'oidc') {
|
||||||
passportConfig[providerName] = {
|
passportConfig[providerName] = {
|
||||||
type: providerConfig.type,
|
type: providerConfig.type,
|
||||||
issuerUrl: providerConfig.OIDC_ISSUER_URL,
|
|
||||||
callbackUrl: providerConfig.OIDC_CALLBACK_URL
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue