Browse Source

refactor and finalize create menu

Olivier Massot 2 years ago
parent
commit
9b032b4869

+ 35 - 3
components/Layout/Header/UniversalCreation/Card.vue

@@ -39,20 +39,35 @@
 </template>
 </template>
 
 
 <script setup lang="ts">
 <script setup lang="ts">
+  import {PropType} from "@vue/runtime-core";
+  import {MENU_LINK_TYPE} from "~/types/enum/layout";
+  import {useAdminUrl} from "~/composables/utils/useAdminUrl";
+  import UrlUtils from "~/services/utils/urlUtils";
+
   const props = defineProps({
   const props = defineProps({
     /**
     /**
      * Target location in the wizard
      * Target location in the wizard
      */
      */
     to: {
     to: {
       type: String,
       type: String,
-      required: false
+      required: false,
+      default: null
     },
     },
     /**
     /**
      * Target url
      * Target url
      */
      */
     href: {
     href: {
       type: String,
       type: String,
-      required: false
+      required: false,
+      default: null
+    },
+    /**
+     * Target url
+     */
+    linkType: {
+      type: Number as PropType<MENU_LINK_TYPE>,
+      required: false,
+      default: MENU_LINK_TYPE.V1
     },
     },
     /**
     /**
      * Title displayed on the card
      * Title displayed on the card
@@ -79,8 +94,25 @@
 
 
   const emit = defineEmits(['click'])
   const emit = defineEmits(['click'])
 
 
+  const { makeAdminUrl } = useAdminUrl()
+
+  let url: string | null = null;
+
+  if (props.href !== null) {
+    switch (props.linkType) {
+      case MENU_LINK_TYPE.V1:
+        url = makeAdminUrl(props.href)
+        break;
+      case MENU_LINK_TYPE.EXTERNAL:
+        url = UrlUtils.prependHttps(props.href)
+        break;
+      default:
+        url = props.href
+    }
+  }
+
   const onClick = () => {
   const onClick = () => {
-    emit('click', props.to, props.link)
+    emit('click', props.to, url)
   }
   }
 </script>
 </script>
 
 

+ 114 - 28
components/Layout/Header/UniversalCreation/CreateButton.vue

@@ -1,5 +1,5 @@
 <!--
 <!--
-  Bouton Créer du header de l'application
+  Bouton Créer du header de l'application et boite de dialogue associée
 -->
 -->
 
 
 <template>
 <template>
@@ -25,20 +25,22 @@
       <span>{{ $t('create') }}</span>
       <span>{{ $t('create') }}</span>
     </v-btn>
     </v-btn>
 
 
-    <LayoutDialog :show="showing" :max-width="850" >
+    <LayoutDialog :show="showCreateDialog" :max-width="850" >
       <template #dialogType>{{ $t('creative_assistant') }}</template>
       <template #dialogType>{{ $t('creative_assistant') }}</template>
 
 
       <template #dialogTitle>
       <template #dialogTitle>
-        <span v-if="type === 'home'">{{ $t('what_do_you_want_to_create') }}</span>
-        <span v-else-if="type === 'access'">{{ $t('what_type_of_contact_do_you_want_to_create') }}</span>
-        <span v-else-if="type === 'event'">{{ $t('what_do_you_want_to_add_to_your_planning') }}</span>
-        <span v-else-if="type === 'message'">{{ $t('what_do_you_want_to_send') }}</span>
+        <span v-if="location === 'home'">{{ $t('what_do_you_want_to_create') }}</span>
+        <span v-else-if="location === 'access'">{{ $t('what_type_of_contact_do_you_want_to_create') }}</span>
+        <span v-else-if="location === 'event'">{{ $t('what_do_you_want_to_add_to_your_planning') }}</span>
+        <span v-else-if="location === 'message'">{{ $t('what_do_you_want_to_send') }}</span>
+        <span v-else-if="location === 'event-params'">{{ $t('which_date_and_which_hour') }}</span>
       </template>
       </template>
 
 
       <template #dialogText>
       <template #dialogText>
          <LayoutHeaderUniversalCreationGenerateCardsSteps
          <LayoutHeaderUniversalCreationGenerateCardsSteps
-             :step="step"
-             @updateStep="updateStep"
+             :path="path"
+             @cardClick="onCardClick"
+             @urlUpdate="onUrlUpdate"
          />
          />
       </template>
       </template>
 
 
@@ -48,9 +50,13 @@
             {{ $t('cancel') }}
             {{ $t('cancel') }}
           </v-btn>
           </v-btn>
 
 
-          <v-btn v-if="step > 1" class="theme-neutral-soft" @click="reset" >
+          <v-btn v-if="path.length > 1" class="theme-neutral-soft" @click="goToPrevious" >
             {{ $t('previous_step') }}
             {{ $t('previous_step') }}
           </v-btn>
           </v-btn>
+
+          <v-btn v-if="targetUrl !== null && !directRedirectionOngoing" class="theme-primary" @click="validate" >
+            {{ $t('validate') }}
+          </v-btn>
         </div>
         </div>
       </template>
       </template>
     </LayoutDialog>
     </LayoutDialog>
@@ -60,40 +66,120 @@
 <script setup lang="ts">
 <script setup lang="ts">
   import {Ref, ref} from "@vue/reactivity";
   import {Ref, ref} from "@vue/reactivity";
   import {useDisplay} from "vuetify";
   import {useDisplay} from "vuetify";
+  import {ComputedRef} from "vue";
+  import {usePageStore} from "~/stores/page";
 
 
-  const showing: Ref<Boolean> = ref(false);
-  const step: Ref<Number> = ref(1);
-  const type: Ref<String> = ref('home');
+  const { mdAndDown: asIcon } = useDisplay()
 
 
-  const updateStep = ({stepChoice, typeChoice}: any) =>{
-    step.value = stepChoice
-    type.value = typeChoice
-  }
+  // Set to true to show the Create dialog
+  const showCreateDialog: Ref<boolean> = ref(false);
+
+  // The succession of menus the user has been through; used to keep track of the navigation
+  const path: Ref<Array<string>> = ref(['home'])
 
 
+  // The current menu
+  const location: ComputedRef<string> = computed(() => {
+    return path.value.at(-1) ?? 'home'
+  })
+
+  // The current target URL (@see onUrlUpdate())
+  const targetUrl: Ref<string | null> = ref(null)
+
+  // Already redirecting (to avoid the display of the 'validate' button when page has already been redirected and is loading)
+  const directRedirectionOngoing: Ref<boolean> = ref(false)
+
+  /**
+   * Return to the home menu
+   */
   const reset = () => {
   const reset = () => {
-    step.value = 1
-    type.value = 'home'
+    path.value = ['home']
+  }
+
+  /**
+   * Go back to the previous step
+   */
+  const goToPrevious = () => {
+    if (path.value.length === 1) {
+      return
+    }
+    path.value.pop()
   }
   }
 
 
+  /**
+   * Display the create dialog
+   */
   const show = () => {
   const show = () => {
     reset()
     reset()
-    showing.value = true
+    showCreateDialog.value = true
   }
   }
 
 
+  const pageStore = usePageStore()
+
+  /**
+   * Redirect the user to the given url
+   * @param url
+   */
+  const redirect = (url: string) => {
+    pageStore.loading = true
+    window.location.href = url
+  }
+
+  /**
+   * Go to the current targetUrl
+   */
+  const validate = () => {
+    if (targetUrl.value === null) {
+      console.warn('No url defined')
+      return
+    }
+    redirect(targetUrl.value)
+  }
+
+  /**
+   * Close the Create dialog
+   */
   const close = () => {
   const close = () => {
-    showing.value = false
+    showCreateDialog.value = false
   }
   }
 
 
-  const { mdAndDown: asIcon } = useDisplay()
+  /**
+   * A cart has been clicked. The reaction depends on the card's properties.
+   *
+   * @param to  Target location in the wizard
+   * @param href  Target absolute url
+   */
+  const onCardClick = (to: string | null, href: string | null) => {
+    console.log(to, href)
+    if (to !== null) {
+      // La carte définit une nouvelle destination : on se dirige vers elle.
+      path.value.push(to)
+
+    } else if (href !== null) {
+      // La carte définit une url avec href, et pas de nouvelle destination : on suit directement le lien pour éviter
+      // l'étape de validation devenue inutile.
+      directRedirectionOngoing.value = true
+      redirect(href)
+
+    } else {
+      console.warn('Error: card has no `to` nor `href` defined')
+    }
+  }
 
 
+  /**
+   * The url has been updated in the GenerateCardsStep component
+   * @param url
+   */
+  const onUrlUpdate = (url: string) => {
+    targetUrl.value = url
+  }
 </script>
 </script>
 
 
 <style scoped lang="scss">
 <style scoped lang="scss">
-:deep(.v-btn .v-icon) {
-  font-size: 16px !important;
-}
-:deep(.v-btn) {
-  text-transform: none !important;
-  font-weight: 600;
-}
+  :deep(.v-btn .v-icon) {
+    font-size: 16px !important;
+  }
+  :deep(.v-btn) {
+    text-transform: none !important;
+    font-weight: 600;
+  }
 </style>
 </style>

+ 10 - 1
components/Layout/Header/UniversalCreation/EventParams.vue

@@ -91,9 +91,18 @@ Event parameters page in the create dialog
     }
     }
   })
   })
 
 
-  watch(params, (newParams) => {
+  // Send an update event as soon as the page is mounted
+  onMounted(() => {
+    emit('paramsUpdated', params.value)
+  })
+
+  // Send an update event every time the params change
+  const unwatch = watch(params, (newParams) => {
     emit('paramsUpdated', newParams)
     emit('paramsUpdated', newParams)
   })
   })
+  onUnmounted(() => {
+    unwatch()
+  })
 </script>
 </script>
 
 
 <style scoped lang="scss">
 <style scoped lang="scss">

+ 165 - 83
components/Layout/Header/UniversalCreation/GenerateCardsSteps.vue

@@ -3,220 +3,280 @@
 -->
 -->
 
 
 <template>
 <template>
-  <v-container v-if="step === 1">
+
+  <!-- Menu Accueil -->
+  <v-container v-if="location == 'home'">
     <v-row>
     <v-row>
+
+      <!-- Une personne -->
       <v-col cols="6" v-if="ability.can('manage', 'users')">
       <v-col cols="6" v-if="ability.can('manage', 'users')">
-          <LayoutHeaderUniversalCreationTypeCard
-            title="a_person"
-            text-content="add_new_person_student"
-            icon="fa fa-user"
-            type="access"
-            @typeClick="onTypeClick"
+          <LayoutHeaderUniversalCreationCard
+              to="access"
+              title="a_person"
+              text-content="add_new_person_student"
+              icon="fa fa-user"
+              @click="onCardClick"
           />
           />
       </v-col>
       </v-col>
 
 
+      <!-- Un évènement -->
       <v-col cols="6" v-if="ability.can('display', 'agenda_page')
       <v-col cols="6" v-if="ability.can('display', 'agenda_page')
                 && (
                 && (
                    ability.can('display', 'course_page') ||
                    ability.can('display', 'course_page') ||
                    ability.can('display', 'exam_page') ||
                    ability.can('display', 'exam_page') ||
                    ability.can('display', 'pedagogics_project_page')
                    ability.can('display', 'pedagogics_project_page')
                 )">
                 )">
-        <LayoutHeaderUniversalCreationTypeCard
-          title="an_event"
-          text-content="add_an_event_course"
-          icon="fa fa-calendar-alt"
-          type="event"
-          @typeClick="onTypeClick"
+        <LayoutHeaderUniversalCreationCard
+            to="event"
+            title="an_event"
+            text-content="add_an_event_course"
+            icon="fa fa-calendar-alt"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Autre évènement -->
       <v-col cols="6" v-else-if="ability.can('display', 'agenda_page') && ability.can('manage', 'events')">
       <v-col cols="6" v-else-if="ability.can('display', 'agenda_page') && ability.can('manage', 'events')">
-        <LayoutHeaderUniversalCreationTypeCard
-          title="other_event"
-          text-content="other_event_text_creation_card"
-          icon="far fa-calendar"
-          :link="makeAdminUrl('/calendar/create/events')"
+        <LayoutHeaderUniversalCreationCard
+            to="event-params"
+            title="other_event"
+            text-content="other_event_text_creation_card"
+            icon="far fa-calendar"
+            href="/calendar/create/events"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Une correspondance -->
       <v-col cols="6" v-if="ability.can('display', 'message_send_page')
       <v-col cols="6" v-if="ability.can('display', 'message_send_page')
                    && (
                    && (
                     ability.can('manage', 'emails') ||
                     ability.can('manage', 'emails') ||
                     ability.can('manage', 'mails') ||
                     ability.can('manage', 'mails') ||
                     ability.can('manage', 'texto')
                     ability.can('manage', 'texto')
                   )">
                   )">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
+          to="message"
           title="a_correspondence"
           title="a_correspondence"
-          text-content="sen_email_letter"
+          text-content="send_email_letter"
           icon="fa fa-comment"
           icon="fa fa-comment"
           type="message"
           type="message"
-          @typeClick="onTypeClick"
+          @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un matériel (direct link) -->
       <v-col cols="6" v-if="ability.can('manage', 'equipments')">
       <v-col cols="6" v-if="ability.can('manage', 'equipments')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
           title="a_materiel"
           title="a_materiel"
           text-content="add_any_type_material"
           text-content="add_any_type_material"
           icon="fa fa-cube"
           icon="fa fa-cube"
-          :link="makeAdminUrl('/list/create/equipment')"
+          href="/list/create/equipment"
+          @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
     </v-row>
     </v-row>
   </v-container>
   </v-container>
 
 
-  <v-container v-if="step === 2">
-    <v-row v-if="type === 'access'">
+  <!-- Menu "Créer une personne" -->
+  <v-container v-if="location === 'access'">
+    <v-row>
+      <!-- Un adhérent -->
       <v-col cols="6" v-if="isLaw1901">
       <v-col cols="6" v-if="isLaw1901">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="an_adherent"
             title="an_adherent"
             text-content="adherent_text_creation_card"
             text-content="adherent_text_creation_card"
             icon="fa fa-user"
             icon="fa fa-user"
-            :link="makeAdminUrl('/universal_creation_person/adherent')"
+            href="/universal_creation_person/adherent"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un membre du CA -->
       <v-col cols="6" v-if="isLaw1901">
       <v-col cols="6" v-if="isLaw1901">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_ca_member"
             title="a_ca_member"
             text-content="ca_member_text_creation_card"
             text-content="ca_member_text_creation_card"
             icon="fa fa-users"
             icon="fa fa-users"
-            :link="makeAdminUrl('/universal_creation_person/ca_member')"
+            href="/universal_creation_person/ca_member"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un élève -->
       <v-col cols="6">
       <v-col cols="6">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_student"
             title="a_student"
             text-content="student_text_creation_card"
             text-content="student_text_creation_card"
             icon="fa fa-user"
             icon="fa fa-user"
-            :link="makeAdminUrl('/universal_creation_person/student')"
+            href="/universal_creation_person/student"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un tuteur -->
       <v-col cols="6">
       <v-col cols="6">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_guardian"
             title="a_guardian"
             text-content="guardian_text_creation_card"
             text-content="guardian_text_creation_card"
             icon="fa fa-female"
             icon="fa fa-female"
-            :link="makeAdminUrl('/universal_creation_person/guardian')"
+            href="/universal_creation_person/guardian"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un professeur -->
       <v-col cols="6">
       <v-col cols="6">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_teacher"
             title="a_teacher"
             text-content="teacher_text_creation_card"
             text-content="teacher_text_creation_card"
             icon="fa fa-graduation-cap"
             icon="fa fa-graduation-cap"
-            :link="makeAdminUrl('/universal_creation_person/teacher')"
+            href="/universal_creation_person/teacher"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un membre du personnel -->
       <v-col cols="6">
       <v-col cols="6">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_member_of_staff"
             title="a_member_of_staff"
             text-content="personnel_text_creation_card"
             text-content="personnel_text_creation_card"
             icon="fa fa-suitcase"
             icon="fa fa-suitcase"
-            :link="makeAdminUrl('/universal_creation_person/personnel')"
+            href="/universal_creation_person/personnel"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Une entité légale -->
       <v-col cols="6">
       <v-col cols="6">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_legal_entity"
             title="a_legal_entity"
             text-content="moral_text_creation_card"
             text-content="moral_text_creation_card"
             icon="fa fa-building"
             icon="fa fa-building"
-            :link="makeAdminUrl('/universal_creation_person/company')"
+            href="/universal_creation_person/company"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Une inscription en ligne -->
       <v-col cols="6" v-if="hasOnlineRegistrationModule">
       <v-col cols="6" v-if="hasOnlineRegistrationModule">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="online_registration"
             title="online_registration"
             text-content="online_registration_text_creation_card"
             text-content="online_registration_text_creation_card"
             icon="fa fa-list-alt"
             icon="fa fa-list-alt"
-            :link="makeAdminUrl('/online/registration/new_registration')"
+            href="/online/registration/new_registration"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un autre type de contact -->
       <v-col cols="6">
       <v-col cols="6">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="another_type_of_contact"
             title="another_type_of_contact"
             text-content="other_contact_text_creation_card"
             text-content="other_contact_text_creation_card"
             icon="fa fa-plus"
             icon="fa fa-plus"
-            :link="makeAdminUrl('/universal_creation_person/other_contact')"
+            href="/universal_creation_person/other_contact"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
     </v-row>
     </v-row>
+  </v-container>
 
 
-    <v-row v-if="type === 'event'">
-      <!-- /?start=2023-06-12T08:00:00%2B0200&end=2023-06-12T09:00:00%2B0200 -->
+  <!-- Menu Évènement -->
+  <v-container v-if="location === 'event'">
+    <v-row>
+      <!-- Un cours -->
       <v-col cols="6" v-if="ability.can('display', 'course_page')">
       <v-col cols="6" v-if="ability.can('display', 'course_page')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
+            to="event-params"
+            href="/calendar/create/courses"
             title="course"
             title="course"
             text-content="course_text_creation_card"
             text-content="course_text_creation_card"
             icon="fa fa-users"
             icon="fa fa-users"
-            :link="makeAdminUrl('/calendar/create/courses', {'start': eventDefaultStart, 'end': eventDefaultEnd})"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un examen -->
       <v-col cols="6" v-if="ability.can('display', 'exam_page')">
       <v-col cols="6" v-if="ability.can('display', 'exam_page')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
+            to="event-params"
+            href="/calendar/create/examens"
             title="exam"
             title="exam"
             text-content="exam_text_creation_card"
             text-content="exam_text_creation_card"
             icon="fa fa-graduation-cap"
             icon="fa fa-graduation-cap"
-            :link="makeAdminUrl('/calendar/create/examens')"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un projet pédagogique -->
       <v-col cols="6" v-if="ability.can('display', 'pedagogics_project_page')">
       <v-col cols="6" v-if="ability.can('display', 'pedagogics_project_page')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
+            to="event-params"
+            href="/calendar/create/educational_projects"
             title="educational_services"
             title="educational_services"
             text-content="educational_services_text_creation_card"
             text-content="educational_services_text_creation_card"
             icon="fa fa-suitcase"
             icon="fa fa-suitcase"
-            :link="makeAdminUrl('/calendar/create/educational_projects')"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un autre évènement -->
       <v-col cols="6" v-if="ability.can('manage', 'events')">
       <v-col cols="6" v-if="ability.can('manage', 'events')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
+            to="event-params"
+            href="/calendar/create/events"
             title="other_event"
             title="other_event"
             text-content="other_event_text_creation_card"
             text-content="other_event_text_creation_card"
             icon="far fa-calendar"
             icon="far fa-calendar"
-            :link="adminLegacy + '/calendar/create/events'"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
     </v-row>
     </v-row>
+  </v-container>
 
 
-    <v-row v-if="type === 'message'">
+  <!-- Une correspondance -->
+  <v-container v-if="location === 'message'">
+    <v-row>
+      <!-- Un email -->
       <v-col cols="6" v-if="ability.can('manage', 'emails')">
       <v-col cols="6" v-if="ability.can('manage', 'emails')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="an_email"
             title="an_email"
             text-content="email_text_creation_card"
             text-content="email_text_creation_card"
             icon="far fa-envelope"
             icon="far fa-envelope"
-            :link="makeAdminUrl('/list/create/emails')"
+            href="/list/create/emails"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un courrier -->
       <v-col cols="6" v-if="ability.can('manage', 'mails')">
       <v-col cols="6" v-if="ability.can('manage', 'mails')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_letter"
             title="a_letter"
             text-content="letter_text_creation_card"
             text-content="letter_text_creation_card"
             icon="far fa-file-alt"
             icon="far fa-file-alt"
-            :link="makeAdminUrl('/list/create/mails')"
+            href="/list/create/mails"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
 
 
+      <!-- Un SMS -->
       <v-col cols="6" v-if="ability.can('manage', 'texto')">
       <v-col cols="6" v-if="ability.can('manage', 'texto')">
-        <LayoutHeaderUniversalCreationTypeCard
+        <LayoutHeaderUniversalCreationCard
             title="a_sms"
             title="a_sms"
             text-content="sms_text_creation_card"
             text-content="sms_text_creation_card"
             icon="fa fa-mobile-alt"
             icon="fa fa-mobile-alt"
-            :link="makeAdminUrl('/list/create/sms')"
+            href="/list/create/sms"
+            @click="onCardClick"
         />
         />
       </v-col>
       </v-col>
     </v-row>
     </v-row>
   </v-container>
   </v-container>
+
+  <!-- Page de pré-paramétrage des évènements -->
+  <LayoutHeaderUniversalCreationEventParams
+      v-if="location === 'event-params'"
+      @params-updated="onEventParamsUpdated"
+  />
 </template>
 </template>
 
 
 <script setup lang="ts">
 <script setup lang="ts">
@@ -224,43 +284,65 @@
   import {useOrganizationProfileStore} from "~/stores/organizationProfile";
   import {useOrganizationProfileStore} from "~/stores/organizationProfile";
   import {useAbility} from "@casl/vue";
   import {useAbility} from "@casl/vue";
   import {ComputedRef} from "vue";
   import {ComputedRef} from "vue";
+  import {useAdminUrl} from "~/composables/utils/useAdminUrl";
   import UrlUtils from "~/services/utils/urlUtils";
   import UrlUtils from "~/services/utils/urlUtils";
-  import {add, formatISO, startOfHour} from "date-fns";
 
 
   const props = defineProps({
   const props = defineProps({
-    step: {
-      type: Number,
+    /**
+     * The path that the user followed troughout the wizard
+     */
+    path: {
+      type: Array<string>,
       required: true
       required: true
     }
     }
   })
   })
 
 
-  const emit = defineEmits(['updateStep'])
+  const location: ComputedRef<string> = computed(() => {
+    return props.path.at(-1) ?? 'home'
+  })
 
 
   const ability = useAbility()
   const ability = useAbility()
 
 
-  const type: Ref<String> = ref('');
   const organizationProfile = useOrganizationProfileStore()
   const organizationProfile = useOrganizationProfileStore()
-  const runtimeConfig = useRuntimeConfig()
+  const isLaw1901: ComputedRef<boolean> = organizationProfile.isAssociation
+  const hasOnlineRegistrationModule: Ref<boolean> = ref(organizationProfile.hasModule('IEL'))
+
+  const baseUrl: Ref<string | null> = ref(null)
+  const query: Ref<Record<string, string>> = ref({})
+
+  const url: ComputedRef<string | null> = computed(() => {
+    if (baseUrl.value === null) {
+      return null
+    }
+    return UrlUtils.addQuery(baseUrl.value, query.value)
+  })
 
 
-  // Get the start of the next hour as a default event start
-  const now: Date = new Date()
-  const eventDefaultStart: string = formatISO(startOfHour(add(now, { 'hours': 1 })))
-  const eventDefaultEnd: string = formatISO(startOfHour(add(now, { 'hours': 2 })))
+  const emit = defineEmits(['cardClick', 'urlUpdate'])
 
 
-  const onTypeClick = (step: Number, Cardtype: String) => {
-    type.value = Cardtype;
-    emit('updateStep', { stepChoice: step, typeChoice: Cardtype });
+  /**
+   * Called when a card is clicked
+   * @param to  Target location in the wizard
+   * @param href  Target absolute url
+   */
+  const onCardClick = (to: string | null, href: string | null) => {
+    if (href !== null) {
+      baseUrl.value = href
+    }
+    emit('cardClick', to, url.value)
   }
   }
 
 
-  const adminLegacy: Ref<string> = ref(runtimeConfig.baseUrlAdminLegacy)
-  const isLaw1901: ComputedRef<boolean> = organizationProfile.isAssociation
-  const hasOnlineRegistrationModule: ComputedRef<boolean> = computed(
-      () => organizationProfile.hasModule('IEL')
-  )
-
-  const makeAdminUrl = (tail: string, query: Record<string, string> = {}) => {
-    let url = UrlUtils.join(runtimeConfig.baseUrlAdminLegacy, '#', tail)
-    url = UrlUtils.addQuery(url, query)
-    return url
+  /**
+   * Called when the event parameters page is updated
+   * @param event
+   */
+  const onEventParamsUpdated = (event: {'start': string, 'end': string}) => {
+    query.value = event
   }
   }
+
+  const unwatch = watch(url, (newUrl: string | null) => {
+    emit('urlUpdate', newUrl)
+  })
+  onUnmounted(() => {
+    unwatch()
+  })
 </script>
 </script>

+ 0 - 1
components/Ui/Input/Number.vue

@@ -96,7 +96,6 @@ const emitUpdate = () => {
  * Setup min and max values at the input level
  * Setup min and max values at the input level
  */
  */
 onMounted(() => {
 onMounted(() => {
-  console.log(input.value)
   const inputElement = input.value.$el.querySelector('input')
   const inputElement = input.value.$el.querySelector('input')
   if (props.min !== null) {
   if (props.min !== null) {
     inputElement.min = props.min
     inputElement.min = props.min

+ 0 - 0
composables/utils/useAbilityUtils.ts


+ 14 - 0
composables/utils/useAdminUrl.ts

@@ -0,0 +1,14 @@
+import UrlUtils from "~/services/utils/urlUtils";
+
+export const useAdminUrl = () => {
+    const runtimeConfig = useRuntimeConfig()
+
+    const makeAdminUrl = (tail: string, query: Record<string, string> = {}): string => {
+        const baseUrl = runtimeConfig.baseUrlAdminLegacy ?? runtimeConfig.public.baseUrlAdminLegacy
+        let url = UrlUtils.join(baseUrl, '#', tail)
+        url = UrlUtils.addQuery(url, query)
+        return url
+    }
+
+    return { makeAdminUrl }
+}

+ 1 - 1
lang/fr.json

@@ -347,7 +347,7 @@
   "previous_step": "Étape précédente",
   "previous_step": "Étape précédente",
   "add_any_type_material": "Ajoutez tout type de matériel ou de documents tels que des partitions à votre parc de matériel",
   "add_any_type_material": "Ajoutez tout type de matériel ou de documents tels que des partitions à votre parc de matériel",
   "a_materiel": "Un matériel",
   "a_materiel": "Un matériel",
-  "sen_email_letter": "Envoyez un email, un courrier, ou un SMS aux personnes de votre carnet d'adresses",
+  "send_email_letter": "Envoyez un email, un courrier, ou un SMS aux personnes de votre carnet d'adresses",
   "a_correspondence": "Une correspondance",
   "a_correspondence": "Une correspondance",
   "add_an_event_course": "Ajoutez un évènement, un cours, une prestation pédagogique, un examen... à votre planning",
   "add_an_event_course": "Ajoutez un évènement, un cours, une prestation pédagogique, un examen... à votre planning",
   "an_event": "Un évènement",
   "an_event": "Un évènement",