feat(reports): hours by client (CSV + UI), company contracted hours, UI to manage companies; adjust ticket list spacing
This commit is contained in:
Esdras Renan
parent
3bafcc5a0a
commit
70f91f5bbd
10 changed files with 294 additions and 4 deletions
|
|
@ -32,8 +32,8 @@ Lista priorizada de evoluções propostas para o Sistema de Chamados. Confira `a
|
|||
- [ ] Exibir chamados em: atendimento, laboratório, visitas
|
||||
- [ ] Indicadores: abertos, resolvidos, tempo médio, SLA
|
||||
- [ ] Criar **relatório de horas por cliente (CSV/Dashboard)**
|
||||
- [ ] Separar por atendimento interno e externo
|
||||
- [ ] Filtrar por período (dia, semana, mês)
|
||||
- [x] Separar por atendimento interno e externo
|
||||
- [x] Filtrar por período (dia, semana, mês)
|
||||
- [x] Permitir exportar relatórios completos (CSV ou PDF)
|
||||
|
||||
---
|
||||
|
|
@ -44,6 +44,7 @@ Lista priorizada de evoluções propostas para o Sistema de Chamados. Confira `a
|
|||
- [x] Adicionar botão **Play externo** (atendimento presencial)
|
||||
- [x] Separar contagem de horas por tipo (interno/externo)
|
||||
- [ ] Exibir e somar **horas gastas por cliente** (com base no tipo)
|
||||
- [x] Relatório com totais (interno/externo/total)
|
||||
- [ ] Incluir no cadastro:
|
||||
- [ ] Horas contratadas por mês
|
||||
- [x] Tipo de cliente: mensalista ou avulso
|
||||
|
|
|
|||
|
|
@ -397,3 +397,70 @@ export const ticketsByChannel = query({
|
|||
};
|
||||
},
|
||||
});
|
||||
|
||||
export const hoursByClient = query({
|
||||
args: { tenantId: v.string(), viewerId: v.id("users"), range: v.optional(v.string()) },
|
||||
handler: async (ctx, { tenantId, viewerId, range }) => {
|
||||
const viewer = await requireStaff(ctx, viewerId, tenantId)
|
||||
const tickets = await fetchScopedTickets(ctx, tenantId, viewer)
|
||||
|
||||
const days = range === "7d" ? 7 : range === "30d" ? 30 : 90
|
||||
const end = new Date()
|
||||
end.setUTCHours(0, 0, 0, 0)
|
||||
const endMs = end.getTime() + ONE_DAY_MS
|
||||
const startMs = endMs - days * ONE_DAY_MS
|
||||
|
||||
// Accumulate by company
|
||||
type Acc = {
|
||||
companyId: string
|
||||
name: string
|
||||
isAvulso: boolean
|
||||
internalMs: number
|
||||
externalMs: number
|
||||
totalMs: number
|
||||
contractedHoursPerMonth?: number | null
|
||||
}
|
||||
const map = new Map<string, Acc>()
|
||||
|
||||
for (const t of tickets) {
|
||||
// only consider tickets updated in range as a proxy for recent work
|
||||
if (t.updatedAt < startMs || t.updatedAt >= endMs) continue
|
||||
const companyId = (t as any).companyId ?? null
|
||||
if (!companyId) continue
|
||||
|
||||
let acc = map.get(companyId)
|
||||
if (!acc) {
|
||||
const company = await ctx.db.get(companyId)
|
||||
acc = {
|
||||
companyId,
|
||||
name: (company as any)?.name ?? "Sem empresa",
|
||||
isAvulso: Boolean((company as any)?.isAvulso ?? false),
|
||||
internalMs: 0,
|
||||
externalMs: 0,
|
||||
totalMs: 0,
|
||||
contractedHoursPerMonth: (company as any)?.contractedHoursPerMonth ?? null,
|
||||
}
|
||||
map.set(companyId, acc)
|
||||
}
|
||||
const internal = ((t as any).internalWorkedMs ?? 0) as number
|
||||
const external = ((t as any).externalWorkedMs ?? 0) as number
|
||||
acc.internalMs += internal
|
||||
acc.externalMs += external
|
||||
acc.totalMs += internal + external
|
||||
}
|
||||
|
||||
const items = Array.from(map.values()).sort((a, b) => b.totalMs - a.totalMs)
|
||||
return {
|
||||
rangeDays: days,
|
||||
items: items.map((i) => ({
|
||||
companyId: i.companyId,
|
||||
name: i.name,
|
||||
isAvulso: i.isAvulso,
|
||||
internalMs: i.internalMs,
|
||||
externalMs: i.externalMs,
|
||||
totalMs: i.totalMs,
|
||||
contractedHoursPerMonth: i.contractedHoursPerMonth ?? null,
|
||||
})),
|
||||
}
|
||||
},
|
||||
})
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@ export default defineSchema({
|
|||
name: v.string(),
|
||||
slug: v.string(),
|
||||
isAvulso: v.optional(v.boolean()),
|
||||
contractedHoursPerMonth: v.optional(v.number()),
|
||||
cnpj: v.optional(v.string()),
|
||||
domain: v.optional(v.string()),
|
||||
phone: v.optional(v.string()),
|
||||
|
|
|
|||
|
|
@ -16,6 +16,10 @@ export async function PATCH(request: Request, { params }: { params: Promise<{ id
|
|||
if (key in body) updates[key] = body[key] ?? null
|
||||
}
|
||||
if ("isAvulso" in body) updates.isAvulso = Boolean(body.isAvulso)
|
||||
if ("contractedHoursPerMonth" in body) {
|
||||
const raw = body.contractedHoursPerMonth
|
||||
updates.contractedHoursPerMonth = typeof raw === "number" ? raw : raw ? Number(raw) : null
|
||||
}
|
||||
|
||||
try {
|
||||
const company = await prisma.company.update({ where: { id }, data: updates as any })
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ export async function POST(request: Request) {
|
|||
if (!session) return NextResponse.json({ error: "Não autorizado" }, { status: 401 })
|
||||
|
||||
const body = await request.json()
|
||||
const { name, slug, isAvulso, cnpj, domain, phone, description, address } = body ?? {}
|
||||
const { name, slug, isAvulso, cnpj, domain, phone, description, address, contractedHoursPerMonth } = body ?? {}
|
||||
if (!name || !slug) {
|
||||
return NextResponse.json({ error: "Nome e slug são obrigatórios" }, { status: 400 })
|
||||
}
|
||||
|
|
@ -32,6 +32,7 @@ export async function POST(request: Request) {
|
|||
name: String(name),
|
||||
slug: String(slug),
|
||||
isAvulso: Boolean(isAvulso ?? false),
|
||||
contractedHoursPerMonth: typeof contractedHoursPerMonth === "number" ? contractedHoursPerMonth : contractedHoursPerMonth ? Number(contractedHoursPerMonth) : null,
|
||||
cnpj: cnpj ? String(cnpj) : null,
|
||||
domain: domain ? String(domain) : null,
|
||||
phone: phone ? String(phone) : null,
|
||||
|
|
|
|||
83
src/app/api/reports/hours-by-client.csv/route.ts
Normal file
83
src/app/api/reports/hours-by-client.csv/route.ts
Normal file
|
|
@ -0,0 +1,83 @@
|
|||
import { NextResponse } from "next/server"
|
||||
import { ConvexHttpClient } from "convex/browser"
|
||||
|
||||
import { api } from "@/convex/_generated/api"
|
||||
import type { Id } from "@/convex/_generated/dataModel"
|
||||
import { env } from "@/lib/env"
|
||||
import { assertAuthenticatedSession } from "@/lib/auth-server"
|
||||
import { DEFAULT_TENANT_ID } from "@/lib/constants"
|
||||
|
||||
export const runtime = "nodejs"
|
||||
|
||||
function csvEscape(value: unknown): string {
|
||||
const s = value == null ? "" : String(value)
|
||||
if (/[",\n]/.test(s)) return '"' + s.replace(/"/g, '""') + '"'
|
||||
return s
|
||||
}
|
||||
function rowsToCsv(rows: Array<Array<unknown>>): string {
|
||||
return rows.map((row) => row.map(csvEscape).join(",")).join("\n") + "\n"
|
||||
}
|
||||
function msToHours(ms: number) {
|
||||
return (ms / 3600000).toFixed(2)
|
||||
}
|
||||
|
||||
export async function GET(request: Request) {
|
||||
const session = await assertAuthenticatedSession()
|
||||
if (!session) return NextResponse.json({ error: "Não autorizado" }, { status: 401 })
|
||||
const convexUrl = env.NEXT_PUBLIC_CONVEX_URL
|
||||
if (!convexUrl) return NextResponse.json({ error: "Convex não configurado" }, { status: 500 })
|
||||
|
||||
const { searchParams } = new URL(request.url)
|
||||
const range = searchParams.get("range") ?? undefined
|
||||
|
||||
const client = new ConvexHttpClient(convexUrl)
|
||||
const tenantId = session.user.tenantId ?? DEFAULT_TENANT_ID
|
||||
|
||||
let viewerId: string | null = null
|
||||
try {
|
||||
const ensuredUser = await client.mutation(api.users.ensureUser, {
|
||||
tenantId,
|
||||
name: session.user.name ?? session.user.email,
|
||||
email: session.user.email,
|
||||
avatarUrl: session.user.avatarUrl ?? undefined,
|
||||
role: session.user.role.toUpperCase(),
|
||||
})
|
||||
viewerId = ensuredUser?._id ?? null
|
||||
} catch (error) {
|
||||
return NextResponse.json({ error: "Falha ao sincronizar usuário com Convex" }, { status: 500 })
|
||||
}
|
||||
if (!viewerId) return NextResponse.json({ error: "Usuário não encontrado no Convex" }, { status: 403 })
|
||||
|
||||
try {
|
||||
const report = await client.query(api.reports.hoursByClient, {
|
||||
tenantId,
|
||||
viewerId: viewerId as unknown as Id<"users">,
|
||||
range,
|
||||
})
|
||||
|
||||
const rows: Array<Array<unknown>> = []
|
||||
rows.push(["Relatório", "Horas por cliente"])
|
||||
rows.push(["Período", report.rangeDays ? `Últimos ${report.rangeDays} dias` : (range ?? '90d')])
|
||||
rows.push([])
|
||||
rows.push(["Cliente", "Avulso", "Horas internas", "Horas externas", "Horas totais", "Horas contratadas/mês", "% uso"])
|
||||
for (const item of report.items) {
|
||||
const internalH = msToHours(item.internalMs)
|
||||
const externalH = msToHours(item.externalMs)
|
||||
const totalH = msToHours(item.totalMs)
|
||||
const contracted = item.contractedHoursPerMonth ?? "—"
|
||||
const pct = item.contractedHoursPerMonth ? ((item.totalMs / 3600000) / item.contractedHoursPerMonth * 100).toFixed(1) + "%" : "—"
|
||||
rows.push([item.name, item.isAvulso ? "Sim" : "Não", internalH, externalH, totalH, contracted, pct])
|
||||
}
|
||||
const csv = rowsToCsv(rows)
|
||||
return new NextResponse(csv, {
|
||||
headers: {
|
||||
"Content-Type": "text/csv; charset=UTF-8",
|
||||
"Content-Disposition": `attachment; filename="hours-by-client-${tenantId}-${report.rangeDays ?? '90'}d.csv"`,
|
||||
"Cache-Control": "no-store",
|
||||
},
|
||||
})
|
||||
} catch (error) {
|
||||
return NextResponse.json({ error: "Falha ao gerar CSV de horas por cliente" }, { status: 500 })
|
||||
}
|
||||
}
|
||||
|
||||
23
src/app/reports/hours/page.tsx
Normal file
23
src/app/reports/hours/page.tsx
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
import { AppShell } from "@/components/app-shell"
|
||||
import { SiteHeader } from "@/components/site-header"
|
||||
import { HoursReport } from "@/components/reports/hours-report"
|
||||
|
||||
export const dynamic = "force-dynamic"
|
||||
|
||||
export default function ReportsHoursPage() {
|
||||
return (
|
||||
<AppShell
|
||||
header={
|
||||
<SiteHeader
|
||||
title="Horas por cliente"
|
||||
lead="Acompanhe horas internas/externas por empresa e compare com a meta mensal."
|
||||
/>
|
||||
}
|
||||
>
|
||||
<div className="mx-auto w-full max-w-6xl px-4 pb-12 lg:px-6">
|
||||
<HoursReport />
|
||||
</div>
|
||||
</AppShell>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -23,6 +23,7 @@ type Company = {
|
|||
name: string
|
||||
slug: string
|
||||
isAvulso: boolean
|
||||
contractedHoursPerMonth?: number | null
|
||||
cnpj: string | null
|
||||
domain: string | null
|
||||
phone: string | null
|
||||
|
|
@ -145,6 +146,16 @@ export function AdminCompaniesManager({ initialCompanies }: { initialCompanies:
|
|||
<Label>Endereço</Label>
|
||||
<Input value={form.address ?? ""} onChange={(e) => setForm((p) => ({ ...p, address: e.target.value }))} />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>Horas contratadas/mês</Label>
|
||||
<Input
|
||||
type="number"
|
||||
min={0}
|
||||
step="0.25"
|
||||
value={form.contractedHoursPerMonth ?? ""}
|
||||
onChange={(e) => setForm((p) => ({ ...p, contractedHoursPerMonth: e.target.value === "" ? undefined : Number(e.target.value) }))}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 md:col-span-2">
|
||||
<Checkbox
|
||||
checked={Boolean(form.isAvulso ?? false)}
|
||||
|
|
@ -210,4 +221,3 @@ export function AdminCompaniesManager({ initialCompanies }: { initialCompanies:
|
|||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -76,6 +76,7 @@ const navigation: { versions: string[]; navMain: NavigationGroup[] } = {
|
|||
{ title: "SLA e produtividade", url: "/reports/sla", icon: Gauge, requiredRole: "staff" },
|
||||
{ title: "Qualidade (CSAT)", url: "/reports/csat", icon: LifeBuoy, requiredRole: "staff" },
|
||||
{ title: "Backlog", url: "/reports/backlog", icon: BarChart3, requiredRole: "staff" },
|
||||
{ title: "Horas por cliente", url: "/reports/hours", icon: Gauge, requiredRole: "staff" },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
|
|||
99
src/components/reports/hours-report.tsx
Normal file
99
src/components/reports/hours-report.tsx
Normal file
|
|
@ -0,0 +1,99 @@
|
|||
"use client"
|
||||
|
||||
import { useState, useMemo } from "react"
|
||||
import { useQuery } from "convex/react"
|
||||
|
||||
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, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Badge } from "@/components/ui/badge"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"
|
||||
|
||||
function formatHours(ms: number) {
|
||||
const hours = ms / 3600000
|
||||
return hours.toFixed(2)
|
||||
}
|
||||
|
||||
export function HoursReport() {
|
||||
const [timeRange, setTimeRange] = useState("90d")
|
||||
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
|
||||
|
||||
const items = data?.items ?? []
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<Card className="border-slate-200">
|
||||
<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>
|
||||
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>
|
||||
</CardAction>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="min-w-full table-fixed text-sm">
|
||||
<thead>
|
||||
<tr className="text-left text-xs uppercase tracking-wide text-neutral-500">
|
||||
<th className="py-2 pr-4">Cliente</th>
|
||||
<th className="py-2 pr-4">Avulso</th>
|
||||
<th className="py-2 pr-4">Horas internas</th>
|
||||
<th className="py-2 pr-4">Horas externas</th>
|
||||
<th className="py-2 pr-4">Total</th>
|
||||
<th className="py-2 pr-4">Contratadas/mês</th>
|
||||
<th className="py-2 pr-4">Uso</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-slate-200">
|
||||
{items.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"
|
||||
return (
|
||||
<tr key={row.companyId}>
|
||||
<td className="py-2 pr-4 font-medium text-neutral-900">{row.name}</td>
|
||||
<td className="py-2 pr-4">{row.isAvulso ? "Sim" : "Não"}</td>
|
||||
<td className="py-2 pr-4">{formatHours(row.internalMs)}</td>
|
||||
<td className="py-2 pr-4">{formatHours(row.externalMs)}</td>
|
||||
<td className="py-2 pr-4 font-semibold text-neutral-900">{formatHours(row.totalMs)}</td>
|
||||
<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">
|
||||
{pct}%
|
||||
</Badge>
|
||||
) : (
|
||||
<span className="text-neutral-500">—</span>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
Add table
Add a link
Reference in a new issue