48 lines
2.1 KiB
TypeScript
48 lines
2.1 KiB
TypeScript
|
import Link from "next/link";
|
||
|
|
import { ArrowLeft, ClipboardList } from "lucide-react";
|
||
|
|
import { serverAuth } from "@/lib/pb";
|
||
|
|
import { JobCardsTable, type JobRow } from "@/components/JobCardsTable";
|
||
|
|
|
||
|
|
export const dynamic = "force-dynamic";
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Job cards: the work mechanics log from the Plant Clock app. A mechanic scans a vehicle's
|
||
|
|
* QR to start a job and scans it again to finish, giving the odometer, the kind of work
|
||
|
|
* and a note. Time on the job is first scan to second scan.
|
||
|
|
*/
|
||
|
|
export default async function JobCardsPage() {
|
||
|
|
const pb = await serverAuth();
|
||
|
|
const cards = await pb.collection("job_cards").getFullList({ expand: "asset", sort: "-started_at" });
|
||
|
|
const rows: JobRow[] = cards.map((j) => ({
|
||
|
|
id: j.id,
|
||
|
|
startedAt: String(j.started_at || ""),
|
||
|
|
endedAt: String(j.ended_at || ""),
|
||
|
|
open: j.status === "open",
|
||
|
|
asset: String(j.expand?.asset?.code || ""),
|
||
|
|
assetName: String(j.expand?.asset?.name || ""),
|
||
|
|
mechanic: String(j.mechanic_name || ""),
|
||
|
|
type: String(j.job_type || ""),
|
||
|
|
minutes: Number(j.duration_minutes || 0),
|
||
|
|
odometer: j.status === "closed" && !j.no_meter ? Number(j.odometer || 0) : null,
|
||
|
|
note: String(j.note || ""),
|
||
|
|
}));
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="p-4 sm:p-8 max-w-[1400px]">
|
||
|
|
<Link href="/running" className="inline-flex min-h-[44px] items-center gap-1 text-xs text-gray-500 dark:text-gray-400 hover:text-[#30638E] mb-3">
|
||
|
|
<ArrowLeft className="w-3 h-3" /> Back to Running Costs
|
||
|
|
</Link>
|
||
|
|
<div className="mb-6">
|
||
|
|
<div className="flex items-center gap-3 mb-1">
|
||
|
|
<div className="w-10 h-10 shrink-0 rounded-xl bg-gradient-to-br from-[#30638E]/15 to-[#003D5B]/15 grid place-items-center text-[#30638E]">
|
||
|
|
<ClipboardList className="w-5 h-5" />
|
||
|
|
</div>
|
||
|
|
<h1 className="text-2xl font-semibold text-[#003D5B] dark:text-white">Job Cards</h1>
|
||
|
|
</div>
|
||
|
|
<p className="text-gray-500 dark:text-gray-400 text-sm">Work done on each vehicle, logged by mechanics in the Plant Clock app</p>
|
||
|
|
</div>
|
||
|
|
<JobCardsTable rows={rows} />
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|