lego/back-end/src/templates/member.ejs
2024-12-04 21:39:43 +00:00

200 lines
4.9 KiB
Plaintext

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>
<%= member.name %>
</title>
<%- include('partials/links.ejs') %>
<style>
#box-register-form {
display: flex;
flex-direction: column;
max-width: max(30vw, 60ch);
margin: auto;
}
#box-register-form select,
#box-register-form input {
padding: .5rem 1rem;
}
i {
color: var(--bg);
}
</style>
<script>
function removeBox(id) {
fetch(window.location.origin + '/boxes/' + id + '/' + <%= member.id_member %>, {method: 'DELETE'}).then(r => window.location.reload());
}
</script>
</head>
<body>
<%- include('partials/header.ejs') %>
<main>
<h1>
<%= member.name %>
</h1>
<hr>
<h2>Caractéristiques</h2>
<pre>
id: <%= member.id_member%>
name: <%= member.name%>
</pre>
<h2>Enregistrer une boite</h2>
<form name="title" action="/boxes/register" id="box-register-form" method="POST">
<input type="hidden" name="id_member" id="id_member" value="<%= member.id_member %>">
<label for="id_box">Nom de la boite</label>
<select name="id_box" id="id_box">
<% allboxes.forEach(function(box) { %>
<option value="<%=box.id%>">
<%=box.title%>
</option>
<% }); %>
</select>
<label for="quantity">Quantité</label>
<input type="number" name="quantity" min="1" step="1" id="quantity" value="1">
<input type="submit" value="Ajouter">
</form>
<h2>Liste des boites enregistrées</h2>
<div class="table">
<table>
<thead>
<tr>
<th>Id</th>
<th>Nom</th>
<th>Nombre de pièces</th>
<th>Quantité</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<% boxes.forEach(function(box) { %>
<tr>
<td>
<%=box.first.id%>
</td>
<td>
<%=box.first.title%>
</td>
<td><%- box.first.pieces.reduce( (p,q)=> p + q.second, 0
)
-%></td>
<td>
<%=box.second%>
</td>
<td><a href="/boxes/byid/<%=box.first.id%>"><i class="fa-solid fa-eye"></i></a></td>
<td><button onclick="removeBox(<%=box.first.id%>)"><i class="fa-solid fa-trash"></i></button></td>
</tr>
<% }); %>
</tbody>
</table>
<div class="box"></div>
</div>
<h2>
Liste des pièces achetées
</h2>
<div class="table">
<table>
<thead>
<tr>
<th>Id Pièce</th>
<th>Couleur</th>
<th>Motif</th>
<th>Forme</th>
<th>Quantité</th>
</tr>
</thead>
<tbody>
<% pieces.forEach(function(p) { %>
<tr>
<td>
<%=p.first.id_piece%>
</td>
<td>
<%=p.first.colour.name%> (<%=p.first.colour.id_colour%>)
</td>
<td>
<%=p.first.pattern.name%> (<%=p.first.pattern.id_pattern%>)
</td>
<td>
<%=p.first.shape.name%> (<%=p.first.shape.id_shape%>)
</td>
<td>
<%=p.second%>
</td>
</tr>
<% }); %>
</tbody>
</table>
<div class="box"></div>
</div>
<h2>Liste des modèles faisables</h2>
<div class="table">
<table>
<thead>
<tr>
<th>Id modèle</th>
<th>Nom modèle</th>
<th>Proposé par</th>
<th></th>
</tr>
</thead>
<tbody>
<% models.forEach(function(model) { %>
<tr>
<td>
<%=model.id%>
</td>
<td>
<%=model.name%>
</td>
<% if (model.creator===undefined) {%>
<td></td>
<% } else {%>
<td><a href="/membres/byid/<%=model.creator.id_member%>"><i class="fa-solid fa-user"></i>
<%=model.creator.name%>
</a></td>
<% } %>
<td><a href="/models/byname/<%=model.name%>"><i class="fa-solid fa-eye"></i></a></td>
</tr>
<% }); %>
</tbody>
</table>
<div class="box"></div>
</div>
</main>
</body>
</html>