esdras/sistema-de-chamados
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

Refresh device cards layout

Browse source
This commit is contained in:
Esdras Renan 2025-11-19 11:17:07 -03:00
parent 2c975edd09
commit 188518e06c
1 changed files with 44 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

83
src/components/admin/devices/admin-devices-overview.tsx
View file

@ -5743,42 +5743,53 @@ function DeviceCard({ device, companyName }: { device: DevicesQueryItem; company
) : null} ) : null}
</div> </div>
<CardHeader className="pb-2"> <CardHeader className="pb-2">
<CardTitle className="line-clamp-1 flex items-center gap-2 text-base font-semibold"> <CardTitle className="flex items-center gap-2 text-base font-semibold">
<DeviceIcon className="size-4 text-slate-500" /> {deviceLabel} <DeviceIcon className="size-4 text-slate-500" />
<span className="line-clamp-1">{deviceLabel}</span>
</CardTitle> </CardTitle>
<div className="flex flex-wrap items-center gap-2 text-xs text-slate-500"> <div className="flex flex-col gap-1">
<span>{deviceTypeLabel}</span> <div className="flex flex-wrap items-center gap-2 text-xs text-slate-500">
{device.devicePlatform ? ( <span>{deviceTypeLabel}</span>
<> {device.devicePlatform ? (
<span className="text-slate-300">•</span> <>
<span>{device.devicePlatform}</span> <span className="text-slate-300">•</span>
</> <span>{device.devicePlatform}</span>
) : null} </>
{device.authEmail ? ( ) : null}
<> {device.authEmail ? (
<span className="text-slate-300">•</span> <>
<span>{device.authEmail}</span> <span className="text-slate-300">•</span>
</> <span className="truncate max-w-[140px]" title={device.authEmail}>
{device.authEmail}
</span>
</>
) : null}
</div>
{collaborator?.email ? (
<div className="flex flex-wrap items-center gap-2 text-xs text-slate-600">
<div className="flex flex-col rounded-lg border border-slate-200 bg-slate-50 px-3 py-1">
<span className="text-[11px] uppercase text-slate-400">Usuário vinculado</span>
<span className="text-sm font-medium text-slate-800 line-clamp-1" title={collaborator.name ?? collaborator.email}>
{collaborator.name ?? "Usuário"}
</span>
<span className="text-[11px] text-slate-500 line-clamp-1" title={collaborator.email}>
{collaborator.email}
</span>
</div>
<button
type="button"
className="text-[11px] font-semibold text-slate-500 underline underline-offset-4 hover:text-slate-800"
onClick={(event) => {
event.preventDefault()
event.stopPropagation()
router.push("/admin/users")
}}
>
Gerenciar usuários
</button>
</div>
) : null} ) : null}
</div> </div>
{collaborator?.email ? (
<div className="mt-2 flex flex-wrap items-center gap-2 text-[11px] text-slate-600">
<span className="rounded-full border border-slate-300 bg-slate-100 px-2 py-0.5">
Usuário vinculado: {collaborator.name ? `${collaborator.name} · ` : ""}{collaborator.email}
</span>
<button
type="button"
className="underline underline-offset-4 hover:text-slate-800"
onClick={(event) => {
event.preventDefault()
event.stopPropagation()
router.push("/admin/users")
}}
>
Gerenciar usuários
</button>
</div>
) : null}
{!isActive ? ( {!isActive ? (
<Badge variant="outline" className="mt-2 w-fit border-rose-200 bg-rose-50 text-[10px] font-semibold uppercase tracking-wide text-rose-700"> <Badge variant="outline" className="mt-2 w-fit border-rose-200 bg-rose-50 text-[10px] font-semibold uppercase tracking-wide text-rose-700">
Desativado Desativado
@ -5800,12 +5811,6 @@ function DeviceCard({ device, companyName }: { device: DevicesQueryItem; company
</Badge> </Badge>
) : null} ) : null}
</div> </div>
{collaborator?.email ? (
<p className="text-[11px] text-muted-foreground">
{persona}: {collaborator.name ? `${collaborator.name} · ` : ""}
{collaborator.email}
</p>
) : null}
<div className="flex flex-wrap items-center gap-2"> <div className="flex flex-wrap items-center gap-2">
<Badge variant="outline" className="border-slate-300 bg-slate-100 text-xs font-medium text-slate-700"> <Badge variant="outline" className="border-slate-300 bg-slate-100 text-xs font-medium text-slate-700">
{deviceTypeLabel} {deviceTypeLabel}