93 lines
2.7 KiB
Vue
93 lines
2.7 KiB
Vue
<script lang="ts" setup>
|
|
import teamRoutes from '@/routes/teams';
|
|
import {Head, Link, router, usePage} from '@inertiajs/vue3';
|
|
import type {Team} from '@/types/models';
|
|
import TextLink from '@/components/TextLink.vue';
|
|
import {Card, CardContent} from '@/components/ui/card';
|
|
import {Table, TableBody, TableCaption, TableCell, TableHead, TableHeader, TableRow,} from '@/components/ui/table';
|
|
import {Button} from '@/components/ui/button';
|
|
import {Eye, Pencil, Plus} from '@lucide/vue';
|
|
|
|
defineOptions({
|
|
layout: {
|
|
breadcrumbs: [
|
|
{
|
|
title: 'Teams',
|
|
href: teamRoutes.index(),
|
|
},
|
|
],
|
|
},
|
|
});
|
|
|
|
defineProps<{
|
|
teams: Team[];
|
|
canCreateTeam: boolean;
|
|
}>();
|
|
|
|
const user = usePage().props.auth.user;
|
|
|
|
const openTeam = (team: Team) =>
|
|
router.visit(teamRoutes.show({team: team.slug}).url);
|
|
|
|
const canManageTeam = (team: Team) =>
|
|
team.members.find((member) => member.email === user.email)?.role === 'admin';
|
|
</script>
|
|
|
|
<template>
|
|
<Head title="Teams"/>
|
|
|
|
<div class="flex flex-col justify-center p-16">
|
|
<div v-if="canCreateTeam" class="flex w-full justify-end py-4">
|
|
<Link :href="teamRoutes.create()">
|
|
<Button>
|
|
<component :is="Plus"/>
|
|
Erstellen
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
<Card class="w-full">
|
|
<CardContent>
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Name</TableHead>
|
|
<TableHead>Slug</TableHead>
|
|
<TableHead>Mitglieder</TableHead>
|
|
<TableHead>2FA</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
<TableRow
|
|
v-for="team in teams"
|
|
v-if="teams.length > 0"
|
|
:key="team.slug"
|
|
role="link"
|
|
tabindex="0"
|
|
@click="openTeam(team)"
|
|
>
|
|
<TableCell>{{ team.name }}</TableCell>
|
|
<TableCell>{{ team.slug }}</TableCell>
|
|
<TableCell>{{ team.members.length }}</TableCell>
|
|
<TableCell>{{ team.multi_factor_required ? 'Ja' : 'Nein' }}</TableCell>
|
|
<Link
|
|
:href="(canManageTeam(team) ? teamRoutes.edit : teamRoutes.show)({ team: team.slug })"
|
|
class="cursor-pointer"
|
|
@click.stop
|
|
>
|
|
<TableCell>
|
|
<component :is="canManageTeam(team) ? Pencil : Eye" size="18"/>
|
|
</TableCell>
|
|
</Link>
|
|
</TableRow>
|
|
</TableBody>
|
|
<TableCaption v-if="teams.length <= 0">
|
|
Du bist noch von keinem Team mitglied. Tritt einem Team bei oder
|
|
<TextLink :href="teamRoutes.create()">erstelle eins.</TextLink>
|
|
</TableCaption>
|
|
</Table>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</template>
|