Merge branch 'main' into guillaume
This commit is contained in:
Yass
GitHub
commit
8aed1e526b
18 changed files with 810 additions and 40 deletions
|
|
@ -1,4 +1,9 @@
|
|||
|
||||
<!-- Contenu principal de la page -->
|
||||
<main class="container py-5">
|
||||
|
||||
<!-- Centrage horizontal du formulaire -->
|
||||
<div class="row justify-content-center">
|
||||
<!-- Contenu principal de la page -->
|
||||
<main class="container py-5">
|
||||
|
||||
|
|
@ -95,3 +100,92 @@
|
|||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<h1 class="h3 fw-bold mb-1">Connexion</h1>
|
||||
|
||||
<p class="text-secondary mb-4">
|
||||
Connectez-vous à votre compte.
|
||||
</p>
|
||||
|
||||
<?php
|
||||
// Affichage des erreurs (validation côté serveur)
|
||||
if (!empty($arrError)) { ?>
|
||||
<div class="alert alert-danger" role="alert">
|
||||
<?php foreach ($arrError as $strError) { ?>
|
||||
<p class="mb-0"><?php echo htmlspecialchars($strError); ?></p>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<!-- Formulaire de connexion -->
|
||||
<form method="POST" action="index.php?ctrl=user&action=login">
|
||||
|
||||
<div class="row g-3">
|
||||
|
||||
<!-- Champ : adresse e-mail -->
|
||||
<div class="col-12">
|
||||
<label for="mail" class="form-label">
|
||||
Adresse e-mail
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
class="form-control <?php if (isset($arrError['mail'])) { echo 'is-invalid'; } ?>"
|
||||
id="mail"
|
||||
name="mail"
|
||||
value="<?php echo htmlspecialchars($strMail ?? ''); ?>"
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ : mot de passe -->
|
||||
<div class="col-12">
|
||||
<label for="pwd" class="form-label">
|
||||
Mot de passe
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
class="form-control <?php if (isset($arrError['pwd'])) { echo 'is-invalid'; } ?>"
|
||||
id="pwd"
|
||||
name="pwd"
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Option "Se souvenir de moi" -->
|
||||
<div class="col-12">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="remember_me" name="remember_me">
|
||||
<label class="form-check-label" for="remember_me">
|
||||
Se souvenir de moi
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bouton -->
|
||||
<div class="col-12 d-grid mt-2">
|
||||
<button type="submit" class="btn btn-primary btn-lg rounded-3">
|
||||
Se connecter
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Liens -->
|
||||
<div class="col-12 text-center">
|
||||
<small class="text-secondary">
|
||||
Pas encore de compte ?
|
||||
<a href="index.php?ctrl=user&action=signin" class="link-primary">Créer un compte</a>
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<div class="col-12 text-center">
|
||||
<small>
|
||||
<a href="#" class="link-primary">
|
||||
Mot de passe oublié ?
|
||||
</a>
|
||||
</small>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,9 @@
|
|||
|
||||
<!-- Page : Inscription -->
|
||||
<main class="container py-5">
|
||||
|
||||
<!-- Centrage du formulaire -->
|
||||
<div class="row justify-content-center">
|
||||
<!-- Contenu principal de la page -->
|
||||
<main class="container py-5">
|
||||
|
||||
|
|
@ -66,6 +71,193 @@
|
|||
required
|
||||
>
|
||||
</div>
|
||||
<!-- Carte Bootstrap contenant le formulaire -->
|
||||
<div class="card shadow-sm border-0 rounded-4 p-4 p-lg-5">
|
||||
|
||||
<!-- Titre et description -->
|
||||
<h1 class="h3 fw-bold mb-1">Inscription</h1>
|
||||
<p class="text-secondary mb-4">
|
||||
Créez votre compte utilisateur.
|
||||
</p>
|
||||
|
||||
<?php
|
||||
// Affichage des messages d'erreur du formulaire, l'affichage en Bootstrap (validation côté serveur)
|
||||
if (!empty($arrError)) { ?>
|
||||
<div class="alert alert-danger" role="alert">
|
||||
<?php foreach ($arrError as $strError) { ?>
|
||||
<p class="mb-0">
|
||||
<?php echo htmlspecialchars($strError); ?>
|
||||
</p>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<!-- Formulaire d'inscription -->
|
||||
<!-- Les données sont envoyées en POST vers la méthode signin du user_controller.php -->
|
||||
<form method="POST" action="index.php?ctrl=user&action=signin">
|
||||
|
||||
<div class="row g-3">
|
||||
|
||||
<!-- Champ : Nom -->
|
||||
<div class="col-md-6">
|
||||
<label class="form-label" for="user_name">
|
||||
Nom *
|
||||
</label>
|
||||
<input
|
||||
class="form-control <?php if (isset($arrError['user_name'])) echo 'is-invalid'; ?>"
|
||||
type="text"
|
||||
id="user_name"
|
||||
name="user_name"
|
||||
value="<?php echo htmlspecialchars($objUser->getName()); ?>"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ : Prénom -->
|
||||
<div class="col-md-6">
|
||||
<label class="form-label" for="user_firstname">
|
||||
Prénom *
|
||||
</label>
|
||||
<input
|
||||
class="form-control <?php if (isset($arrError['user_firstname'])) echo 'is-invalid'; ?>"
|
||||
type="text"
|
||||
id="user_firstname"
|
||||
name="user_firstname"
|
||||
value="<?php echo htmlspecialchars($objUser->getFirstname()); ?>"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ : Pseudo -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_pseudo">
|
||||
Pseudo *
|
||||
</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text">@</span>
|
||||
<input
|
||||
class="form-control <?php if (isset($arrError['user_pseudo'])) echo 'is-invalid'; ?>"
|
||||
type="text"
|
||||
id="user_pseudo"
|
||||
name="user_pseudo"
|
||||
value="<?php echo htmlspecialchars($objUser->getPseudo()); ?>"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Champ : Adresse e-mail -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_mail">
|
||||
Adresse e-mail *
|
||||
</label>
|
||||
<input
|
||||
class="form-control <?php if (isset($arrError['user_mail'])) echo 'is-invalid'; ?>"
|
||||
type="email"
|
||||
id="user_mail"
|
||||
name="user_mail"
|
||||
value="<?php echo htmlspecialchars($objUser->getMail()); ?>"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ : Mot de passe -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_password">
|
||||
Mot de passe *
|
||||
</label>
|
||||
<input
|
||||
class="form-control <?php if (isset($arrError['user_password'])) echo 'is-invalid'; ?>"
|
||||
type="password"
|
||||
id="user_password"
|
||||
name="user_password"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ : Confirmation du mot de passe -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="pwd_confirm">
|
||||
Confirmation du mot de passe *
|
||||
</label>
|
||||
<input
|
||||
class="form-control <?php if (isset($arrError['pwd_confirm'])) echo 'is-invalid'; ?>"
|
||||
type="password"
|
||||
id="pwd_confirm"
|
||||
name="pwd_confirm"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ optionnel : numéro de téléphone -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_phone">
|
||||
Téléphone
|
||||
</label>
|
||||
<input
|
||||
class="form-control"
|
||||
type="text"
|
||||
id="user_phone"
|
||||
name="user_phone"
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ optionnel : profession de l'utilisateur -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_work">
|
||||
Profession
|
||||
</label>
|
||||
<input
|
||||
class="form-control"
|
||||
type="text"
|
||||
id="user_work"
|
||||
name="user_work"
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ optionnel : localisation de l'utilisateur -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_location">
|
||||
Localisation
|
||||
</label>
|
||||
<input
|
||||
class="form-control"
|
||||
type="text"
|
||||
id="user_location"
|
||||
name="user_location"
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- Champ optionnel : phrase d'accroche / description courte -->
|
||||
<div class="col-12">
|
||||
<label class="form-label" for="user_description">
|
||||
Phrase d'accroche
|
||||
</label>
|
||||
<textarea
|
||||
class="form-control"
|
||||
id="user_description"
|
||||
name="user_description"
|
||||
rows="3"
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<!-- Lien vers la page de connexion -->
|
||||
<div class="col-12 text-center">
|
||||
<small class="text-secondary">
|
||||
Déjà un compte ?
|
||||
<a href="index.php?ctrl=user&action=login">Se connecter</a>
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<!-- Bouton de soumission -->
|
||||
<div class="col-12 d-grid mt-2">
|
||||
<button type="submit" class="btn btn-primary btn-lg rounded-3">
|
||||
Créer mon compte
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Champ : adresse e-mail -->
|
||||
|
|
@ -186,3 +378,5 @@
|
|||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,32 @@
|
|||
|
||||
<h2>coucou c'est le footer</h2>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
|
||||
<footer class="footer container-fluid d-flex justify-content-around">
|
||||
<div class="col-3">
|
||||
<ul>
|
||||
<li><a href="#">Découvrir</a>
|
||||
<li><a href="#">Customisation</a>
|
||||
<li><a href="#">Emploi</a>
|
||||
<li><a href="#">A propos</a>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<ul>
|
||||
<li><a href="#">Recruter</a>
|
||||
<li><a href="#">Partenariat</a>
|
||||
<li><a href="#">Blog</a>
|
||||
<li><a href="#">Aide et support</a>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<ul>
|
||||
<li><a href="#">Politique de confidentialité</a>
|
||||
<li><a href="#">Politique sur les données</a>
|
||||
<li><a href="#">CGU</a>
|
||||
<li><a href="#">CGV</a>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<p>Suivez-nous</p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -168,3 +168,28 @@
|
|||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
// Gestion de l'affichage des champs de date
|
||||
const periodRadios = document.querySelectorAll('input[name="period"]');
|
||||
const dateExact = document.getElementById('date-exact');
|
||||
const dateRange = document.getElementById('date-range');
|
||||
|
||||
function toggleDateFields() {
|
||||
const selectedPeriod = document.querySelector('input[name="period"]:checked').value;
|
||||
|
||||
if (selectedPeriod === '0') {
|
||||
dateExact.style.display = 'block';
|
||||
dateRange.style.display = 'none';
|
||||
} else {
|
||||
dateExact.style.display = 'none';
|
||||
dateRange.style.display = 'block';
|
||||
}
|
||||
}
|
||||
|
||||
periodRadios.forEach(radio => {
|
||||
radio.addEventListener('change', toggleDateFields);
|
||||
});
|
||||
|
||||
// Initialisation au chargement
|
||||
toggleDateFields();
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue