ui: ajustar layout do prazo de reabertura abaixo da linha de acoes
This commit is contained in:
parent
4d4a2e3aaf
commit
16bbd1e4b8
1 changed files with 50 additions and 50 deletions
|
|
@ -1096,17 +1096,17 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
|
|||
|
||||
return (
|
||||
<div id="ticket-summary-header" className={cardClass}>
|
||||
<div className="absolute right-6 top-6 flex items-center gap-3">
|
||||
{status !== "RESOLVED" ? (
|
||||
<Button
|
||||
type="button"
|
||||
className="inline-flex items-center gap-2 rounded-lg border border-sidebar-border bg-sidebar-accent px-3 py-1.5 text-sm font-semibold text-sidebar-accent-foreground transition-all duration-200 ease-out hover:-translate-y-0.5 hover:border-sidebar-ring hover:bg-sidebar-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--sidebar-ring)]/30 active:translate-y-0 active:border-sidebar-ring"
|
||||
onClick={() => setCloseOpen(true)}
|
||||
>
|
||||
<CheckCircle2 className="size-4" /> Encerrar
|
||||
</Button>
|
||||
) : canReopenTicket ? (
|
||||
<div className="flex flex-col items-end gap-1">
|
||||
<div className="absolute right-6 top-6 flex flex-col items-end gap-1">
|
||||
<div className="flex items-center gap-3">
|
||||
{status !== "RESOLVED" ? (
|
||||
<Button
|
||||
type="button"
|
||||
className="inline-flex items-center gap-2 rounded-lg border border-sidebar-border bg-sidebar-accent px-3 py-1.5 text-sm font-semibold text-sidebar-accent-foreground transition-all duration-200 ease-out hover:-translate-y-0.5 hover:border-sidebar-ring hover:bg-sidebar-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--sidebar-ring)]/30 active:translate-y-0 active:border-sidebar-ring"
|
||||
onClick={() => setCloseOpen(true)}
|
||||
>
|
||||
<CheckCircle2 className="size-4" /> Encerrar
|
||||
</Button>
|
||||
) : canReopenTicket ? (
|
||||
<Button
|
||||
type="button"
|
||||
className="inline-flex items-center gap-2 rounded-lg border border-sidebar-border bg-white px-3 py-1.5 text-sm font-semibold text-neutral-800 transition-all duration-200 ease-out hover:-translate-y-0.5 hover:border-sidebar-ring hover:bg-slate-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--sidebar-ring)]/30 active:translate-y-0 active:border-sidebar-ring"
|
||||
|
|
@ -1116,51 +1116,51 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
|
|||
{isReopening ? <Spinner className="size-4 text-neutral-600" /> : <RotateCcw className="size-4" />}
|
||||
Reabrir
|
||||
</Button>
|
||||
{reopenDeadlineLabel ? (
|
||||
<p className="text-[11px] text-neutral-500">Prazo para reabrir: {reopenDeadlineLabel}</p>
|
||||
) : null}
|
||||
</div>
|
||||
) : null}
|
||||
{workSummary ? (
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<Badge
|
||||
className="inline-flex h-9 cursor-help items-center gap-2 rounded-full border border-slate-200 bg-white px-3 text-sm font-semibold text-neutral-700 [&>svg]:size-5"
|
||||
>
|
||||
<IconClock className="size-5 text-neutral-700" /> {formattedTotalWorked}
|
||||
</Badge>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-medium text-neutral-700 shadow-lg">
|
||||
<div className="flex flex-col gap-1">
|
||||
<span>Horas internas: {formatDuration(internalWorkedMs)}</span>
|
||||
<span>Horas externas: {formatDuration(externalWorkedMs)}</span>
|
||||
</div>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{!editing ? (
|
||||
) : null}
|
||||
{workSummary ? (
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<Badge
|
||||
className="inline-flex h-9 cursor-help items-center gap-2 rounded-full border border-slate-200 bg-white px-3 text-sm font-semibold text-neutral-700 [&>svg]:size-5"
|
||||
>
|
||||
<IconClock className="size-5 text-neutral-700" /> {formattedTotalWorked}
|
||||
</Badge>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-medium text-neutral-700 shadow-lg">
|
||||
<div className="flex flex-col gap-1">
|
||||
<span>Horas internas: {formatDuration(internalWorkedMs)}</span>
|
||||
<span>Horas externas: {formatDuration(externalWorkedMs)}</span>
|
||||
</div>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{!editing ? (
|
||||
<Button
|
||||
size="icon"
|
||||
aria-label="Editar"
|
||||
className="inline-flex items-center justify-center rounded-lg border border-slate-200 bg-white text-neutral-800 hover:bg-slate-50"
|
||||
onClick={() => setEditing(true)}
|
||||
title="Editar"
|
||||
>
|
||||
<IconPencil className="size-5" />
|
||||
</Button>
|
||||
) : null}
|
||||
<Button
|
||||
size="icon"
|
||||
aria-label="Editar"
|
||||
variant="outline"
|
||||
aria-label="Exportar PDF"
|
||||
className="inline-flex items-center justify-center rounded-lg border border-slate-200 bg-white text-neutral-800 hover:bg-slate-50"
|
||||
onClick={() => setEditing(true)}
|
||||
title="Editar"
|
||||
onClick={handleExportPdf}
|
||||
disabled={exportingPdf}
|
||||
title="Exportar PDF"
|
||||
>
|
||||
<IconPencil className="size-5" />
|
||||
{exportingPdf ? <Spinner className="size-4 text-neutral-700" /> : <IconDownload className="size-5" />}
|
||||
</Button>
|
||||
<DeleteTicketDialog ticketId={ticket.id as Id<"tickets">} />
|
||||
</div>
|
||||
{status === "RESOLVED" && canReopenTicket && reopenDeadlineLabel ? (
|
||||
<p className="text-[11px] text-neutral-500">Prazo para reabrir: {reopenDeadlineLabel}</p>
|
||||
) : null}
|
||||
<Button
|
||||
size="icon"
|
||||
variant="outline"
|
||||
aria-label="Exportar PDF"
|
||||
className="inline-flex items-center justify-center rounded-lg border border-slate-200 bg-white text-neutral-800 hover:bg-slate-50"
|
||||
onClick={handleExportPdf}
|
||||
disabled={exportingPdf}
|
||||
title="Exportar PDF"
|
||||
>
|
||||
{exportingPdf ? <Spinner className="size-4 text-neutral-700" /> : <IconDownload className="size-5" />}
|
||||
</Button>
|
||||
<DeleteTicketDialog ticketId={ticket.id as Id<"tickets">} />
|
||||
</div>
|
||||
<CloseTicketDialog
|
||||
open={closeOpen}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue