elpatron
5c8c4a947e
- Admin: Artikel löschen (min. 1 erforderlich) - Admin: Neue Artikel hinzufügen - Admin: Update-Logik für variable Artikelanzahl - Kasse: Dynamische items/Session pro Produkt - Kasse: CSS Grid Layout - alle Artikel fit auf einen Bildschirm - Kasse: Leerzustand wenn keine Artikel Made-with: Cursor
144 lines
7.6 KiB
HTML
144 lines
7.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>erdbeerhannah 🍓💶 - Admin</title>
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
|
<link rel="manifest" href="/manifest.json">
|
|
<meta name="theme-color" content="#dc3545">
|
|
<link rel="apple-touch-icon" href="/static/icon-192x192.png">
|
|
<script defer data-domain="erdbeerhannah.elpatron.me" src="https://plausible.elpatron.me/js/script.js"></script>
|
|
</head>
|
|
|
|
<body class="bg-light">
|
|
<div class="container mt-5">
|
|
<h2 class="mb-4">Kassen-Konfiguration</h2>
|
|
<p>Dies ist die Konfiguration für deine Kasse: <strong>{{ instance_id }}</strong></p>
|
|
<p>Speichere dir diese URL ab, um später Änderungen vorzunehmen.</p>
|
|
<div class="alert alert-info">
|
|
Deine Kasse ist erreichbar unter: <a href="{{ url_for('index', instance_id=instance_id) }}">/{{ instance_id
|
|
}}</a>
|
|
</div>
|
|
|
|
<form method="post" class="bg-white p-4 shadow-sm rounded">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Position</th>
|
|
<th>Name</th>
|
|
<th>Preis (€)</th>
|
|
<th>Icon/Emoji</th>
|
|
<th>Farbe (Bootstrap Klasse)</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% if not products %}
|
|
<tr>
|
|
<td colspan="6" class="text-muted text-center py-4">Keine Artikel. Füge unten einen neuen hinzu.</td>
|
|
</tr>
|
|
{% endif %}
|
|
{% for pos, prod in products|dictsort %}
|
|
<tr>
|
|
<td class="align-middle">{{ pos }}</td>
|
|
<td><input type="text" class="form-control" name="name_{{ pos }}" value="{{ prod['name'] }}"
|
|
required></td>
|
|
<td><input type="number" step="0.01" class="form-control" name="price_{{ pos }}"
|
|
value="{{ prod['price'] }}" required></td>
|
|
<td><input type="text" class="form-control" name="icon_{{ pos }}" value="{{ prod['icon'] }}"
|
|
required></td>
|
|
<td>
|
|
<select class="form-control" name="color_{{ pos }}">
|
|
<option value="btn-primary" {% if prod['color_class']=='btn-primary' %}selected{% endif
|
|
%}>Blau (Primary)</option>
|
|
<option value="btn-secondary" {% if prod['color_class']=='btn-secondary' %}selected{%
|
|
endif %}>Grau (Secondary)</option>
|
|
<option value="btn-success" {% if prod['color_class']=='btn-success' %}selected{% endif
|
|
%}>Grün (Success)</option>
|
|
<option value="btn-danger" {% if prod['color_class']=='btn-danger' %}selected{% endif
|
|
%}>Rot (Danger)</option>
|
|
<option value="btn-warning" {% if prod['color_class']=='btn-warning' %}selected{% endif
|
|
%}>Gelb (Warning)</option>
|
|
<option value="btn-info" {% if prod['color_class']=='btn-info' %}selected{% endif %}>
|
|
Hellblau (Info)</option>
|
|
<option value="btn-dark" {% if prod['color_class']=='btn-dark' %}selected{% endif %}>
|
|
Schwarz (Dark)</option>
|
|
</select>
|
|
</td>
|
|
<td class="align-middle">
|
|
{% if products|length > 1 %}
|
|
<button type="submit" name="delete_{{ pos }}" value="1" class="btn btn-outline-danger btn-sm"
|
|
onclick="return confirm('Artikel wirklich löschen?');">Löschen</button>
|
|
{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
<div class="d-flex justify-content-between">
|
|
<div>
|
|
<a href="{{ url_for('index', instance_id=instance_id) }}" class="btn btn-secondary">Zurück zur
|
|
Kasse</a>
|
|
<button type="submit" name="action" value="delete" class="btn btn-danger ml-2"
|
|
onclick="return confirm('Möchtest du diese Kasse wirklich unwiderruflich löschen? Alle zugehörigen Verkaufsdaten und Produkteinstellungen gehen verloren.');">🗑️
|
|
Kasse löschen</button>
|
|
</div>
|
|
<button type="submit" name="action" value="save" class="btn btn-success">Speichern & Zur Kasse</button>
|
|
</div>
|
|
</form>
|
|
|
|
<form method="post" class="bg-white p-4 shadow-sm rounded mt-4">
|
|
<input type="hidden" name="action" value="add_product">
|
|
<h5 class="mb-3">Neuer Artikel hinzufügen</h5>
|
|
<div class="form-row align-items-end">
|
|
<div class="form-group col-md-3">
|
|
<label for="add_name">Name</label>
|
|
<input type="text" class="form-control" name="add_name" id="add_name" required
|
|
placeholder="z.B. 500g Brombeeren">
|
|
</div>
|
|
<div class="form-group col-md-2">
|
|
<label for="add_price">Preis (€)</label>
|
|
<input type="number" step="0.01" class="form-control" name="add_price" id="add_price" required
|
|
placeholder="4.50">
|
|
</div>
|
|
<div class="form-group col-md-1">
|
|
<label for="add_icon">Icon</label>
|
|
<input type="text" class="form-control" name="add_icon" id="add_icon" placeholder="🫐"
|
|
maxlength="4">
|
|
</div>
|
|
<div class="form-group col-md-2">
|
|
<label for="add_color">Farbe</label>
|
|
<select class="form-control" name="add_color" id="add_color">
|
|
<option value="btn-primary">Blau</option>
|
|
<option value="btn-secondary">Grau</option>
|
|
<option value="btn-success">Grün</option>
|
|
<option value="btn-danger">Rot</option>
|
|
<option value="btn-warning">Gelb</option>
|
|
<option value="btn-info">Hellblau</option>
|
|
<option value="btn-dark">Schwarz</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-group col-md-2">
|
|
<button type="submit" class="btn btn-primary">Artikel hinzufügen</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<div class="mt-4 text-center text-muted pb-4">
|
|
<small>Made with ♥️, marmalade and zero knowledge in <a href="https://kiel-sailing-city.de/"
|
|
target="_blank">Kiel Strawberry City.</a><br>
|
|
Version: {{ version }}, Instanz: {{ instance_id[:8] }}...</small>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
if ('serviceWorker' in navigator) {
|
|
window.addEventListener('load', () => {
|
|
navigator.serviceWorker.register('/sw.js');
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
|
|
</html> |