fix layout errors

components/Layout/Parameters/Menu.vue

@@ -1,5 +1,10 @@
 <template>
   <v-navigation-drawer>
+    <template v-slot:prepend>
+      <div class="title">
+        <h3>{{ $t('parameters') }}</h3>
+      </div>
+    </template>
     <v-list>
       <v-list-item :title="$t('general_parameters')" to="/parameters/general_parameters"></v-list-item>
       <v-list-item :title="$t('website')" to="/parameters/website"></v-list-item>
@@ -23,5 +28,17 @@
 </script>
 
 <style scoped lang="scss">
+  .title {
+    display: flex;
+    align-items: center;
+    height: 48px;
+    vertical-align: center;
+    margin-top: 18px;
+    padding: 4px 16px;
+    font-size: 18px;
+  }
 
+  .v-navigation-drawer {
+    border-right: solid 1px rgb(var(--v-theme-neutral-strong));
+  }
 </style>

composables/layout/useMenu.ts

@@ -28,7 +28,7 @@ export const useMenu = () => {
    * Construct all Menus
    * TODO: ce serait mieux de conserver les ids des menus même non possédés, de façon à pouvoir différencier un menu
    * non possédé et un id incorrect dans getMenu par exemple. J'ai eu du mal capter pourquoi hasMenu('Family') renvoyait
-   * false, jusqu'à ce que je tilte que le menu s'appellait MyFamily, et pas Family
+   * false, jusqu'à ce que je tilte que le menu s'appelait MyFamily, et pas Family
    */
   const buildAllMenu = () => {
     MenuComposer.build(runtimeConfig, ability, organizationProfile, accessProfile as AccessProfile, layoutState)

layouts/default.vue

@@ -27,10 +27,5 @@
 </template>
 
 <script setup lang="ts">
-  import {useMenu} from "~/composables/layout/useMenu";
 
-  if(process.server){
-    const { buildAllMenu } = useMenu()
-    buildAllMenu()
-  }
 </script>

pages/parameters.vue

@@ -1,13 +1,20 @@
 <!-- Page de détails des paramètres -->
 
 <template>
-  <LayoutContainer>
+  <NuxtLayout name="parameters">
     <!-- Rend le contenu de la page -->
     <NuxtPage />
-  </LayoutContainer>
+  </NuxtLayout>
 </template>
 
 <script setup lang="ts">
+  /**
+   * Disable the default layout, the page will use the layout defined with <NuxtLayout />
+   * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
+   */
+  definePageMeta({
+    layout: false,
+  });
 </script>
 
 <style scoped lang="scss">

pages/parameters/attendances.vue

@@ -1,30 +1,28 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm v-else :model="Parameters" :entity="parameters">
-        <v-row>
-          <v-col cols="6">
-            <UiInputCheckbox
-              v-model="parameters.sendAttendanceEmail"
-              field="sendAttendanceEmail"
-              label="sendAttendanceEmail"
-            />
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm v-else :model="Parameters" :entity="parameters">
+      <v-row>
+        <v-col cols="6">
+          <UiInputCheckbox
+            v-model="parameters.sendAttendanceEmail"
+            field="sendAttendanceEmail"
+            label="sendAttendanceEmail"
+          />
 
-            <UiInputCheckbox
-              v-model="parameters.sendAttendanceSms"
-              field="sendAttendanceSms"
-            />
+          <UiInputCheckbox
+            v-model="parameters.sendAttendanceSms"
+            field="sendAttendanceSms"
+          />
 
-            <UiInputCheckbox
-              v-model="parameters.notifyAdministrationAbsence"
-              field="notifyAdministrationAbsence"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+          <UiInputCheckbox
+            v-model="parameters.notifyAdministrationAbsence"
+            field="notifyAdministrationAbsence"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 <script setup lang="ts">
 import Parameters from '~/models/Organization/Parameters'
@@ -32,13 +30,6 @@ import { useEntityFetch } from '~/composables/data/useEntityFetch'
 import { useOrganizationProfileStore } from '~/stores/organizationProfile'
 import { AsyncData } from '#app'
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
 
 const { fetch } = useEntityFetch()
 

pages/parameters/bulletin.vue

@@ -1,72 +1,70 @@
 
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Parameters"
-          :entity="parameters"
-      >
-        <v-row>
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.bulletinWithTeacher"
-                field="bulletinWithTeacher"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinSignatureDirector"
-                field="bulletinSignatureDirector"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinShowEducationWithoutEvaluation"
-                field="bulletinShowEducationWithoutEvaluation"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinShowAbsences"
-                field="bulletinShowAbsences"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinEditWithoutEvaluation"
-                field="bulletinEditWithoutEvaluation"
-            />
-          </v-col>
-
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.bulletinPrintAddress"
-                field="bulletinPrintAddress"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinDisplayLevelAcquired"
-                field="bulletinDisplayLevelAcquired"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinViewTestResults"
-                field="bulletinViewTestResults"
-            />
-
-            <UiInputCheckbox
-                v-model="parameters.bulletinShowAverages"
-                field="bulletinShowAverages"
-            />
-
-            <UiInputAutocompleteWithEnum
-                v-model="parameters.bulletinReceiver"
-                field="bulletinReceiver"
-                enum-name="organization_bulletin_send_to"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm
+        v-else
+        :model="Parameters"
+        :entity="parameters"
+    >
+      <v-row>
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.bulletinWithTeacher"
+              field="bulletinWithTeacher"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinSignatureDirector"
+              field="bulletinSignatureDirector"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinShowEducationWithoutEvaluation"
+              field="bulletinShowEducationWithoutEvaluation"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinShowAbsences"
+              field="bulletinShowAbsences"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinEditWithoutEvaluation"
+              field="bulletinEditWithoutEvaluation"
+          />
+        </v-col>
+
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.bulletinPrintAddress"
+              field="bulletinPrintAddress"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinDisplayLevelAcquired"
+              field="bulletinDisplayLevelAcquired"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinViewTestResults"
+              field="bulletinViewTestResults"
+          />
+
+          <UiInputCheckbox
+              v-model="parameters.bulletinShowAverages"
+              field="bulletinShowAverages"
+          />
+
+          <UiInputAutocompleteWithEnum
+              v-model="parameters.bulletinReceiver"
+              field="bulletinReceiver"
+              enum-name="organization_bulletin_send_to"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -75,14 +73,6 @@ import {useEntityFetch} from "~/composables/data/useEntityFetch";
 import {useOrganizationProfileStore} from "~/stores/organizationProfile";
 import {AsyncData} from "#app";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const { fetch } = useEntityFetch()
 
 const organizationProfile = useOrganizationProfileStore()

pages/parameters/education_notation.vue

@@ -1,60 +1,58 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Parameters"
-          :entity="parameters"
-      >
-        <v-row>
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.periodValidation"
-                field="periodValidation"
-                label="define_validation_periods_for_teachers"
-            />
-            <UiInputCheckbox
-                v-model="parameters.editCriteriaNotationByAdminOnly"
-                field="editCriteriaNotationByAdminOnly"
-                label="evaluation_criterium_edition_is_admin_only"
-            />
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm
+        v-else
+        :model="Parameters"
+        :entity="parameters"
+    >
+      <v-row>
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.periodValidation"
+              field="periodValidation"
+              label="define_validation_periods_for_teachers"
+          />
+          <UiInputCheckbox
+              v-model="parameters.editCriteriaNotationByAdminOnly"
+              field="editCriteriaNotationByAdminOnly"
+              label="evaluation_criterium_edition_is_admin_only"
+          />
 
-            <UiInputAutocompleteWithEnum
-                v-if="organizationProfile.hasModule('AdvancedEducationNotation')"
-                v-model="parameters.advancedEducationNotationType"
-                enum-name="advanced_education_notation"
-                field="advancedEducationNotationType"
-            />
-          </v-col>
+          <UiInputAutocompleteWithEnum
+              v-if="organizationProfile.hasModule('AdvancedEducationNotation')"
+              v-model="parameters.advancedEducationNotationType"
+              enum-name="advanced_education_notation"
+              field="advancedEducationNotationType"
+          />
+        </v-col>
 
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.requiredValidation"
-                field="requiredValidation"
-                label="mandatory_validation_for_evaluations"
-            />
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.requiredValidation"
+              field="requiredValidation"
+              label="mandatory_validation_for_evaluations"
+          />
 
-            <UiInputAutocompleteWithEnum
-                v-model="parameters.educationPeriodicity"
-                enum-name="education_periodicity"
-                field="educationPeriodicity"
-            />
+          <UiInputAutocompleteWithEnum
+              v-model="parameters.educationPeriodicity"
+              enum-name="education_periodicity"
+              field="educationPeriodicity"
+          />
 
-            <UiInputNumber
-              v-model="parameters.average"
-              field="average"
-              label="max_note_for_pedagogical_followup"
-              :default="20"
-              :min="1"
-              :max="100"
-              class="mt-2"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+          <UiInputNumber
+            v-model="parameters.average"
+            field="average"
+            label="max_note_for_pedagogical_followup"
+            :default="20"
+            :min="1"
+            :max="100"
+            class="mt-2"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -63,14 +61,6 @@ import {useEntityFetch} from "~/composables/data/useEntityFetch";
 import {useOrganizationProfileStore} from "~/stores/organizationProfile";
 import {AsyncData} from "#app";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const i18n = useI18n()
 const { fetch } = useEntityFetch()
 

pages/parameters/education_timings.vue

@@ -1,58 +1,56 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <v-container v-else style="width: 500px;">
-        <v-col cols="12">
-          <v-row class="justify-center">
-            <v-table class="w-100">
-              <thead>
-                <tr>
-                  <td>{{ $t('educationTimings') }}</td>
-                  <td></td>
-                </tr>
-              </thead>
-              <tbody>
-                <tr v-if="educationTimings.length > 0" v-for="timing in educationTimings" :key="timing.id">
-                  <td class="cycle-editable-cell">
-                    {{ timing.timing }}
-                  </td>
-                  <td class="d-flex flex-row">
-                    <v-btn
-                        :flat="true"
-                        icon="fa fa-pen"
-                        class="cycle-edit-icon mr-3"
-                        @click="goToEditPage(timing.id as number)"
-                    />
-                    <UiButtonDelete
-                        :model="EducationTiming"
-                        :entity="timing"
-                        :flat="true"
-                        class="cycle-edit-icon"
-                    />
-                  </td>
-                </tr>
-                <tr v-else class="theme-neutral">
-                  <td><i>{{ $t('nothing_to_show')}}</i></td>
-                  <td></td>
-                </tr>
-              </tbody>
-            </v-table>
-          </v-row>
-          <v-row class="justify-end">
-            <v-btn
-                :flat="true"
-                prepend-icon="fa fa-plus"
-                class="theme-primary mt-2"
-                @click="goToCreatePage"
-            >
-              {{ $t('add') }}
-            </v-btn>
-          </v-row>
-        </v-col>
-      </v-container>
-    </LayoutContainer>
-  </NuxtLayout>
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <v-container v-else style="width: 500px;">
+      <v-col cols="12">
+        <v-row class="justify-center">
+          <v-table class="w-100">
+            <thead>
+              <tr>
+                <td>{{ $t('educationTimings') }}</td>
+                <td></td>
+              </tr>
+            </thead>
+            <tbody>
+              <tr v-if="educationTimings.length > 0" v-for="timing in educationTimings" :key="timing.id">
+                <td class="cycle-editable-cell">
+                  {{ timing.timing }}
+                </td>
+                <td class="d-flex flex-row">
+                  <v-btn
+                      :flat="true"
+                      icon="fa fa-pen"
+                      class="cycle-edit-icon mr-3"
+                      @click="goToEditPage(timing.id as number)"
+                  />
+                  <UiButtonDelete
+                      :model="EducationTiming"
+                      :entity="timing"
+                      :flat="true"
+                      class="cycle-edit-icon"
+                  />
+                </td>
+              </tr>
+              <tr v-else class="theme-neutral">
+                <td><i>{{ $t('nothing_to_show')}}</i></td>
+                <td></td>
+              </tr>
+            </tbody>
+          </v-table>
+        </v-row>
+        <v-row class="justify-end">
+          <v-btn
+              :flat="true"
+              prepend-icon="fa fa-plus"
+              class="theme-primary mt-2"
+              @click="goToCreatePage"
+          >
+            {{ $t('add') }}
+          </v-btn>
+        </v-row>
+      </v-col>
+    </v-container>
+  </LayoutContainer>
 
 </template>
 
@@ -65,14 +63,6 @@ import {ComputedRef} from "vue";
 import {useOrganizationProfileStore} from "~/stores/organizationProfile";
 import UrlUtils from "~/services/utils/urlUtils";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const organizationProfile = useOrganizationProfileStore()
 
 if (organizationProfile.parametersId === null) {

pages/parameters/general_parameters.vue

@@ -1,78 +1,76 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Parameters"
-          :entity="parameters"
-      >
-        <v-row>
-          <v-col cols="6">
-            <UiInputDatePicker
-                v-if="organizationProfile.isSchool"
-                v-model="parameters.financialDate"
-                field="financialDate"
-                label="start_date_of_financial_season"
-                class="my-2"
-            />
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm
+        v-else
+        :model="Parameters"
+        :entity="parameters"
+    >
+      <v-row>
+        <v-col cols="6">
+          <UiInputDatePicker
+              v-if="organizationProfile.isSchool"
+              v-model="parameters.financialDate"
+              field="financialDate"
+              label="start_date_of_financial_season"
+              class="my-2"
+          />
 
-            <UiInputDatePicker
-                v-if="organizationProfile.isSchool"
-                v-model="parameters.startCourseDate"
-                field="startCourseDate"
-                label="start_date_of_courses"
-                class="my-2"
-            />
+          <UiInputDatePicker
+              v-if="organizationProfile.isSchool"
+              v-model="parameters.startCourseDate"
+              field="startCourseDate"
+              label="start_date_of_courses"
+              class="my-2"
+          />
 
-            <UiInputCheckbox
-                v-model="parameters.showAdherentList"
-                field="showAdherentList"
-                label="show_adherents_list_and_their_coordinates"
-            />
+          <UiInputCheckbox
+              v-model="parameters.showAdherentList"
+              field="showAdherentList"
+              label="show_adherents_list_and_their_coordinates"
+          />
 
-            <UiInputAutocompleteWithEnum
-                v-model="parameters.timezone"
-                enum-name="timezone"
-                field="timezone"
-            />
-          </v-col>
+          <UiInputAutocompleteWithEnum
+              v-model="parameters.timezone"
+              enum-name="timezone"
+              field="timezone"
+          />
+        </v-col>
 
-          <v-col cols="6">
-            <UiInputDatePicker
-                v-if="organizationProfile.isSchool"
-                v-model="parameters.musicalDate"
-                field="musicalDate"
-                label="start_date_of_activity_season"
-                class="my-2"
-            />
+        <v-col cols="6">
+          <UiInputDatePicker
+              v-if="organizationProfile.isSchool"
+              v-model="parameters.musicalDate"
+              field="musicalDate"
+              label="start_date_of_activity_season"
+              class="my-2"
+          />
 
-            <UiInputDatePicker
-                v-if="organizationProfile.isSchool"
-                v-model="parameters.endCourseDate"
-                field="endCourseDate"
-                label="end_date_of_courses"
-                class="my-2"
-            />
+          <UiInputDatePicker
+              v-if="organizationProfile.isSchool"
+              v-model="parameters.endCourseDate"
+              field="endCourseDate"
+              label="end_date_of_courses"
+              class="my-2"
+          />
 
-            <UiInputCheckbox
-                v-if="organizationProfile.isSchool && organizationProfile.isAssociation"
-                v-model="parameters.studentsAreAdherents"
-                field="studentsAreAdherents"
-                label="students_are_also_association_members"
-            />
+          <UiInputCheckbox
+              v-if="organizationProfile.isSchool && organizationProfile.isAssociation"
+              v-model="parameters.studentsAreAdherents"
+              field="studentsAreAdherents"
+              label="students_are_also_association_members"
+          />
 
-            <!-- TODO: reprendre l'UiInput -->
-            <UiInputImage
-                v-model="parameters['qrCode_id']"
-                field="qrCode_id"
-                label="licenceQrCode"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+          <!-- TODO: reprendre l'UiInput -->
+          <UiInputImage
+              v-model="parameters['qrCode_id']"
+              field="qrCode_id"
+              label="licenceQrCode"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -81,14 +79,6 @@ import {useEntityFetch} from "~/composables/data/useEntityFetch";
 import {useOrganizationProfileStore} from "~/stores/organizationProfile";
 import {AsyncData} from "#app";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const { fetch } = useEntityFetch()
 
 const organizationProfile = useOrganizationProfileStore()

pages/parameters/index.vue

@@ -2,7 +2,11 @@
 </template>
 
 <script setup lang="ts">
-/** Redirect to /parameters/general_parameters */
+/**
+ * Redirect to /parameters/general_parameters
+ *
+ * Voir aussi : pages/parameters.vue
+ * */
 const router = useRouter()
 router.push(
     { path: `/parameters/general_parameters` }

pages/parameters/intranet.vue

@@ -1,56 +1,54 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Parameters"
-          :entity="parameters"
-      >
-        <v-row>
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.generateAttendanceReport"
-                field="generateAttendanceReport"
-                label="allow_teachers_to_generate_attendance_reports"
-            />
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm
+        v-else
+        :model="Parameters"
+        :entity="parameters"
+    >
+      <v-row>
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.generateAttendanceReport"
+              field="generateAttendanceReport"
+              label="allow_teachers_to_generate_attendance_reports"
+          />
 
-            <UiInputCheckbox
-                v-model="parameters.administrationCc"
-                field="administrationCc"
-                label="send_teachers_mail_reports_copy_to_administration"
-            />
+          <UiInputCheckbox
+              v-model="parameters.administrationCc"
+              field="administrationCc"
+              label="send_teachers_mail_reports_copy_to_administration"
+          />
 
-            <UiInputCheckbox
-                v-model="parameters.allowMembersToChangeGivenNameAndName"
-                field="allowMembersToChangeGivenNameAndName"
-                label="allow_members_to_change_their_names_and_firstnames"
-            />
-          </v-col>
+          <UiInputCheckbox
+              v-model="parameters.allowMembersToChangeGivenNameAndName"
+              field="allowMembersToChangeGivenNameAndName"
+              label="allow_members_to_change_their_names_and_firstnames"
+          />
+        </v-col>
 
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.createCourse"
-                field="createCourse"
-                label="allow_teachers_to_create_courses"
-            />
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.createCourse"
+              field="createCourse"
+              label="allow_teachers_to_create_courses"
+          />
 
-            <UiInputCheckbox
-                v-model="parameters.consultTeacherListing"
-                field="consultTeacherListing"
-                label="allow_teachers_to_consult_colleagues_informations"
-            />
+          <UiInputCheckbox
+              v-model="parameters.consultTeacherListing"
+              field="consultTeacherListing"
+              label="allow_teachers_to_consult_colleagues_informations"
+          />
 
-            <UiInputCheckbox
-                v-model="parameters.showAdherentList"
-                field="showAdherentList"
-                label="allow_students_to_consult_their_pedagogical_followup"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+          <UiInputCheckbox
+              v-model="parameters.showAdherentList"
+              field="showAdherentList"
+              label="allow_students_to_consult_their_pedagogical_followup"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -59,14 +57,6 @@
   import {useOrganizationProfileStore} from "~/stores/organizationProfile";
   import {AsyncData} from "#app";
 
-  /**
-   * Disable the default layout, the page will use the layout defined with <NuxtLayout />
-   * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
-   */
-  definePageMeta({
-    layout: false,
-  });
-
   const { fetch } = useEntityFetch()
 
   const organizationProfile = useOrganizationProfileStore()

pages/parameters/residence_areas.vue

@@ -1,58 +1,56 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <v-container v-else style="width: 500px;">
-        <v-col cols="12">
-          <v-row class="justify-center">
-            <v-table class="w-100">
-              <thead>
-              <tr>
-                <td>{{ $t('residenceAreas') }}</td>
-                <td></td>
-              </tr>
-              </thead>
-              <tbody>
-              <tr v-if="residenceAreas.length > 0" v-for="residenceArea in residenceAreas" :key="residenceArea.id">
-                <td class="cycle-editable-cell">
-                  {{ residenceArea.label }}
-                </td>
-                <td class="d-flex flex-row">
-                  <v-btn
-                      :flat="true"
-                      icon="fa fa-pen"
-                      class="cycle-edit-icon mr-3"
-                      @click="goToEditPage(residenceArea.id as number)"
-                  />
-                  <UiButtonDelete
-                      :model="ResidenceArea"
-                      :entity="residenceArea"
-                      :flat="true"
-                      class="cycle-edit-icon"
-                  />
-                </td>
-              </tr>
-              <tr v-else class="theme-neutral">
-                <td><i>{{ $t('nothing_to_show')}}</i></td>
-                <td></td>
-              </tr>
-              </tbody>
-            </v-table>
-          </v-row>
-          <v-row class="justify-end">
-            <v-btn
-                :flat="true"
-                prepend-icon="fa fa-plus"
-                class="theme-primary mt-2"
-                @click="goToCreatePage"
-            >
-              {{ $t('add') }}
-            </v-btn>
-          </v-row>
-        </v-col>
-      </v-container>
-    </LayoutContainer>
-  </NuxtLayout>
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <v-container v-else style="width: 500px;">
+      <v-col cols="12">
+        <v-row class="justify-center">
+          <v-table class="w-100">
+            <thead>
+            <tr>
+              <td>{{ $t('residenceAreas') }}</td>
+              <td></td>
+            </tr>
+            </thead>
+            <tbody>
+            <tr v-if="residenceAreas.length > 0" v-for="residenceArea in residenceAreas" :key="residenceArea.id">
+              <td class="cycle-editable-cell">
+                {{ residenceArea.label }}
+              </td>
+              <td class="d-flex flex-row">
+                <v-btn
+                    :flat="true"
+                    icon="fa fa-pen"
+                    class="cycle-edit-icon mr-3"
+                    @click="goToEditPage(residenceArea.id as number)"
+                />
+                <UiButtonDelete
+                    :model="ResidenceArea"
+                    :entity="residenceArea"
+                    :flat="true"
+                    class="cycle-edit-icon"
+                />
+              </td>
+            </tr>
+            <tr v-else class="theme-neutral">
+              <td><i>{{ $t('nothing_to_show')}}</i></td>
+              <td></td>
+            </tr>
+            </tbody>
+          </v-table>
+        </v-row>
+        <v-row class="justify-end">
+          <v-btn
+              :flat="true"
+              prepend-icon="fa fa-plus"
+              class="theme-primary mt-2"
+              @click="goToCreatePage"
+          >
+            {{ $t('add') }}
+          </v-btn>
+        </v-row>
+      </v-col>
+    </v-container>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -63,14 +61,6 @@ import ResidenceAreasRepository from '~/stores/repositories/ResidenceAreasReposi
 import { useRouter } from 'vue-router'
 import UrlUtils from "~/services/utils/urlUtils";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const residenceAreasRepo = useRepo(ResidenceAreasRepository)
 
 const router = useRouter()

pages/parameters/sms.vue

@@ -1,32 +1,30 @@
 <template>
-  <NuxtLayout name="parameters">
-    <div>
-      <UiForm :model="Parameters" :entity="parameters">
-        <v-row>
-          <v-col cols="12">
-            <UiInputText
-              v-model="parameters.smsSenderName"
-              field="smsSenderName"
-            />
-          </v-col>
-          <v-col cols="12">
-            <UiInputText
-              v-model="parameters.usernameSMS"
-              field="usernameSMS"
-              label="Nom d'utilisateur SMS"
-            />
-          </v-col>
-          <v-col cols="12">
-            <UiInputText
-                v-model="parameters.passwordSMS"
-                field="passwordSMS"
-                type="password"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </div>
-  </NuxtLayout>
+  <div>
+    <UiForm :model="Parameters" :entity="parameters">
+      <v-row>
+        <v-col cols="12">
+          <UiInputText
+            v-model="parameters.smsSenderName"
+            field="smsSenderName"
+          />
+        </v-col>
+        <v-col cols="12">
+          <UiInputText
+            v-model="parameters.usernameSMS"
+            field="usernameSMS"
+            label="Nom d'utilisateur SMS"
+          />
+        </v-col>
+        <v-col cols="12">
+          <UiInputText
+              v-model="parameters.passwordSMS"
+              field="passwordSMS"
+              type="password"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </div>
 </template>
 <script setup lang="ts">
 import Parameters from '~/models/Organization/Parameters'
@@ -34,14 +32,6 @@ import { useEntityFetch } from '~/composables/data/useEntityFetch'
 import { useOrganizationProfileStore } from '~/stores/organizationProfile'
 import { AsyncData } from '#app'
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const { fetch } = useEntityFetch()
 
 const organizationProfile = useOrganizationProfileStore()

pages/parameters/super_admin.vue

@@ -1,51 +1,49 @@
 <template>
-  <NuxtLayout name="parameters">
-    <div>
-      <v-container>
-        <v-row>
-          <v-col cols="1">
-          </v-col>
-          <v-col cols="4">
-            <div class="explanation">
-              <div class="px-6 d-flex flex-row align-center">
-                <v-icon class="theme-primary">fa fa-info</v-icon>
-              </div>
-              <div class="px-2">
-                {{ $t('super_admin_explanation_text')}}
-              </div>
+  <div>
+    <v-container>
+      <v-row>
+        <v-col cols="1">
+        </v-col>
+        <v-col cols="4">
+          <div class="explanation">
+            <div class="px-6 d-flex flex-row align-center">
+              <v-icon class="theme-primary">fa fa-info</v-icon>
+            </div>
+            <div class="px-2">
+              {{ $t('super_admin_explanation_text')}}
             </div>
-          </v-col>
-          <v-col cols="1" />
-          <v-col cols="6">
-            <v-row>
+          </div>
+        </v-col>
+        <v-col cols="1" />
+        <v-col cols="6">
+          <v-row>
 
-            </v-row>
-            <v-row v-if="pending">
-              <UiLoadingPanel/>
-            </v-row>
-            <v-row v-else>
-              <UiForm
-                  ref="form"
-                  :model="AdminAccess"
-                  :entity="adminAccess"
-                  class="w-100"
-              >
-                <div class="d-flex flex-row mx-4 my-6">
-                  <span>{{ $t('username') }} :</span> <pre> {{ adminAccess.username }}</pre>
-                </div>
+          </v-row>
+          <v-row v-if="pending">
+            <UiLoadingPanel/>
+          </v-row>
+          <v-row v-else>
+            <UiForm
+                ref="form"
+                :model="AdminAccess"
+                :entity="adminAccess"
+                class="w-100"
+            >
+              <div class="d-flex flex-row mx-4 my-6">
+                <span>{{ $t('username') }} :</span> <pre> {{ adminAccess.username }}</pre>
+              </div>
 
-                <UiInputText
-                    field="email"
-                    v-model="adminAccess.email"
-                    :rules="rules()"
-                />
-              </UiForm>
-            </v-row>
-          </v-col>
-        </v-row>
-      </v-container>
-    </div>
-  </NuxtLayout>
+              <UiInputText
+                  field="email"
+                  v-model="adminAccess.email"
+                  :rules="rules()"
+              />
+            </UiForm>
+          </v-row>
+        </v-col>
+      </v-row>
+    </v-container>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -54,14 +52,6 @@ import { useAccessProfileStore } from '~/stores/accessProfile'
 import AdminAccess from '~/models/Access/AdminAccess'
 import {useValidationUtils} from "~/composables/utils/useValidationUtils";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const { fetch } = useEntityFetch()
 
 const accessProfile = useAccessProfileStore()

pages/parameters/teaching.vue

@@ -1,51 +1,49 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Parameters"
-          :entity="parameters"
-      >
-        <v-table>
-          <thead>
-            <tr>
-              <td>{{ $t('originalLabel') }}</td>
-              <td>{{ $t('effectiveLabel') }}</td>
-            </tr>
-          </thead>
-
-          <tbody>
-            <tr v-for="enumItem in cycleEnum">
-              <td>{{ $t(enumItem.value) }}</td>
-              <td class="cycle-editable-cell">
-                {{ orderedCycles[enumItem.value] ? orderedCycles[enumItem.value].label : $t(enumItem.value) }}
-              </td>
-              <td style="max-width: 24px;">
-                <v-btn
-                    v-if="orderedCycles[enumItem.value]"
-                    :flat="true"
-                    icon="fa fa-pen"
-                    class="cycle-edit-icon"
-                    @click="goToCycleEditPage(orderedCycles[enumItem.value].id)"
-                />
-              </td>
-            </tr>
-          </tbody>
-        </v-table>
-
-        <v-row>
-          <v-col cols="6">
-            <UiInputCheckbox
-                v-model="parameters.showEducationIsACollectivePractice"
-                field="showEducationIsACollectivePractice"
-                label="allow_to_configure_teachings_with_played_instrument_choice"
-            />
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm
+        v-else
+        :model="Parameters"
+        :entity="parameters"
+    >
+      <v-table>
+        <thead>
+          <tr>
+            <td>{{ $t('originalLabel') }}</td>
+            <td>{{ $t('effectiveLabel') }}</td>
+          </tr>
+        </thead>
+
+        <tbody>
+          <tr v-for="enumItem in cycleEnum">
+            <td>{{ $t(enumItem.value) }}</td>
+            <td class="cycle-editable-cell">
+              {{ orderedCycles[enumItem.value] ? orderedCycles[enumItem.value].label : $t(enumItem.value) }}
+            </td>
+            <td style="max-width: 24px;">
+              <v-btn
+                  v-if="orderedCycles[enumItem.value]"
+                  :flat="true"
+                  icon="fa fa-pen"
+                  class="cycle-edit-icon"
+                  @click="goToCycleEditPage(orderedCycles[enumItem.value].id)"
+              />
+            </td>
+          </tr>
+        </tbody>
+      </v-table>
+
+      <v-row>
+        <v-col cols="6">
+          <UiInputCheckbox
+              v-model="parameters.showEducationIsACollectivePractice"
+              field="showEducationIsACollectivePractice"
+              label="allow_to_configure_teachings_with_played_instrument_choice"
+          />
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -57,14 +55,6 @@ import {useOrganizationProfileStore} from "~/stores/organizationProfile";
 import {AnyJson} from "~/types/data";
 import {useEnumFetch} from "~/composables/data/useEnumFetch";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const organizationProfile = useOrganizationProfileStore()
 
 if (organizationProfile.parametersId === null) {

pages/parameters/website.vue

@@ -1,123 +1,121 @@
 <template>
-  <NuxtLayout name="parameters">
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Parameters"
-          :entity="parameters"
-      >
-        <v-row>
-          <v-col cols="6">
-            <div class="mb-6">
-              <div>{{ $t('your_opentalent_website_address_is')}} : </div>
-              <div class="ma-2 text-primary">
-                <strong>{{ organizationProfile.website }}</strong>
-              </div>
+  <LayoutContainer>
+    <UiLoadingPanel v-if="pending" />
+    <UiForm
+        v-else
+        :model="Parameters"
+        :entity="parameters"
+    >
+      <v-row>
+        <v-col cols="6">
+          <div class="mb-6">
+            <div>{{ $t('your_opentalent_website_address_is')}} : </div>
+            <div class="ma-2 text-primary">
+              <strong>{{ organizationProfile.website }}</strong>
             </div>
+          </div>
+
+          <div class="mb-6">
+            <div>{{ $t('your_subdomains') }} : </div>
+            <UiLoadingPanel v-if="subdomainsPending" />
+            <div v-else>
+              <v-table class="my-2">
+                <tbody>
+                  <tr
+                      v-for="subdomain in subdomains.items"
+                      :key="subdomain.id"
+                      :title="subdomain.subdomain"
+                      class="subdomainItem"
+                      @click="goToEditPage(subdomain.id)"
+                  >
+                    <td>{{ subdomain.subdomain }}</td>
+                    <td>
+                        <span v-if="subdomain.active">
+                          <v-icon class="text-success icon">
+                            fa-solid fa-check
+                          </v-icon> {{ $t('active') }}
+                        </span>
+                    </td>
 
-            <div class="mb-6">
-              <div>{{ $t('your_subdomains') }} : </div>
-              <UiLoadingPanel v-if="subdomainsPending" />
-              <div v-else>
-                <v-table class="my-2">
-                  <tbody>
-                    <tr
-                        v-for="subdomain in subdomains.items"
-                        :key="subdomain.id"
-                        :title="subdomain.subdomain"
-                        class="subdomainItem"
-                        @click="goToEditPage(subdomain.id)"
-                    >
-                      <td>{{ subdomain.subdomain }}</td>
-                      <td>
-                          <span v-if="subdomain.active">
-                            <v-icon class="text-success icon">
-                              fa-solid fa-check
-                            </v-icon> {{ $t('active') }}
-                          </span>
-                      </td>
-
-                    </tr>
-
-                  </tbody>
-
-                </v-table>
+                  </tr>
+
+                </tbody>
+
+              </v-table>
 
-                <v-btn
-                    :disabled="!canAddNewSubdomain"
-                    class="my-2"
-                    @click="onAddSubdomainClick"
-                >
-                  {{ $t('record_a_new_subdomain')}}
-                </v-btn>
-              </div>
-            </div>
-          </v-col>
-
-          <v-col cols="6">
-              <!-- les publicationDirectors sont des entités Access -->
-              <UiInputAutocompleteAccesses
-                  v-model="parameters.publicationDirectors"
-                  field="publicationDirectors"
-                  multiple
-                  chips
-              />
-
-            <div class="my-8" v-if="!organizationProfile.isCmf">
-              <v-btn
-                v-if="!parameters.desactivateOpentalentSiteWeb"
-                color="error"
-                @click="showWebsiteDeactivationDialog=true"
-              >
-                {{ $t('deactivateOpentalentSiteWeb') }}
-              </v-btn>
               <v-btn
-                v-else
-                color="primary"
-                @click="reactivateWebsite"
+                  :disabled="!canAddNewSubdomain"
+                  class="my-2"
+                  @click="onAddSubdomainClick"
               >
-                {{ $t('reactivateOpentalentSiteWeb') }}
+                {{ $t('record_a_new_subdomain')}}
               </v-btn>
-
-              <LazyLayoutDialog :show="showWebsiteDeactivationDialog">
-                <template #dialogTitle>
-                  {{ $t('please_confirm')}}
-                </template>
-                <template #dialogText>
-                  <v-col>
-                    <div>{{ $t('yourOpentalentWebsiteWillBeDeactivatedOnceYouLlHaveSaved')}}.</div>
-                    <span>{{ $t('doYouWantToContinue')}} ?</span>
-                  </v-col>
-                </template>
-                <template #dialogBtn>
-                  <v-btn
-                      class="theme-neutral-soft mr-4"
-                      @click="showWebsiteDeactivationDialog=false"
-                  >
-                    {{ $t('cancel') }}
-                  </v-btn>
-                  <v-btn
-                      class="theme-primary"
-                      @click="showWebsiteDeactivationDialog=false; deactivateWebsite()"
-                  >
-                    {{ $t('yes') }}
-                  </v-btn>
-                </template>
-              </LazyLayoutDialog>
-            </div>
-
-            <div>
-              <UiInputText
-                  v-model="parameters.otherWebsite"
-                  field="otherWebsite"
-              />
             </div>
-          </v-col>
-        </v-row>
-      </UiForm>
-    </LayoutContainer>
-  </NuxtLayout>
+          </div>
+        </v-col>
+
+        <v-col cols="6">
+            <!-- les publicationDirectors sont des entités Access -->
+            <UiInputAutocompleteAccesses
+                v-model="parameters.publicationDirectors"
+                field="publicationDirectors"
+                multiple
+                chips
+            />
+
+          <div class="my-8" v-if="!organizationProfile.isCmf">
+            <v-btn
+              v-if="!parameters.desactivateOpentalentSiteWeb"
+              color="error"
+              @click="showWebsiteDeactivationDialog=true"
+            >
+              {{ $t('deactivateOpentalentSiteWeb') }}
+            </v-btn>
+            <v-btn
+              v-else
+              color="primary"
+              @click="reactivateWebsite"
+            >
+              {{ $t('reactivateOpentalentSiteWeb') }}
+            </v-btn>
+
+            <LazyLayoutDialog :show="showWebsiteDeactivationDialog">
+              <template #dialogTitle>
+                {{ $t('please_confirm')}}
+              </template>
+              <template #dialogText>
+                <v-col>
+                  <div>{{ $t('yourOpentalentWebsiteWillBeDeactivatedOnceYouLlHaveSaved')}}.</div>
+                  <span>{{ $t('doYouWantToContinue')}} ?</span>
+                </v-col>
+              </template>
+              <template #dialogBtn>
+                <v-btn
+                    class="theme-neutral-soft mr-4"
+                    @click="showWebsiteDeactivationDialog=false"
+                >
+                  {{ $t('cancel') }}
+                </v-btn>
+                <v-btn
+                    class="theme-primary"
+                    @click="showWebsiteDeactivationDialog=false; deactivateWebsite()"
+                >
+                  {{ $t('yes') }}
+                </v-btn>
+              </template>
+            </LazyLayoutDialog>
+          </div>
+
+          <div>
+            <UiInputText
+                v-model="parameters.otherWebsite"
+                field="otherWebsite"
+            />
+          </div>
+        </v-col>
+      </v-row>
+    </UiForm>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">
@@ -127,14 +125,6 @@ import {useEntityFetch} from "~/composables/data/useEntityFetch";
 import {AsyncData} from "#app";
 import Subdomain from "~/models/Organization/Subdomain";
 
-/**
- * Disable the default layout, the page will use the layout defined with <NuxtLayout />
- * @see https://nuxt.com/docs/guide/directory-structure/layouts#overriding-a-layout-on-a-per-page-basis
- */
-definePageMeta({
-  layout: false,
-});
-
 const i18n = useI18n()
 
 const { fetch, fetchCollection } = useEntityFetch()

plugins/menus.server.ts

@@ -0,0 +1,6 @@
+import {useMenu} from "~/composables/layout/useMenu";
+
+export default defineNuxtPlugin(async () => {
+    const { buildAllMenu } = useMenu()
+    buildAllMenu()
+})

services/layout/menuComposer.ts

@@ -8,6 +8,7 @@ import AccountMenuBuilder from "~/services/layout/menuBuilder/accountMenuBuilder
 import {RuntimeConfig} from "@nuxt/schema";
 import {AnyAbility} from "@casl/ability";
 import {MenuBuilder, MenuGroup} from "~/types/layout";
+import ParametersMenuBuilder from "~/services/layout/menuBuilder/parametersMenuBuilder";
 
 /**
  * Gestionnaire principal des menus de l'application
@@ -21,7 +22,7 @@ export default class MenuComposer {
         MyAccessesMenuBuilder,
         MyFamilyMenuBuilder,
         ConfigurationMenuBuilder,
-        AccountMenuBuilder,
+        AccountMenuBuilder
     ]
 
     /**