codevdesign 1.0.36 → 1.0.38

package/composants/csqcModaleSaisie.vue

@@ -1,95 +1,97 @@
-<template>
-  <csqcDialogue
-    ref="modale"
-    :titre="titre"
-    activator="supprimer"
-    v-bind="$attrs"
-    :largeur="largeur"
-    @ok="confirmer"
-    @annuler="annuler"
-  >
-    <v-form
-      ref="form"
-      @submit.prevent
-    >
-      <v-row>
-        <v-col
-          cols="12"
-          class="pa-0 ma-0"
-        >
-          <span v-html="texte"></span>
-        </v-col>
-      </v-row>
-
-      <v-row>
-        <v-col
-          cols="12"
-          class="pa-0 ma-0"
-        >
-          <v-text-field
-            v-if="!multiligne"
-            v-model="reponse"
-            autofocus
-            @keyup.enter="confirmer"
-          />
-          <v-textarea
-            v-if="multiligne"
-            v-model="reponse"
-            :rows="3"
-            autofocus
-          />
-        </v-col>
-      </v-row>
-    </v-form>
-  </csqcDialogue>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue'
-  import csqcDialogue from './csqcDialogue.vue'
-
-  const modale = ref<InstanceType<typeof csqcDialogue> | null>(null)
-  const utilisateurATermine = ref(false)
-  const reponse = ref<string | null>(null)
-  const texte = ref('')
-  const titre = ref('')
-  const largeur = ref('525px')
-  const multiligne = ref(false)
-
-  const ouvrir = async (
-    titreParam: string,
-    message: string,
-    multiligneParam: boolean = false,
-    largeurParam = '525px',
-  ) => {
-    texte.value = message
-    titre.value = titreParam
-    multiligne.value = multiligneParam
-    largeur.value = largeurParam
-    utilisateurATermine.value = false
-    modale.value?.ouvrir()
-
-    while (!utilisateurATermine.value) {
-      await new Promise(resolve => setTimeout(resolve, 100)) // Attendre 100ms
-    }
-
-    return reponse.value
-  }
-
-  const confirmer = (): void => {
-    utilisateurATermine.value = true
-    fermer()
-  }
-
-  const annuler = (): void => {
-    reponse.value = null
-    utilisateurATermine.value = true
-    fermer()
-  }
-
-  const fermer = (): void => {
-    modale.value?.fermer()
-  }
-
-  defineExpose({ ouvrir, fermer })
-</script>
+<template>
+  <csqcDialogue
+    ref="modale"
+    :titre="titre"
+    activator="supprimer"
+    v-bind="$attrs"
+    :largeur="largeur"
+    @ok="confirmer"
+    @annuler="annuler"
+  >
+    <v-form
+      ref="form"
+      @submit.prevent
+    >
+      <v-row>
+        <v-col
+          cols="12"
+          class="pa-0 ma-0"
+        >
+          <span v-html="texte"></span>
+        </v-col>
+      </v-row>
+
+      <v-row>
+        <v-col
+          cols="12"
+          class="pa-0 ma-0"
+        >
+          <v-text-field
+            v-if="!multiligne"
+            v-model="reponse"
+            autofocus
+            @keyup.enter="confirmer"
+          />
+          <v-textarea
+            v-if="multiligne"
+            v-model="reponse"
+            :rows="3"
+            autofocus
+          />
+        </v-col>
+      </v-row>
+    </v-form>
+  </csqcDialogue>
+</template>
+
+<script lang="ts" setup>
+  import { ref } from 'vue'
+  import csqcDialogue from './csqcDialogue.vue'
+
+  const modale = ref<InstanceType<typeof csqcDialogue> | null>(null)
+  const utilisateurATermine = ref(false)
+  const reponse = ref<string | null>(null)
+  const texte = ref('')
+  const titre = ref('')
+  const largeur = ref('525px')
+  const multiligne = ref(false)
+
+  const ouvrir = async (
+    titreParam: string,
+    message: string,
+    valeurDefaut: string | null = null,
+    multiligneParam: boolean = false,
+    largeurParam = '525px',
+  ) => {
+    texte.value = message
+    titre.value = titreParam
+    reponse.value = valeurDefaut
+    multiligne.value = multiligneParam
+    largeur.value = largeurParam
+    utilisateurATermine.value = false
+    modale.value?.ouvrir()
+
+    while (!utilisateurATermine.value) {
+      await new Promise(resolve => setTimeout(resolve, 100)) // Attendre 100ms
+    }
+
+    return reponse.value
+  }
+
+  const confirmer = (): void => {
+    utilisateurATermine.value = true
+    fermer()
+  }
+
+  const annuler = (): void => {
+    reponse.value = null
+    utilisateurATermine.value = true
+    fermer()
+  }
+
+  const fermer = (): void => {
+    modale.value?.fermer()
+  }
+
+  defineExpose({ ouvrir, fermer })
+</script>

package/composants/csqcOptionSwitch.vue

@@ -1,120 +1,120 @@
-<template>
-  <div>
-    <v-row dense>
-      <v-col
-        cols="9"
-        md="8"
-        lg="6"
-        class="d-flex align-end"
-      >
-        <div class="labelSwitchSiSwitchApres">{{ texte }}</div>
-      </v-col>
-      <v-col
-        cols="2"
-        class="d-flex align-end justify-end"
-      >
-        <v-switch
-          v-model="maValeur"
-          :disabled="desactiver"
-          density="compact"
-          inset
-          v-bind="$attrs"
-          hide-details
-          @update:model-value="sauvegarder"
-        />
-      </v-col>
-    </v-row>
-    <v-row dense>
-      <v-col
-        cols="9"
-        md="8"
-      >
-        <span v-html="texteDetaille"></span>
-      </v-col>
-    </v-row>
-  </div>
-</template>
-<script setup lang="ts">
-  import { ref, watch, onMounted, type PropType } from 'vue'
-
-  // Définition des props
-  const props = defineProps({
-    valeurInverse: {
-      type: Boolean,
-      default: false,
-    },
-    desactiver: {
-      type: Boolean,
-      default: false,
-    },
-    modelValue: {
-      type: Boolean,
-      required: true,
-    },
-    texte: {
-      type: String,
-      required: true,
-    },
-    texteDetaille: {
-      type: String,
-      required: true,
-    },
-  })
-
-  // Définition de l'événement
-  const emit = defineEmits(['update:modelValue'])
-
-  // Référence pour la valeur interne
-  const maValeur = ref<boolean>(false)
-
-  // Montée du composant
-  onMounted(() => {
-    if (props.valeurInverse) {
-      maValeur.value = !props.modelValue
-    } else {
-      maValeur.value = props.modelValue
-    }
-  })
-
-  // Watcher pour suivre les changements de la prop 'value'
-  watch(
-    () => props.modelValue,
-    newValue => {
-      if (props.valeurInverse) {
-        maValeur.value = !newValue
-      } else {
-        maValeur.value = newValue
-      }
-    },
-  )
-
-  watch(
-    () => props.valeurInverse,
-    newValue => {
-      if (props.valeurInverse) {
-        maValeur.value = newValue
-      } else {
-        maValeur.value = !newValue
-      }
-    },
-  )
-
-  // Méthode pour sauvegarder la valeur
-  const sauvegarder = () => {
-    if (props.valeurInverse) {
-      emit('update:modelValue', !maValeur.value)
-    } else {
-      emit('update:modelValue', maValeur.value)
-    }
-  }
-</script>
-
-<style lang="css" scoped>
-  .labelSwitchSiSwitchApres {
-    font-weight: bold;
-    margin-top: 25px;
-  }
-  .v-switch {
-    margin-bottom: -10px; /* aligner le switch avec son texte*/
-  }
-</style>
+<template>
+  <div>
+    <v-row dense>
+      <v-col
+        cols="9"
+        md="8"
+        lg="6"
+        class="d-flex align-end"
+      >
+        <div class="labelSwitchSiSwitchApres">{{ texte }}</div>
+      </v-col>
+      <v-col
+        cols="2"
+        class="d-flex align-end justify-end"
+      >
+        <v-switch
+          v-model="maValeur"
+          :disabled="desactiver"
+          density="compact"
+          inset
+          v-bind="$attrs"
+          hide-details
+          @update:model-value="sauvegarder"
+        />
+      </v-col>
+    </v-row>
+    <v-row dense>
+      <v-col
+        cols="9"
+        md="8"
+      >
+        <span v-html="texteDetaille"></span>
+      </v-col>
+    </v-row>
+  </div>
+</template>
+<script setup lang="ts">
+  import { ref, watch, onMounted, type PropType } from 'vue'
+
+  // Définition des props
+  const props = defineProps({
+    valeurInverse: {
+      type: Boolean,
+      default: false,
+    },
+    desactiver: {
+      type: Boolean,
+      default: false,
+    },
+    modelValue: {
+      type: Boolean,
+      required: true,
+    },
+    texte: {
+      type: String,
+      required: true,
+    },
+    texteDetaille: {
+      type: String,
+      required: true,
+    },
+  })
+
+  // Définition de l'événement
+  const emit = defineEmits(['update:modelValue'])
+
+  // Référence pour la valeur interne
+  const maValeur = ref<boolean>(false)
+
+  // Montée du composant
+  onMounted(() => {
+    if (props.valeurInverse) {
+      maValeur.value = !props.modelValue
+    } else {
+      maValeur.value = props.modelValue
+    }
+  })
+
+  // Watcher pour suivre les changements de la prop 'value'
+  watch(
+    () => props.modelValue,
+    newValue => {
+      if (props.valeurInverse) {
+        maValeur.value = !newValue
+      } else {
+        maValeur.value = newValue
+      }
+    },
+  )
+
+  watch(
+    () => props.valeurInverse,
+    newValue => {
+      if (props.valeurInverse) {
+        maValeur.value = newValue
+      } else {
+        maValeur.value = !newValue
+      }
+    },
+  )
+
+  // Méthode pour sauvegarder la valeur
+  const sauvegarder = () => {
+    if (props.valeurInverse) {
+      emit('update:modelValue', !maValeur.value)
+    } else {
+      emit('update:modelValue', maValeur.value)
+    }
+  }
+</script>
+
+<style lang="css" scoped>
+  .labelSwitchSiSwitchApres {
+    font-weight: bold;
+    margin-top: 25px;
+  }
+  .v-switch {
+    margin-bottom: -10px; /* aligner le switch avec son texte*/
+  }
+</style>