74 lines
3.1 KiB
TypeScript
74 lines
3.1 KiB
TypeScript
import { auth } from "@/auth";
|
|
import { db } from "@/lib/db";
|
|
import { hasPermission } from "@/lib/permissions";
|
|
import { redirect } from "next/navigation";
|
|
import { AddVesselButton, EditVesselButton } from "./vessel-form";
|
|
import { ConfirmDeleteButton } from "@/components/ui/confirm-delete-button";
|
|
import { deleteVessel } from "./actions";
|
|
import type { Metadata } from "next";
|
|
|
|
export const metadata: Metadata = { title: "Cost Centre Management" };
|
|
|
|
export default async function AdminVesselsPage() {
|
|
const session = await auth();
|
|
if (!session?.user) redirect("/login");
|
|
|
|
if (!hasPermission(session.user.role, "manage_vessels_accounts")) redirect("/dashboard");
|
|
|
|
const vessels = await db.vessel.findMany({ orderBy: { name: "asc" } });
|
|
|
|
return (
|
|
<div>
|
|
<div className="mb-6 flex items-center justify-between">
|
|
<h1 className="text-2xl font-semibold text-neutral-900">Cost Centre Management</h1>
|
|
<AddVesselButton />
|
|
</div>
|
|
|
|
<div className="rounded-lg border border-neutral-200 bg-white overflow-hidden">
|
|
<table className="w-full text-sm">
|
|
<thead className="bg-neutral-50 border-b border-neutral-200">
|
|
<tr>
|
|
<th className="px-4 py-3 text-left font-medium text-neutral-600">Name</th>
|
|
<th className="px-4 py-3 text-left font-medium text-neutral-600">IMO Number</th>
|
|
<th className="px-4 py-3 text-left font-medium text-neutral-600">Status</th>
|
|
<th className="px-4 py-3"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="divide-y divide-neutral-100">
|
|
{vessels.map((vessel) => (
|
|
<tr key={vessel.id} className="hover:bg-neutral-50">
|
|
<td className="px-4 py-3 font-medium text-neutral-900">{vessel.name}</td>
|
|
<td className="px-4 py-3 font-mono text-xs text-neutral-600">
|
|
{vessel.imoNumber ?? <span className="text-neutral-400 italic">—</span>}
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<span className={`rounded-full px-2.5 py-0.5 text-xs font-medium ${
|
|
vessel.isActive ? "bg-success-100 text-success-700" : "bg-neutral-100 text-neutral-500"
|
|
}`}>
|
|
{vessel.isActive ? "Active" : "Inactive"}
|
|
</span>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<span className="flex items-center gap-3">
|
|
<EditVesselButton vessel={{
|
|
id: vessel.id,
|
|
name: vessel.name,
|
|
imoNumber: vessel.imoNumber,
|
|
isActive: vessel.isActive,
|
|
}} />
|
|
<ConfirmDeleteButton onDelete={deleteVessel.bind(null, vessel.id)} label={vessel.name} />
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
{vessels.length === 0 && (
|
|
<tr>
|
|
<td colSpan={4} className="px-4 py-8 text-center text-neutral-400">No cost centres yet.</td>
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|