codevdesign 0.0.27 → 0.0.28

package/composants/csqcAide.vue

@@ -0,0 +1,40 @@
+<template>
+  <v-menu
+    v-if="!isXs"
+    location="top start"
+  >
+    <template #activator="{ props: activatorProps }">
+      <v-icon
+        v-bind="activatorProps"
+        :size="small ? 'small' : 'default'"
+        start
+        color="grisMoyen"
+        :style="monstyle"
+      >
+        mdi-help-circle
+      </v-icon>
+    </template>
+
+    <v-card style="max-width: 1000px">
+      <v-card-text class="pa-6">
+        <span v-html="props.aide"></span>
+      </v-card-text>
+    </v-card>
+  </v-menu>
+</template>
+
+<script setup lang="ts">
+  import { computed } from 'vue'
+  import { useDisplay } from 'vuetify'
+
+  const props = defineProps<{
+    aide: string
+    monstyle?: string
+    small?: boolean
+  }>()
+
+  const { name } = useDisplay()
+
+  // on évite d'afficher sur les écrans extra-smalls
+  const isXs = computed(() => name.value === 'xs')
+</script>

package/composants/csqcOptionSwitch.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="pt-4 pb-4 pl-4">
+  <div>
     <v-row dense>
       <v-col
         cols="9"
@@ -15,6 +15,8 @@
         <v-switch
           v-model="maValeur"
           :disabled="desactiver"
+          :density="densite"
+          :inset="inset"
           @change="sauvegarder"
           hide-details
         />
@@ -31,7 +33,7 @@
   </div>
 </template>
 <script setup lang="ts">
-  import { ref, watch, defineProps, defineEmits, onMounted } from 'vue'
+  import { ref, watch, defineProps, defineEmits, onMounted, type PropType } from 'vue'
 
   // Définition des props
   const props = defineProps({
@@ -43,6 +45,10 @@
       type: Boolean,
       default: false,
     },
+    inset: {
+      type: Boolean,
+      default: true,
+    },
     modelValue: {
       type: Boolean,
       required: true,
@@ -55,6 +61,7 @@
       type: String,
       required: true,
     },
+    densite: { type: String as PropType<'default' | 'comfortable' | 'compact'>, default: 'compact' },
   })
 
   // Définition de l'événement

package/composants/csqcRecherche.vue

@@ -48,6 +48,7 @@
           v-if="rechercheAvancee"
           :readonly="chargement || desactiver"
           expand-icon=""
+          @update:modelValue="onPanelChange"
         >
           <v-expansion-panel
             flat
@@ -108,6 +109,7 @@
 
   const emit = defineEmits<{
     (e: 'update:recherche', recherche: string): void
+    (e: 'panneau:etat', isOpen: boolean): void //  événement pour l'ouverture/fermeture du panneau
   }>()
 
   // Création d'une variable locale pour gérer la recherche
@@ -125,6 +127,16 @@
   watch(rechercheLocale, nouvelleValeur => {
     emit('update:recherche', nouvelleValeur!)
   })
+
+  // Fonction pour émettre l'événement d'ouverture/fermeture du panneau
+  const onPanelChange = (val: unknown) => {
+    if (typeof val === 'string' || typeof val === 'number' || val === null) {
+      const isOpen = val !== null && val !== ''
+      emit('panneau:etat', isOpen)
+    } else {
+      emit('panneau:etat', false)
+    }
+  }
 </script>
 
 <style lang="css">

package/index.ts

@@ -10,6 +10,7 @@ import csqcMenu from './composants/gabarit/csqcMenu.vue'
 import csqcConfirmation from './composants/csqcConfirmation.vue'
 import csqcTable from './composants/csqcTable/csqcTable.vue'
 import csqcChaise from './composants/csqcChaise/chaiseConteneur.vue'
+import csqcAide from './composants/csqcAide.vue'
 
 import Utilisateur from './modeles/utilisateur'
 import Unite from './modeles/unite'
@@ -43,6 +44,7 @@ export {
   csqcChaise,
   pivFooter,
   pivEntete,
+  csqcAide,
   Utilisateur,
   Unite,
   Intervention,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codevdesign",
-  "version": "0.0.27",
+  "version": "0.0.28",
   "description": "Composants Vuetify 3 pour les projets Codev",
   "files": [
     "./**/*.vue",