muller-reporting-sys/app/admin/workers/page.tsx
2025-11-12 22:21:35 +03:00

76 lines
3.4 KiB
TypeScript

import DashboardLayout from "@/components/DashboardLayout"
import { prisma } from "@/lib/prisma"
import Link from "next/link"
export default async function WorkersPage() {
const workers = await prisma.worker.findMany({
include: { team: true },
orderBy: { empNo: "asc" }
})
return (
<DashboardLayout requiredRole="admin">
<div>
<div className="flex justify-between items-center mb-6">
<h1 className="text-3xl font-bold text-gray-800">Workers</h1>
<Link
href="/admin/workers/create"
className="bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700 transition-colors"
>
+ Add Worker
</Link>
</div>
<div className="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<table className="w-full">
<thead className="bg-gray-50 border-b border-gray-200">
<tr>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Emp No</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Name</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Email</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Job Position</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Team</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Status</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Actions</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
{workers.map((worker) => (
<tr key={worker.id}>
<td className="px-6 py-4 text-sm text-gray-900">{worker.empNo}</td>
<td className="px-6 py-4 text-sm text-gray-900">
{worker.firstName} {worker.surname}
</td>
<td className="px-6 py-4 text-sm text-gray-600">{worker.email}</td>
<td className="px-6 py-4 text-sm text-gray-600">{worker.jobPosition}</td>
<td className="px-6 py-4 text-sm text-gray-600">
{worker.team ? (
<span className="px-2 py-1 bg-blue-100 text-blue-800 rounded text-xs">
{worker.team.name}
</span>
) : (
<span className="text-gray-400 italic">No team</span>
)}
</td>
<td className="px-6 py-4 text-sm">
<span className={`px-3 py-1 rounded-full text-xs font-medium ${
worker.status === "active" ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"
}`}>
{worker.status}
</span>
</td>
<td className="px-6 py-4 text-sm">
<Link href={`/admin/workers/${worker.id}`} className="text-blue-600 hover:underline">
Edit
</Link>
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</DashboardLayout>
)
}