Files
warren/frontend/pages/admin/index.vue
2025-07-22 22:01:43 +02:00

117 lines
4.9 KiB
Vue

<script setup lang="ts">
definePageMeta({
layout: 'admin',
middleware: ['authenticated', 'is-admin'],
});
const session = useAuthSession();
const adminStore = useAdminStore();
</script>
<template>
<div class="grid gap-4 lg:grid-cols-2">
<Card class="overflow-hidden">
<CardHeader>
<CardTitle>Users</CardTitle>
<CardDescription>Create or manage users</CardDescription>
</CardHeader>
<CardContent class="max-h-96 overflow-hidden">
<ScrollArea class="h-full w-full overflow-hidden">
<div class="flex w-full flex-col gap-2 overflow-hidden">
<AdminUserListing
v-for="user in adminStore.resources.users"
:key="user.id"
:user
>
<template #actions>
<Button
class="m-1"
variant="outline"
size="icon"
@click="
() => adminStore.setEditUserDialog(user)
"
>
<Icon name="lucide:pencil" />
</Button>
<Button
class="m-1"
variant="destructive"
size="icon"
:disabled="session?.user.id === user.id"
@click="
() =>
adminStore.openDeleteUserDialog(
user
)
"
>
<Icon name="lucide:trash-2" />
</Button>
</template>
</AdminUserListing>
</div>
</ScrollArea>
</CardContent>
<CardFooter>
<div class="mt-4 flex grow flex-row justify-end">
<Button @click="adminStore.openCreateUserDialog"
>Create</Button
>
</div>
</CardFooter>
</Card>
<Card class="overflow-hidden">
<CardHeader>
<CardTitle>Warrens</CardTitle>
<CardDescription>Create or manage warrens</CardDescription>
</CardHeader>
<CardContent class="max-h-96 grow overflow-hidden">
<ScrollArea class="h-full w-full overflow-hidden">
<div class="flex w-full flex-col gap-2 overflow-hidden">
<AdminWarrenListing
v-for="warren in adminStore.resources.warrens"
:key="warren.id"
:warren
>
<template #actions>
<Button
class="m-1"
variant="outline"
size="icon"
@click="
() =>
adminStore.openEditWarrenDialog(
warren
)
"
><Icon name="lucide:pencil"
/></Button>
<Button
class="m-1"
variant="destructive"
size="icon"
@click="
() =>
adminStore.openDeleteWarrenDialog(
warren
)
"
><Icon name="lucide:trash-2"
/></Button>
</template>
</AdminWarrenListing>
</div>
</ScrollArea>
</CardContent>
<CardFooter>
<div class="mt-4 flex grow flex-row justify-end">
<Button @click="adminStore.openCreateWarrenDialog"
>Create</Button
>
</div>
</CardFooter>
</Card>
</div>
</template>