Add role-based authorization system with admin functionality

- Implement authorization middleware and composables for role checking
- Add groups/roles support to authentication and session management
- Create admin dashboard pages and API endpoints
- Add audit logging utility for tracking user actions
- Enhance expense page with role-based access control
- Improve session caching with authorization state management

middleware/authentication.ts

@@ -23,12 +23,21 @@ export default defineNuxtRouteMiddleware(async (to) => {
   const cacheExpiry = 30000; // 30 seconds cache
   
   // Check if we have a cached session
-  const cachedSession = nuxtApp.payload.data[cacheKey];
+  const cachedSession = nuxtApp.payload.data?.[cacheKey];
   const now = Date.now();
   
   if (cachedSession && cachedSession.timestamp && (now - cachedSession.timestamp) < cacheExpiry) {
     console.log('[MIDDLEWARE] Using cached session');
     if (cachedSession.authenticated && cachedSession.user) {
+      // Store auth state for components
+      if (!nuxtApp.payload.data) {
+        nuxtApp.payload.data = {};
+      }
+      nuxtApp.payload.data.authState = {
+        user: cachedSession.user,
+        authenticated: cachedSession.authenticated,
+        groups: cachedSession.groups || []
+      };
       return;
     }
     return navigateTo('/login');
@@ -48,19 +57,39 @@ export default defineNuxtRouteMiddleware(async (to) => {
     clearTimeout(timeout);
     
     // Cache the session data
+    if (!nuxtApp.payload.data) {
+      nuxtApp.payload.data = {};
+    }
+    
     nuxtApp.payload.data[cacheKey] = {
       ...sessionData,
       timestamp: now
     };
     
+    // Store auth state for components
+    nuxtApp.payload.data.authState = {
+      user: sessionData.user,
+      authenticated: sessionData.authenticated,
+      groups: sessionData.groups || []
+    };
+    
     console.log('[MIDDLEWARE] Session check result:', {
       authenticated: sessionData.authenticated,
       hasUser: !!sessionData.user,
-      userId: sessionData.user?.id
+      userId: sessionData.user?.id,
+      groups: sessionData.groups || []
     });
 
     if (sessionData.authenticated && sessionData.user) {
       console.log('[MIDDLEWARE] User authenticated, allowing access');
+      
+      // Check for any auth errors from authorization middleware
+      if (nuxtApp.payload.authError) {
+        const toast = useToast();
+        toast.error(String(nuxtApp.payload.authError));
+        delete nuxtApp.payload.authError;
+      }
+      
       return;
     }
 
@@ -73,10 +102,19 @@ export default defineNuxtRouteMiddleware(async (to) => {
     // If it's a network error or timeout, check if we have a recent cached session
     if (error.name === 'AbortError' || error.code === 'ECONNREFUSED') {
       console.log('[MIDDLEWARE] Network error, checking for recent cache');
-      const recentCache = nuxtApp.payload.data[cacheKey];
+      const recentCache = nuxtApp.payload.data?.[cacheKey];
       if (recentCache && recentCache.timestamp && (now - recentCache.timestamp) < 300000) { // 5 minutes
         console.log('[MIDDLEWARE] Using recent cache despite network error');
         if (recentCache.authenticated && recentCache.user) {
+          // Store auth state for components
+          if (!nuxtApp.payload.data) {
+            nuxtApp.payload.data = {};
+          }
+          nuxtApp.payload.data.authState = {
+            user: recentCache.user,
+            authenticated: recentCache.authenticated,
+            groups: recentCache.groups || []
+          };
           return;
         }
       }

middleware/authorization.ts

@@ -0,0 +1,57 @@
+export default defineNuxtRouteMiddleware(async (to) => {
+  // Skip on server-side rendering
+  if (import.meta.server) return;
+
+  // Skip if no auth requirements or roles specified
+  if (!to.meta.roles) {
+    return;
+  }
+
+  console.log('[AUTHORIZATION] Checking route access for:', to.path, 'Required roles:', to.meta.roles);
+
+  try {
+    // Get current session data with groups
+    const sessionData = await $fetch('/api/auth/session') as any;
+    
+    if (!sessionData.authenticated || !sessionData.user) {
+      console.log('[AUTHORIZATION] User not authenticated, redirecting to login');
+      return navigateTo('/login');
+    }
+
+    // Get required roles for this route
+    const requiredRoles = Array.isArray(to.meta.roles) ? to.meta.roles : [to.meta.roles];
+    const userGroups = sessionData.groups || [];
+
+    // Check if user has any of the required roles
+    const hasRequiredRole = requiredRoles.some(role => userGroups.includes(role));
+
+    if (!hasRequiredRole) {
+      console.log('[AUTHORIZATION] Access denied. User groups:', userGroups, 'Required roles:', requiredRoles);
+      
+      // Store the error in nuxtApp to show toast on redirect
+      const nuxtApp = useNuxtApp();
+      nuxtApp.payload.authError = `Access denied. This page requires one of the following roles: ${requiredRoles.join(', ')}`;
+      
+      // Redirect to dashboard instead of login since user is authenticated
+      return navigateTo('/dashboard');
+    }
+
+    // Store auth state in nuxtApp for use by components
+    const nuxtApp = useNuxtApp();
+    if (!nuxtApp.payload.data) {
+      nuxtApp.payload.data = {};
+    }
+    nuxtApp.payload.data.authState = {
+      user: sessionData.user,
+      authenticated: sessionData.authenticated,
+      groups: sessionData.groups || []
+    };
+
+    console.log('[AUTHORIZATION] Access granted for route:', to.path);
+  } catch (error) {
+    console.error('[AUTHORIZATION] Error checking route access:', error);
+    
+    // If session check fails, redirect to login
+    return navigateTo('/login');
+  }
+});