Compare commits

...

4 Commits

11 changed files with 637 additions and 220 deletions

View File

@@ -83,7 +83,24 @@
</tr> </tr>
</thead> </thead>
<tbody id="categoriesTableBody"> <tbody id="categoriesTableBody">
<!-- rempli en JS --> <tr>
<td>Soins</td>
<td class="text-end">
<a href="modifier_categorie.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<a href="index.php" class="btn btn-sm btn-outline-danger" role="button" data-bs-toggle="modal"
data-bs-target="#confirmDeleteModal">Supprimer</a>
</td>
</tr>
<tr>
<td>Alimentation</td>
<td class="text-end">
<a href="modifier_categorie.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<a href="index.php" class="btn btn-sm btn-outline-danger" role="button" data-bs-toggle="modal"
data-bs-target="#confirmDeleteModal">Supprimer</a>
</td>
</tr>
</tbody> </tbody>
</table> </table>
</section> </section>
@@ -115,7 +132,8 @@
<a href="modifier_article.html" <a href="modifier_article.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a> class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> <a href="index.php" class="btn btn-sm btn-outline-danger" role="button" data-bs-toggle="modal"
data-bs-target="#confirmDeleteModal">Supprimer</a>
</td> </td>
</tr> </tr>
<tr> <tr>
@@ -125,7 +143,8 @@
class="btn btn-sm btn-outline-success me-1">Facebook</a> class="btn btn-sm btn-outline-success me-1">Facebook</a>
<a href="modifier_article.html" <a href="modifier_article.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a> class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> <a href="index.php" class="btn btn-sm btn-outline-danger" role="button" data-bs-toggle="modal"
data-bs-target="#confirmDeleteModal">Supprimer</a>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@@ -143,7 +162,26 @@
</div> </div>
</footer> </footer>
<div class="modal fade" id="confirmDeleteModal" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Confirmer la suppression</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
Êtes-vous sûr de vouloir supprimer cette catégorie ou cet article ? Cette action est irréversible.
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
<button type="button" class="btn btn-danger" id="confirmDeleteBtn"> Supprimer</button>
</div>
</div>
</div>
</div>
</div>
<script src="/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script> <script src="/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="/js/confirmDelete.js"></script>
</body> </body>
</html> </html>

View File

@@ -1,29 +1,30 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Réinitialisation du mot de passe</title> <title>Réinitialisation du mot de passe</title>
<link <link href="/node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
rel="stylesheet" <link rel="shortcut icon" href="/favicon.png" type="image/png">
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
/>
<style> <style>
body { body {
background: #f4f6f981;
height: 100vh; height: 100vh;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.reset-password-card { .reset-password-card {
width: 100%; width: 100%;
max-width: 380px; max-width: 380px;
} }
</style> </style>
</head> </head>
<body>
<body>
<div class="card shadow reset-password-card"> <div class="card shadow reset-password-card">
<div class="card-body p-4"> <div class="card-body p-4">
<h1 class="text-center mb-4 fs-3">Nouveau mot de passe</h1> <h1 class="text-center mb-4 fs-3">Nouveau mot de passe</h1>
@@ -33,38 +34,21 @@
</p> </p>
<div
id="errorMsg"
class="alert alert-danger text-center fs-1"
style="display: none"
>
Les mots de passe ne correspondent pas.
</div>
<form id="resetForm">
<form id="password-form">
<main>
<div class="mb-4"> <div class="mb-4">
<label class="form-label" <label class="form-label">Nouveau mot de passe <br><span class="small"><span id="min8">8 caractères minimum</span>, incluant une <span id="uppercase">majuscule</span>, une <span id="lowercase">minuscule</span> et un <span id="digit">chiffre</span></span></label>
>Nouveau mot de passe (minimum 8 caractères)</label <input type="password" class="form-control" id="password" required />
>
<input
type="password"
class="form-control"
id="password"
required
/>
<small id="passwordIndicator" class="fw-bold"></small>
</div> </div>
<div class="mb-2">
<label class="form-label">Confirmer le mot de passe</label>
<input type="password" class="form-control" id="passwordConfirm" required />
</div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label"
>Confirmer le mot de passe</label
>
<input
type="password"
class="form-control"
id="confirmPassword"
required
/>
<label for="showPassword" class="mt-3"> <label for="showPassword" class="mt-3">
<input type="checkbox" id="showPassword" /> <input type="checkbox" id="showPassword" />
Voir le mot de passe Voir le mot de passe
@@ -75,26 +59,19 @@
<div
id="successMsg"
class="alert alert-success text-center"
style="display: none"
>
Votre mot de passe a été modifié avec succès !
</div>
<button class="btn btn-primary w-100" type="submit"> <button class="btn btn-primary w-100" type="submit">
Changer le mot de passe Changer le mot de passe
</button> </button>
<div class="text-center mt-3"> <div class="text-center mt-3">
<a <a href="../html/page_de_connexion.html" class="text-decoration-none">Retour à la connexion</a>
href="../html/page_de_connexion.html"
class="text-decoration-none"
>Retour à la connexion</a
</form> </form>
</main>
</div> </div>
</div> </div>
<script src="../js/reinitialisation_du_mot_de_passe.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> <script src="/js/password.js"></script>
</body> </body>
</html> </html>

View File

@@ -40,7 +40,7 @@ form.addEventListener('submit', function(e) {
if (pass.length < minLength) { if (pass.length < minLength) {
errorMsg.style.display = 'block'; errorMsg.style.display = 'block';
errorMsg.textContent = `Le mot de passe doit contenir au moins ${minLength} caractères.`; errorMsg.textContent = `Le mot de passe doit contenir au moins ${minLength} caractères.`;
return; return;8 caractères minimum
} }
//Correspondance //Correspondance
@@ -61,7 +61,7 @@ form.addEventListener('submit', function(e) {
showPasswordCheckbox.addEventListener('change', function() { showPasswordCheckbox.addEventListener('change', function() {
if (this.checked) { if (this.checked) {8 caractères minimum
password.type = 'text'; password.type = 'text';
confirmPassword.type = 'text'; confirmPassword.type = 'text';

View File

@@ -167,6 +167,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>

99
js/password.js Normal file
View File

@@ -0,0 +1,99 @@
/**
* Verification et gestion du mot de passe lors de la réinitialisation
*/
const PASSWORD_LENGTH = 8;
const PASSWORD_CONTENT = ['[A-Z]', '[a-z]', '[0-9]'];
const passwordElt = document.getElementById('password');
const confirmPasswordElt = document.getElementById('passwordConfirm');
const min8Elt = document.getElementById('min8');
const uppercaseElt = document.getElementById('uppercase');
const lowercaseElt = document.getElementById('lowercase');
const digitElt = document.getElementById('digit');
const specialElt = document.getElementById('special');
//Pattern du mot de passe
passwordElt.addEventListener('input', function() {
const password = passwordElt.value;
// Vérification de la longueur
if (password.length >= PASSWORD_LENGTH) {
min8Elt.style.color = 'green';
} else {
min8Elt.style.color = 'red';
}
// Vérification du contenu
PASSWORD_CONTENT.forEach((pattern, index) => {
const regex = new RegExp(pattern);
const element = [uppercaseElt, lowercaseElt, digitElt, specialElt][index];
if (regex.test(password)) {
element.style.color = 'green';
} else {
element.style.color = 'red';
}
});
});
// Vérification de la confirmation du mot de passe
confirmPasswordElt.addEventListener('input', function() {
const password = passwordElt.value;
const confirmPassword = confirmPasswordElt.value;
if (password === confirmPassword) {
confirmPasswordElt.style.borderColor = 'green';
} else {
confirmPasswordElt.style.borderColor = 'red';
}
});
// Afficher ou masquer le mot de passe
const showPasswordElt = document.getElementById('showPassword');
showPasswordElt.addEventListener('change', function() {
if (showPasswordElt.checked) {
passwordElt.type = 'text';
confirmPasswordElt.type = 'text';
} else {
passwordElt.type = 'password';
confirmPasswordElt.type = 'password';
}
});
// Gestion de la soumission du formulaire
const passwordForm = document.getElementById('password-form');
passwordForm.addEventListener('submit', function(event) {
const password = passwordElt.value;
const confirmPassword = confirmPasswordElt.value;
// Empêcher la soumission si les critères ne sont pas remplis
if (password.length < PASSWORD_LENGTH ||
!/[A-Z]/.test(password) ||
!/[a-z]/.test(password) ||
!/[0-9]/.test(password) ||
password !== confirmPassword) {
event.preventDefault();
const main = document.querySelector('main');
const existingAlert = main.querySelector('#password-alert');
if (existingAlert) {
existingAlert.remove();
}
const alertElt = document.createElement('div');
alertElt.id = 'password-alert';
alertElt.className = 'alert alert-danger text-center';
alertElt.textContent = "Le mot de passe ne respecte pas les critères requis ou la confirmation ne correspond pas.";
main.prepend(alertElt);
window.scrollTo(0, 0);
}
});

15
package-lock.json generated
View File

@@ -19,7 +19,6 @@
"version": "2.11.8", "version": "2.11.8",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
"license": "MIT",
"peer": true, "peer": true,
"funding": { "funding": {
"type": "opencollective", "type": "opencollective",
@@ -40,7 +39,6 @@
"url": "https://opencollective.com/bootstrap" "url": "https://opencollective.com/bootstrap"
} }
], ],
"license": "MIT",
"peerDependencies": { "peerDependencies": {
"@popperjs/core": "^2.11.8" "@popperjs/core": "^2.11.8"
} }
@@ -58,7 +56,6 @@
"version": "19.2.1", "version": "19.2.1",
"resolved": "https://registry.npmjs.org/react/-/react-19.2.1.tgz", "resolved": "https://registry.npmjs.org/react/-/react-19.2.1.tgz",
"integrity": "sha512-DGrYcCWK7tvYMnWh79yrPHt+vdx9tY+1gPZa7nJQtO/p8bLTDaHp4dzwEhQB7pZ4Xe3ok4XKuEPrVuc+wlpkmw==", "integrity": "sha512-DGrYcCWK7tvYMnWh79yrPHt+vdx9tY+1gPZa7nJQtO/p8bLTDaHp4dzwEhQB7pZ4Xe3ok4XKuEPrVuc+wlpkmw==",
"license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
"node": ">=0.10.0" "node": ">=0.10.0"
@@ -68,7 +65,6 @@
"version": "19.2.1", "version": "19.2.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.1.tgz", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.1.tgz",
"integrity": "sha512-ibrK8llX2a4eOskq1mXKu/TGZj9qzomO+sNfO98M6d9zIPOEhlBkMkBUBLd1vgS0gQsLDBzA+8jJBVXDnfHmJg==", "integrity": "sha512-ibrK8llX2a4eOskq1mXKu/TGZj9qzomO+sNfO98M6d9zIPOEhlBkMkBUBLd1vgS0gQsLDBzA+8jJBVXDnfHmJg==",
"license": "MIT",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
"scheduler": "^0.27.0" "scheduler": "^0.27.0"
@@ -81,20 +77,17 @@
"version": "0.27.0", "version": "0.27.0",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
"integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==", "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
"license": "MIT",
"peer": true "peer": true
}, },
"node_modules/tinymce": { "node_modules/tinymce": {
"version": "8.3.0", "version": "8.2.2",
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-8.3.0.tgz", "resolved": "https://registry.npmjs.org/tinymce/-/tinymce-8.2.2.tgz",
"integrity": "sha512-9IjrEo8HD5mg9QP6/rKcPSIcyRNVSf5eiYTqapb/q1zAIoISRJgI2DJUs4CJgZvio0hmEH394xSHUJuoGf4Msw==", "integrity": "sha512-CFDSZwciMvFGW2czK/Xig1HcOGpXI0qcQMIqaIcG2F4RuuTdf+LQTreyEZunAJoFTQ9L0KAugOqL7OA5TJkoAA=="
"license": "SEE LICENSE IN license.md"
}, },
"node_modules/tinymce-i18n": { "node_modules/tinymce-i18n": {
"version": "25.11.17", "version": "25.11.17",
"resolved": "https://registry.npmjs.org/tinymce-i18n/-/tinymce-i18n-25.11.17.tgz", "resolved": "https://registry.npmjs.org/tinymce-i18n/-/tinymce-i18n-25.11.17.tgz",
"integrity": "sha512-Fi5hGRDL9o42VsdahgNgHRHO/4ClAAqIew45QMu8sa5LQT2wTaVPf/tAXnVDHxR7c6NWZQmZp/E18LosxLq42A==", "integrity": "sha512-Fi5hGRDL9o42VsdahgNgHRHO/4ClAAqIew45QMu8sa5LQT2wTaVPf/tAXnVDHxR7c6NWZQmZp/E18LosxLq42A=="
"license": "MIT"
} }
} }
} }

View File

@@ -3,17 +3,18 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ajouter une prestation</title>
<link rel="stylesheet" href="/css/prestation.css">
<link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">
<title>Ajouter une préstation</title>
<link href="../../node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="node_modules/bs-icon/icons.css">
<link rel="shortcut icon" href="favicon.png" type="image/png">
<link rel="stylesheet" href="../../css/style.css">
</head> </head>
<body> <body>
<header> <header>
<nav class="navbar navbar-expand-xl bg-body-tertiary shadow-sm"> <nav class="navbar navbar-expand-xxl bg-body-tertiary shadow-sm">
<div class="container-fluid align-items-center"> <div class="container-fluid align-items-center">
<a class="navbar-brand" href="#">L'Il'eau chiens - Admin</a> <a class="navbar-brand" href="#">L'Il'eau chiens - Admin</a>
@@ -24,18 +25,30 @@
</button> </button>
<div class="collapse navbar-collapse" id="navbarSupportedContent"> <div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- MENU GAUCHE -->
<ul class="navbar-nav me-auto mb-2 mb-lg-0"> <ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item"><a class="nav-link active" href="#">Blog</a></li> <li class="nav-item">
<li class="nav-item"><a class="nav-link" href="#">Boutique</a></li> <a class="nav-link active left-label" aria-current="page" href="#">Blog</a>
<li class="nav-item"><a class="nav-link" href="#">Prestations</a></li> </li>
<li class="nav-item"><a class="nav-link" href="#">FAQ</a></li> <li class="nav-item">
<li class="nav-item"><a class="nav-link" href="#">Fiche de renseignements</a></li> <a class="nav-link left-label" href="#">Boutique</a>
<li class="nav-item"><a class="nav-link" href="#">Partenaires</a></li> </li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Prestations</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">FAQ</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Fiche renseignements</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Partenaires</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Citations</a>
</li>
</ul> </ul>
<!-- MENU DROIT -->
<ul class="navbar-nav ms-auto mb-2 mb-lg-0"> <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-megaphone me-1"></i> Message d'actu</a> <a class="nav-link" href="#"><i class="bi bi-megaphone me-1"></i> Message d'actu</a>
@@ -46,12 +59,12 @@
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-gear me-1"></i> Configuration</a> <a class="nav-link" href="#"><i class="bi bi-gear me-1"></i> Configuration</a>
</li> </li>
<li class="nav-item dropdown"> <li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="userMenu" data-bs-toggle="dropdown"> <a class="nav-link dropdown-toggle" href="#" id="userMenu" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-person-circle me-1"></i> <span id="userFirstName">Prénom</span> <i class="bi bi-person-circle me-1"></i> <span id="userFirstName">Prénom</span>
</a> </a>
<ul class="dropdown-menu dropdown-menu-end"> <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userMenu">
<li><a class="dropdown-item" href="#">Profil</a></li> <li><a class="dropdown-item" href="#">Profil</a></li>
<li><hr class="dropdown-divider"></li> <li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Sortir</a></li> <li><a class="dropdown-item" href="#">Sortir</a></li>
@@ -62,56 +75,84 @@
</div> </div>
</div> </div>
</nav> </nav>
</header> </header>
<div class="container"> <main class="my-5 fs-6">
<h1 class="mb-5 text-center">Ajouter une prestation</h1> <div class="container">
<header>
<h1 class="title my-4 fs-2">Ajouter une prestation</h1>
<!-- Messages DOM --> <!-- Erreur champ vide -->
<div id="messages" class="mb-3"></div> <div id="errorEmpty" class="alert alert-danger d-none">Le titre est obligatoire.</div>
<!-- Erreur nom déjà existant -->
<div id="errorExists" class="alert alert-danger d-none">
Cette prestation existe déjà. Veuillez en choisir une autre.
</div>
<!-- Succès ajout -->
<div id="successMessage" class="alert alert-success d-none">
Prestation ajoutée avec succès !
</div>
</header>
<div class="section">
<form id="addCategoryForm"> <form id="addCategoryForm">
<div class="mb-4"> <div class="mb-4">
<label class="form-label fw-bold">Titre de la prestation (obligatoire)</label> <label class="form-label fw-bold" for="categoryName">
<input type="text" id="categoryName" class="form-control"> Titre de la prestation (obligatoire)
</label>
<input type="text" id="categoryName" class="form-control" required>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-bold">Type de prestation</label> <label class="form-label fw-bold" for="prestationType">
<select id="prestationType" class="form-select"> Type de prestation (obligatoire)
<option value="chien" selected>Chien</option> </label>
<select id="prestationType" class="form-select" required>
<option value="" selected disabled>-- Choisissez un type --</option>
<option value="chien">Chien</option>
<option value="chat">Chat</option> <option value="chat">Chat</option>
</select> </select>
</div> </div>
<!-- Étapes -->
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-bold">Description de la prestation</label> <label class="form-label fw-bold">Choisissez les étapes (obligatoire)</label>
<textarea id="prestationDescription" class="form-control" rows="5">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="stepCiseaux" name="steps" value="coupe_ciseaux">
<label class="form-check-label" for="stepCiseaux">Coupe ciseaux</label>
</textarea>
</div> </div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="stepGriffes" name="steps" value="coupe_griffes">
<label class="form-check-label" for="stepGriffes">Coupe griffes</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="stepSechage" name="steps" value="sechage_doux">
<label class="form-check-label" for="stepSechage">Séchage doux</label>
</div>
</div>
<!-- Tarifs -->
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-bold">Tarif (fourchette)</label> <label class="form-label fw-bold">Tarif (fourchette) (obligatoire)</label>
<div class="d-flex gap-3"> <div class="d-flex gap-3">
<input type="number" id="priceMin" class="form-control" placeholder="Prix min (€)" value="35"> <input type="number" id="priceMin" class="form-control" placeholder="Prix min (€)" value="35" required>
<input type="number" id="priceMax" class="form-control" placeholder="Prix max (€)" value="60"> <input type="number" id="priceMax" class="form-control" placeholder="Prix max (€)" value="60" required>
</div> </div>
</div> </div>
<div class="d-flex gap-3 mt-4"> <div class="d-flex gap-3 mt-4">
<a href="../liste_prestation/liste_prestation.html" class="btn btn-secondary w-50">Annuler</a> <a href="../html/prestation_accueil.html" class="btn btn-secondary w-50">Annuler</a>
<button type="submit" class="btn btn-primary w-50">Ajouter</button> <button type="submit" class="btn btn-primary w-50">Ajouter</button>
</div> </div>
</form> </form>
</div> </div>
</div>
</main>
<script src="ajouter_prestation.js"></script> <script src="../js/ajouter_prestation.js"></script>
<script src="/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script> <script src="../..
</body>
</html>

View File

@@ -6,13 +6,78 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gérer les prestations</title> <title>Gérer les prestations</title>
<link href="../../node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="../../node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="../../node_modules/bs-icon/icons.css"> <link rel="stylesheet" href="node_modules/bs-icon/icons.css">
<link rel="shortcut icon" href="favicon.png" type="image/png">
<link rel="stylesheet" href="../../css/style.css"> <link rel="stylesheet" href="../../css/style.css">
</head> </head>
<body> <body>
<div id="header-placeholder"></div> <header>
<nav class="navbar navbar-expand-xxl bg-body-tertiary">
<div class="container-fluid align-items-center">
<a class="navbar-brand" href="#">L'Il'eau chiens - Admin</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active left-label" aria-current="page" href="#">Blog</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Boutique</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Prestations</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">FAQ</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Fiche renseignements</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Partenaires</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Citations</a>
</li>
</ul>
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-megaphone me-1"></i> Message d'actu</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-box-arrow-up-right me-1"></i> Voir le site</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-gear me-1"></i> Configuration</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="userMenu" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-person-circle me-1"></i> <span id="userFirstName">Prénom</span>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userMenu">
<li><a class="dropdown-item" href="#">Profil</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#">Sortir</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main class="my-5 fs-6"> <main class="my-5 fs-6">
<div class="container"> <div class="container">
@@ -39,7 +104,7 @@
<section class="presta my-3"> <section class="presta my-3">
<h3 class="fs-4">Prestations</h3> <h3 class="fs-4">Prestations</h3>
<div class="mb-4 mt-2"> <div class="mb-4 mt-2">
<a href="../html/ajouter_avant_apres.html" class="btn btn-primary btn-sm"> <a href="../html/ajouter_prestation.html" class="btn btn-primary btn-sm">
Ajouter une prestation Ajouter une prestation
</a> </a>
</div> </div>
@@ -58,7 +123,8 @@
<td>Toilettage complet</td> <td>Toilettage complet</td>
<td class="text-end"> <td class="text-end">
<a href="#" class="btn btn-sm btn-outline-primary me-1">Modifier</a> <a href="../html/modifier_prestation.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button <button
class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button>
@@ -69,7 +135,8 @@
<td>Toilettage express</td> <td>Toilettage express</td>
<td class="text-end"> <td class="text-end">
<a href="#" class="btn btn-sm btn-outline-primary me-1">Modifier</a> <a href="../html/modifier_prestation.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button <button
class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button>
@@ -80,10 +147,10 @@
</section> </section>
<section class="carte my-3"> <section class="carte my-3">
<h3 class="fs-4 mt-4">Cartes</h3> <h3 class="fs-4 mt-4">Étapes</h3>
<div class="mb-4 mt-2"> <div class="mb-4 mt-2">
<a href="../html/ajouter_avant_apres.html" class="btn btn-primary btn-sm"> <a href="#" class="btn btn-primary btn-sm">
Ajouter une carte Ajouter une étape
</a> </a>
</div> </div>
@@ -115,6 +182,17 @@
</td> </td>
</tr> </tr>
<tr>
<td>Séchage doux</td>
<td class="text-end">
<a href="#" class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button
class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button>
</tr>
</tbody> </tbody>
</table> </table>
</section> </section>
@@ -135,7 +213,7 @@
<div class="accordion-body"> <div class="accordion-body">
<div class="mb-4 mt-2"> <div class="mb-4 mt-2">
<a href="../html/ajouter_avant_apres.html" class="btn btn-primary btn-sm"> <a href="../html/ajouter_slider.html" class="btn btn-primary btn-sm">
Ajouter un slider Ajouter un slider
</a> </a>
</div> </div>
@@ -149,10 +227,11 @@
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td><img src="slide1.webp" alt="Chien toiletté" class="img-thumbnail"></td> <td>Chien toiletté</td>
<td class="text-end"> <td class="text-end">
<a href="#" class="btn btn-sm btn-outline-primary me-1">Modifier</a> <a href="../html/modifier_slider.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button <button
class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button>
@@ -164,7 +243,8 @@
<td class="text-end"> <td class="text-end">
<a href="#" class="btn btn-sm btn-outline-primary me-1">Modifier</a> <a href="../html/modifier_slider.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button <button
class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button>
@@ -175,7 +255,8 @@
<td>Nouveauté</td> <td>Nouveauté</td>
<td class="text-end"> <td class="text-end">
<a href="#" class="btn btn-sm btn-outline-primary me-1">Modifier</a> <a href="../html/modifier_slider.html"
class="btn btn-sm btn-outline-primary me-1">Modifier</a>
<button <button
class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button> class="btn btn-sm btn-outline-danger delete-btn">Supprimer</button>
@@ -250,8 +331,6 @@
</main> </main>
<script src="../../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script> <script src="../../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="../components/js/header-composant.js"></script>
<script src="../components/js/delete-composant.js"></script>
</body> </body>
</html> </html>

View File

@@ -52,6 +52,7 @@ form.addEventListener("submit", function (e) {
// Redirection // Redirection
setTimeout(() => { setTimeout(() => {
window.location.href = "../liste_prestation/liste_prestation.html";
}, 1500); window.location.href = "../html/prestation_accueil.html";
}, 1500);
}); });

126
profil/html/profil.html Normal file
View File

@@ -0,0 +1,126 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Profil - L'Il'eau chiens - Admin</title>
<link href="/node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="/node_modules/bs-icon/icons.css">
<link rel="shortcut icon" href="/favicon.png" type="image/png">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/citations.css">
</head>
<body>
<header>
<nav class="navbar navbar-expand-xl bg-body-tertiary">
<div class="container-fluid align-items-center">
<a class="navbar-brand" href="#">L'Il'eau chiens - Admin</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item"><a class="nav-link left-label" aria-current="page" href="#">Blog</a></li>
<li class="nav-item"><a class="nav-link left-label" href="#">Boutique</a></li>
<li class="nav-item"><a class="nav-link left-label" href="#">Prestations</a></li>
<li class="nav-item"><a class="nav-link left-label" href="#">FAQ</a></li>
<li class="nav-item"><a class="nav-link left-label" href="#">Vétos</a></li>
<li class="nav-item"><a class="nav-link left-label" href="#">Citations</a></li>
<li class="nav-item"><a class="nav-link left-label" href="#">À propos</a></li>
</ul>
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item"><a class="nav-link" href="#"><i class="bi bi-megaphone me-1"></i> Message d'actu</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="bi bi-box-arrow-up-right me-1"></i> Voir le site</a></li>
<li class="nav-item"><a class="nav-link" href="#"><i class="bi bi-gear me-1"></i> Configuration</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="userMenu" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-person-circle me-1"></i> <span id="userFirstName">Prénom</span>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userMenu">
<li><a class="dropdown-item active" href="#">Profil</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Sortir</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main class="my-5 fs-6">
<div class="container">
<header>
<h1 class="title my-4 fs-2 text-center">Mon profil</h1>
</header>
<div class="content">
<section class="my-4">
<h2 class="fs-4 mb-3">Informations personnelles</h2>
<form class="row g-3" id="profile-info-form">
<div class="col-md-12">
<label for="lastName" class="form-label">Nom (obligatoire)</label>
<input type="text" class="form-control" id="lastName" name="lastName" placeholder="Votre nom" value="Nom de famille" required>
</div>
<div class="col-md-12">
<label for="firstName" class="form-label">Prénom (obligatoire)</label>
<input type="text" class="form-control" id="firstName" name="firstName" placeholder="Votre prénom" value="Sandrine" required>
</div>
<div class="col-12">
<label for="email" class="form-label">Email (obligatoire)</label>
<input type="email" class="form-control" id="email" name="email" placeholder="votre@email.com" value="sandrine@gmail.com">
</div>
<div class="col-12 d-flex justify-content-star">
<button type="submit" class="btn btn-primary">Modifier</button>
</div>
</form>
</section>
<section class="my-5">
<h2 class="fs-4">Mot de passe</h2>
<form class="row" id="password-form">
<div class="col-12 my-2">
<small class="text-muted">Laissez ces champs vides pour ne pas modifier votre mot de passe.</small>
</div>
<div class="col-12 mb-3">
<label for="password" class="form-label">Nouveau mot de passe (<span id="min8">8 caractères minimum</span>, incluant une <span id="uppercase">majuscule</span>, une <span id="lowercase">minuscule</span> et un <span id="digit">chiffre</span>)</label>
<input type="password" class="form-control" id="password" name="password" placeholder="Nouveau mot de passe">
</div>
<div class="col-12">
<label for="passwordConfirm" class="form-label">Confirmation</label>
<input type="password" class="form-control" id="passwordConfirm" name="passwordConfirm" placeholder="Confirmer le mot de passe">
</div>
<div class="col-12">
<label for="showPassword" class="mt-2 mb-3">
<input type="checkbox" id="showPassword" />
Voir le mot de passe
</label>
</div>
<div class="col-12 d-flex justify-content-star">
<button type="submit" class="btn btn-primary">Modifier</button>
</div>
</form>
</section>
</div>
</div>
</main>
<footer class="bg-body-tertiary py-4 mt-auto">
<div class="container d-flex gap-3 flex-wrap">
<span class="text-muted">© 2025 L'Il'eau chiens. Tous droits réservés.</span>
<a href="/pagesText/mentionsLégales.html" class="link-secondary">Mentions légales</a>
<a href="/pagesText/cgv.html" class="link-secondary">CGV</a>
</div>
</footer>
<script src="/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="/js/password.js"></script>
</body>
</html>

62
template-header.html Normal file
View File

@@ -0,0 +1,62 @@
<header>
<nav class="navbar navbar-expand-xxl bg-body-tertiary">
<div class="container-fluid align-items-center">
<a class="navbar-brand" href="#">L'Il'eau chiens - Admin</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active left-label" aria-current="page" href="#">Blog</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Boutique</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Prestations</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">FAQ</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Fiche renseignements</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Partenaires</a>
</li>
<li class="nav-item">
<a class="nav-link left-label" href="#">Citations</a>
</li>
</ul>
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-megaphone me-1"></i> Message d'actu</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-box-arrow-up-right me-1"></i> Voir le site</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-gear me-1"></i> Configuration</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="userMenu" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-person-circle me-1"></i> <span id="userFirstName">Prénom</span>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userMenu">
<li><a class="dropdown-item" href="#">Profil</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Sortir</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
</header>