codevdesign 1.0.50 → 1.0.51

package/composants/csqcAide.vue

@@ -1,55 +1,55 @@
-<template>
-  <v-menu
-    v-if="!isXs"
-    :open-on-hover="hover"
-    location="top start"
-  >
-    <template #activator="{ props: activatorProps }">
-      <slot name="icone">
-        <v-icon
-          v-bind="activatorProps"
-          :style="styleCss"
-          :size="grosseurEffective"
-          color="grisMoyen"
-          icon="mdi-help-circle"
-          @click.stop.prevent
-        />
-      </slot>
-    </template>
-
-    <slot name="carte">
-      <v-expand-transition>
-        <v-card style="max-width: 1000px">
-          <v-card-text class="pa-6">
-            <span v-html="props.aide"></span>
-          </v-card-text> </v-card
-      ></v-expand-transition>
-    </slot>
-  </v-menu>
-</template>
-
-<script setup lang="ts">
-  import { computed } from 'vue'
-  import { useDisplay } from 'vuetify'
-
-  const props = withDefaults(
-    defineProps<{
-      aide: string
-      grosseur?: 'default' | 'small' | 'large' | 'x-large' | 'x-small'
-      hover?: boolean
-      styleCss?: string
-    }>(),
-    {
-      grosseur: 'default',
-      hover: false,
-      styleCss: '',
-    },
-  )
-  const grosseurEffective = computed(() => {
-    const val = props.grosseur
-    return val && val.trim() !== '' ? val : 'default'
-  })
-
-  const { name } = useDisplay()
-  const isXs = computed(() => name.value === 'xs')
-</script>
+<template>
+  <v-menu
+    v-if="!isXs"
+    :open-on-hover="hover"
+    location="top start"
+  >
+    <template #activator="{ props: activatorProps }">
+      <slot name="icone">
+        <v-icon
+          v-bind="activatorProps"
+          :style="styleCss"
+          :size="grosseurEffective"
+          color="grisMoyen"
+          icon="mdi-help-circle"
+          @click.stop.prevent
+        />
+      </slot>
+    </template>
+
+    <slot name="carte">
+      <v-expand-transition>
+        <v-card style="max-width: 1000px">
+          <v-card-text class="pa-6">
+            <span v-html="props.aide"></span>
+          </v-card-text> </v-card
+      ></v-expand-transition>
+    </slot>
+  </v-menu>
+</template>
+
+<script setup lang="ts">
+  import { computed } from 'vue'
+  import { useDisplay } from 'vuetify'
+
+  const props = withDefaults(
+    defineProps<{
+      aide: string
+      grosseur?: 'default' | 'small' | 'large' | 'x-large' | 'x-small'
+      hover?: boolean
+      styleCss?: string
+    }>(),
+    {
+      grosseur: 'default',
+      hover: false,
+      styleCss: '',
+    },
+  )
+  const grosseurEffective = computed(() => {
+    const val = props.grosseur
+    return val && val.trim() !== '' ? val : 'default'
+  })
+
+  const { name } = useDisplay()
+  const isXs = computed(() => name.value === 'xs')
+</script>

package/composants/csqcAlerteErreur.vue

@@ -1,87 +1,87 @@
-<template>
-  <div
-    v-if="afficher && erreur"
-    :style="retournerStyle"
-  >
-    <v-alert
-      v-model="afficher"
-      class="mb-0 text-center hyphen_auto"
-      color="#CB381F"
-      closable
-      v-bind="$attrs"
-      @click:close="fermer"
-    >
-      <span v-html="erreur" /><br />
-      <span
-        id="messageSoutien"
-        style="color: darkgray"
-        >{{ messageSoutien }}</span
-      >
-    </v-alert>
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import { computed, ref, watch } from 'vue'
-  import { useDisplay } from 'vuetify'
-  import { useI18n } from 'vue-i18n'
-
-  // Définir les props avec les types
-  const props = defineProps({
-    message: {
-      type: String,
-      required: true,
-    },
-    messageSoutien: {
-      type: String,
-      required: true,
-    },
-  })
-  const { name: displayName } = useDisplay()
-  const emit = defineEmits(['fermer:alerte'])
-  const { t } = useI18n({ useScope: 'global' })
-
-  const fermer = (): void => {
-    afficher.value = false
-    emit('fermer:alerte')
-  }
-
-  const afficher = ref(false)
-
-  // Watcher pour réagir aux changements du message
-  watch(
-    () => props.message,
-    nouveauMessage => {
-      if (nouveauMessage && nouveauMessage !== '') {
-        afficher.value = true
-      }
-    },
-  )
-
-  // Computed pour l'erreur, venant du store
-  const erreur = computed(() => {
-    if (props.message == null || props.message == '') return null
-
-    if (props.message.indexOf('erreurs.') === 0) return t(props.message)
-
-    return props.message
-  })
-
-  // Méthode computed pour le style en fonction du breakpoint
-  const retournerStyle = computed(() => {
-    if (displayName.value === 'xs') {
-      return 'top: 0px; right:1%;width: 98%;position: fixed; z-index: 2000;'
-    }
-    return 'top: 20px; right: 10%; width: 80%; position: fixed; z-index: 2000; margin: 0 auto;'
-  })
-</script>
-
-<style lang="css" scoped>
-  .error {
-    padding-top: 0.7rem;
-    padding-bottom: 0.7rem;
-  }
-  :deep(.blanc) {
-    color: white;
-  }
-</style>
+<template>
+  <div
+    v-if="afficher && erreur"
+    :style="retournerStyle"
+  >
+    <v-alert
+      v-model="afficher"
+      class="mb-0 text-center hyphen_auto"
+      color="#CB381F"
+      closable
+      v-bind="$attrs"
+      @click:close="fermer"
+    >
+      <span v-html="erreur" /><br />
+      <span
+        id="messageSoutien"
+        style="color: darkgray"
+        >{{ messageSoutien }}</span
+      >
+    </v-alert>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { computed, ref, watch } from 'vue'
+  import { useDisplay } from 'vuetify'
+  import { useI18n } from 'vue-i18n'
+
+  // Définir les props avec les types
+  const props = defineProps({
+    message: {
+      type: String,
+      required: true,
+    },
+    messageSoutien: {
+      type: String,
+      required: true,
+    },
+  })
+  const { name: displayName } = useDisplay()
+  const emit = defineEmits(['fermer:alerte'])
+  const { t } = useI18n({ useScope: 'global' })
+
+  const fermer = (): void => {
+    afficher.value = false
+    emit('fermer:alerte')
+  }
+
+  const afficher = ref(false)
+
+  // Watcher pour réagir aux changements du message
+  watch(
+    () => props.message,
+    nouveauMessage => {
+      if (nouveauMessage && nouveauMessage !== '') {
+        afficher.value = true
+      }
+    },
+  )
+
+  // Computed pour l'erreur, venant du store
+  const erreur = computed(() => {
+    if (props.message == null || props.message == '') return null
+
+    if (props.message.indexOf('erreurs.') === 0) return t(props.message)
+
+    return props.message
+  })
+
+  // Méthode computed pour le style en fonction du breakpoint
+  const retournerStyle = computed(() => {
+    if (displayName.value === 'xs') {
+      return 'top: 0px; right:1%;width: 98%;position: fixed; z-index: 2000;'
+    }
+    return 'top: 20px; right: 10%; width: 80%; position: fixed; z-index: 2000; margin: 0 auto;'
+  })
+</script>
+
+<style lang="css" scoped>
+  .error {
+    padding-top: 0.7rem;
+    padding-bottom: 0.7rem;
+  }
+  :deep(.blanc) {
+    color: white;
+  }
+</style>

package/composants/csqcChaise/chaiseItem.vue

@@ -1,54 +1,54 @@
-<template>
-  <div>
-    <v-list-item-title>{{ nomUnite }}</v-list-item-title>
-    <v-list-item-subtitle v-if="getPreference != ''">
-      {{ getPreference }}
-    </v-list-item-subtitle>
-    <v-list-item-subtitle
-      v-if="getPreference == ''"
-      class="messageErreurChaiseItem"
-    >
-      {{ $t('csqc.message.chaiseSelection') }}
-    </v-list-item-subtitle>
-  </div>
-</template>
-<script lang="ts" setup>
-  import { computed } from 'vue'
-
-  // Définition des props
-  const props = defineProps<{
-    uniteId: number
-    preferences: { chaiseId: number }[]
-    dictChaisesReleve: Record<number, { id: number; nom: string }[]>
-    unites: { id: number; nom: string }[]
-  }>()
-
-  const nomUnite = computed(() => {
-    if (!props.uniteId || !props.unites?.length) {
-      return ''
-    }
-
-    const unite = props.unites.find(u => u.id == props.uniteId)
-    return unite?.nom || ''
-  })
-
-  const getPreference = computed(() => {
-    const chaises = props.dictChaisesReleve?.[props.uniteId] ?? []
-    const prefs = props.preferences ?? []
-
-    for (const chaise of chaises) {
-      if (prefs.some(p => p.chaiseId === chaise.id)) {
-        return chaise.nom
-      }
-    }
-
-    return ''
-  })
-</script>
-
-<style scoped>
-  .messageErreurChaiseItem {
-    color: red !important;
-    font-style: italic;
-  }
-</style>
+<template>
+  <div>
+    <v-list-item-title>{{ nomUnite }}</v-list-item-title>
+    <v-list-item-subtitle v-if="getPreference != ''">
+      {{ getPreference }}
+    </v-list-item-subtitle>
+    <v-list-item-subtitle
+      v-if="getPreference == ''"
+      class="messageErreurChaiseItem"
+    >
+      {{ $t('csqc.message.chaiseSelection') }}
+    </v-list-item-subtitle>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { computed } from 'vue'
+
+  // Définition des props
+  const props = defineProps<{
+    uniteId: number
+    preferences: { chaiseId: number }[]
+    dictChaisesReleve: Record<number, { id: number; nom: string }[]>
+    unites: { id: number; nom: string }[]
+  }>()
+
+  const nomUnite = computed(() => {
+    if (!props.uniteId || !props.unites?.length) {
+      return ''
+    }
+
+    const unite = props.unites.find(u => u.id == props.uniteId)
+    return unite?.nom || ''
+  })
+
+  const getPreference = computed(() => {
+    const chaises = props.dictChaisesReleve?.[props.uniteId] ?? []
+    const prefs = props.preferences ?? []
+
+    for (const chaise of chaises) {
+      if (prefs.some(p => p.chaiseId === chaise.id)) {
+        return chaise.nom
+      }
+    }
+
+    return ''
+  })
+</script>
+
+<style scoped>
+  .messageErreurChaiseItem {
+    color: red !important;
+    font-style: italic;
+  }
+</style>

package/composants/csqcConfirmation.vue

@@ -1,75 +1,75 @@
-<template>
-  <csqcDialogue
-    ref="modale"
-    :titre="props.titre"
-    :operation-en-cours="operationEnCours"
-    activator="supprimer"
-    v-bind="$attrs"
-    :largeur="props.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-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(false)
-  const texte = ref('')
-  const modeAlerte = ref(false)
-
-  const props = defineProps({
-    operationEnCours: { type: Boolean, default: false },
-    titre: { type: String, default: '' },
-    largeur: { type: String, default: '525px' },
-  })
-
-  const ouvrir = async (message: string, modeAlerteParam: boolean = false) => {
-    texte.value = message
-    modeAlerte.value = modeAlerteParam
-    utilisateurATermine.value = false
-    modale.value?.ouvrir()
-
-    while (!utilisateurATermine.value) {
-      await new Promise(resolve => setTimeout(resolve, 100)) // Attendre 100ms
-    }
-
-    return reponse.value
-  }
-
-  const confirmer = (): void => {
-    reponse.value = true
-    utilisateurATermine.value = true
-
-    if (modeAlerte.value) fermer()
-  }
-
-  const annuler = (): void => {
-    reponse.value = false
-    utilisateurATermine.value = true
-    fermer()
-  }
-
-  const fermer = (): void => {
-    modale.value?.fermer()
-  }
-
-  defineExpose({ ouvrir, fermer })
-</script>
+<template>
+  <csqcDialogue
+    ref="modale"
+    :titre="props.titre"
+    :operation-en-cours="operationEnCours"
+    activator="supprimer"
+    v-bind="$attrs"
+    :largeur="props.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-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(false)
+  const texte = ref('')
+  const modeAlerte = ref(false)
+
+  const props = defineProps({
+    operationEnCours: { type: Boolean, default: false },
+    titre: { type: String, default: '' },
+    largeur: { type: String, default: '525px' },
+  })
+
+  const ouvrir = async (message: string, modeAlerteParam: boolean = false) => {
+    texte.value = message
+    modeAlerte.value = modeAlerteParam
+    utilisateurATermine.value = false
+    modale.value?.ouvrir()
+
+    while (!utilisateurATermine.value) {
+      await new Promise(resolve => setTimeout(resolve, 100)) // Attendre 100ms
+    }
+
+    return reponse.value
+  }
+
+  const confirmer = (): void => {
+    reponse.value = true
+    utilisateurATermine.value = true
+
+    if (modeAlerte.value) fermer()
+  }
+
+  const annuler = (): void => {
+    reponse.value = false
+    utilisateurATermine.value = true
+    fermer()
+  }
+
+  const fermer = (): void => {
+    modale.value?.fermer()
+  }
+
+  defineExpose({ ouvrir, fermer })
+</script>

package/composants/csqcDate.vue

@@ -1,57 +1,58 @@
-<template>
-  <v-date-input
-    v-model="dateValeur"
-    v-bind="$attrs"
-    input-format="yyyy-MM-dd"
-    variant="outlined"
-    prepend-icon=""
-    prepend-inner-icon="$calendar"
-    density="comfortable"
-    @update:model-value="formatDate"
-  ></v-date-input>
-</template>
-
-<script setup lang="ts">
-  import { ref, watch } from 'vue'
-  import { VDateInput } from 'vuetify/labs/VDateInput'
-
-  const props = withDefaults(
-    defineProps<{
-      modelValue: string | Date | null
-    }>(),
-    {},
-  )
-
-  const emit = defineEmits(['update:modelValue'])
-  const dateValeur = ref<Date | string | null>(props.modelValue)
-
-  const formatDate = (date: Date | string | null) => {
-    if (date == null) {
-      emit('update:modelValue', null)
-      return
-    }
-
-    if (typeof date === 'string') {
-      emit('update:modelValue', props.modelValue)
-      return
-    }
-
-    //Transformer la date en string
-    const d = new Date(date)
-    const yyyy = d.getFullYear()
-    const mm = String(d.getMonth() + 1).padStart(2, '0')
-    const dd = String(d.getDate()).padStart(2, '0')
-    const formatte = `${yyyy}-${mm}-${dd}`
-    dateValeur.value = formatte
-
-    emit('update:modelValue', dateValeur.value)
-  }
-
-  // Synchronise les props externes avec l'état interne
-  watch(
-    () => props.modelValue,
-    nouvelle => {
-      dateValeur.value = nouvelle
-    },
-  )
-</script>
+<template>
+  <v-date-input
+    v-model="dateValeur"
+    v-bind="$attrs"
+    input-format="yyyy-MM-dd"
+    variant="outlined"
+    prepend-icon=""
+    prepend-inner-icon="$calendar"
+    density="comfortable"
+    @update:model-value="formatDate"
+  ></v-date-input>
+</template>
+
+<script setup lang="ts">
+  import { ref, watch } from 'vue'
+  import { VDateInput } from 'vuetify/labs/VDateInput'
+
+  const props = withDefaults(
+    defineProps<{
+      modelValue: string | Date | null
+    }>(),
+    {},
+  )
+
+  const emit = defineEmits(['update:modelValue'])
+  const dateValeur = ref<Date | string | null>(props.modelValue)
+
+  const formatDate = (date: Date | string | null) => {
+    if (date == null) {
+      dateValeur.value = null
+      emit('update:modelValue', null)
+      return
+    }
+
+    if (typeof date === 'string') {
+      dateValeur.value = date
+      emit('update:modelValue', date)
+      return
+    }
+
+    const d = new Date(date)
+    const yyyy = d.getFullYear()
+    const mm = String(d.getMonth() + 1).padStart(2, '0')
+    const dd = String(d.getDate()).padStart(2, '0')
+    const formatte = `${yyyy}-${mm}-${dd}`
+
+    dateValeur.value = formatte
+    emit('update:modelValue', formatte)
+  }
+
+  // Synchronise les props externes avec l'état interne
+  watch(
+    () => props.modelValue,
+    nouvelle => {
+      dateValeur.value = nouvelle
+    },
+  )
+</script>