91 lines
2.7 KiB
Vue
91 lines
2.7 KiB
Vue
<script lang="ts" setup>
|
|
import teamRoutes from '@/routes/teams';
|
|
import {Head, Link, setLayoutProps} from '@inertiajs/vue3';
|
|
import type {Team} from '@/types/models';
|
|
import {Card, CardContent} from '@/components/ui/card';
|
|
import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow,} from '@/components/ui/table';
|
|
import {Button} from '@/components/ui/button';
|
|
import {Pencil} from '@lucide/vue';
|
|
|
|
const props = defineProps<{
|
|
team: Team;
|
|
canManageTeam: boolean;
|
|
}>();
|
|
|
|
setLayoutProps({
|
|
breadcrumbs: [
|
|
{
|
|
title: 'Teams',
|
|
href: teamRoutes.index(),
|
|
},
|
|
{
|
|
title: props.team.name,
|
|
href: teamRoutes.index(),
|
|
},
|
|
],
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<Head title="Teams"/>
|
|
|
|
<div class="flex flex-col justify-center p-16">
|
|
<div v-if="canManageTeam" class="flex w-full justify-end py-4">
|
|
<Link :href="teamRoutes.create()">
|
|
<Button>
|
|
<component :is="Pencil"/>
|
|
Bearbeiten
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
<Card class="w-full mb-8">
|
|
<CardContent class="flex flex-col">
|
|
<h1 class="font-semibold text-2xl">{{ team.name }}</h1>
|
|
<Table>
|
|
<TableBody class="[&_td]:py-0 [&_tr]:border-0 text-gray-500 text-sm">
|
|
<TableRow>
|
|
<TableCell class="font-bold ">Slug:</TableCell>
|
|
<TableCell>{{ team.slug }}</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell class="font-bold ">Erfordert 2FA:</TableCell>
|
|
<TableCell>{{ team.multi_factor_required ? 'Ja' : 'Nein' }}</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell class="font-bold ">Erstellt am:</TableCell>
|
|
<TableCell>{{ team.created_at }}</TableCell>
|
|
</TableRow>
|
|
</TableBody>
|
|
</Table>
|
|
</CardContent>
|
|
</Card>
|
|
<Card>
|
|
<CardContent>
|
|
<h2 class="font-semibold text-lg">Mitglieder</h2>
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Name</TableHead>
|
|
<TableHead>Email</TableHead>
|
|
<TableHead>2FA</TableHead>
|
|
<TableHead>Rolle</TableHead>
|
|
<TableHead>Beigetreten Am</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
<TableRow v-for="member in team.members">
|
|
<TableCell>{{ member.name }}</TableCell>
|
|
<TableCell>{{ member.email }}</TableCell>
|
|
<TableCell>{{ member.has_multi_factor ? 'Ja' : 'Nein' }}</TableCell>
|
|
<TableCell>{{ member.role }}</TableCell>
|
|
<TableCell>{{ member.joined_at }}</TableCell>
|
|
</TableRow>
|
|
</TableBody>
|
|
</Table>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</template>
|