feat(admin): index.vue als quick-link-dashboard (Phase 2 done)

Phase 2-pending-Liste durch 4 NuxtLink-Cards ersetzt → tap navigiert direkt
zur jeweiligen page. Plus separater Stats-Quick-Link unten.

Pages-content unangetastet, nur dashboard refresh.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
chahinebrini 2026-05-09 15:48:26 +02:00
parent 6c1abc1ec9
commit b36d9ae7c4

View File

@ -3,43 +3,39 @@
<h1 class="text-xl font-semibold text-white mb-1">Dashboard</h1>
<p class="text-sm text-gray-500 mb-8">rebreak Admin -- internes Verwaltungspanel</p>
<!-- Stat-Cards (Placeholder bis Phase 2 echte API-Calls hat) -->
<!-- Quick-Links zu den 4 Phase-2-Pages -->
<div class="grid grid-cols-2 gap-4 lg:grid-cols-4 mb-8">
<div
v-for="card in statCards"
<NuxtLink
v-for="card in quickLinks"
:key="card.label"
class="rounded-lg border border-gray-800 bg-gray-900 p-4"
:to="card.to"
class="rounded-lg border border-gray-800 bg-gray-900 p-4 hover:bg-gray-800 transition-colors block"
>
<div class="flex items-center gap-2 mb-2">
<UIcon :name="card.icon" class="h-4 w-4 text-gray-500" />
<span class="text-xs text-gray-500">{{ card.label }}</span>
</div>
<p class="text-2xl font-bold text-white">{{ card.value }}</p>
</div>
<p class="text-xs text-gray-600 mt-1">{{ card.hint }}</p>
</NuxtLink>
</div>
<!-- Phase 2 Preview -->
<div class="rounded-lg border border-gray-800 bg-gray-900 p-6">
<h2 class="text-sm font-medium text-gray-400 mb-3">Phase 2 -- ausstehende Features</h2>
<ul class="space-y-2 text-sm text-gray-500">
<li class="flex items-center gap-2">
<UIcon name="heroicons:clock" class="h-4 w-4 text-gray-600" />
Domain-Approval-Queue (wartende Anfragen)
</li>
<li class="flex items-center gap-2">
<UIcon name="heroicons:clock" class="h-4 w-4 text-gray-600" />
User-Liste mit Plan-Status + letztem Login
</li>
<li class="flex items-center gap-2">
<UIcon name="heroicons:clock" class="h-4 w-4 text-gray-600" />
SOS-Session-Statistiken (aggregiert, anonym)
</li>
<li class="flex items-center gap-2">
<UIcon name="heroicons:clock" class="h-4 w-4 text-gray-600" />
Content-Moderation-Queue (gemeldete Nachrichten)
</li>
</ul>
</div>
<!-- Vollständige Stats-Page-Hinweis -->
<NuxtLink
to="/stats"
class="rounded-lg border border-gray-800 bg-gray-900 p-6 block hover:bg-gray-800 transition-colors"
>
<div class="flex items-center gap-3">
<UIcon name="heroicons:chart-bar" class="h-6 w-6 text-blue-400" />
<div class="flex-1">
<h2 class="text-sm font-medium text-white">Vollständige Statistiken</h2>
<p class="text-xs text-gray-500 mt-1">
Aggregierte User/Posts/Domain-Stats mit Auto-Refresh
</p>
</div>
<UIcon name="heroicons:arrow-right" class="h-4 w-4 text-gray-500" />
</div>
</NuxtLink>
</div>
</template>
@ -49,11 +45,35 @@ definePageMeta({
middleware: "admin-auth",
})
// Placeholder-Werte -- Phase 2 ersetzt mit echten API-Calls gegen backend /api/admin/*
const statCards = [
{ label: "Aktive User (30d)", value: "—", icon: "heroicons:users" },
{ label: "SOS-Sessions heute", value: "—", icon: "heroicons:chat-bubble-left-ellipsis" },
{ label: "Domains pending", value: "—", icon: "heroicons:globe-alt" },
{ label: "Free / Pro / Legend", value: "—", icon: "heroicons:star" },
// Quick-Links als statische Cards echte Stats-page übernimmt Live-Werte
const quickLinks = [
{
label: "Domain-Approval",
value: "→",
hint: "Pending submissions prüfen",
icon: "heroicons:globe-alt",
to: "/domains",
},
{
label: "User-Verwaltung",
value: "→",
hint: "Plan/Ban/Soft-Delete",
icon: "heroicons:users",
to: "/users",
},
{
label: "Statistiken",
value: "→",
hint: "Aktive User, Posts, Domains",
icon: "heroicons:chart-bar",
to: "/stats",
},
{
label: "Moderation",
value: "→",
hint: "Reported content queue",
icon: "heroicons:flag",
to: "/moderation",
},
]
</script>