feat(#1): Add permission and role model

legalconsenthub/pages/create.vue

@@ -16,18 +16,11 @@
 
     <template #body>
       <div class="flex flex-col gap-4 sm:gap-6 lg:gap-12 w-full lg:max-w-4xl mx-auto">
-        <div v-if="!true" class="text-center py-12">
+        <div v-if="!canWriteApplicationForms" class="text-center py-12">
           <UIcon name="i-lucide-shield-x" class="w-16 h-16 mx-auto text-red-400 mb-4" />
           <h2 class="text-2xl font-semibold text-gray-700 mb-2">Keine Berechtigung</h2>
           <p class="text-gray-500 mb-4">Sie haben keine Berechtigung zum Erstellen von Anträgen.</p>
-          <UAlert
-            v-if="currentRoleInfo"
-            :title="`Ihre aktuelle Rolle: ${currentRoleInfo.name}`"
-            :description="currentRoleInfo.description"
-            :color="currentRoleInfo.color"
-            variant="soft"
-            class="max-w-md mx-auto"
-          />
+          <UButton to="/" class="mt-4"> Zurück zur Übersicht </UButton>
         </div>
         <div v-else>
           <UPageCard title="Ampelstatus" variant="naked" orientation="horizontal" class="mb-4">
@@ -86,17 +79,11 @@ import type { StepperItem } from '@nuxt/ui'
 const { getAllApplicationFormTemplates } = await useApplicationFormTemplate()
 const { createApplicationForm, submitApplicationForm } = useApplicationForm()
 const { validateFormElements, getHighestComplianceStatus } = useApplicationFormValidator()
+const { canWriteApplicationForms } = usePermissions()
 const userStore = useUserStore()
 const { selectedOrganization } = storeToRefs(userStore)
 const toast = useToast()
 
-// Get current role information for display
-const currentRoleInfo = {
-  name: 'Mitarbeiter',
-  description: 'Sie können Anträge erstellen und bearbeiten.',
-  color: 'info'
-}
-
 const stepper = useTemplateRef('stepper')
 const activeStepperItemIndex = ref<number>(0)
 

legalconsenthub/pages/index.vue

@@ -123,15 +123,18 @@ const selectedOrganizationId = computed({
   }
 })
 
-const items = [
+const { canWriteApplicationForms } = usePermissions()
+
+const items = computed(() => [
   [
     {
       label: 'Neuer Mitbestimmungsantrag',
       icon: 'i-lucide-send',
-      to: '/create'
+      to: '/create',
+      disabled: !canWriteApplicationForms.value
     }
   ]
-]
+])
 
 const applicationForms = computed({
   get: () => data?.value?.content ?? [],
@@ -147,12 +150,14 @@ function getLinksForApplicationForm(applicationForm: ApplicationFormDto) {
     {
       label: 'Bearbeiten',
       icon: 'i-lucide-file-pen',
-      to: `/application-forms/${applicationForm.id}`
+      to: `/application-forms/${applicationForm.id}`,
+      disabled: !canWriteApplicationForms.value
     },
     {
       label: 'Löschen',
       icon: 'i-lucide-trash',
-      to: `?delete&id=${applicationForm.id}`
+      to: `?delete&id=${applicationForm.id}`,
+      disabled: !canWriteApplicationForms.value
     }
   ]
 }