app/pages/organization.vue

<!-- Page de détails de l'organization courante -->

<template>
  <div>
    <LayoutContainer v-if="organization">
      <!-- Définit le contenu des trois slots du header de la page -->
      <LayoutBannerTop>
        <template #block1>
          {{ organization.name }}
        </template>
        <template #block2>
          N°Siret : {{ organization.siretNumber }}
        </template>
        <template #block3>
          {{ organization.description }}
        </template>
      </LayoutBannerTop>

      <!-- Rend le contenu de la page -->
      <NuxtPage />
    </LayoutContainer>
    <LayoutContainer v-else>
      Pending : {{ emPending }}
    </LayoutContainer>
  </div>
</template>

<script setup lang="ts">

import {useEntityManager} from "~/composables/data/useEntityManager";
import {useEntityFetch} from "~/composables/data/useEntityFetch";
import {computed, ComputedRef, Ref} from "@vue/reactivity";
import {useOrganizationProfileStore} from "~/stores/organizationProfile";
import Organization from "~/models/Organization/Organization";
import ContactPoint from "~/models/Core/ContactPoint";
import BankAccount from "~/models/Core/BankAccount";
import OrganizationAddressPostal from "~/models/Organization/OrganizationAddressPostal";
import AddressPostal from "~/models/Core/AddressPostal";
import Country from "~/models/Core/Country";
import TypeOfPractice from "~/models/Organization/TypeOfPractice";
import Network from "~/models/Network/Network";
import NetworkOrganization from "~/models/Network/NetworkOrganization";
import OrganizationArticle from "~/models/Organization/OrganizationArticle";
import File from "~/models/Core/File";

const { em, pending: emPending } = useEntityManager()

const id: number | null = useOrganizationProfileStore().id
if (id === null) {
  throw new Error('Missing organization id')
}

const { fetch } = useEntityFetch()

const { pending } = fetch(Organization, id)

// Get file from store
const organization: ComputedRef<Organization> = computed( () => {
  return em.find(Organization, id)
})



// TODO: restaurer le middleware  (peut-être utiliser beforeMount?)
// middleware({ $ability, redirect }) {
//   if(!$ability.can('display', 'organization_page'))
//     return redirect('/error')
// }


onBeforeUnmount(() => {
  console.log('flush store') // TODO: vérifier le bon fonctionnement
  em.flush(Organization)
  em.flush(ContactPoint)
  em.flush(BankAccount)
  em.flush(OrganizationAddressPostal)
  em.flush(AddressPostal)
  em.flush(Country)
  em.flush(TypeOfPractice)
  em.flush(Network)
  em.flush(NetworkOrganization)
  em.flush(OrganizationArticle)
  em.flush(File)
})
</script>