presque fini la maquette

This commit is contained in:
2024-10-03 14:41:01 +02:00
parent 7eee8c25a3
commit aa92bae41a
9 changed files with 433 additions and 26 deletions

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Création de portefeuille</title>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>
<div class="w3-container">
<header class="w3-bar w3-light-grey w3-padding">
<nav class="w3-left" style="display: flex;flex-direction: column;">
<button class="w3-bar-item w3-button w3-border w3-border-black w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_gestion_portefeuilles.html'">Profil</button>
<button class="w3-button w3-border w3-border-black w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_liste_employes.html'">Accès des employés</button>
<button class="w3-button w3-yellow w3-border w3-border-black w3-round-xlarge w3-margin-bottom">Créer des portefeuilles</button>
</nav>
<h2 class="w3-bar-item w3-display-topmiddle">Liste des employés</h2>
<span class="w3-bar-item w3-right w3-button w3-border w3-border-black w3-border w3-round-xlarge w3-margin-bottom">Déconnexion</span>
</header>
<div class="w3-container w3-padding w3-margin-top">
<h3 class="w3-center">Créer un nouveau portefeuille</h3>
<form class="w3-container">
<label for="portfolioName">Nom du portefeuille :</label>
<input class="w3-input w3-border" type="text" id="portfolioName" required>
<label for="portfolioDescription">Description :</label>
<input class="w3-input w3-border" type="text" id="portfolioDescription" required>
<button class="w3-button w3-green w3-margin-top w3-round-xlarge">Créer</button>
</form>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gestion des portefeuilles</title>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>
<div class="w3-container">
<header class="w3-bar w3-light-grey w3-padding">
<nav class="w3-left" style="display: flex;flex-direction: column;">
<button class="w3-bar-item w3-button w3-border w3-border-black w3-yellow w3-round-xlarge w3-margin-bottom">Profil</button>
<button class="w3-button w3-border w3-border-black w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_liste_employes.html'">Accès des employés</button>
<button class="w3-button w3-border w3-border-black w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_creation_portefeuille.html'">Créer des portefeuilles</button>
</nav>
<h2 class="w3-bar-item w3-display-topmiddle">Liste des employés</h2>
<span class="w3-bar-item w3-right w3-button w3-border w3-border-black w3-border w3-round-xlarge w3-margin-bottom">Déconnexion</span>
</header>
<div class="w3-container w3-padding w3-margin-top">
<h3 class="w3-center">Liste des portefeuilles</h3>
<div class="w3-container w3-padding">
<div class="w3-container w3-border w3-margin-bottom w3-border-black w3-round-xlarge">
<h4>Portefeuille 1</h4>
<p>Description du portefeuille</p>
<div class="w3-right">
<button class="w3-button w3-blue w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_info_portefeuille.html'">Voir les détails</button>
<button class="w3-button w3-red w3-round-xlarge w3-margin-bottom" onclick="document.getElementById('deleteModal').style.display='block'">Supprimer</button>
</div>
</div>
<div class="w3-container w3-border w3-margin-bottom w3-border-black w3-round-xlarge">
<h4>Portefeuille 2</h4>
<p>Description du portefeuille</p>
<div class="w3-right">
<button class="w3-button w3-blue w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_info_portefeuille.html'">Voir les détails</button>
<button class="w3-button w3-red w3-round-xlarge w3-margin-bottom" onclick="document.getElementById('deleteModal').style.display='block'">Supprimer</button>
</div>
</div>
</div>
</div>
<!-- Pop-up de confirmation pour suppression -->
<div id="deleteModal" class="w3-modal">
<div class="w3-modal-content w3-animate-top w3-card">
<header class="w3-container w3-red">
<h2>Confirmation</h2>
</header>
<div class="w3-container">
<p>Êtes-vous sûr de vouloir supprimer ce portefeuille ?</p>
</div>
<footer class="w3-container w3-padding">
<button class="w3-button w3-red w3-round-xlarge" onclick="document.getElementById('deleteModal').style.display='none'">Annuler</button>
<button class="w3-button w3-green w3-round-xlarge" onclick="document.getElementById('deleteModal').style.display='none'">Confirmer</button>
</footer>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Information du portefeuille</title>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>
<!-- Conteneur principal -->
<div class="w3-container">
<header class="w3-bar w3-light-grey w3-padding">
<a href="manager_gestion_portefeuilles.html" class="w3-bar-item w3-button w3-left w3-border w3-border-black w3-round-xlarge w3-margin-bottom">Retour</a>
<h2 class="w3-bar-item w3-display-topmiddle">Information du portefeuille</h2>
</header>
<!-- Détails du portefeuille -->
<div class="w3-card w3-margin">
<div class="w3-container w3-padding">
<h3>Nom du portefeuille</h3>
<p><strong>Nom du manager :</strong> ...</p>
<p><strong>Prénom du manager :</strong> ...</p>
<p><strong>Mail du manager :</strong> ...</p>
<p><strong>Nom du responsable de portefeuille :</strong> ...</p>
<p><strong>Prénom du responsable :</strong> ...</p>
<p><strong>Mail du responsable :</strong> ...</p>
<!-- Liste des employés et clients -->
<nav style="display: flex;">
<div class="w3-padding" style="display: flex;flex-direction: column;">
<label for="employes">Employés :</label>
<select id="employes" class="w3-select" name="employes">
<option value="">Liste des employés</option>
</select>
</div>
<div class="w3-padding" style="display: flex;flex-direction: column;">
<label for="ajouter">Ajouter :</label>
<select id="ajouter" class="w3-select" name="ajouter">
<option value="">Liste des employés</option>
</select>
</div>
<div class="w3-padding" style="display: flex;flex-direction: column;">
<label for="supprimer">Supprimer :</label>
<select id="supprimer" class="w3-select" name="supprimer">
<option value="">Liste des employés</option>
</select>
</div>
</nav>
<nav style="display: flex;">
<div class="w3-padding" style="display: flex;flex-direction: column;">
<label for="clients" class="w3-margin-top">Clients :</label>
<select id="clients" class="w3-select" name="clients">
<option value="">Liste des clients</option>
</select>
</div>
<div class="w3-padding" style="display: flex;flex-direction: column;">
<label for="ajouter" class="w3-margin-top">Ajouter :</label>
<select id="ajouter" class="w3-select" name="ajouter">
<option value="">Liste des clients</option>
</select>
</div>
<div class="w3-padding" style="display: flex;flex-direction: column;">
<label for="supprimer" class="w3-margin-top">Supprimer :</label>
<select id="supprimer" class="w3-select" name="supprimer">
<option value="">Liste des clients</option>
</select>
</div>
</nav>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,109 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Liste des employés</title>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script>
// Fonction pour ouvrir la pop-up
function openModal() {
document.getElementById('portfolioModal').style.display='block';
}
// Fonction pour fermer la pop-up
function closeModal() {
document.getElementById('portfolioModal').style.display='none';
}
</script>
</head>
<body>
<div class="w3-container">
<header class="w3-bar w3-light-grey w3-padding">
<nav class="w3-left" style="display: flex; flex-direction: column;">
<button class="w3-bar-item w3-button w3-border w3-border-black w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_gestion_portefeuilles.html'">Profil</button>
<button class="w3-button w3-yellow w3-border w3-border-black w3-round-xlarge w3-margin-bottom">Accès des employés</button>
<button class="w3-button w3-border w3-border-black w3-round-xlarge w3-margin-bottom" onclick="location.href='manager_creation_portefeuille.html'">Créer des portefeuilles</button>
</nav>
<h2 class="w3-bar-item w3-display-topmiddle">Liste des employés</h2>
<span class="w3-bar-item w3-right w3-button w3-border w3-border-black w3-border w3-round-xlarge w3-margin-bottom">Déconnexion</span>
</header>
<!-- Zone de filtre pour recherche -->
<div class="w3-container w3-padding w3-margin-top">
<h4>Filtrer les employés</h4>
<input class="w3-input w3-border" type="text" placeholder="Rechercher par nom ou prénom">
<button class="w3-button w3-blue w3-margin-top w3-round-xlarge">Rechercher</button>
</div>
<div class="w3-container w3-padding w3-margin-top">
<h3 class="w3-center">Liste des employés</h3>
<div class="w3-container w3-padding ">
<div class="w3-container w3-border w3-border-black w3-round-xlarge w3-margin-bottom">
<img src="avatar1.jpg" alt="Avatar" class="w3-circle" style="width:50px;height:50px; float:left; margin-right: 15px;">
<h4 style="margin: 0;">Nom: Dupont</h4>
<p style="margin: 0;">Prénom: Jean</p>
<p style="margin: 0;">Date de naissance: 01/01/1990</p>
<p style="margin: 0;">Lieu de vie: Paris</p>
<p style="margin: 0;">Email: employe1@example.com</p>
<div class="w3-right">
<button class="w3-button w3-blue w3-round-xlarge w3-margin-bottom">Voir les détails</button>
<button class="w3-button w3-green w3-round-xlarge w3-margin-bottom" onclick="openModal()">Contrôle Portefeuille</button>
</div>
</div>
<div class="w3-container w3-border w3-border-black w3-round-xlarge w3-margin-bottom">
<img src="avatar2.jpg" alt="Avatar" class="w3-circle" style="width:50px;height:50px; float:left; margin-right: 15px;">
<h4 style="margin: 0;">Nom: Martin</h4>
<p style="margin: 0;">Prénom: Alice</p>
<p style="margin: 0;">Date de naissance: 02/02/1992</p>
<p style="margin: 0;">Lieu de vie: Lyon</p>
<p style="margin: 0;">Email: employe2@example.com</p>
<div class="w3-right">
<button class="w3-button w3-blue w3-round-xlarge w3-margin-bottom">Voir les détails</button>
<button class="w3-button w3-green w3-round-xlarge w3-margin-bottom" onclick="openModal()">Contrôle Portefeuille</button>
</div>
</div>
<div class="w3-container w3-border w3-border-black w3-round-xlarge w3-margin-bottom">
<img src="avatar3.jpg" alt="Avatar" class="w3-circle" style="width:50px;height:50px; float:left; margin-right: 15px;">
<h4 style="margin: 0;">Nom: Bernard</h4>
<p style="margin: 0;">Prénom: Sophie</p>
<p style="margin: 0;">Date de naissance: 03/03/1991</p>
<p style="margin: 0;">Lieu de vie: Marseille</p>
<p style="margin: 0;">Email: employe3@example.com</p>
<div class="w3-right">
<button class="w3-button w3-blue w3-round-xlarge w3-margin-bottom">Voir les détails</button>
<button class="w3-button w3-green w3-round-xlarge w3-margin-bottom" onclick="openModal()">Contrôle Portefeuille</button>
</div>
</div>
<!-- Ajoute d'autres employés si nécessaire -->
</div>
</div>
<!-- Pop-up de confirmation pour contrôle de portefeuille -->
<div id="portfolioModal" class="w3-modal">
<div class="w3-modal-content w3-animate-top w3-card">
<header class="w3-container w3-blue">
<h2>Liste des employés du portefeuille</h2>
</header>
<div class="w3-container">
<p>Choisissez un employé :</p>
<label for="employeeList">Liste des employés :</label>
<select id="employeeList" class="w3-select w3-border">
<option value="" disabled selected>Choisissez un employé</option>
<option value="employe1">Employé 1</option>
<option value="employe2">Employé 2</option>
<option value="employe3">Employé 3</option>
</select>
</div>
<footer class="w3-container w3-padding">
<button class="w3-button w3-red w3-round-xlarge" onclick="closeModal()">Annuler</button>
<button class="w3-button w3-green w3-round-xlarge" onclick="closeModal()">Confirmer</button>
</footer>
</div>
</div>
</div>
</body>
</html>