refactor(app): unify settings tab design for tags, templates & crowd types

Move crowd types management to organisation settings as a new tab and
align all three settings tabs (Tags, Registration Field Templates, Crowd
Types) to the same layout pattern: header with title/subtitle, VDataTable
for active items, and a separate inactive section with VList. Also fix
the API to return inactive records for person tags and registration field
templates so the frontend can display them.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/app/src/pages/organisation/index.vue

@@ -2,7 +2,6 @@
 import { useMyOrganisation } from '@/composables/api/useOrganisations'
 import { useAuthStore } from '@/stores/useAuthStore'
 import EditOrganisationDialog from '@/components/organisations/EditOrganisationDialog.vue'
-import CrowdTypesManager from '@/components/organisations/CrowdTypesManager.vue'
 import type { Organisation } from '@/types/organisation'
 
 const authStore = useAuthStore()
@@ -124,13 +123,6 @@ function formatDate(iso: string) {
         </VCardText>
       </VCard>
 
-      <!-- Crowd Types -->
-      <CrowdTypesManager
-        v-if="isOrgAdmin"
-        :org-id="organisation.id"
-        class="mt-6"
-      />
-
       <EditOrganisationDialog
         v-model="isEditDialogOpen"
         :organisation="organisation"

apps/app/src/pages/organisation/settings.vue

@@ -2,6 +2,7 @@
 import { useOrganisationStore } from '@/stores/useOrganisationStore'
 import PersonTagsTab from '@/components/organisation/PersonTagsTab.vue'
 import RegistrationFieldTemplatesTab from '@/components/organisation/RegistrationFieldTemplatesTab.vue'
+import CrowdTypesManager from '@/components/organisations/CrowdTypesManager.vue'
 
 const route = useRoute()
 const router = useRouter()
@@ -12,6 +13,7 @@ const orgId = computed(() => orgStore.activeOrganisationId ?? '')
 const tabs = [
   { value: 'tags', label: 'Tags & Vaardigheden', icon: 'tabler-tag' },
   { value: 'templates', label: 'Registratieveld-templates', icon: 'tabler-forms' },
+  { value: 'crowd-types', label: 'Crowd types', icon: 'tabler-users-group' },
 ]
 
 const activeTab = computed({
@@ -62,6 +64,9 @@ const activeTab = computed({
       <VWindowItem value="templates">
         <RegistrationFieldTemplatesTab :org-id="orgId" />
       </VWindowItem>
+      <VWindowItem value="crowd-types">
+        <CrowdTypesManager :org-id="orgId" />
+      </VWindowItem>
     </VWindow>
   </div>
 </template>