feat(frontend) : add portal pages, update auth middleware and DTOs for client portal

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-15 19:51:51 +01:00
parent 17c5160f2c
commit 0724d38a26
8 changed files with 347 additions and 29 deletions
@@ -0,0 +1,87 @@
+<template>
+    <div>
+        <div class="sticky top-8 z-20 bg-white pb-4 sm:top-12">
+            <h1 class="text-xl font-bold text-primary-500 sm:text-2xl">{{ $t('portal.projects') }}</h1>
+        </div>
+
+        <div v-if="isLoading" class="py-8 text-center text-sm text-neutral-400">
+            {{ $t('common.loading') }}
+        </div>
+
+        <div v-else-if="projects.length === 0" class="py-8 text-center text-sm text-neutral-400">
+            {{ $t('portal.noProjects') }}
+        </div>
+
+        <div v-else class="mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
+            <NuxtLink
+                v-for="project in projects"
+                :key="project.id"
+                :to="`/portal/projects/${project.id}`"
+                class="rounded-lg border border-neutral-200 bg-white p-5 shadow-sm transition hover:shadow-md"
+            >
+                <h3 class="text-lg font-bold text-neutral-900">{{ project.name }}</h3>
+                <p class="mt-2 text-sm text-neutral-500">
+                    {{ ticketCountByProject[project.id] ?? 0 }} {{ $t('portal.openTickets') }}
+                </p>
+            </NuxtLink>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type { Project } from '~/services/dto/project'
+import type { ClientTicket } from '~/services/dto/client-ticket'
+import { useClientTicketService } from '~/services/client-tickets'
+import { useProjectService } from '~/services/projects'
+
+definePageMeta({
+    layout: 'portal',
+})
+
+const { t } = useI18n()
+useHead({ title: t('portal.title') })
+
+const auth = useAuthStore()
+const clientTicketService = useClientTicketService()
+const projectService = useProjectService()
+
+const projects = ref<Project[]>([])
+const tickets = ref<ClientTicket[]>([])
+const isLoading = ref(true)
+
+const ticketCountByProject = computed(() => {
+    const counts: Record<number, number> = {}
+    for (const ticket of tickets.value) {
+        if (ticket.status === 'new' || ticket.status === 'in_progress') {
+            // Extract project ID from IRI
+            const match = ticket.project.match(/\/api\/projects\/(\d+)/)
+            if (match) {
+                const projectId = Number(match[1])
+                counts[projectId] = (counts[projectId] ?? 0) + 1
+            }
+        }
+    }
+    return counts
+})
+
+async function loadData() {
+    isLoading.value = true
+    try {
+        if (auth.user?.roles?.includes('ROLE_ADMIN')) {
+            // Admin sees all projects
+            const allProjects = await projectService.getAll({ archived: false })
+            projects.value = allProjects
+        } else {
+            // Client sees allowed projects
+            projects.value = auth.user?.allowedProjects ?? []
+        }
+        tickets.value = await clientTicketService.getAll()
+    } finally {
+        isLoading.value = false
+    }
+}
+
+onMounted(() => {
+    loadData()
+})
+</script>