stadtwerke/innungsapp/apps/admin/app/superadmin/page.tsx

85 lines
4.6 KiB
TypeScript

import { prisma } from '@innungsapp/shared'
import { CreateOrgForm } from './CreateOrgForm'
import { format } from 'date-fns'
import { de } from 'date-fns/locale'
export default async function SuperAdminPage() {
const organizations = await prisma.organization.findMany({
orderBy: { createdAt: 'desc' },
include: {
_count: {
select: {
members: true,
userRoles: true,
},
},
},
})
return (
<div className="space-y-8">
<div>
<h1 className="text-2xl font-bold text-gray-900">Innungs-Verwaltung (Multi-Tenant)</h1>
<p className="text-gray-500 mt-1">Hierüber werden alle Mandanten der Lösung verwaltet.</p>
</div>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
{/* Form: Create new org */}
<div className="lg:col-span-1">
<CreateOrgForm />
</div>
{/* List of orgs */}
<div className="lg:col-span-2">
<div className="bg-white rounded-lg border overflow-hidden">
<div className="p-6 border-b">
<h2 className="text-lg font-semibold text-gray-900">Aktive Innungen ({organizations.length})</h2>
</div>
<div className="divide-y">
{organizations.length === 0 ? (
<div className="p-8 text-center text-gray-500">
Bisher keine Innungen angelegt.
</div>
) : (
organizations.map((org) => (
<div key={org.id} className="p-5 hover:bg-gray-50 border-l-[3px] border-transparent hover:border-brand-500 transition-all">
<div className="flex justify-between items-start">
<div>
<h3 className="font-bold text-gray-900 text-lg">{org.name}</h3>
<div className="flex items-center gap-3 mt-1 text-sm text-gray-500">
<span className="font-mono bg-gray-100 px-2 py-0.5 rounded text-[11px]">{org.slug}</span>
<span></span>
<span>{org.contactEmail || 'Keine E-Mail'}</span>
</div>
</div>
<span className="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">
{org.plan}
</span>
</div>
<div className="mt-4 flex flex-wrap gap-4 text-sm">
<div className="bg-gray-50 px-3 py-2 rounded-lg border inline-block">
<span className="text-gray-500 block text-xs uppercase tracking-wider font-semibold">Mitglieder</span>
<span className="font-bold text-gray-900">{org._count.members}</span>
</div>
<div className="bg-gray-50 px-3 py-2 rounded-lg border inline-block">
<span className="text-gray-500 block text-xs uppercase tracking-wider font-semibold">Admins</span>
<span className="font-bold text-gray-900">{org._count.userRoles}</span>
</div>
<div className="bg-gray-50 px-3 py-2 rounded-lg border inline-block">
<span className="text-gray-500 block text-xs uppercase tracking-wider font-semibold">Erstellt am</span>
<span className="font-bold text-gray-900">{format(org.createdAt, 'dd.MM.yyyy', { locale: de })}</span>
</div>
</div>
</div>
))
)}
</div>
</div>
</div>
</div>
</div>
)
}