hd-commerce: neutrales SQLite-Commerce-Backend (Admin + API + Demo-Storefront)

2026-06-17 12:05:29 +00:00
commit 4e8a3ab105
43 changed files with 2689 additions and 0 deletions
@@ -0,0 +1,60 @@
+---
+import Admin from '../../../layouts/Admin.astro';
+import { getOrderById, updateOrderStatus, formatPrice } from '../../../lib/store.js';
+
+const { id } = Astro.params;
+let flash = '';
+if (Astro.request.method === 'POST') {
+  const form = await Astro.request.formData();
+  const status = form.get('status');
+  if (status) { updateOrderStatus(id, String(status)); flash = 'Status aktualisiert.'; }
+}
+const order = getOrderById(id);
+if (!order) return Astro.redirect('/admin/bestellungen');
+const statusMap = { fulfilled: ['green', 'Erfüllt'], pending: ['amber', 'Offen'], cancelled: ['gray', 'Storniert'], refunded: ['red', 'Erstattet'] };
+const fmtDate = (s) => new Date(s).toLocaleString('de-DE', { day: '2-digit', month: 'long', year: 'numeric', hour: '2-digit', minute: '2-digit' });
+const statuses = [['pending', 'Offen'], ['fulfilled', 'Erfüllt'], ['cancelled', 'Storniert'], ['refunded', 'Erstattet']];
+---
+<Admin title={`Bestellung ${order.number}`} active="bestellungen" crumbs={[{ label: 'Bestellungen', href: '/admin/bestellungen' }, { label: order.number }]}>
+  <div class="s-stack">
+    {flash && <div class="s-flash">✓ {flash}</div>}
+    <div class="s-two-col">
+      <div class="s-card">
+        <div class="s-card-head">Artikel</div>
+        <div class="s-table-wrap">
+          <table class="s-table">
+            <thead><tr><th>Produkt</th><th>Variante</th><th class="num">Menge</th><th class="num">Einzelpreis</th><th class="num">Summe</th></tr></thead>
+            <tbody>
+              {order.items.map((i) => (
+                <tr><td><b>{i.name}</b></td><td class="s-muted">{i.size || '—'}</td><td class="num">{i.qty}</td><td class="num">{formatPrice(i.priceCents)}</td><td class="num">{formatPrice(i.priceCents * i.qty)}</td></tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+        <div class="s-card-pad" style="display:flex;justify-content:space-between;font-weight:700;font-size:16px;border-top:1px solid var(--s-border)"><span>Gesamt</span><span>{formatPrice(order.total_cents)}</span></div>
+      </div>
+
+      <div class="s-stack">
+        <div class="s-card s-card-pad">
+          <div class="s-section-title">Status</div>
+          <div style="margin:8px 0 14px"><span class={`s-badge ${(statusMap[order.status]||['gray',order.status])[0]}`}>{(statusMap[order.status]||['',order.status])[1]}</span></div>
+          <form method="POST">
+            <select class="s-select" name="status" style="margin-bottom:10px">
+              {statuses.map(([v, l]) => (<option value={v} selected={order.status === v}>{l}</option>))}
+            </select>
+            <button class="s-btn s-btn-primary" type="submit" style="width:100%">Status speichern</button>
+          </form>
+        </div>
+        <div class="s-card s-card-pad">
+          <div class="s-section-title">Kunde</div>
+          <p style="margin:8px 0 4px"><b>{order.customer_name || '—'}</b></p>
+          <p class="s-muted" style="margin:0 0 8px">{order.email}</p>
+          <div class="s-section-title" style="margin-top:12px">Lieferadresse</div>
+          <p class="s-muted" style="margin:6px 0 0">{order.address || '—'}</p>
+          <div class="s-section-title" style="margin-top:12px">Bestellt am</div>
+          <p class="s-muted" style="margin:6px 0 0">{fmtDate(order.created_at)}</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</Admin>