Versie 1.0
This commit is contained in:
@@ -0,0 +1,35 @@
|
||||
<div class="page-header mb-4">
|
||||
|
||||
<h1>Categorie wijzigen</h1>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h2 class="card-title">Categoriegegevens</h2>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<form id="category-edit-form" method="post" action="/categories/<%= category.id %>">
|
||||
<label class="form-label" for="category-name">Naam</label>
|
||||
<input id="category-name" class="form-control mb-3" type="text" name="name"
|
||||
value="<%= category.name %>" maxlength="80" required>
|
||||
|
||||
<label class="form-label" for="category-icon">Icoon</label>
|
||||
<input id="category-icon" class="form-control mb-4" type="text" name="icon"
|
||||
value="<%= category.icon || "" %>" maxlength="8">
|
||||
</form>
|
||||
|
||||
<div class="product-actions">
|
||||
<button class="btn btn-primary" type="submit" form="category-edit-form">Wijzigingen opslaan</button>
|
||||
<form method="post" action="/categories/<%= category.id %>/delete"
|
||||
onsubmit="return confirm('Weet je zeker dat je deze categorie wilt verwijderen?');">
|
||||
<button class="btn btn-outline-danger" type="submit">Categorie verwijderen</button>
|
||||
</form>
|
||||
<a class="btn btn-link" href="/categories">Annuleren</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,52 @@
|
||||
<div class="page-header mb-4">
|
||||
|
||||
<h1>🏷️ Categorieën</h1>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h2 class="card-title">Categorieën beheren</h2>
|
||||
</div>
|
||||
<div class="list-group list-group-flush">
|
||||
<% if (categories.length === 0) { %>
|
||||
<div class="list-group-item text-secondary">Nog geen categorieën.</div>
|
||||
<% } %>
|
||||
<% categories.forEach(category => { %>
|
||||
<div class="list-group-item">
|
||||
<div class="d-flex align-items-start justify-content-between gap-3">
|
||||
<div>
|
||||
<strong><%= category.icon || "" %> <%= category.name %></strong>
|
||||
<div class="text-secondary"><%= category.product_count %> product(en)</div>
|
||||
</div>
|
||||
<a class="btn btn-sm btn-outline-primary" href="/categories/<%= category.id %>/edit">
|
||||
Wijzigen
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-header"><h2 class="card-title">Nieuwe categorie</h2></div>
|
||||
<div class="card-body">
|
||||
<form method="post" action="/categories">
|
||||
<label class="form-label" for="category-name">Naam</label>
|
||||
<input id="category-name" class="form-control mb-3" type="text" name="name"
|
||||
placeholder="bijv. Zuivel" maxlength="80" required>
|
||||
|
||||
<label class="form-label" for="category-icon">Icoon</label>
|
||||
<input id="category-icon" class="form-control mb-3" type="text" name="icon"
|
||||
placeholder="bijv. 🥛" maxlength="8">
|
||||
|
||||
<button class="btn btn-primary w-100" type="submit">Categorie toevoegen</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -9,12 +9,28 @@
|
||||
</a>
|
||||
|
||||
<% if (user) { %>
|
||||
<div class="navbar-nav flex-row ms-auto">
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#pantryhub-navigation"
|
||||
aria-controls="pantryhub-navigation"
|
||||
aria-expanded="false"
|
||||
aria-label="Navigatiemenu openen">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<% } %>
|
||||
|
||||
<% if (user) { %>
|
||||
<div class="collapse navbar-collapse" id="pantryhub-navigation">
|
||||
<nav class="navbar-nav ms-auto">
|
||||
<a class="nav-link" href="/">Dashboard</a>
|
||||
<a class="nav-link" href="/lists">Lijsten</a>
|
||||
<a class="nav-link" href="/products">Producten</a>
|
||||
<a class="nav-link" href="/categories">Categorieën</a>
|
||||
<a class="nav-link" href="/household">Huishouden</a>
|
||||
<a class="nav-link text-danger" href="/logout">Uitloggen</a>
|
||||
</nav>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
|
||||
@@ -0,0 +1,42 @@
|
||||
<div class="page-header mb-4">
|
||||
|
||||
<h1>Product wijzigen</h1>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h2 class="card-title">Productgegevens</h2>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<form id="product-edit-<%= product.id %>" method="post" action="/products/<%= product.id %>">
|
||||
<label class="form-label" for="product-name">Productnaam</label>
|
||||
<input id="product-name" class="form-control mb-3" type="text" name="name"
|
||||
value="<%= product.name %>" maxlength="120" required>
|
||||
|
||||
<label class="form-label" for="category-id">Categorie</label>
|
||||
<select id="category-id" class="form-select mb-4" name="category_id">
|
||||
<option value="">Geen categorie</option>
|
||||
<% (categories || []).forEach(category => { %>
|
||||
<option value="<%= category.id %>" <%= product.category_id === category.id ? "selected" : "" %>>
|
||||
<%= category.icon || "" %> <%= category.name %>
|
||||
</option>
|
||||
<% }); %>
|
||||
</select>
|
||||
|
||||
</form>
|
||||
|
||||
<div class="product-actions">
|
||||
<button class="btn btn-primary" type="submit" form="product-edit-<%= product.id %>">Wijzigingen opslaan</button>
|
||||
<form method="post" action="/products/<%= product.id %>/delete"
|
||||
onsubmit="return confirm('Weet je zeker dat je dit product wilt verwijderen?');">
|
||||
<button class="btn btn-outline-danger" type="submit">Product verwijderen</button>
|
||||
</form>
|
||||
<a class="btn btn-link" href="/products">Annuleren</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -18,8 +18,15 @@
|
||||
<div class="list-group">
|
||||
<% products.forEach(product => { %>
|
||||
<div class="list-group-item">
|
||||
<strong><%= product.category_icon || "" %> <%= product.name %></strong>
|
||||
<div class="text-secondary"><%= product.category_name || "Geen categorie" %></div>
|
||||
<div class="d-flex align-items-start justify-content-between gap-3">
|
||||
<div>
|
||||
<strong><%= product.category_icon || "" %> <%= product.name %></strong>
|
||||
<div class="text-secondary"><%= product.category_name || "Geen categorie" %></div>
|
||||
</div>
|
||||
<a class="btn btn-sm btn-outline-primary" href="/products/<%= product.id %>/edit">
|
||||
Wijzigen
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
</div>
|
||||
@@ -49,5 +56,18 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mt-3">
|
||||
<div class="card-header"><h3 class="card-title">Producten in bulk laden</h3></div>
|
||||
<div class="card-body">
|
||||
<form method="post" action="/products/import" enctype="multipart/form-data">
|
||||
<label class="form-label" for="product-import-file">CSV-bestand</label>
|
||||
<input id="product-import-file" class="form-control mb-3" type="file" name="file"
|
||||
accept=".csv,text/csv" required>
|
||||
<div class="text-secondary small mb-3">Kolommen: name, category, barcode. Alleen name is verplicht.</div>
|
||||
<button class="btn btn-outline-primary w-100" type="submit">CSV importeren</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user