Daniel/webshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: group success page order items by device name
Some checks failed
Staging Build / build (push) Failing after 28s
Details

Browse Source
This commit is contained in:
DanielS
2026-07-10 00:20:32 +02:00
parent a3c5a66d3f
commit 6821b4e8d9
1 changed files with 31 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
shop/app/order/success/page.tsx
View File

@@ -49,6 +49,14 @@ export default async function OrderSuccessPage({
const o = order as Order
const items = o.order_data?.items ?? []
const groupedItems: Record<string, typeof items> = {}
items.forEach(item => {
const devName = item.device_name || 'Kasse 1'
if (!groupedItems[devName]) {
groupedItems[devName] = []
}
groupedItems[devName].push(item)
})
const taxRate = o.order_data?.tax_rate ?? 19
const oneTimeItems = items.filter((item) => item.billing_interval === 'one_time')
@@ -105,23 +113,30 @@ export default async function OrderSuccessPage({
</Badge>
</CardHeader>
<CardContent className="space-y-4">
{/* Produkte */}
<div className="space-y-3">
{items.map((item) => (
<div key={item.product_id} className="space-y-1">
<div className="flex justify-between text-sm">
<span className="font-semibold text-white">{item.product_name}</span>
<span className="text-white">
{new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(item.base_price)}
<span className="text-slate-400 text-xs ml-1">
{item.billing_interval === 'one_time' ? 'einmalig' : '/ Monat'}
</span>
</span>
{/* Produkte gruppiert nach Gerät */}
<div className="space-y-4">
{Object.entries(groupedItems).map(([deviceName, devItems]) => (
<div key={deviceName} className="space-y-2 border-b border-white/5 pb-3 last:border-0 last:pb-0">
<div className="bg-white/5 px-2 py-1 rounded text-xs text-primary font-bold">
Gerät: {deviceName}
</div>
{item.selected_modules.map((mod) => (
<div key={mod.module_id} className="flex justify-between text-xs pl-4 text-slate-400">
<span>+ {mod.module_name}</span>
<span>{new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(mod.price)}</span>
{devItems.map((item) => (
<div key={item.product_id} className="space-y-1 pl-2">
<div className="flex justify-between text-sm">
<span className="font-semibold text-white">{item.product_name}</span>
<span className="text-white">
{new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(item.base_price)}
<span className="text-slate-400 text-xs ml-1">
{item.billing_interval === 'one_time' ? 'einmalig' : '/ Monat'}
</span>
</span>
</div>
{item.selected_modules.map((mod) => (
<div key={mod.module_id} className="flex justify-between text-xs pl-4 text-slate-400">
<span>+ {mod.module_name}</span>
<span>{new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(mod.price)}</span>
</div>
))}
</div>
))}
</div>