50 lines
2.0 KiB
Svelte
50 lines
2.0 KiB
Svelte
<script lang="ts">
|
|
// Get the profile from the page data if available
|
|
let { data } = $props();
|
|
let profile = $derived(data.profile);
|
|
</script>
|
|
|
|
<div class="flex flex-col items-center justify-center min-h-[70vh] p-6">
|
|
<div class="rounded-lg border border-gray-300 p-6 max-w-md w-full flex flex-col gap-6 text-center">
|
|
<div class="flex flex-col items-center gap-2">
|
|
<div class="text-red-600 bg-red-50 p-3 rounded-full">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="w-10 h-10" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" />
|
|
</svg>
|
|
</div>
|
|
<h1 class="text-2xl font-semibold text-gray-800">Access Denied</h1>
|
|
<p class="text-gray-600">You don't have permission to access the events section.</p>
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-4">
|
|
{#if profile}
|
|
<p class="text-sm text-gray-500">
|
|
Your current role: <span class="font-semibold">{profile.section_position || 'Not assigned'}</span>
|
|
</p>
|
|
{#if profile.section}
|
|
<p class="text-sm text-gray-500">
|
|
Section: <span class="font-semibold">{profile.section.name}</span>
|
|
</p>
|
|
{/if}
|
|
{/if}
|
|
|
|
<p class="text-gray-600">
|
|
You need the <span class="font-semibold">events_manager</span> role to access this section.
|
|
Please contact your administrator for assistance.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-3">
|
|
<a href="/private/home" class="rounded-md px-4 py-2 bg-blue-600 text-white">
|
|
Go to Dashboard
|
|
</a>
|
|
<button
|
|
onclick={() => window.history.back()}
|
|
class="rounded-md px-4 py-2 border border-gray-300 text-gray-700"
|
|
aria-label="Go back"
|
|
>
|
|
Go Back
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div> |