complete card component

components/Layout/Header/UniversalCreation/TypeCard.vue → components/Layout/Header/UniversalCreation/Card.vue

@@ -1,5 +1,11 @@
 <!--
   VCard proposant une option dans la boite de dialogue "Assistant de création"
+
+  La carte peut prendre en paramètres des options `to` et `href` :
+  Si `to` est défini et pas `href`, la carte mène simplement à un nouveau menu dans le wizard.
+  Si `href` est défini, et pas `to`, la carte se comporte comme un lien, et doit rediriger la page vers `href` au clic.
+  Enfin, si les deux sont définis, l'url est envoyée au composant parent pour être mémorisée, et la carte mène ensuite à
+  un nouveau menu dans le wizard, qui permettra d'affiner l'url, par exemple en lui ajoutant une query.
 -->
 
 <template>
@@ -8,8 +14,7 @@
     color=""
     flat
     border="solid 1px"
-    :href="link"
-    @click="$emit('typeClick', 2, type)"
+    @click="onClick"
   >
     <v-row no-gutters style="height: 100px">
       <v-col cols="3" class="flex-grow-0 flex-shrink-0 d-flex justify-center">
@@ -35,27 +40,48 @@
 
 <script setup lang="ts">
   const props = defineProps({
+    /**
+     * Target location in the wizard
+     */
+    to: {
+      type: String,
+      required: false
+    },
+    /**
+     * Target url
+     */
+    href: {
+      type: String,
+      required: false
+    },
+    /**
+     * Title displayed on the card
+     */
     title: {
       type: String,
       required: true
     },
+    /**
+     * Description displayed on the card
+     */
     textContent: {
       type: String,
       required: true
     },
+    /**
+     * Icon displayed on the card
+     */
     icon: {
       type: String,
       required: true
-    },
-    link: {
-      type: String,
-      required: false
-    },
-    type: {
-      type: String,
-      required: false
     }
   })
+
+  const emit = defineEmits(['click'])
+
+  const onClick = () => {
+    emit('click', props.to, props.link)
+  }
 </script>
 
 <style lang="scss" scoped>