codevdesign 0.0.12 → 0.0.14

package/composants/csqcTable/csqcTableExportExcel.vue

@@ -1,58 +1,58 @@
-<template>
-  <v-icon
-    right
-    color="grisMoyen"
-    @click="exportToXLSX"
-    icon="mdi-microsoft-excel"
-  >
-  </v-icon>
-</template>
-
-<script setup lang="ts">
-  import { utils, writeFileXLSX } from '@e965/xlsx'
-  import { defineProps, computed } from 'vue'
-
-  const props = defineProps<{
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    liste: any[]
-    nomFichier: string
-    chargementListe: boolean
-  }>()
-
-  // Extraction des clés uniques de tous les objets
-  const cleDynamique = computed(() => {
-    const keys = new Set<string>()
-
-    // Parcours tous les objets de la liste et ajoute leurs clés
-    props.liste.forEach(item => {
-      if (typeof item === 'object' && item !== null) {
-        Object.keys(item).forEach(key => keys.add(key))
-      }
-    })
-    return Array.from(keys)
-  })
-
-  // Fonction pour exporter les données en Excel
-  const exportToXLSX = () => {
-    if (!props.liste.length) {
-      console.warn('La liste est vide, exportation annulée.')
-      return
-    }
-
-    // Récupération des en-têtes depuis la fonction cleDynamique
-    const headers = cleDynamique.value
-
-    //  Construction des lignes en respectant l'ordre des en-têtes
-    const rows = props.liste.map(item => {
-      return headers.map(key => (key in item ? item[key] : '')) // Valeur ou vide si absente
-    })
-
-    //  Création des données Excel (en-têtes + lignes)
-    const data = [headers, ...rows]
-    //  Génération du fichier Excel
-    const ws = utils.aoa_to_sheet(data)
-    const wb = utils.book_new()
-    utils.book_append_sheet(wb, ws, '1')
-    writeFileXLSX(wb, `${props.nomFichier}.xlsx`)
-  }
-</script>
+<template>
+  <v-icon
+    right
+    color="grisMoyen"
+    @click="exportToXLSX"
+    icon="mdi-microsoft-excel"
+  >
+  </v-icon>
+</template>
+
+<script setup lang="ts">
+  import { utils, writeFileXLSX } from '@e965/xlsx'
+  import { defineProps, computed } from 'vue'
+
+  const props = defineProps<{
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    liste: any[]
+    nomFichier: string
+    chargementListe: boolean
+  }>()
+
+  // Extraction des clés uniques de tous les objets
+  const cleDynamique = computed(() => {
+    const keys = new Set<string>()
+
+    // Parcours tous les objets de la liste et ajoute leurs clés
+    props.liste.forEach(item => {
+      if (typeof item === 'object' && item !== null) {
+        Object.keys(item).forEach(key => keys.add(key))
+      }
+    })
+    return Array.from(keys)
+  })
+
+  // Fonction pour exporter les données en Excel
+  const exportToXLSX = () => {
+    if (!props.liste.length) {
+      console.warn('La liste est vide, exportation annulée.')
+      return
+    }
+
+    // Récupération des en-têtes depuis la fonction cleDynamique
+    const headers = cleDynamique.value
+
+    //  Construction des lignes en respectant l'ordre des en-têtes
+    const rows = props.liste.map(item => {
+      return headers.map(key => (key in item ? item[key] : '')) // Valeur ou vide si absente
+    })
+
+    //  Création des données Excel (en-têtes + lignes)
+    const data = [headers, ...rows]
+    //  Génération du fichier Excel
+    const ws = utils.aoa_to_sheet(data)
+    const wb = utils.book_new()
+    utils.book_append_sheet(wb, ws, '1')
+    writeFileXLSX(wb, `${props.nomFichier}.xlsx`)
+  }
+</script>

package/composants/csqcTiroir.vue

@@ -1,150 +1,150 @@
-<template>
-  <v-navigation-drawer
-    v-model="visible"
-    location="right"
-    temporary
-    class="pa-0 elevation-2"
-    :width="grosseurTiroir"
-    :persistent="persistant"
-    @keydown.esc="!persistant ? fermeture : ''"
-    @click:outside="!persistant ? fermeture : ''"
-  >
-    <v-card class="pa-0 ma-0 pl-8 pt-8">
-      <!-- Bouton en haut à droite -->
-      <v-btn
-        icon="mdi-close"
-        variant="text"
-        class="position-absolute couleurHover"
-        style="top: 5px; right: 5px"
-        @click="fermeture"
-      ></v-btn>
-
-      <v-card-title
-        class="pa-0 ma-0 pb-6 text-wrap"
-        style="font-size: 24px"
-      >
-        <slot name="titre"></slot>
-        <div class="headline">{{ titre }}</div>
-      </v-card-title>
-
-      <v-card-text class="pa-0 ma-0 pb-6 pr-6">
-        <v-container>
-          <slot></slot>
-          <slot name="content"></slot>
-        </v-container>
-      </v-card-text>
-      <v-card-actions class="my-2 d-flex justify-end pr-6 pb-5">
-        <slot name="actions"></slot>
-        <v-btn
-          v-if="btnAnnuler"
-          color="primary"
-          variant="text"
-          :loading="operationEnCours"
-          @click="fermeture"
-        >
-          {{ props.btnAnnulerTexte ? props.btnAnnulerTexte : $t('csqc.bouton.annuler') }}
-        </v-btn>
-
-        <v-btn
-          v-if="btnOk"
-          class="Gouttiere"
-          color="primary"
-          variant="flat"
-          :loading="operationEnCours"
-          :disabled="btnOkDesactiver || operationEnCours"
-          @click="okBouton"
-          outlined
-        >
-          {{ props.btnOkTexte ? props.btnOkTexte : $t('csqc.bouton.ok') }}
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-navigation-drawer>
-</template>
-<script lang="ts" setup>
-  import { ref, computed } from 'vue'
-  import { useDisplay } from 'vuetify'
-
-  const visible = ref(false)
-  const display = useDisplay()
-
-  // Déclaration des props
-  const props = defineProps({
-    titre: {
-      type: String,
-      default: '',
-      required: false,
-    },
-    btnAnnuler: {
-      type: Boolean,
-      default: true,
-      required: false,
-    },
-    btnOk: {
-      type: Boolean,
-      default: true,
-      required: false,
-    },
-    btnAnnulerTexte: {
-      type: String,
-      default: '',
-      required: false,
-    },
-    btnOkDesactiver: {
-      type: Boolean,
-      default: false,
-      required: false,
-    },
-    operationEnCours: { type: Boolean, default: false },
-    persistant: { type: Boolean, default: true },
-    btnOkTexte: {
-      type: String,
-      default: '',
-      required: false,
-    },
-  })
-
-  // Déclaration des événements
-  const emit = defineEmits(['fermer', 'ok'])
-
-  // Méthodes
-  const ouvrir = () => {
-    visible.value = true
-  }
-
-  const fermer = () => {
-    visible.value = false
-  }
-
-  const fermeture = () => {
-    emit('fermer')
-    fermer()
-  }
-
-  const okBouton = () => {
-    emit('ok')
-    fermer()
-  }
-
-  // Calcul des tailles du tiroir en fonction du breakpoint
-  const grosseurTiroir = computed(() => {
-    switch (display.name.value) {
-      case 'xs':
-        return ''
-      case 'sm':
-        return 0.95 * display.width.value
-      case 'md':
-        return 0.8 * display.width.value
-      case 'lg':
-        return 0.7 * display.width.value
-      case 'xl':
-        return 0.6 * display.width.value
-      case 'xxl':
-        return 0.5 * display.width.value
-      default:
-        return ''
-    }
-  })
-
-  defineExpose({ ouvrir, fermer })
-</script>
+<template>
+  <v-navigation-drawer
+    v-model="visible"
+    location="right"
+    temporary
+    class="pa-0 elevation-2"
+    :width="grosseurTiroir"
+    :persistent="persistant"
+    @keydown.esc="!persistant ? fermeture : ''"
+    @click:outside="!persistant ? fermeture : ''"
+  >
+    <v-card class="pa-0 ma-0 pl-8 pt-8">
+      <!-- Bouton en haut à droite -->
+      <v-btn
+        icon="mdi-close"
+        variant="text"
+        class="position-absolute couleurHover"
+        style="top: 5px; right: 5px"
+        @click="fermeture"
+      ></v-btn>
+
+      <v-card-title
+        class="pa-0 ma-0 pb-6 text-wrap"
+        style="font-size: 24px"
+      >
+        <slot name="titre"></slot>
+        <div class="headline">{{ titre }}</div>
+      </v-card-title>
+
+      <v-card-text class="pa-0 ma-0 pb-6 pr-6">
+        <v-container>
+          <slot></slot>
+          <slot name="content"></slot>
+        </v-container>
+      </v-card-text>
+      <v-card-actions class="my-2 d-flex justify-end pr-6 pb-5">
+        <slot name="actions"></slot>
+        <v-btn
+          v-if="btnAnnuler"
+          color="primary"
+          variant="text"
+          :loading="operationEnCours"
+          @click="fermeture"
+        >
+          {{ props.btnAnnulerTexte ? props.btnAnnulerTexte : $t('csqc.bouton.annuler') }}
+        </v-btn>
+
+        <v-btn
+          v-if="btnOk"
+          class="Gouttiere"
+          color="primary"
+          variant="flat"
+          :loading="operationEnCours"
+          :disabled="btnOkDesactiver || operationEnCours"
+          @click="okBouton"
+          outlined
+        >
+          {{ props.btnOkTexte ? props.btnOkTexte : $t('csqc.bouton.ok') }}
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-navigation-drawer>
+</template>
+<script lang="ts" setup>
+  import { ref, computed } from 'vue'
+  import { useDisplay } from 'vuetify'
+
+  const visible = ref(false)
+  const display = useDisplay()
+
+  // Déclaration des props
+  const props = defineProps({
+    titre: {
+      type: String,
+      default: '',
+      required: false,
+    },
+    btnAnnuler: {
+      type: Boolean,
+      default: true,
+      required: false,
+    },
+    btnOk: {
+      type: Boolean,
+      default: true,
+      required: false,
+    },
+    btnAnnulerTexte: {
+      type: String,
+      default: '',
+      required: false,
+    },
+    btnOkDesactiver: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
+    operationEnCours: { type: Boolean, default: false },
+    persistant: { type: Boolean, default: true },
+    btnOkTexte: {
+      type: String,
+      default: '',
+      required: false,
+    },
+  })
+
+  // Déclaration des événements
+  const emit = defineEmits(['fermer', 'ok'])
+
+  // Méthodes
+  const ouvrir = () => {
+    visible.value = true
+  }
+
+  const fermer = () => {
+    visible.value = false
+  }
+
+  const fermeture = () => {
+    emit('fermer')
+    fermer()
+  }
+
+  const okBouton = () => {
+    emit('ok')
+    fermer()
+  }
+
+  // Calcul des tailles du tiroir en fonction du breakpoint
+  const grosseurTiroir = computed(() => {
+    switch (display.name.value) {
+      case 'xs':
+        return ''
+      case 'sm':
+        return 0.95 * display.width.value
+      case 'md':
+        return 0.8 * display.width.value
+      case 'lg':
+        return 0.7 * display.width.value
+      case 'xl':
+        return 0.6 * display.width.value
+      case 'xxl':
+        return 0.5 * display.width.value
+      default:
+        return ''
+    }
+  })
+
+  defineExpose({ ouvrir, fermer })
+</script>