feat(orders): format device container cards with register name and license number
This commit is contained in:
@@ -68,13 +68,22 @@ function DeviceCard({
|
||||
`&device_id=${encodeURIComponent(device.deviceId)}`
|
||||
|
||||
return (
|
||||
<div className="p-4 rounded-xl bg-slate-900/60 border border-white/10 hover:border-white/20 transition-all flex flex-col md:flex-row md:items-start justify-between gap-4">
|
||||
<div className="p-4 rounded-xl bg-slate-950/70 border border-slate-800 hover:border-slate-700 transition-all flex flex-col md:flex-row md:items-start justify-between gap-4 relative overflow-hidden">
|
||||
{/* Kassen-Info links */}
|
||||
<div className="space-y-2 min-w-[200px] flex-1">
|
||||
{/* Kassen-Name + Status */}
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
<Monitor className="w-4 h-4 text-primary shrink-0" />
|
||||
<span className="font-bold text-white text-base">{device.deviceName}</span>
|
||||
<div className="space-y-2.5 min-w-[200px] flex-1">
|
||||
{/* Kassen-Name + Lizenznummer daneben + Status */}
|
||||
<div className="flex items-center gap-2 flex-wrap border-b border-white/5 pb-2">
|
||||
<span className="px-2 py-0.5 rounded text-xs font-extrabold bg-blue-500/20 text-blue-400 border border-blue-500/30 font-mono">
|
||||
{device.deviceName}
|
||||
</span>
|
||||
|
||||
{device.items[0]?.license_number && (
|
||||
<span className="text-xs font-mono text-emerald-400 bg-emerald-500/10 px-2 py-0.5 rounded border border-emerald-500/20 flex items-center gap-1">
|
||||
<span className="text-[10px] text-slate-400 uppercase font-sans">Lizenz:</span>
|
||||
{device.items[0].license_number}
|
||||
</span>
|
||||
)}
|
||||
|
||||
<Badge
|
||||
className={`text-xs ${statusClass[device.orderStatus] ?? 'bg-slate-500/20 text-slate-300'}`}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user