46 lines
2.2 KiB
Plaintext
46 lines
2.2 KiB
Plaintext
<div class="page-header mb-4">
|
|
<h1>💙 Favorieten</h1>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<div class="row g-3 mb-4" data-product-filter>
|
|
<div class="col-md-8">
|
|
<label class="form-label" for="favorite-search">Zoek op naam</label>
|
|
<input id="favorite-search" class="form-control" type="search" placeholder="Bijv. melk" data-product-search>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" for="favorite-category-filter">Filter op categorie</label>
|
|
<select id="favorite-category-filter" class="form-select" data-product-category>
|
|
<option value="">Alle categorieën</option>
|
|
<% (categories || []).forEach(category => { %>
|
|
<option value="<%= category.id %>"><%= category.icon || "" %> <%= category.name %></option>
|
|
<% }); %>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<% if (favorites.length === 0) { %>
|
|
<p class="text-secondary">Je hebt nog geen favoriete producten.</p>
|
|
<% } else { %>
|
|
<div class="list-group" data-product-list>
|
|
<% favorites.forEach(product => { %>
|
|
<div class="list-group-item d-flex justify-content-between align-items-center gap-3"
|
|
data-product-row
|
|
data-product-name="<%= product.name.toLowerCase() %>"
|
|
data-product-category="<%= product.category_id || '' %>">
|
|
<div>
|
|
<strong><%= product.category_icon || "" %> <%= product.name %></strong>
|
|
<div class="text-secondary"><%= product.category_name || "Geen categorie" %></div>
|
|
</div>
|
|
|
|
<form method="post" action="/favorites/<%= product.id %>/delete">
|
|
<button class="btn btn-sm btn-outline-danger" type="submit">Verwijder</button>
|
|
</form>
|
|
</div>
|
|
<% }); %>
|
|
</div>
|
|
<p class="text-secondary mt-3 d-none" data-product-empty>Geen favorieten gevonden.</p>
|
|
<% } %>
|
|
</div>
|
|
</div>
|