Files
demo-tga-shop/src/pages/admin/bestellungen/index.astro
T

30 lines
1.6 KiB
Plaintext

---
import Admin from '../../../layouts/Admin.astro';
import { listOrders } from '../../../lib/store.js';
import { formatPrice } from '../../../lib/seed.js';
const orders = await listOrders();
const badge = (s) => ({ fulfilled:['green','Erfüllt'], pending:['amber','Offen'], cancelled:['gray','Storniert'], refunded:['blue','Erstattet'] }[s] || ['gray', s]);
const fmtDate = (s) => new Date(s).toLocaleDateString('de-DE', { day:'2-digit', month:'short', year:'numeric' });
const items = (o) => o.items.reduce((s,i)=>s+i.qty,0);
---
<Admin title="Bestellungen" active="bestellungen" crumbs={[{label:'Bestellungen'}]}>
<span slot="actions" class="s-muted" style="font-size:13px">{orders.length} Bestellungen</span>
<div class="s-card">
<div class="s-table-wrap"><table class="s-table">
<thead><tr><th>Bestellung</th><th>Datum</th><th>Kunde</th><th>Artikel</th><th>Status</th><th class="num">Betrag</th></tr></thead>
<tbody>
{orders.map((o) => { const [c,l] = badge(o.status); return (
<tr onclick={`location.href='/admin/bestellungen/${o.id}'`}>
<td><span class="s-link">#{o.number}</span></td>
<td class="s-muted">{fmtDate(o.created_at)}</td>
<td>{o.customer_name || '—'}<div class="s-muted" style="font-size:12px">{o.email}</div></td>
<td>{items(o)} Artikel</td>
<td><span class={`s-badge ${c}`}>{l}</span></td>
<td class="num">{formatPrice(o.total_cents)}</td>
</tr>); })}
{orders.length === 0 && <tr><td colspan="6"><div class="s-empty">Noch keine Bestellungen.</div></td></tr>}
</tbody>
</table></div>
</div>
</Admin>