106 lines
3.8 KiB
Plaintext
106 lines
3.8 KiB
Plaintext
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<title>Dashboard Complexe - Smart Building</title>
|
||
<link rel="stylesheet" href="/styleComplexe.css" />
|
||
<script>
|
||
function toggleForm(id) {
|
||
const form = document.getElementById(id);
|
||
form.style.display = form.style.display === 'none' ? 'block' : 'none';
|
||
}
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<%- include('partials/header') %>
|
||
|
||
<main class="admin-container">
|
||
<h1>Gestion des objets</h1>
|
||
|
||
<div class="ajout-section">
|
||
<h2>Ajouter un objet <span class="toggle-btn" onclick="toggleForm('form-ajout-objet')">➕</span></h2>
|
||
<form id="form-ajout-objet" action="/complexe/ajouter-objet" method="POST" style="display: none;">
|
||
<input type="text" name="denomination" placeholder="Nom" required />
|
||
<input type="text" name="adresse_ip" placeholder="Adresse IP" required />
|
||
|
||
<select name="type" required>
|
||
<option value="Climatisation">Climatisation</option>
|
||
<option value="Lumière">Lumière</option>
|
||
<option value="thermostat">Thermostat</option>
|
||
<option value="securite">Sécurité</option>
|
||
<option value="Enceinte connectée">Enceinte connectée</option>
|
||
<option value="Capteur">Capteur</option>
|
||
<option value="appareil_menager">Appareil ménager</option>
|
||
<option value="Prise">Prise</option>
|
||
</select>
|
||
|
||
<select name="niveau">
|
||
<option value="débutant">Débutant</option>
|
||
<option value="intermédiaire">Intermédiaire</option>
|
||
<option value="avancé">Avancé</option>
|
||
<option value="expert">Expert</option>
|
||
</select>
|
||
|
||
<select name="etat">
|
||
<option value="Actif">Actif</option>
|
||
<option value="Inactif">Inactif</option>
|
||
</select>
|
||
|
||
<button type="submit">Ajouter</button>
|
||
</form>
|
||
</div>
|
||
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Nom</th>
|
||
<th>Adresse IP</th>
|
||
<th>Type</th>
|
||
<th>Niveau</th>
|
||
<th>État</th>
|
||
<th>Modifier</th>
|
||
<th>Supprimer</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<% objets.forEach(objet => { %>
|
||
<tr>
|
||
<form action="/complexe/update-objet" method="POST">
|
||
<input type="hidden" name="adresse_ip" value="<%= objet.adresse_ip %>" />
|
||
<td><%= objet.denomination %></td>
|
||
<td><%= objet.adresse_ip %></td>
|
||
<td><%= objet.type %></td>
|
||
<td>
|
||
<select name="niveau">
|
||
<option value="débutant" <%= objet.niveau === 'débutant' ? 'selected' : '' %>>Débutant</option>
|
||
<option value="intermédiaire" <%= objet.niveau === 'intermédiaire' ? 'selected' : '' %>>Intermédiaire</option>
|
||
<option value="avancé" <%= objet.niveau === 'avancé' ? 'selected' : '' %>>Avancé</option>
|
||
<option value="expert" <%= objet.niveau === 'expert' ? 'selected' : '' %>>Expert</option>
|
||
</select>
|
||
</td>
|
||
<td>
|
||
<select name="etat">
|
||
<option value="Actif" <%= objet.etat === 'Actif' ? 'selected' : '' %>>Actif</option>
|
||
<option value="Inactif" <%= objet.etat === 'Inactif' ? 'selected' : '' %>>Inactif</option>
|
||
</select>
|
||
</td>
|
||
<td>
|
||
<button type="submit">Modifier</button>
|
||
</td>
|
||
</form>
|
||
<td>
|
||
<form action="/complexe/supprimer-objet" method="POST" onsubmit="return confirm('Supprimer cet objet ?')">
|
||
<input type="hidden" name="adresse_ip" value="<%= objet.adresse_ip %>">
|
||
<button type="submit" style="background-color: #e74c3c; color: white;">Supprimer</button>
|
||
</form>
|
||
</td>
|
||
</tr>
|
||
<% }) %>
|
||
</tbody>
|
||
</table>
|
||
</main>
|
||
|
||
<%- include('partials/footer') %>
|
||
</body>
|
||
</html>
|