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

Hours by client: add search and CSV filtering; add alerts cron (BRT 08:00 guard) + alerts panel filters; admin companies shows last alert; PDF Inter font from public/fonts; fix Select empty value; type cleanups; tests for CSV/TZ; remove Knowledge Base nav

Browse source
This commit is contained in:
Esdras Renan 2025-10-07 15:39:55 -03:00
parent 2cf399dcb1
commit 08cc8037d5
151 changed files with 1404 additions and 214 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/reports/backlog-report.tsx
View file

@ -12,6 +12,7 @@ import { Button } from "@/components/ui/button"
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"
import { Skeleton } from "@/components/ui/skeleton"
import { Badge } from "@/components/ui/badge"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
const PRIORITY_LABELS: Record<string, string> = {
LOW: "Baixa",
@ -29,12 +30,14 @@ const STATUS_LABELS: Record<string, string> = {
export function BacklogReport() {
const [timeRange, setTimeRange] = useState("90d")
const [companyId, setCompanyId] = useState<string>("all")
const { session, convexUserId } = useAuth()
const tenantId = session?.user.tenantId ?? DEFAULT_TENANT_ID
const data = useQuery(
api.reports.backlogOverview,
convexUserId ? { tenantId, viewerId: convexUserId as Id<"users">, range: timeRange } : "skip"
convexUserId ? { tenantId, viewerId: convexUserId as Id<"users">, range: timeRange, companyId: companyId === "all" ? undefined : (companyId as Id<"companies">) } : "skip"
)
const companies = useQuery(api.companies.list, convexUserId ? { tenantId, viewerId: convexUserId as Id<"users"> } : "skip") as Array<{ id: Id<"companies">; name: string }> | undefined
const mostCriticalPriority = useMemo(() => {
if (!data) return null
@ -102,8 +105,19 @@ export function BacklogReport() {
Acompanhe a evolução dos tickets pelas fases do fluxo de atendimento.
</CardDescription>
<CardAction>
<Select value={companyId} onValueChange={setCompanyId}>
<SelectTrigger className="hidden w-56 md:flex">
<SelectValue placeholder="Todas as empresas" />
</SelectTrigger>
<SelectContent className="rounded-xl">
<SelectItem value="all">Todas as empresas</SelectItem>
{(companies ?? []).map((c) => (
<SelectItem key={c.id} value={c.id}>{c.name}</SelectItem>
))}
</SelectContent>
</Select>
<Button asChild size="sm" variant="outline">
<a href={`/api/reports/backlog.csv?range=${timeRange}`} download>
<a href={`/api/reports/backlog.csv?range=${timeRange}${companyId !== "all" ? `&companyId=${companyId}` : ""}`} download>
Exportar CSV
</a>
</Button>

29
src/components/reports/csat-report.tsx
View file

@ -6,9 +6,12 @@ import { api } from "@/convex/_generated/api"
import type { Id } from "@/convex/_generated/dataModel"
import { useAuth } from "@/lib/auth-client"
import { DEFAULT_TENANT_ID } from "@/lib/constants"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Skeleton } from "@/components/ui/skeleton"
import { Badge } from "@/components/ui/badge"
import { useState } from "react"
import { Button } from "@/components/ui/button"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
function formatScore(value: number | null) {
if (value === null) return "—"
@ -16,12 +19,16 @@ function formatScore(value: number | null) {
}
export function CsatReport() {
const [companyId, setCompanyId] = useState<string>("all")
const { session, convexUserId } = useAuth()
const tenantId = session?.user.tenantId ?? DEFAULT_TENANT_ID
const data = useQuery(
api.reports.csatOverview,
convexUserId ? { tenantId, viewerId: convexUserId as Id<"users"> } : "skip"
convexUserId
? ({ tenantId, viewerId: convexUserId as Id<"users">, companyId: companyId === "all" ? undefined : (companyId as Id<"companies">) })
: "skip"
)
const companies = useQuery(api.companies.list, convexUserId ? { tenantId, viewerId: convexUserId as Id<"users"> } : "skip") as Array<{ id: Id<"companies">; name: string }> | undefined
if (!data) {
return (
@ -42,6 +49,24 @@ export function CsatReport() {
<IconMoodSmile className="size-4 text-teal-500" /> CSAT médio
</CardTitle>
<CardDescription className="text-neutral-600">Média das respostas recebidas.</CardDescription>
<CardAction>
<Select value={companyId} onValueChange={setCompanyId}>
<SelectTrigger className="w-56">
<SelectValue placeholder="Todas as empresas" />
</SelectTrigger>
<SelectContent className="rounded-xl">
<SelectItem value="all">Todas as empresas</SelectItem>
{(companies ?? []).map((c) => (
<SelectItem key={c.id} value={c.id}>{c.name}</SelectItem>
))}
</SelectContent>
</Select>
<Button asChild size="sm" variant="outline">
<a href={`/api/reports/csat.csv${companyId !== "all" ? `?companyId=${companyId}` : ""}`} download>
Exportar CSV
</a>
</Button>
</CardAction>
</CardHeader>
<CardContent className="text-3xl font-semibold text-neutral-900">
{formatScore(data.averageScore)}

52
src/components/reports/hours-report.tsx
View file

@ -11,23 +11,40 @@ import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle }
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"
import { Input } from "@/components/ui/input"
function formatHours(ms: number) {
const hours = ms / 3600000
return hours.toFixed(2)
}
type HoursItem = {
companyId: string
name: string
isAvulso: boolean
internalMs: number
externalMs: number
totalMs: number
contractedHoursPerMonth?: number | null
}
export function HoursReport() {
const [timeRange, setTimeRange] = useState("90d")
const [query, setQuery] = useState("")
const { session, convexUserId } = useAuth()
const tenantId = session?.user.tenantId ?? DEFAULT_TENANT_ID
const data = useQuery(
api.reports.hoursByClient,
convexUserId ? { tenantId, viewerId: convexUserId as Id<"users">, range: timeRange } : "skip"
) as { rangeDays: number; items: Array<{ companyId: string; name: string; isAvulso: boolean; internalMs: number; externalMs: number; totalMs: number; contractedHoursPerMonth?: number | null }> } | undefined
) as { rangeDays: number; items: HoursItem[] } | undefined
const items = data?.items ?? []
const filtered = useMemo(() => {
const q = query.trim().toLowerCase()
if (!q) return items
return items.filter((it) => it.name.toLowerCase().includes(q))
}, [items, query])
return (
<div className="space-y-6">
@ -35,17 +52,25 @@ export function HoursReport() {
<CardHeader>
<CardTitle>Horas por cliente</CardTitle>
<CardDescription>Horas internas e externas registradas por empresa.</CardDescription>
<CardAction className="flex items-center gap-2">
<Button asChild size="sm" variant="outline">
<a href={`/api/reports/hours-by-client.csv?range=${timeRange}`} download>
<CardAction>
<div className="flex flex-col items-stretch gap-2 sm:flex-row sm:items-center sm:justify-end">
<Input
placeholder="Pesquisar cliente..."
value={query}
onChange={(e) => setQuery(e.target.value)}
className="h-9 w-full min-w-56 sm:w-72"
/>
<ToggleGroup type="single" value={timeRange} onValueChange={setTimeRange} variant="outline" className="hidden md:flex">
<ToggleGroupItem value="90d">90 dias</ToggleGroupItem>
<ToggleGroupItem value="30d">30 dias</ToggleGroupItem>
<ToggleGroupItem value="7d">7 dias</ToggleGroupItem>
</ToggleGroup>
<Button asChild size="sm" variant="outline">
<a href={`/api/reports/hours-by-client.csv?range=${timeRange}${query ? `&q=${encodeURIComponent(query)}` : ""}`} download>
Exportar CSV
</a>
</Button>
<ToggleGroup type="single" value={timeRange} onValueChange={setTimeRange} variant="outline" className="hidden md:flex">
<ToggleGroupItem value="90d">90 dias</ToggleGroupItem>
<ToggleGroupItem value="30d">30 dias</ToggleGroupItem>
<ToggleGroupItem value="7d">7 dias</ToggleGroupItem>
</ToggleGroup>
</Button>
</div>
</CardAction>
</CardHeader>
<CardContent>
@ -63,11 +88,11 @@ export function HoursReport() {
</tr>
</thead>
<tbody className="divide-y divide-slate-200">
{items.map((row) => {
{filtered.map((row) => {
const totalH = Number(formatHours(row.totalMs))
const contracted = row.contractedHoursPerMonth ?? null
const pct = contracted ? Math.round((totalH / contracted) * 100) : null
const pctBadgeVariant = pct !== null && pct >= 90 ? "destructive" : "secondary"
const pctBadgeVariant: "secondary" | "destructive" = pct !== null && pct >= 90 ? "destructive" : "secondary"
return (
<tr key={row.companyId}>
<td className="py-2 pr-4 font-medium text-neutral-900">{row.name}</td>
@ -78,7 +103,7 @@ export function HoursReport() {
<td className="py-2 pr-4">{contracted ?? "—"}</td>
<td className="py-2 pr-4">
{pct !== null ? (
<Badge variant={pctBadgeVariant as any} className="rounded-full px-3 py-1 text-[11px] uppercase tracking-wide">
<Badge variant={pctBadgeVariant} className="rounded-full px-3 py-1 text-[11px] uppercase tracking-wide">
{pct}%
</Badge>
) : (
@ -96,4 +121,3 @@ export function HoursReport() {
</div>
)
}

29
src/components/reports/sla-report.tsx
View file

@ -7,9 +7,12 @@ import { api } from "@/convex/_generated/api"
import type { Id } from "@/convex/_generated/dataModel"
import { useAuth } from "@/lib/auth-client"
import { DEFAULT_TENANT_ID } from "@/lib/constants"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Skeleton } from "@/components/ui/skeleton"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
import { useState } from "react"
function formatMinutes(value: number | null) {
if (value === null) return "—"
@ -21,12 +24,16 @@ function formatMinutes(value: number | null) {
}
export function SlaReport() {
const [companyId, setCompanyId] = useState<string>("all")
const { session, convexUserId } = useAuth()
const tenantId = session?.user.tenantId ?? DEFAULT_TENANT_ID
const data = useQuery(
api.reports.slaOverview,
convexUserId ? { tenantId, viewerId: convexUserId as Id<"users"> } : "skip"
convexUserId
? ({ tenantId, viewerId: convexUserId as Id<"users">, companyId: companyId === "all" ? undefined : (companyId as Id<"companies">) })
: "skip"
)
const companies = useQuery(api.companies.list, convexUserId ? { tenantId, viewerId: convexUserId as Id<"users"> } : "skip") as Array<{ id: Id<"companies">; name: string }> | undefined
const queueTotal = useMemo(
() => data?.queueBreakdown.reduce((acc: number, queue: { open: number }) => acc + queue.open, 0) ?? 0,
@ -97,6 +104,24 @@ export function SlaReport() {
Distribuição dos {queueTotal} tickets abertos por fila de atendimento.
</CardDescription>
</div>
<CardAction>
<Select value={companyId} onValueChange={setCompanyId}>
<SelectTrigger className="w-56">
<SelectValue placeholder="Todas as empresas" />
</SelectTrigger>
<SelectContent className="rounded-xl">
<SelectItem value="all">Todas as empresas</SelectItem>
{(companies ?? []).map((c) => (
<SelectItem key={c.id} value={c.id}>{c.name}</SelectItem>
))}
</SelectContent>
</Select>
<Button asChild size="sm" variant="outline">
<a href={`/api/reports/sla.csv${companyId !== "all" ? `?companyId=${companyId}` : ""}`} download>
Exportar CSV
</a>
</Button>
</CardAction>
</div>
</CardHeader>
<CardContent>