rewrite main menu into v3 (ongoing) and various fixes

components/Layout/Header/Notification.vue

@@ -85,7 +85,7 @@ import {$accessProfile} from "~/services/profile/accessProfile";
 export default defineComponent({
   setup: function () {
     const {$dataProvider, $dataPersister, $config, store, app: { i18n }} = useContext()
-    const profileAccess = store.state.profile.access
+    const accessProfile = store.state.profile.access
     $accessProfile.setStore(store)
     const currentAccessId = $accessProfile.getCurrentAccessId()
 
@@ -225,8 +225,8 @@ export default defineComponent({
      */
     const download = (link: string) => {
       const url_parts: Array<string> = link.split('/api');
-      if(profileAccess.originalAccess)
-        url_parts[0] = `api/${profileAccess.originalAccess.id}/${currentAccessId}`
+      if(accessProfile.originalAccess)
+        url_parts[0] = `api/${accessProfile.originalAccess.id}/${currentAccessId}`
       else
         url_parts[0] = `api/${currentAccessId}`
 

components/Layout/Menu.vue

@@ -7,10 +7,7 @@ Prend en paramètre une liste de ItemMenu et les met en forme
   <v-navigation-drawer
     :mini-variant.sync="miniVariant"
     v-model="open"
-    fixed
-    clipped
-    class="ot_dark_grey ot_menu_color--text"
-    app
+    class="bg-ot-dark-grey text-ot-menu-color"
   >
     <template #prepend>
       <slot name="title"></slot>
@@ -18,37 +15,35 @@ Prend en paramètre une liste de ItemMenu et les met en forme
 
     <v-list class="left-menu">
       <div v-for="(item, i) in menu" :key="i">
+        <!-- Cas 1 : l'item n'a pas d'enfants, c'est un lien -->
         <v-list-item
           v-if="!item.children"
           :href="item.isExternalLink ? item.to : undefined"
           :to="!item.isExternalLink ? item.to : undefined"
-          router
           exact
         >
-          <v-list-item-action>
-            <v-icon class="ot_menu_color--text" small>
-              {{ item.icon.name }}
-            </v-icon>
-          </v-list-item-action>
-          <v-list-item-content>
-            <v-list-item-title class="ot_menu_color--text" v-text="item.title" />
-          </v-list-item-content>
+          <template v-slot:prepend>
+            <v-list-item-action start>
+              <v-icon :icon="item.icon.name" class="text-ot-menu-color" small />
+            </v-list-item-action>
+          </template>
+
+          <v-list-item-title
+              v-text="item.title"
+              class="text-ot-menu-color"
+          />
         </v-list-item>
 
+        <!-- Cas 2 : l'item a des enfants, c'est un groupe -->
         <v-list-group
           v-else
           v-model="item.active"
-          no-action
         >
           <template #activator>
-            <v-list-item-action>
-              <v-icon class="ot_menu_color--text" small>
-                {{ item.icon.name }}
-              </v-icon>
-            </v-list-item-action>
-            <v-list-item-content>
-              <v-list-item-title class="ot_menu_color--text" v-text="item.title" />
-            </v-list-item-content>
+              <v-list-item-action>
+                <v-icon :icon="item.icon.name" class="text-ot-menu-color" small />
+              </v-list-item-action>
+            <v-list-item-title class="text-ot-menu-color" v-text="item.title" />
           </template>
 
           <v-list-item
@@ -60,17 +55,14 @@ Prend en paramètre une liste de ItemMenu et les met en forme
             exact
           >
             <v-list-item-action>
-              <v-icon class="ot_white--text" small>
-                {{ child.icon.name }}
-              </v-icon>
+              <v-icon :icon="child.icon.name" class="text-ot-white" small />
             </v-list-item-action>
-            <v-list-item-content>
-              <v-list-item-title class="ot_white--text" v-text="child.title" />
-            </v-list-item-content>
+
+            <v-list-item-title class="text-ot-white" v-text="child.title" />
           </v-list-item>
 
           <template #appendIcon>
-            <v-icon class="ot_menu_color--text" small>mdi-chevron-down</v-icon>
+            <v-icon class="text-ot-menu-color" small>mdi-chevron-down</v-icon>
           </template>
         </v-list-group>
       </div>
@@ -85,7 +77,8 @@ Prend en paramètre une liste de ItemMenu et les met en forme
 
 <script setup lang="ts">
 import { ItemsMenu } from '~/types/interfaces'
-import {WatchStopHandle} from "@vue/runtime-core";
+import {onUnmounted, watch, WatchStopHandle} from "@vue/runtime-core";
+import {ref, toRefs} from "@vue/reactivity";
 
 const props = defineProps({
   menu: {
@@ -102,17 +95,22 @@ const props = defineProps({
   }
 })
 
-const {openMenu} = toRefs(props)
+const { openMenu } = toRefs(props)
 const open = ref(true)
 
 //Par défaut si l'écran est trop petit au chargement de la page, le menu doit être fermé.
 if(process.client)
   open.value = window.innerWidth >= 1264
 
+// TODO : ajouter une petite explication de ce qu'on fait dans ce watch
 const unwatch: WatchStopHandle = watch(openMenu, (newValue, oldValue) => {
-  if(newValue !== oldValue)
+  if (newValue !== oldValue) {
     open.value = true
+  }
 })
+
+console.log(props.menu)
+
 onUnmounted(() => {
   unwatch()
 })
@@ -123,7 +121,7 @@ onUnmounted(() => {
     margin-right: 10px !important;
   }
 
-  .v-application--is-ltr .v-list-group--no-action > .v-list-group__header{
+  .v-application--is-ltr .v-list-group--no-action > .v-list-group__header {
     margin-left: 0;
     padding-left: 0;
   }

composables/data/useAp2iRequestService.ts

@@ -1,4 +1,4 @@
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {FetchContext, FetchOptions} from "ohmyfetch";
 import {TYPE_ALERT} from "~/types/enums";
 import {navigateTo, useRuntimeConfig} from "#app";
@@ -32,15 +32,15 @@ export const useAp2iRequestService = () => {
             return
         }
 
-        const profileAccessStore = useProfileAccessStore()
+        const accessProfileStore = useAccessProfileStore()
 
         const headers: AssociativeArray = {
-            'x-accessid': String(profileAccessStore.id),
-            'Authorization': 'BEARER ' + profileAccessStore.bearer,
+            'x-accessid': String(accessProfileStore.id),
+            'Authorization': 'BEARER ' + accessProfileStore.bearer,
         }
 
-        if (profileAccessStore.switchId) {
-            headers['x-switch-user'] = String(profileAccessStore.switchId)
+        if (accessProfileStore.switchId) {
+            headers['x-switch-user'] = String(accessProfileStore.switchId)
         }
 
         options.headers = { ...options.headers, ...headers }

composables/layout/Menus/accessMenu.ts

@@ -10,15 +10,6 @@ import {useAbility} from "@casl/vue";
  */
 class AccessMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-    super($config)
-  }
-
   /**
    * Construit le menu Répertoire, ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -26,37 +17,37 @@ class AccessMenu extends BaseMenu implements Menu {
   getMenu (): ItemMenu | null {
     const children: ItemsMenu = []
     const {can} = useAbility()
-    
+
     if (can('display', 'accesses_page')) {
       const organization = $organizationProfile()
       const to = organization.isSchool() ? '/students/list/' : '/adherent/list/'
-      children.push(this.constructMenu('person', {name: 'fa-user'}, to, true))
+      children.push(this.constructMenuItem('person', {name: 'fa-user'}, to, true))
     }
 
     if (can('display', 'student_registration_page')) {
-      children.push(this.constructMenu('family_view', {name: 'fa-users'}, '/student_registration/new', true))
+      children.push(this.constructMenuItem('family_view', {name: 'fa-users'}, '/student_registration/new', true))
     }
 
     if (can('display', 'education_student_next_year_page')) {
-      children.push(this.constructMenu('education_student_next_year', {name: 'fa-list-alt'}, '/education_student_next_year/list/', true))
+      children.push(this.constructMenuItem('education_student_next_year', {name: 'fa-list-alt'}, '/education_student_next_year/list/', true))
     }
 
     if (can('display', 'commissions_page')) {
-      children.push(this.constructMenu('commissions', {name: 'fa-street-view'}, '/commissions/list/', true))
+      children.push(this.constructMenuItem('commissions', {name: 'fa-street-view'}, '/commissions/list/', true))
     }
 
     if (can('display', 'network_children_page')) {
-      children.push(this.constructMenu('network', {name: 'fa-sitemap'}, 'networks/list/', true))
+      children.push(this.constructMenuItem('network', {name: 'fa-sitemap'}, 'networks/list/', true))
     }
 
     if (can('display', 'network_parents_page')) {
-      children.push(this.constructMenu('my_network', {name: 'fa-sitemap'}, '/network_artist_schools/list/', true))
+      children.push(this.constructMenuItem('my_network', {name: 'fa-sitemap'}, '/network_artist_schools/list/', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('address_book', {name: 'fa-address-book'}, undefined, undefined, children)
+      return this.constructMenuItem('address_book', {name: 'fa-address-book'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/accountMenu.ts

@@ -1,6 +1,6 @@
 import { ItemMenu, ItemsMenu, Menu } from '~/types/interfaces'
 import BaseMenu from '~/composables/layout/Menus/baseMenu'
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {useAbility} from "@casl/vue";
 
 /**
@@ -10,92 +10,83 @@ import {useAbility} from "@casl/vue";
  */
 class AccountMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-    super($config)
-  }
-
   /**
    * Construit le menu Header Configuration ou null si aucune page accessible
    * @return {ItemMenu | null}
    */
   getHeaderMenu (): ItemMenu | null {
-    const profileAccessStore = useProfileAccessStore();
+    const accessProfileStore = useAccessProfileStore();
     const {can} = useAbility()
 
     const children: ItemsMenu = []
 
     if (can('display', 'my_schedule_page')) {
-      children.push(this.constructMenu('my_schedule_page', undefined, '/my_calendar', true))
+      children.push(this.constructMenuItem('my_schedule_page', undefined, '/my_calendar', true))
     }
 
     if (can('display', 'attendance_bookings_page')) {
-      children.push(this.constructMenu('attendance_bookings_menu', undefined, '/own_attendance', true))
+      children.push(this.constructMenuItem('attendance_bookings_menu', undefined, '/own_attendance', true))
     }
 
     if (can('display', 'my_attendance_page')) {
-      children.push(this.constructMenu('my_attendance', undefined, '/my_attendances/list/', true))
+      children.push(this.constructMenuItem('my_attendance', undefined, '/my_attendances/list/', true))
     }
 
     if (can('display', 'my_invitation_page')) {
-      children.push(this.constructMenu('my_invitation', undefined, '/my_invitations/list/', true))
+      children.push(this.constructMenuItem('my_invitation', undefined, '/my_invitations/list/', true))
     }
 
     if (can('display', 'my_students_page')) {
-      children.push(this.constructMenu('my_students', undefined, '/my_students/list/', true))
+      children.push(this.constructMenuItem('my_students', undefined, '/my_students/list/', true))
     }
 
     if (can('display', 'my_students_education_students_page')) {
-      children.push(this.constructMenu('my_students_education_students', undefined, '/my_students_education_students/list/', true))
+      children.push(this.constructMenuItem('my_students_education_students', undefined, '/my_students_education_students/list/', true))
     }
 
     if (can('display', 'criteria_notations_page') || can('display', 'criteria_notations_page_from_account_menu')) {
-      children.push(this.constructMenu('criteria_notations', undefined, '/criteria_notations/list/', true))
+      children.push(this.constructMenuItem('criteria_notations', undefined, '/criteria_notations/list/', true))
     }
 
     if (can('display', 'my_education_students_page')) {
-      children.push(this.constructMenu('my_education_students', undefined, `/main/my_profile/${profileAccessStore.id}/dashboard/my_education_students/list/`, true))
+      children.push(this.constructMenuItem('my_education_students', undefined, `/main/my_profile/${accessProfileStore.id}/dashboard/my_education_students/list/`, true))
     }
 
     if (can('display', 'send_an_email_page')) {
-      children.push(this.constructMenu('send_an_email', undefined, `/list/create/emails`, true))
+      children.push(this.constructMenuItem('send_an_email', undefined, `/list/create/emails`, true))
     }
 
     if (can('display', 'my_documents_page')) {
-      children.push(this.constructMenu('my_documents', undefined, `/main/my_profile/${profileAccessStore.id}/dashboard/show/my_access_file`, true))
+      children.push(this.constructMenuItem('my_documents', undefined, `/main/my_profile/${accessProfileStore.id}/dashboard/show/my_access_file`, true))
     }
 
     if (can('display', 'my_profile_page')) {
-      children.push(this.constructMenu('my_profile', undefined, `/main/my_profile/${profileAccessStore.id}/dashboard`, true))
+      children.push(this.constructMenuItem('my_profile', undefined, `/main/my_profile/${accessProfileStore.id}/dashboard`, true))
     }
 
     if (can('display', 'adherent_list_page')) {
-      children.push(this.constructMenu('adherent_list', undefined, `/adherent_contacts/list/`, true))
+      children.push(this.constructMenuItem('adherent_list', undefined, `/adherent_contacts/list/`, true))
     }
 
     if (can('display', 'subscription_page')) {
-      children.push(this.constructMenu('my_subscription', undefined, `/subscription`))
+      children.push(this.constructMenuItem('my_subscription', undefined, `/subscription`))
     }
 
     if (can('display', 'my_bills_page')) {
-      children.push(this.constructMenu('my_bills', undefined, `/main/my_profile/${profileAccessStore.id}/dashboard/show/my_bills`, true))
+      children.push(this.constructMenuItem('my_bills', undefined, `/main/my_profile/${accessProfileStore.id}/dashboard/show/my_bills`, true))
     }
 
     if (can('display', 'cmf_licence_person_page')) {
-      children.push(this.constructMenu('print_my_licence', undefined, `/licence_cmf/user`, true))
+      children.push(this.constructMenuItem('print_my_licence', undefined, `/licence_cmf/user`, true))
     }
 
-    const accountMenu = this.constructMenu('my_account', {
-      avatarId: profileAccessStore.avatarId,
-      avatarByDefault: profileAccessStore.gender == 'MISTER' ? 'men-1.png' : 'women-1.png'
+    const accountMenu = this.constructMenuItem('my_account', {
+      avatarId: accessProfileStore.avatarId,
+      avatarByDefault: accessProfileStore.gender == 'MISTER' ? 'men-1.png' : 'women-1.png'
     }, undefined, undefined, children, false)
 
     const actions: ItemsMenu = [];
-    actions.push(this.constructMenu('logout', undefined, `/logout`, true))
+    actions.push(this.constructMenuItem('logout', undefined, `/logout`, true))
 
     accountMenu.actions = actions
 

composables/layout/Menus/admin2iosMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class Admin2iosMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issus du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Administration 2ios ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -29,37 +19,37 @@ class Admin2iosMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'all_accesses_page')) {
-      children.push(this.constructMenu('all_accesses', {name: 'fa-users'}, '/all_accesses/list/', true))
+      children.push(this.constructMenuItem('all_accesses', {name: 'fa-users'}, '/all_accesses/list/', true))
     }
 
     if (can('display', 'all_organizations_page')) {
-      children.push(this.constructMenu('all_organizations', {name: 'fa-building'}, '/organization_params/list/', true))
+      children.push(this.constructMenuItem('all_organizations', {name: 'fa-building'}, '/organization_params/list/', true))
     }
 
     if (can('display', 'tips_page')) {
-      children.push(this.constructMenu('tips', {name: 'fa-info-circle'}, '/tips/list/', true))
+      children.push(this.constructMenuItem('tips', {name: 'fa-info-circle'}, '/tips/list/', true))
     }
 
     if (can('display', 'dgv_page')) {
-      children.push(this.constructMenu('dgv', {name: 'fa-house-damage'}, '/admin2ios/dgv', true))
+      children.push(this.constructMenuItem('dgv', {name: 'fa-house-damage'}, '/admin2ios/dgv', true))
     }
 
     if (can('display', 'cmf_cotisation_page')) {
-      children.push(this.constructMenu('cmf_cotisation', {name: 'fa-info-circle'}, '/admin2ios/cotisationcmf', true))
+      children.push(this.constructMenuItem('cmf_cotisation', {name: 'fa-info-circle'}, '/admin2ios/cotisationcmf', true))
     }
 
     if (can('display', 'right_page')) {
-      children.push(this.constructMenu('right_menu', {name: 'fa-balance-scale-right'}, '/admin2ios/right', true))
+      children.push(this.constructMenuItem('right_menu', {name: 'fa-balance-scale-right'}, '/admin2ios/right', true))
     }
 
     if (can('display', 'tree_page')) {
-      children.push(this.constructMenu('tree_menu', {name: 'fa-sitemap'}, '/admin2ios/tree', true))
+      children.push(this.constructMenuItem('tree_menu', {name: 'fa-sitemap'}, '/admin2ios/tree', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('admin2ios', {name: 'fa-sitemap'}, undefined, undefined, children)
+      return this.constructMenuItem('admin2ios', {name: 'fa-sitemap'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/agendaMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class AgendaMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Agenda ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,17 +18,17 @@ class AgendaMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'agenda_page')) {
-      children.push(this.constructMenu('schedule', {name: 'fa-calendar-alt'}, '/calendar', true))
+      children.push(this.constructMenuItem('schedule', {name: 'fa-calendar-alt'}, '/calendar', true))
     }
 
     if (can('display', 'attendance_page')) {
-      children.push(this.constructMenu('attendances', {name: 'fa-calendar-check'}, '/attendances/list/', true))
+      children.push(this.constructMenuItem('attendances', {name: 'fa-calendar-check'}, '/attendances/list/', true))
     }
 
     if (children.length === 1) {
       return children[0]
     }
-    return children.length > 0 ? this.constructMenu('schedule', {name: 'fa-calendar-alt'}, undefined, undefined, children) : null
+    return children.length > 0 ? this.constructMenuItem('schedule', {name: 'fa-calendar-alt'}, undefined, undefined, children) : null
   }
 }
 

composables/layout/Menus/baseMenu.ts

@@ -1,34 +1,40 @@
-import {NuxtConfig} from "nuxt";
 import {ItemMenu, ItemsMenu, IconItem} from '~/types/interfaces'
+import {useRuntimeConfig} from "#app";
+import {RuntimeConfig} from "@nuxt/schema";
+import Url from "~/services/utils/url";
 
 /**
  * @category composables/layout/Menus
  * @class BaseMenu
- * Classe abstraite pour chacun des menu
+ * Classe abstraite pour chacun des menus
  */
 class BaseMenu {
-  protected $config: NuxtConfig;
+  protected $config: RuntimeConfig;
 
   /**
    * @constructor
-   * Initialisation des services issues du context
+   * Initialisation des services issus du context
    */
-  constructor ($config: NuxtConfig) {
-    this.$config = $config
+  constructor () {
+    this.$config = useRuntimeConfig()
   }
 
   /**
    * Construit un ItemMenu
+   *
    * @param {IconItem} icon
    * @param {string} title titre qui sera traduit
    * @param {string} link lien
-   * @param {boolean} isOldLink est-ce un lien renvoyant vers l'ancien admin?
+   * @param {boolean} isV1Link est-ce un lien renvoyant vers l'ancien admin ?
    * @param {Array<ItemMenu>} children Tableau d'ItemMenu représentant les sous menu du menu principal
-   * @param {boolean} isExternalLink est-ce un lien renvoyant vers l'extérieur?
-   * @param {Array<ItemMenu>} actions Tableau d'ItemMenu représentant les actions devant apparaitre en bas du menu
+   * @param {boolean} isExternalLink est-ce un lien renvoyant vers l'extérieur ?
    * @return {ItemMenu}
    */
-  constructMenu (title: string, icon?: IconItem, link?: string, isOldLink?: boolean, children?: Array<ItemMenu>, isExternalLink?: boolean): ItemMenu {
+  constructMenuItem (title: string, icon?: IconItem, link?: string, isV1Link?: boolean, children?: Array<ItemMenu>, isExternalLink?: boolean): ItemMenu {
+    const v1BaseURL = this.$config.baseUrlAdminLegacy ?? this.$config.public.baseUrlAdminLegacy
+
+    const url = (isV1Link && !isExternalLink) ? Url.join(v1BaseURL, link ?? '') : link
+
     return children ? {
       title,
       icon,
@@ -36,8 +42,8 @@ class BaseMenu {
     } : {
       icon,
       title,
-      to: `${isExternalLink || !isOldLink ? '' : this.$config.baseURL_adminLegacy}${link}`,
-      isExternalLink: isExternalLink || isOldLink
+      to: url,
+      isExternalLink: isExternalLink || isV1Link
     }
   }
 

composables/layout/Menus/billingMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class BillingMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Facturation ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,41 +18,41 @@ class BillingMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'billing_product_page')) {
-      children.push(this.constructMenu('billing_product', {name: 'fa-cube'}, '/intangibles/list/', true))
+      children.push(this.constructMenuItem('billing_product', {name: 'fa-cube'}, '/intangibles/list/', true))
     }
 
     if (can('display', 'billing_products_by_student_page')) {
-      children.push(this.constructMenu('billing_products_by_student', {name: 'fa-cubes'}, '/access_intangibles/list/', true))
+      children.push(this.constructMenuItem('billing_products_by_student', {name: 'fa-cubes'}, '/access_intangibles/list/', true))
     }
 
     if (can('display', 'billing_edition_page')) {
-      children.push(this.constructMenu('billing_edition', {name: 'fa-copy'}, '/billing_edition', true))
+      children.push(this.constructMenuItem('billing_edition', {name: 'fa-copy'}, '/billing_edition', true))
     }
 
     if (can('display', 'billing_accounting_page')) {
-      children.push(this.constructMenu('billing_accounting', {name: 'fa-file-alt'}, '/bill_accountings/list/', true))
+      children.push(this.constructMenuItem('billing_accounting', {name: 'fa-file-alt'}, '/bill_accountings/list/', true))
     }
 
     if (can('display', 'billing_payment_list_page')) {
-      children.push(this.constructMenu('billing_payment_list', {name: 'fa-credit-card'}, '/bill_payments_list/list/', true))
+      children.push(this.constructMenuItem('billing_payment_list', {name: 'fa-credit-card'}, '/bill_payments_list/list/', true))
     }
 
     if (can('display', 'pes_page')) {
-      children.push(this.constructMenu('pes_export', {name: 'fa-align-justify'}, '/pes/list/', true))
+      children.push(this.constructMenuItem('pes_export', {name: 'fa-align-justify'}, '/pes/list/', true))
     }
 
     if (can('display', 'berger_levrault_page')) {
-      children.push(this.constructMenu('berger_levrault_export', {name: 'fa-align-justify'}, '/berger_levraults/list/', true))
+      children.push(this.constructMenuItem('berger_levrault_export', {name: 'fa-align-justify'}, '/berger_levraults/list/', true))
     }
 
     if (can('display', 'jvs_page')) {
-      children.push(this.constructMenu('jvs_export', {name: 'fa-align-justify'}, '/jvs/list/', true))
+      children.push(this.constructMenuItem('jvs_export', {name: 'fa-align-justify'}, '/jvs/list/', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('billing', {name: 'fa-euro-sign'}, undefined, undefined, children)
+      return this.constructMenuItem('billing', {name: 'fa-euro-sign'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/communicationMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class CommunicationMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Communication ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,21 +18,21 @@ class CommunicationMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'inbox_page')) {
-      children.push(this.constructMenu('inbox', {name: 'fa-inbox'}, '/messages/list/', true))
+      children.push(this.constructMenuItem('inbox', {name: 'fa-inbox'}, '/messages/list/', true))
     }
 
     if (can('display', 'message_send_page')) {
-      children.push(this.constructMenu('message_send', {name: 'fa-paper-plane'}, '/messagessends/list/', true))
+      children.push(this.constructMenuItem('message_send', {name: 'fa-paper-plane'}, '/messagessends/list/', true))
     }
 
     if (can('display', 'message_templates_page')) {
-      children.push(this.constructMenu('message_templates', {name: 'fa-edit'}, '/templates/list/', true))
+      children.push(this.constructMenuItem('message_templates', {name: 'fa-edit'}, '/templates/list/', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('communication', {name: 'fa-comments'}, undefined, undefined, children)
+      return this.constructMenuItem('communication', {name: 'fa-comments'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/configurationMenu.ts

@@ -10,15 +10,6 @@ import {useAbility} from "@casl/vue";
  */
 class ConfigurationMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-    super($config)
-  }
-
   /**
    * Construit le menu Header Configuration ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -30,62 +21,62 @@ class ConfigurationMenu extends BaseMenu implements Menu {
 
     if (can('display', 'organization_page')) {
       // children.push(this.constructMenu('organization_page', undefined, `/main/organizations/${profileOrganizationStore.id}/dashboard`, true))
-      children.push(this.constructMenu('organization_page', undefined, `/organization`, false))
+      children.push(this.constructMenuItem('organization_page', undefined, `/organization`, false))
     }
 
     if (can('display', 'cmf_licence_page')) {
-      children.push(this.constructMenu('cmf_licence_generate', undefined, '/cmf_licence/organization'))
+      children.push(this.constructMenuItem('cmf_licence_generate', undefined, '/cmf_licence/organization'))
     }
 
     if (can('display', 'parameters_page')) {
       // children.push(this.constructMenu('parameters', undefined,`/main/edit/parameters/${profileOrganizationStore.id}`, true))
-      children.push(this.constructMenu('parameters', undefined,`/parameters`, false))
+      children.push(this.constructMenuItem('parameters', undefined,`/parameters`, false))
     }
 
     if (can('display', 'place_page')) {
-      children.push(this.constructMenu('place', undefined, '/places/list/', true))
+      children.push(this.constructMenuItem('place', undefined, '/places/list/', true))
     }
 
     if (can('display', 'education_page')) {
-      children.push(this.constructMenu('education', undefined, '/educations/list/', true))
+      children.push(this.constructMenuItem('education', undefined, '/educations/list/', true))
     }
 
     if (can('display', 'tag_page')) {
-      children.push(this.constructMenu('tag', undefined, '/taggs/list/', true))
+      children.push(this.constructMenuItem('tag', undefined, '/taggs/list/', true))
     }
 
     if (can('display', 'activities_page')) {
-      children.push(this.constructMenu('activities', undefined, '/activities/list/', true))
+      children.push(this.constructMenuItem('activities', undefined, '/activities/list/', true))
     }
 
     if (can('display', 'template_systems_page')) {
-      children.push(this.constructMenu('template_systems', undefined,'/template_systems/list/', true))
+      children.push(this.constructMenuItem('template_systems', undefined,'/template_systems/list/', true))
     }
 
     if (can('display', 'billing_settings_page')) {
-      children.push(this.constructMenu('billing_settings', undefined, '/main/edit/billing_settings/' + profileOrganizationStore.id, true))
+      children.push(this.constructMenuItem('billing_settings', undefined, '/main/edit/billing_settings/' + profileOrganizationStore.id, true))
     }
 
     if (can('display', 'online_registration_settings_page')) {
-      children.push(this.constructMenu('online_registration_settings', undefined, '/main/edit/online_registration_settings/' + profileOrganizationStore.id, true))
+      children.push(this.constructMenuItem('online_registration_settings', undefined, '/main/edit/online_registration_settings/' + profileOrganizationStore.id, true))
     }
 
     if (can('display', 'transition_next_year_page')) {
-      children.push(this.constructMenu('transition_next_year', undefined, '/transition_next_year', true))
+      children.push(this.constructMenuItem('transition_next_year', undefined, '/transition_next_year', true))
     }
 
     if (can('display', 'course_duplication_page')) {
-      children.push(this.constructMenu('course_duplication', undefined, '/duplicate_courses', true))
+      children.push(this.constructMenuItem('course_duplication', undefined, '/duplicate_courses', true))
     }
 
     if (can('display', 'import_page')) {
-      children.push(this.constructMenu('import', undefined, '/import/all', true))
+      children.push(this.constructMenuItem('import', undefined, '/import/all', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('configuration', {name: 'fa-cogs'}, undefined, undefined, children)
+      return this.constructMenuItem('configuration', {name: 'fa-cogs'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/cotisationsMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class CotisationsMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Cotisations ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,77 +18,77 @@ class CotisationsMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'rate_cotisation_page')) {
-      children.push(this.constructMenu('rate_cotisation', {name: 'fa-euro-sign'}, '/cotisation/rate', true))
+      children.push(this.constructMenuItem('rate_cotisation', {name: 'fa-euro-sign'}, '/cotisation/rate', true))
     }
 
     if (can('display', 'parameters_cotisation_page')) {
-      children.push(this.constructMenu('parameters_cotisation', {name: 'fa-euro-sign'}, '/cotisation/parameter', true))
+      children.push(this.constructMenuItem('parameters_cotisation', {name: 'fa-euro-sign'}, '/cotisation/parameter', true))
     }
 
     if (can('display', 'send_cotisation_page')) {
-      children.push(this.constructMenu('send_cotisation', {name: 'fa-euro-sign'}, '/cotisation/send', true))
+      children.push(this.constructMenuItem('send_cotisation', {name: 'fa-euro-sign'}, '/cotisation/send', true))
     }
 
     if (can('display', 'state_cotisation_page')) {
-      children.push(this.constructMenu('state_cotisation', {name: 'fa-euro-sign'}, '/cotisation/state', true))
+      children.push(this.constructMenuItem('state_cotisation', {name: 'fa-euro-sign'}, '/cotisation/state', true))
     }
 
     if (can('display', 'pay_cotisation_page')) {
-      children.push(this.constructMenu('pay_cotisation', {name: 'fa-euro-sign'}, '/cotisation/pay', true))
+      children.push(this.constructMenuItem('pay_cotisation', {name: 'fa-euro-sign'}, '/cotisation/pay', true))
     }
 
     if (can('display', 'check_cotisation_page')) {
-      children.push(this.constructMenu('check_cotisation', {name: 'fa-euro-sign'}, '/cotisation/check', true))
+      children.push(this.constructMenuItem('check_cotisation', {name: 'fa-euro-sign'}, '/cotisation/check', true))
     }
 
     if (can('display', 'ledger_cotisation_page')) {
-      children.push(this.constructMenu('ledger_cotisation', {name: 'fa-euro-sign'}, '/cotisation/ledger', true))
+      children.push(this.constructMenuItem('ledger_cotisation', {name: 'fa-euro-sign'}, '/cotisation/ledger', true))
     }
 
     if (can('display', 'magazine_cotisation_page')) {
-      children.push(this.constructMenu('magazine_cotisation', {name: 'fa-euro-sign'}, '/cotisation/magazine', true))
+      children.push(this.constructMenuItem('magazine_cotisation', {name: 'fa-euro-sign'}, '/cotisation/magazine', true))
     }
 
     if (can('display', 'ventilated_cotisation_page')) {
-      children.push(this.constructMenu('ventilated_cotisation', {name: 'fa-euro-sign'}, '/cotisation/ventilated', true))
+      children.push(this.constructMenuItem('ventilated_cotisation', {name: 'fa-euro-sign'}, '/cotisation/ventilated', true))
     }
 
     if (can('display', 'pay_erase_cotisation_page')) {
-      children.push(this.constructMenu('pay_erase_cotisation', {name: 'fa-euro-sign'}, '/cotisation/payerase', true))
+      children.push(this.constructMenuItem('pay_erase_cotisation', {name: 'fa-euro-sign'}, '/cotisation/payerase', true))
     }
 
     if (can('display', 'resume_cotisation_page')) {
-      children.push(this.constructMenu('resume_cotisation', {name: 'fa-euro-sign'}, '/cotisation/resume', true))
+      children.push(this.constructMenuItem('resume_cotisation', {name: 'fa-euro-sign'}, '/cotisation/resume', true))
     }
 
     if (can('display', 'history_cotisation_page')) {
-      children.push(this.constructMenu('history_cotisation', {name: 'fa-euro-sign'}, '/cotisation/history', true))
+      children.push(this.constructMenuItem('history_cotisation', {name: 'fa-euro-sign'}, '/cotisation/history', true))
     }
 
     if (can('display', 'call_cotisation_page')) {
-      children.push(this.constructMenu('call_cotisation', {name: 'fa-euro-sign'}, '/cotisation/call', true))
+      children.push(this.constructMenuItem('call_cotisation', {name: 'fa-euro-sign'}, '/cotisation/call', true))
     }
 
     if (can('display', 'history_struture_cotisation_page')) {
-      children.push(this.constructMenu('history_struture_cotisation', {name: 'fa-euro-sign'}, '/cotisation/historystructure', true))
+      children.push(this.constructMenuItem('history_struture_cotisation', {name: 'fa-euro-sign'}, '/cotisation/historystructure', true))
     }
 
     if (can('display', 'insurance_cotisation_page')) {
-      children.push(this.constructMenu('insurance_cotisation', {name: 'fa-euro-sign'}, '/cotisation/insurance', true))
+      children.push(this.constructMenuItem('insurance_cotisation', {name: 'fa-euro-sign'}, '/cotisation/insurance', true))
     }
 
     if (can('display', 'resume_all_cotisation_page')) {
-      children.push(this.constructMenu('resume_all_cotisation', {name: 'fa-euro-sign'}, '/cotisation/resumeall', true))
+      children.push(this.constructMenuItem('resume_all_cotisation', {name: 'fa-euro-sign'}, '/cotisation/resumeall', true))
     }
 
     if (can('display', 'resume_pay_cotisation_page')) {
-      children.push(this.constructMenu('resume_pay_cotisation', {name: 'fa-euro-sign'}, '/cotisation/resumepay', true))
+      children.push(this.constructMenuItem('resume_pay_cotisation', {name: 'fa-euro-sign'}, '/cotisation/resumepay', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('cotisations', {name: 'fa-money-bill'}, undefined, undefined, children)
+      return this.constructMenuItem('cotisations', {name: 'fa-money-bill'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/donorsMenu.ts

@@ -9,25 +9,15 @@ import {useAbility} from "@casl/vue";
  */
 class DonorsMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Partenariat et Dons ou null si aucune page accessible
    * @return {ItemMenu | null}
    */
   getMenu (): ItemMenu | null {
     const {can} = useAbility()
-    
+
     if (can('display', 'donors_page')) {
-      return this.constructMenu('donors', {name: 'far fa-handshake'}, '/donors/list/', true)
+      return this.constructMenuItem('donors', {name: 'far fa-handshake'}, '/donors/list/', true)
     }
     return null
   }

composables/layout/Menus/educationalMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class EducationalMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Suivi pédagogique ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,37 +18,37 @@ class EducationalMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'criteria_notations_page')) {
-      children.push(this.constructMenu('criteria_notations', {name: 'fa-bars'}, '/criteria_notations/list/', true))
+      children.push(this.constructMenuItem('criteria_notations', {name: 'fa-bars'}, '/criteria_notations/list/', true))
     }
 
     if (can('display', 'education_notation_config_page')) {
-      children.push(this.constructMenu('education_notation_configs', {name: 'fa-bars'},  '/education_notation_configs/list/', true))
+      children.push(this.constructMenuItem('education_notation_configs', {name: 'fa-bars'},  '/education_notation_configs/list/', true))
     }
 
     if (can('display', 'seizure_period_page')) {
-      children.push(this.constructMenu('seizure_period', {name: 'fa-calendar-alt'}, '/education_teachers/list/', true))
+      children.push(this.constructMenuItem('seizure_period', {name: 'fa-calendar-alt'}, '/education_teachers/list/', true))
     }
 
     if (can('display', 'test_seizure_page')) {
-      children.push(this.constructMenu('test_seizure', {name: 'fa-pencil-alt'}, '/education_input/list/', true))
+      children.push(this.constructMenuItem('test_seizure', {name: 'fa-pencil-alt'}, '/education_input/list/', true))
     }
 
     if (can('display', 'test_validation_page')) {
-      children.push(this.constructMenu('test_validation', {name: 'fa-check'}, '/education_notations/list/', true))
+      children.push(this.constructMenuItem('test_validation', {name: 'fa-check'}, '/education_notations/list/', true))
     }
 
     if (can('display', 'examen_results_page')) {
-      children.push(this.constructMenu('examen_results', {name: 'fa-graduation-cap'}, '/examen_convocations/list/', true))
+      children.push(this.constructMenuItem('examen_results', {name: 'fa-graduation-cap'}, '/examen_convocations/list/', true))
     }
 
     if (can('display', 'education_by_student_validation_page')) {
-      children.push(this.constructMenu('education_by_student_validation', {name: 'fa-check-square'}, '/education_by_student/list/', true))
+      children.push(this.constructMenuItem('education_by_student_validation', {name: 'fa-check-square'}, '/education_by_student/list/', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('education_state', {name: 'fa-graduation-cap'}, undefined, undefined, children)
+      return this.constructMenuItem('education_state', {name: 'fa-graduation-cap'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/equipmentMenu.ts

@@ -9,25 +9,15 @@ import {useAbility} from "@casl/vue";
  */
 class EquipmentMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Equipement ou null si aucune page accessible
    * @return {ItemMenu | null}
    */
   getMenu (): ItemMenu | null {
     const {can} = useAbility()
-    
+
     if (can('display', 'equipment_page')) {
-      return this.constructMenu('equipment', {name: 'fa-cube'}, '/equipment/list/', true)
+      return this.constructMenuItem('equipment', {name: 'fa-cube'}, '/equipment/list/', true)
     }
     return null
   }

composables/layout/Menus/medalsMenu.ts

@@ -9,25 +9,15 @@ import {useAbility} from "@casl/vue";
  */
 class MedalsMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Médails et Dons ou null si aucune page accessible
    * @return {ItemMenu | null}
    */
   getMenu (): ItemMenu | null {
     const {can} = useAbility()
-    
+
     if (can('display', 'medals_page')) {
-      return this.constructMenu('medals', {name: 'fa-trophy'}, '/medals/list/', true)
+      return this.constructMenuItem('medals', {name: 'fa-trophy'}, '/medals/list/', true)
     }
     return null
   }

composables/layout/Menus/myAccessesMenu.ts

@@ -1,6 +1,6 @@
 import BaseMenu from '~/composables/layout/Menus/baseMenu'
 import { ItemMenu, ItemsMenu, Menu } from '~/types/interfaces'
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {useAbility} from "@casl/vue";
 
 /**
@@ -10,16 +10,6 @@ import {useAbility} from "@casl/vue";
  */
 class MyAccessesMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Header Multi compte ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,12 +18,12 @@ class MyAccessesMenu extends BaseMenu implements Menu {
     const {can} = useAbility()
     const children: ItemsMenu = []
 
-    const profileAccessStore = useProfileAccessStore();
-    useEach(profileAccessStore.multiAccesses, (access) => {
-      children.push(this.constructMenu(access.name as string, undefined, '/switch/' + access.id, true))
+    const accessProfileStore = useAccessProfileStore();
+    useEach(accessProfileStore.multiAccesses, (access) => {
+      children.push(this.constructMenuItem(access.name as string, undefined, '/switch/' + access.id, true))
     })
 
-    return children.length > 0 ? this.constructMenu('multiAccesses', {name: 'fa-building'}, undefined, undefined, children) : null
+    return children.length > 0 ? this.constructMenuItem('multiAccesses', {name: 'fa-building'}, undefined, undefined, children) : null
   }
 }
 

composables/layout/Menus/myFamilyMenu.ts

@@ -1,6 +1,6 @@
 import BaseMenu from '~/composables/layout/Menus/baseMenu'
 import { ItemMenu, ItemsMenu, Menu } from '~/types/interfaces'
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {useProfileOrganizationStore} from "~/store/profile/organization";
 
 /**
@@ -10,16 +10,6 @@ import {useProfileOrganizationStore} from "~/store/profile/organization";
  */
 class MyFamilyMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Header Changement d'utilisateur ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,24 +18,24 @@ class MyFamilyMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     // Si Access des membres de la familles (enfants)
-    const profileAccessStore = useProfileAccessStore()
+    const accessProfileStore = useAccessProfileStore()
     const profileOrganizationStore = useProfileOrganizationStore()
-    useEach(profileAccessStore.familyAccesses, (access) => {
-      const url = `/switch_user/${profileOrganizationStore.id}/${profileAccessStore.id}/${access.id}`
-      children.push(this.constructMenu(`${access.givenName} ${access.name}`, {
+    useEach(accessProfileStore.familyAccesses, (access) => {
+      const url = `/switch_user/${profileOrganizationStore.id}/${accessProfileStore.id}/${access.id}`
+      children.push(this.constructMenuItem(`${access.givenName} ${access.name}`, {
         avatarId: access.avatarId,
         avatarByDefault: access.gender == 'MISTER' ? 'men-1.png' : 'women-1.png'
       }, url, true))
     })
 
     // Si on est en compte swtich, on doit pouvoir retourner au compte d'origine
-    const originalAccess = profileAccessStore.originalAccess
+    const originalAccess = accessProfileStore.originalAccess
     if (originalAccess && !originalAccess.isSuperAdminAccess) {
       const url = `/switch_user/${originalAccess.organization.id}/${originalAccess.id}/exit`
-      children.push(this.constructMenu(`${originalAccess.givenName} ${originalAccess.name}`, undefined, url, true))
+      children.push(this.constructMenuItem(`${originalAccess.givenName} ${originalAccess.name}`, undefined, url, true))
     }
 
-    return children.length > 0 ? this.constructMenu('familyAccesses', {name: 'fa-users'}, undefined, undefined, children) : null
+    return children.length > 0 ? this.constructMenuItem('familyAccesses', {name: 'fa-users'}, undefined, undefined, children) : null
   }
 }
 

composables/layout/Menus/parametersMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class ParametersMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Header Configuration ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,22 +18,22 @@ class ParametersMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'parameters_page')) {
-      children.push(this.constructMenu('general_params', {name: 'fa-cogs'},`/parameters`, false))
+      children.push(this.constructMenuItem('general_params', {name: 'fa-cogs'},`/parameters`, false))
     }
     if (can('display', 'parameters_communication_page')) {
-      children.push(this.constructMenu('communication_params', {name: 'fa-comments'},`/parameters/communication`, false))
+      children.push(this.constructMenuItem('communication_params', {name: 'fa-comments'},`/parameters/communication`, false))
     }
     if (can('display', 'parameters_student_page')) {
-      children.push(this.constructMenu('students_params', {name: 'fa-users'},`/parameters/student`, false))
+      children.push(this.constructMenuItem('students_params', {name: 'fa-users'},`/parameters/student`, false))
     }
     if (can('display', 'parameters_education_page')) {
-      children.push(this.constructMenu('education_params', {name: 'fa-graduation-cap'},`/parameters/education`, false))
+      children.push(this.constructMenuItem('education_params', {name: 'fa-graduation-cap'},`/parameters/education`, false))
     }
     if (can('display', 'parameters_bills_page')) {
-      children.push(this.constructMenu('bills_params', {name: 'fa-euro-sign'},`/parameters/billing`, false))
+      children.push(this.constructMenuItem('bills_params', {name: 'fa-euro-sign'},`/parameters/billing`, false))
     }
     if (can('display', 'parameters_secure_page')) {
-      children.push(this.constructMenu('secure_params', {name: 'fa-lock'},`/parameters/secure`, false))
+      children.push(this.constructMenuItem('secure_params', {name: 'fa-lock'},`/parameters/secure`, false))
     }
 
     if (children.length > 0) {

composables/layout/Menus/statsMenu.ts

@@ -9,16 +9,6 @@ import {useAbility} from "@casl/vue";
  */
 class StatsMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Statistique et Dons ou null si aucune page accessible
    * @return {ItemMenu | null}
@@ -28,25 +18,25 @@ class StatsMenu extends BaseMenu implements Menu {
     const children: ItemsMenu = []
 
     if (can('display', 'report_activity_page')) {
-      children.push(this.constructMenu('report_activity', {name: 'fa-chart-bar'}, '/report_activity', true))
+      children.push(this.constructMenuItem('report_activity', {name: 'fa-chart-bar'}, '/report_activity', true))
     }
 
     if (can('display', 'education_quotas_page')) {
-      children.push(this.constructMenu('educations_quotas_by_education', {name: 'fa-user-circle'},  '/educations_quotas_by_education_year/list/', true))
+      children.push(this.constructMenuItem('educations_quotas_by_education', {name: 'fa-user-circle'},  '/educations_quotas_by_education_year/list/', true))
     }
 
     if (can('display', 'fede_stats_page')) {
-      children.push(this.constructMenu('fede_stats', {name: 'fa-chart-bar'}, '/statistic/membersfedeonly', true))
+      children.push(this.constructMenuItem('fede_stats', {name: 'fa-chart-bar'}, '/statistic/membersfedeonly', true))
     }
 
     if (can('display', 'structure_stats_page')) {
-      children.push(this.constructMenu('structure_stats', {name: 'fa-chart-bar'}, '/statistic/membersfedeassos', true))
+      children.push(this.constructMenuItem('structure_stats', {name: 'fa-chart-bar'}, '/statistic/membersfedeassos', true))
     }
 
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {
-      return this.constructMenu('stats', {name: 'fa-chart-bar'}, undefined, undefined, children)
+      return this.constructMenuItem('stats', {name: 'fa-chart-bar'}, undefined, undefined, children)
     } else {
       return null
     }

composables/layout/Menus/websiteMenu.ts

@@ -1,7 +1,7 @@
 import BaseMenu from '~/composables/layout/Menus/baseMenu'
 import { ItemMenu, ItemsMenu, Menu, organizationState } from '~/types/interfaces'
 import {useProfileOrganizationStore} from "~/store/profile/organization";
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 
 /**
  * @category composables/layout/Menus
@@ -10,26 +10,16 @@ import {useProfileAccessStore} from "~/store/profile/access";
  */
 class WebsiteMenu extends BaseMenu implements Menu {
 
-  /**
-   * @constructor
-   * Initialisation des services issues du context
-   */
-  constructor () {
-    const {$config} = useNuxtApp()
-
-    super($config)
-  }
-
   /**
    * Construit le menu Site internet ou null si aucune page accessible
    * @return {ItemMenu | null}
    */
   getMenu (): ItemMenu | null {
     const profileOrganizationStore = useProfileOrganizationStore()
-    const profileAccessStore = useProfileAccessStore()
+    const accessProfileStore = useAccessProfileStore()
 
-    if (!profileOrganizationStore.website && profileAccessStore.isAdminAccess) {
-      return this.constructMenu('advanced_modification', {name: 'fa-globe-americas'}, this.getWebsite(profileOrganizationStore) + '/typo3', false, undefined, true)
+    if (!profileOrganizationStore.website && accessProfileStore.isAdminAccess) {
+      return this.constructMenuItem('advanced_modification', {name: 'fa-globe-americas'}, this.getWebsite(profileOrganizationStore) + '/typo3', false, undefined, true)
     }
     return null
   }
@@ -43,15 +33,15 @@ class WebsiteMenu extends BaseMenu implements Menu {
 
     const children: ItemsMenu = []
 
-    children.push(this.constructMenu(profileOrganizationStore.name as string, undefined, this.getWebsite(profileOrganizationStore), false, undefined, true))
+    children.push(this.constructMenuItem(profileOrganizationStore.name as string, undefined, this.getWebsite(profileOrganizationStore), false, undefined, true))
 
     useEach(profileOrganizationStore.parents, (parent:any) => {
       if(parent.id != process.env.OPENTALENT_MANAGER_ID){
-        children.push(this.constructMenu(parent.name, undefined, this.getWebsite(parent), false, undefined, true))
+        children.push(this.constructMenuItem(parent.name, undefined, this.getWebsite(parent), false, undefined, true))
       }
     })
 
-    return children.length > 0 ? this.constructMenu('website', {name: 'fa-globe-americas'}, undefined, undefined, children) : null
+    return children.length > 0 ? this.constructMenuItem('website', {name: 'fa-globe-americas'}, undefined, undefined, children) : null
   }
 
   getWebsite (organization: organizationState): string {

composables/layout/useMenu.ts

@@ -17,7 +17,7 @@ import { getMyAccessesMenu } from '~/composables/layout/Menus/myAccessesMenu'
 import { getAccountMenu } from '~/composables/layout/Menus/accountMenu'
 import {getParametersMenu} from "~/composables/layout/Menus/parametersMenu";
 import {Ref} from "@vue/reactivity";
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 
 /**
  * @category composables/layout
@@ -69,8 +69,8 @@ class Menu {
     if (admin2iosMenu) { menu.push(admin2iosMenu) }
 
     // Si l'utilisateur possède au moins un menu alors le menu latéral sera accessible
-    const profileAccessStore = useProfileAccessStore()
-    profileAccessStore.hasLateralMenu = menu.length > 0
+    const accessProfileStore = useAccessProfileStore()
+    accessProfileStore.hasLateralMenu = menu.length > 0
 
     return ref(menu)
   }
@@ -82,8 +82,8 @@ class Menu {
     const menu: ItemMenu | null = getConfigurationMenu()
 
     // Si l'utilisateur possède au moins un menu alors le menu configuration sera accessible
-    const profileAccessStore = useProfileAccessStore()
-    profileAccessStore.hasConfigurationMenu = menu != null
+    const accessProfileStore = useAccessProfileStore()
+    accessProfileStore.hasConfigurationMenu = menu != null
 
     return ref(menu)
   }
@@ -101,8 +101,8 @@ class Menu {
   getMyAccessesMenu (): Ref {
     const menu: ItemMenu | null = getMyAccessesMenu()
     // Si l'utilisateur possède au moins un menu alors le menu mes structures sera accessible
-    const profileAccessStore = useProfileAccessStore()
-    profileAccessStore.hasAccessesMenu = menu != null
+    const accessProfileStore = useAccessProfileStore()
+    accessProfileStore.hasAccessesMenu = menu != null
     return ref(menu)
   }
 
@@ -112,8 +112,8 @@ class Menu {
   getMyFamilyMenu (): Ref {
     const menu: ItemMenu | null = getMyFamilyMenu()
     // Si l'utilisateur possède au moins un menu alors le menu changement d'utilisateur sera accessible
-    const profileAccessStore = useProfileAccessStore()
-    profileAccessStore.hasFamilyMenu = menu != null
+    const accessProfileStore = useAccessProfileStore()
+    accessProfileStore.hasFamilyMenu = menu != null
     return ref(menu)
   }
 
@@ -131,8 +131,8 @@ class Menu {
     const menu: ItemsMenu | null = getParametersMenu()
 
     // Si l'utilisateur possède au moins un menu alors le menu latéral sera accessible
-    const profileAccessStore = useProfileAccessStore()
-    profileAccessStore.hasLateralMenu = true
+    const accessProfileStore = useAccessProfileStore()
+    accessProfileStore.hasLateralMenu = true
 
     return ref(menu)
   }
@@ -140,4 +140,4 @@ class Menu {
 
 export function UseMenu() {
   return new Menu()
-}
+}

layouts/default.vue

@@ -2,7 +2,6 @@
   <div>
     <!-- The client only is used to show the loading picture -->
 <!--    <ClientOnly placeholder-tag="client-only-placeholder" placeholder=" " />-->
-    <h1>Test</h1>
     <v-app>
       <LayoutMenu v-if="displayMenu" :menu="menu" :mini-variant="properties.miniVariant" :openMenu="properties.openMenu" />
 
@@ -24,14 +23,14 @@
 </template>
 
 <script setup lang="ts">
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {UseMenu} from "~/composables/layout/useMenu";
 
 const menu = UseMenu().getLateralMenu()
 
-const profileAccessStore = useProfileAccessStore()
+const accessProfileStore = useAccessProfileStore()
 
-const displayMenu = computed(() => profileAccessStore.hasLateralMenu)
+const displayMenu = computed(() => accessProfileStore.hasLateralMenu)
 
 const properties = reactive({
   clipped: false,

middleware/auth.ts

@@ -1,10 +1,10 @@
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {defineNuxtRouteMiddleware, navigateTo} from "#app";
 
 export default defineNuxtRouteMiddleware(
 (to, from) => {
       // Si l'utilisateur n'est pas connecté on le redirige vers la page login
-      if (!useProfileAccessStore().bearer) {
+      if (!useAccessProfileStore().bearer) {
         // TODO: vérifier qu'on passe bien par ici, car en général ça pète dans le init.server.ts
         return navigateTo(process.env.baseUrlAdminLegacy + '/login')
       }

nuxt.config.ts

@@ -2,39 +2,14 @@ import fs from 'fs';
 import type { I18nOptions } from 'vue-i18n'
 
 // https://v3.nuxtjs.org/api/configuration/nuxt.config
-export default {
+export default defineNuxtConfig({
     vuetify: {
         customVariables: ['~/assets/css/variables.scss'],
         treeShake: true,
-        theme: {
-            options: {
-                customProperties: true
-            },
-            dark: false,
-            themes: {
-                light: {
-                    ot_green: '#00ad8e',
-                    ot_light_green: '#a9e0d6',
-                    ot_dark_grey: '#324150',
-                    ot_dark_grey_hover: '#2c3a48',
-                    ot_grey: '#777777',
-                    ot_header_menu: '#ECE7E5',
-                    ot_light_grey: '#f5f5f5',
-                    ot_super_light_grey: '#ecf0f5',
-                    ot_danger: '#f56954',
-                    ot_success: '#00a65a',
-                    ot_warning: '#f39c12',
-                    ot_info: '#3c8dbc',
-                    ot_menu_color: '#b8c7ce',
-                    ot_content_color: '#ecf0f4',
-                    ot_border_menu: '#f4f4f4',
-                    ot_white: '#ffffff',
-                    ot_black: '#000000'
-                },
-            }
-        }
     },
     css: [
+        '@/assets/css/global.css',
+        '@/assets/css/import.css',
         'vuetify/lib/styles/main.sass'
     ],
     runtimeConfig: {
@@ -98,6 +73,7 @@ export default {
     typescript: {
         strict: true
     },
+    //@ts-ignore
     i18n: {
         langDir: 'lang',
         lazy: true,
@@ -135,10 +111,11 @@ export default {
                 key: fs.readFileSync('local.app-v3.opentalent.fr.key'),
                 cert: fs.readFileSync('local.app-v3.opentalent.fr.crt'),
             },
+            //@ts-ignore
             port: 443,
             hmr: {
                 protocol: 'wss'
             }
         },
     }
-}
+})

package.json

@@ -52,6 +52,7 @@
     "@casl/ability": "^6.3.2",
     "@casl/vue": "^2.2.0",
     "@fortawesome/fontawesome-free": "^6.2.1",
+    "@mdi/font": "^7.0.96",
     "@nuxt/image": "^0.7.1",
     "@nuxtjs/i18n": "^8.0.0-beta.4",
     "@pinia-orm/nuxt": "^1.1.4",

pages/poc/blank.vue

@@ -0,0 +1,2 @@
+<template>
+</template>

pages/poc/i18n.vue

@@ -1,3 +0,0 @@
-<template>
-  <h1>{{ $t('download') }}</h1>
-</template>

plugins/init.server.ts

@@ -1,5 +1,5 @@
 import {defineNuxtPlugin, useCookie} from "nuxt/app";
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {useEntityManager} from "~/composables/data/useEntityManager";
 import UnauthorizedError from "~/services/error/UnauthorizedError";
 import {useRedirectToLogin} from "~/composables/layout/useRedirectToLogin";
@@ -10,10 +10,10 @@ export default defineNuxtPlugin(async ({ssrContext}) => {
     const bearer = useCookie('BEARER')
     const accessId = useCookie('AccessId')
 
-    const profileAccessStore = useProfileAccessStore()
+    const accessProfileStore = useAccessProfileStore()
 
     if (accessId.value !== null) {
-        profileAccessStore.$patch({
+        accessProfileStore.$patch({
             bearer: bearer.value,
             id: parseInt(accessId.value)
         })

plugins/vuetify.ts

@@ -1,12 +1,50 @@
 import { createVuetify } from 'vuetify'
 import * as components from 'vuetify/components'
 import * as directives from 'vuetify/directives'
+import 'vuetify/styles'
+import {defineNuxtPlugin} from "nuxt/app";
+import { aliases, fa } from 'vuetify/iconsets/fa'
+import '@fortawesome/fontawesome-free/css/all.css'
 
 export default defineNuxtPlugin(nuxtApp => {
     const vuetify = createVuetify({
         components,
         directives,
         ssr: true,
+        theme: {
+            defaultTheme: 'otLightTheme',
+            themes: {
+                otLightTheme: {
+                    dark: false,
+                    colors: {
+                        'ot-green': '#00ad8e',
+                        'ot-light-green': '#a9e0d6',
+                        'ot-dark-grey': '#324150',
+                        'ot-dark-grey-hover': '#2c3a48',
+                        'ot-grey': '#777777',
+                        'ot-header-menu': '#ECE7E5',
+                        'ot-light-grey': '#f5f5f5',
+                        'ot-super-light-grey': '#ecf0f5',
+                        'ot-danger': '#f56954',
+                        'ot-success': '#00a65a',
+                        'ot-warning': '#f39c12',
+                        'ot-info': '#3c8dbc',
+                        'ot-menu-color': '#b8c7ce',
+                        'ot-content-color': '#ecf0f4',
+                        'ot-border-menu': '#f4f4f4',
+                        'ot-white': '#ffffff',
+                        'ot-black': '#000000'
+                    }
+                }
+            }
+        },
+        icons: {
+            defaultSet: 'fa',
+            aliases,
+            sets: {
+                fa,
+            }
+        },
     })
     nuxtApp.vueApp.use(vuetify)
 })

services/data/entityManager.ts

@@ -4,7 +4,7 @@ import Url from "~/services/utils/url";
 import ModelNormalizer from "./serializer/normalizer/modelNormalizer";
 import HydraDenormalizer from "./serializer/denormalizer/hydraDenormalizer";
 import ApiModel from "~/models/ApiModel";
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import ApiResource from "~/models/ApiResource";
 import {MyProfile} from "~/models/Access/MyProfile";
 import { v4 as uuid4 } from 'uuid';
@@ -244,8 +244,8 @@ class EntityManager {
 
         const profile = this.newInstance(MyProfile, hydraResponse.data)
 
-        const profileAccessStore = useProfileAccessStore()
-        profileAccessStore.setProfile(profile)
+        const accessProfileStore = useAccessProfileStore()
+        accessProfileStore.setProfile(profile)
     }
 
     /**

services/profile/accessProfile.ts

@@ -1,5 +1,5 @@
 import {AbilitiesType, accessState} from "~/types/interfaces";
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {MongoAbility} from "@casl/ability/dist/types/Ability";
 import {AnyJson} from "~/types/data";
 
@@ -17,7 +17,7 @@ export class AccessProfile {
    * Set le store
    */
   public setPinia () {
-    this.accessProfile = useProfileAccessStore()
+    this.accessProfile = useAccessProfileStore()
   }
 
   /**

services/rights/abilitiesUtils.ts

@@ -2,7 +2,7 @@ import {$accessProfile} from '~/services/profile/accessProfile'
 import {$organizationProfile} from '~/services/profile/organizationProfile'
 import {$roleUtils} from '~/services/rights/roleUtils'
 import {AbilitiesType} from '~/types/interfaces'
-import {useProfileAccessStore} from "~/store/profile/access";
+import {useAccessProfileStore} from "~/store/profile/access";
 import {useProfileOrganizationStore} from "~/store/profile/organization";
 import YamlDenormalizer from "~/services/data/serializer/denormalizer/yamlDenormalizer";
 import {MongoAbility} from "@casl/ability/dist/types/Ability";
@@ -54,7 +54,7 @@ class AbilitiesUtils {
      * Définit les abilities de l'utilisateur à chaque fois qu'on met à jour son profile
      */
     setAbilities() {
-        const accessProfileStore = useProfileAccessStore()
+        const accessProfileStore = useAccessProfileStore()
         const organizationProfileStore = useProfileOrganizationStore()
 
         // Nécessaire pour que l'update des habilités soit correcte après la phase SSR
@@ -90,7 +90,7 @@ class AbilitiesUtils {
      * @return {Array<AbilitiesType>}
      */
     getAbilities(): Array<AbilitiesType> {
-        const accessProfileStore = useProfileAccessStore()
+        const accessProfileStore = useAccessProfileStore()
         const abilitiesByRoles: Array<AbilitiesType> = this.getAbilitiesByRoles(accessProfileStore.roles)
         this.$ability.update(abilitiesByRoles)
         this.initFactory()

store/page.ts

@@ -1,6 +1,5 @@
 import {Alert, pageState} from '~/types/interfaces'
 import {defineStore} from "pinia";
-import {useFormStore} from "~/store/form";
 import {FORM_FUNCTION, TYPE_ALERT} from "~/types/enums";
 
 export const usePageStore = defineStore('page', {

store/profile/access.ts

@@ -6,7 +6,7 @@ import {useProfileOrganizationStore} from "~/store/profile/organization";
 import {MyProfile} from "~/models/Access/MyProfile";
 import {useRepo} from "pinia-orm";
 
-export const useProfileAccessStore = defineStore('profileAccess', {
+export const useAccessProfileStore = defineStore('accessProfile', {
   state: (): accessState => {
     return {
       bearer: null,

types/interfaces.d.ts

@@ -49,6 +49,7 @@ interface ItemMenu {
   isExternalLink?: boolean
   // eslint-disable-next-line no-use-before-define
   actions?: ItemsMenu
+  active?: boolean
 }
 
 type ItemsMenu = Array<ItemMenu>