PetschStudios/ots
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix team authorization, invite revocation, and slug handling
CI/CD / test_and_check_app (push) Failing after 58s
Details
CI/CD / Publish immutable image (push) Skipped
Details

Browse Source
This commit is contained in:
Twyco
2026-09-19 05:54:18 +02:00
parent 3db250ca51
commit e9fc8cabb5
18 changed files with 688 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/pages/team/Show.vue
+61 -43
View File
@@ -1,17 +1,22 @@
<script lang="ts" setup>
import teamRoutes from '@/routes/teams';
import {Head, Link, setLayoutProps} from '@inertiajs/vue3';
import type {Team, TeamInvite} 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, Trash} from '@lucide/vue';
import { Head, Link, setLayoutProps, useForm } from '@inertiajs/vue3';
import type { TeamInvite } from '@/types/models';
import type { TeamShowPageProps } from '@/types/page-props';
import InputError from '@/components/InputError.vue';
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, Trash } from '@lucide/vue';
const props = defineProps<{
team: Team;
canManageTeam: boolean;
teamInvites?: TeamInvite[];
}>();
const props = defineProps<TeamShowPageProps>();
setLayoutProps({
breadcrumbs: [
@@ -26,51 +31,58 @@ setLayoutProps({
],
});
const revokeInvite = (teamInvite: TeamInvite) => fetch(teamRoutes.invite.revoke(teamInvite.team.slug).url, {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({email: teamInvite.invitedEmail})
})
const revokeForm = useForm({ email: '' });
function revokeInvite(invite: TeamInvite): void {
if (revokeForm.processing) {
return;
}
revokeForm.email = invite.invitedEmail;
revokeForm.submit(teamRoutes.invite.revoke({ team: props.team.slug }), {
preserveScroll: true,
});
}
</script>
<template>
<Head title="Teams"/>
<div class="flex flex-col justify-center p-16">
<Head title="Teams" />
<div v-if="canManageTeam" class="flex w-full justify-end py-4">
<Link :href="teamRoutes.edit({team: team.slug})">
<Link :href="teamRoutes.edit({ team: team.slug })">
<Button>
<component :is="Pencil"/>
<component :is="Pencil" />
Bearbeiten
</Button>
</Link>
</div>
<Card class="w-full mb-8">
<Card class="mb-8 w-full">
<CardContent class="flex flex-col">
<h1 class="font-semibold text-2xl">{{ team.name }}</h1>
<h1 class="text-2xl font-semibold">{{ team.name }}</h1>
<Table>
<TableBody class="[&_td]:py-0 [&_tr]:border-0 text-gray-500 text-sm">
<TableBody class="text-sm text-gray-500 [&_td]:py-0 [&_tr]:border-0">
<TableRow>
<TableCell class="font-bold ">Slug:</TableCell>
<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>
<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 class="font-bold">Erstellt am:</TableCell>
<TableCell>{{ team.created_at }}</TableCell>
</TableRow>
</TableBody>
</Table>
</CardContent>
</Card>
<Card class="w-full mb-8">
<Card class="mb-8 w-full">
<CardContent>
<h2 class="font-semibold text-lg">Mitglieder</h2>
<h2 class="text-lg font-semibold">Mitglieder</h2>
<Table>
<TableHeader>
<TableRow>
@@ -82,10 +94,12 @@ const revokeInvite = (teamInvite: TeamInvite) => fetch(teamRoutes.invite.revoke(
</TableRow>
</TableHeader>
<TableBody>
<TableRow v-for="member in team.members">
<TableRow v-for="member in team.members" :key="member.email">
<TableCell>{{ member.name }}</TableCell>
<TableCell>{{ member.email }}</TableCell>
<TableCell>{{ member.has_multi_factor ? 'Ja' : 'Nein' }}</TableCell>
<TableCell>{{
member.has_multi_factor ? 'Ja' : 'Nein'
}}</TableCell>
<TableCell>{{ member.role }}</TableCell>
<TableCell>{{ member.joined_at }}</TableCell>
</TableRow>
@@ -93,9 +107,10 @@ const revokeInvite = (teamInvite: TeamInvite) => fetch(teamRoutes.invite.revoke(
</Table>
</CardContent>
</Card>
<Card v-if="teamInvites" class="w-full mb-8">
<Card v-if="teamInvites" class="mb-8 w-full">
<CardContent>
<h2 class="font-semibold text-lg">Ausstehende Invites</h2>
<h2 class="text-lg font-semibold">Ausstehende Invites</h2>
<InputError :message="revokeForm.errors.email" />
<Table>
<TableHeader>
<TableRow>
@@ -105,19 +120,22 @@ const revokeInvite = (teamInvite: TeamInvite) => fetch(teamRoutes.invite.revoke(
</TableRow>
</TableHeader>
<TableBody>
<TableRow v-for="invite in teamInvites">
<TableRow v-for="invite in teamInvites" :key="invite.invitedEmail">
<TableCell>{{ invite.invitedEmail }}</TableCell>
<TableCell>{{ invite.invitedBy.name }}</TableCell>
<TableCell>{{ invite.invitedAt }}</TableCell>
<Link
:href="teamRoutes.invite.revoke({team: invite.team.slug})"
class="cursor-pointer"
@click="revokeInvite(invite)"
>
<TableCell>
<component :is="Trash" size="18"/>
</TableCell>
</Link>
<TableCell>
<Button
type="button"
variant="ghost"
size="icon"
:disabled="revokeForm.processing"
:aria-label="`Einladung für ${invite.invitedEmail} widerrufen`"
@click="revokeInvite(invite)"
>
<Trash :size="18" />
</Button>
</TableCell>
</TableRow>
</TableBody>
</Table>