Replace all mock data in admin and board pages with real data

- Admin members page now loads real member data from NocoDB API
- Admin users page fetches actual users from Keycloak with tier determination
- Board members page uses real member data with proper transformations
- Admin payments page generates payment records from dues tracking data
- Created new /api/admin/users endpoint for Keycloak user management
- All stats cards now calculate from real data instead of hardcoded values
- Removed all mock/placeholder data arrays from production pages

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>

pages/admin/users/index.vue

@@ -297,45 +297,8 @@ const headers = [
   { title: 'Actions', key: 'actions', sortable: false, align: 'end' }
 ];
 
-// Mock data
-const users = ref([
-  {
-    id: 1,
-    name: 'John Smith',
-    email: 'john.smith@example.com',
-    role: 'admin',
-    status: 'active',
-    lastLogin: new Date('2024-01-15'),
-    avatar: null
-  },
-  {
-    id: 2,
-    name: 'Sarah Johnson',
-    email: 'sarah.j@example.com',
-    role: 'board',
-    status: 'active',
-    lastLogin: new Date('2024-01-14'),
-    avatar: null
-  },
-  {
-    id: 3,
-    name: 'Mike Wilson',
-    email: 'mike.w@example.com',
-    role: 'member',
-    status: 'active',
-    lastLogin: new Date('2024-01-13'),
-    avatar: null
-  },
-  {
-    id: 4,
-    name: 'Emma Davis',
-    email: 'emma.d@example.com',
-    role: 'member',
-    status: 'inactive',
-    lastLogin: new Date('2023-12-01'),
-    avatar: null
-  }
-]);
+// Real data from Keycloak
+const users = ref([]);
 
 // Computed
 const filteredUsers = computed(() => {
@@ -416,12 +379,37 @@ const saveUser = () => {
   editingUser.value = null;
 };
 
+// Load real users from Keycloak
+const loadUsers = async () => {
+  loading.value = true;
+  try {
+    // Fetch users from Keycloak API
+    const response = await $fetch('/api/admin/users');
+    
+    if (response?.success && response.data?.users) {
+      // Transform Keycloak users to our format
+      users.value = response.data.users.map((user: any) => ({
+        id: user.id,
+        name: `${user.firstName || ''} ${user.lastName || ''}`.trim() || user.username,
+        email: user.email,
+        role: user.groups?.[0]?.name || 'member', // Use primary group as role
+        status: user.enabled ? 'active' : 'inactive',
+        lastLogin: user.lastLogin ? new Date(user.lastLogin) : null,
+        avatar: null
+      }));
+      
+      console.log(`[admin-users] Loaded ${users.value.length} users from Keycloak`);
+    }
+  } catch (error) {
+    console.error('Error loading users:', error);
+    // Keep empty array if load fails
+  } finally {
+    loading.value = false;
+  }
+};
+
 // Load data on mount
 onMounted(async () => {
-  loading.value = true;
-  // Fetch users from API
-  setTimeout(() => {
-    loading.value = false;
-  }, 1000);
+  await loadUsers();
 });
 </script>