codevdesign 1.0.9 → 1.0.10

package/composants/csqcRechercheUtilisateur.vue

@@ -1,197 +1,197 @@
-<template>
-  <div>
-    <v-autocomplete
-      v-model="selection"
-      v-model:search="search"
-      :items="items"
-      :loading="chargementInterne"
-      density="compact"
-      :hide-no-data="!doitAfficherAucunResultat"
-      :no-data-text="$t('csqc.csqcRechercheUtilisateur.aucunResultat')"
-      :item-title="formatterUtilisateur"
-      item-value="id"
-      :placeholder="$t('csqc.csqcRechercheUtilisateur.placeholderRechercheUtilisateur')"
-      return-object
-      autofocus
-      auto-select-first
-      variant="outlined"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { ref, watch, computed } from 'vue'
-  import { useI18n } from 'vue-i18n'
-  import appAxios from '../outils/appAxios'
-  import type { EmployeMinsLsCodev } from '../modeles/employeMinsLsCodev'
-
-  const props = defineProps<{
-    matriculeDefaut?: string | null
-    chargement?: boolean
-    urlBase: string
-  }>()
-
-  const emit = defineEmits<{
-    (e: 'selection', value: string | null): void
-    (e: 'selectionPlus', utilisateur: EmployeMinsLsCodev | null): void
-    (e: 'erreur', message: string): void
-  }>()
-
-  const { t } = useI18n({ useScope: 'global' })
-
-  /** État interne */
-  const selection = ref<EmployeMinsLsCodev | null>(null)
-  const utilisateurs = ref<EmployeMinsLsCodev[]>([])
-  const search = ref<string>('')
-  const erreur = ref<string | null>(null)
-
-  /** Charge interne : on combine le chargement externe (prop) et l’interne */
-  const chargementInterne = ref(false)
-  const chargementEffectif = computed(() => props.chargement === true || chargementInterne.value)
-
-  /** Items sécurisés pour l’autocomplete */
-  const items = computed<EmployeMinsLsCodev[]>(() => (Array.isArray(utilisateurs.value) ? utilisateurs.value : []))
-
-  /** Cache clé→liste (toujours des arrays valides) */
-  const cache = ref<Record<string, EmployeMinsLsCodev[]>>({})
-
-  /** Détection d’un terme valide (limite les calls) */
-  const estTermeValide = (terme?: string): boolean => !!terme && terme.trim().length >= 4 && !terme.includes('(')
-
-  /** Affichage “aucun résultat” contrôlé */
-  const doitAfficherAucunResultat = computed(
-    () => estTermeValide(search.value) && !chargementEffectif.value && items.value.length === 0,
-  )
-
-  /** Formattage d’un employé en ligne lisible */
-  const formatterUtilisateur = (item: EmployeMinsLsCodev): string => {
-    const lieu = [item.numeroLieuPrincipal, item.nomLieuPrincipal].filter(Boolean).join('-')
-    const corps = [item.corpsEmploiPrincipal, item.corpsEmploiPrincipalDescription].filter(Boolean).join('-')
-    return `${item.prenom} ${item.nom} (${item.matricule}), ${item.courrielProfessionnel}${lieu ? `, ${lieu}` : ''}${corps ? `, ${corps}` : ''}`
-  }
-
-  /** Type guard: on s’assure qu’on a bien un tableau d’employés */
-  function isEmployeArray(x: unknown): x is EmployeMinsLsCodev[] {
-    return (
-      Array.isArray(x) && x.every(u => u && typeof u === 'object' && 'prenom' in u && 'nom' in u && 'matricule' in u)
-    )
-  }
-
-  /** Réinitialise proprement la liste + émet une erreur optionnelle */
-  function safeClearUsers(msg?: string) {
-    utilisateurs.value = []
-    if (msg) {
-      erreur.value = msg
-      emit('erreur', msg)
-    }
-  }
-
-  /** Anti-race condition: on ne retient le résultat que si l’ID correspond */
-  let lastQueryId = 0
-
-  async function rechercherUtilisateurs(terme?: string) {
-    if (!estTermeValide(terme)) {
-      utilisateurs.value = []
-      return
-    }
-
-    const queryId = ++lastQueryId
-    const termeLower = terme!.toLowerCase()
-
-    // Cache prefix-match: on prend la plus longue clé qui matche le début
-    const cachedKey = Object.keys(cache.value)
-      .filter(k => termeLower.startsWith(k))
-      .sort((a, b) => b.length - a.length)[0]
-
-    if (cachedKey) {
-      const cached = cache.value[cachedKey]
-      if (isEmployeArray(cached)) {
-        // Filtre côté client pour les affiner
-        const tl = termeLower
-        utilisateurs.value = cached.filter(user => formatterUtilisateur(user).toLowerCase().includes(tl))
-        return
-      } else {
-        // Cache corrompu (théorique)
-        delete cache.value[cachedKey]
-      }
-    }
-
-    try {
-      chargementInterne.value = true
-      const url = `${props.urlBase}/api/ComposantUI/Utilisateurs/${encodeURIComponent(terme as string)}`
-      const reponse = await appAxios.getAxios().get<unknown>(url)
-      const data = (reponse as any)?.data ?? reponse
-
-      if (queryId !== lastQueryId) {
-        // Une requête plus récente est arrivée, on ignore
-        return
-      }
-
-      if (!isEmployeArray(data)) {
-        // Probable HTML/redirect login/erreur
-        safeClearUsers(t('csqc.csqcRechercheUtilisateur.erreur'))
-        return
-      }
-
-      utilisateurs.value = data
-      cache.value[termeLower] = data
-    } catch (e: unknown) {
-      let message = t('csqc.csqcRechercheUtilisateur.erreur')
-      if (e instanceof Error) message = e.message
-      else if (typeof e === 'string') message = e
-      safeClearUsers(message)
-    } finally {
-      chargementInterne.value = false
-    }
-  }
-
-  /** Debounce recherche */
-  let timer: number | undefined
-  watch(
-    search,
-    terme => {
-      if (chargementEffectif.value) return
-      window.clearTimeout(timer)
-      timer = window.setTimeout(() => rechercherUtilisateurs(terme), 250)
-    },
-    { flush: 'post' },
-  )
-
-  /** Émettre la sélection (email & objet complet) */
-  watch(selection, utilisateur => {
-    emit('selection', utilisateur?.courrielProfessionnel ?? null)
-    emit('selectionPlus', utilisateur ?? null)
-  })
-
-  /** Préchargement par matricule par défaut */
-  watch(
-    () => props.matriculeDefaut,
-    async (nv, ov) => {
-      // Si vide / nul → on nettoie
-      if (!nv || nv.trim() === '') {
-        selection.value = null
-        search.value = ''
-        utilisateurs.value = []
-        return
-      }
-
-      // Si la même valeur est déjà sélectionnée → rien à faire
-      if (selection.value?.matricule === nv) return
-
-      // Recherche par matricule par défaut
-      await rechercherUtilisateurs(nv)
-      if (utilisateurs.value.length > 0) {
-        const utilisateur = utilisateurs.value.find(u => u.matricule === nv) ?? null
-        if (utilisateur) {
-          search.value = formatterUtilisateur(utilisateur)
-          selection.value = utilisateur
-        } else {
-          // Pas trouvé → reset “propre”
-          selection.value = null
-          search.value = nv // ou ''
-        }
-      }
-    },
-    { immediate: true },
-  )
-</script>
+<template>
+  <div>
+    <v-autocomplete
+      v-model="selection"
+      v-model:search="search"
+      :items="items"
+      :loading="chargementInterne"
+      density="compact"
+      :hide-no-data="!doitAfficherAucunResultat"
+      :no-data-text="$t('csqc.csqcRechercheUtilisateur.aucunResultat')"
+      :item-title="formatterUtilisateur"
+      item-value="id"
+      :placeholder="$t('csqc.csqcRechercheUtilisateur.placeholderRechercheUtilisateur')"
+      return-object
+      autofocus
+      auto-select-first
+      variant="outlined"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { ref, watch, computed } from 'vue'
+  import { useI18n } from 'vue-i18n'
+  import appAxios from '../../outils/appAxios'
+  import type { EmployeMinsLsCodev } from '../modeles/employeMinsLsCodev'
+
+  const props = defineProps<{
+    matriculeDefaut?: string | null
+    chargement?: boolean
+    urlBase: string
+  }>()
+
+  const emit = defineEmits<{
+    (e: 'selection', value: string | null): void
+    (e: 'selectionPlus', utilisateur: EmployeMinsLsCodev | null): void
+    (e: 'erreur', message: string): void
+  }>()
+
+  const { t } = useI18n({ useScope: 'global' })
+
+  /** État interne */
+  const selection = ref<EmployeMinsLsCodev | null>(null)
+  const utilisateurs = ref<EmployeMinsLsCodev[]>([])
+  const search = ref<string>('')
+  const erreur = ref<string | null>(null)
+
+  /** Charge interne : on combine le chargement externe (prop) et l’interne */
+  const chargementInterne = ref(false)
+  const chargementEffectif = computed(() => props.chargement === true || chargementInterne.value)
+
+  /** Items sécurisés pour l’autocomplete */
+  const items = computed<EmployeMinsLsCodev[]>(() => (Array.isArray(utilisateurs.value) ? utilisateurs.value : []))
+
+  /** Cache clé→liste (toujours des arrays valides) */
+  const cache = ref<Record<string, EmployeMinsLsCodev[]>>({})
+
+  /** Détection d’un terme valide (limite les calls) */
+  const estTermeValide = (terme?: string): boolean => !!terme && terme.trim().length >= 4 && !terme.includes('(')
+
+  /** Affichage “aucun résultat” contrôlé */
+  const doitAfficherAucunResultat = computed(
+    () => estTermeValide(search.value) && !chargementEffectif.value && items.value.length === 0,
+  )
+
+  /** Formattage d’un employé en ligne lisible */
+  const formatterUtilisateur = (item: EmployeMinsLsCodev): string => {
+    const lieu = [item.numeroLieuPrincipal, item.nomLieuPrincipal].filter(Boolean).join('-')
+    const corps = [item.corpsEmploiPrincipal, item.corpsEmploiPrincipalDescription].filter(Boolean).join('-')
+    return `${item.prenom} ${item.nom} (${item.matricule}), ${item.courrielProfessionnel}${lieu ? `, ${lieu}` : ''}${corps ? `, ${corps}` : ''}`
+  }
+
+  /** Type guard: on s’assure qu’on a bien un tableau d’employés */
+  function isEmployeArray(x: unknown): x is EmployeMinsLsCodev[] {
+    return (
+      Array.isArray(x) && x.every(u => u && typeof u === 'object' && 'prenom' in u && 'nom' in u && 'matricule' in u)
+    )
+  }
+
+  /** Réinitialise proprement la liste + émet une erreur optionnelle */
+  function safeClearUsers(msg?: string) {
+    utilisateurs.value = []
+    if (msg) {
+      erreur.value = msg
+      emit('erreur', msg)
+    }
+  }
+
+  /** Anti-race condition: on ne retient le résultat que si l’ID correspond */
+  let lastQueryId = 0
+
+  async function rechercherUtilisateurs(terme?: string) {
+    if (!estTermeValide(terme)) {
+      utilisateurs.value = []
+      return
+    }
+
+    const queryId = ++lastQueryId
+    const termeLower = terme!.toLowerCase()
+
+    // Cache prefix-match: on prend la plus longue clé qui matche le début
+    const cachedKey = Object.keys(cache.value)
+      .filter(k => termeLower.startsWith(k))
+      .sort((a, b) => b.length - a.length)[0]
+
+    if (cachedKey) {
+      const cached = cache.value[cachedKey]
+      if (isEmployeArray(cached)) {
+        // Filtre côté client pour les affiner
+        const tl = termeLower
+        utilisateurs.value = cached.filter(user => formatterUtilisateur(user).toLowerCase().includes(tl))
+        return
+      } else {
+        // Cache corrompu (théorique)
+        delete cache.value[cachedKey]
+      }
+    }
+
+    try {
+      chargementInterne.value = true
+      const url = `${props.urlBase}/api/ComposantUI/Utilisateurs/${encodeURIComponent(terme as string)}`
+      const reponse = await appAxios.getAxios().get<unknown>(url)
+      const data = (reponse as any)?.data ?? reponse
+
+      if (queryId !== lastQueryId) {
+        // Une requête plus récente est arrivée, on ignore
+        return
+      }
+
+      if (!isEmployeArray(data)) {
+        // Probable HTML/redirect login/erreur
+        safeClearUsers(t('csqc.csqcRechercheUtilisateur.erreur'))
+        return
+      }
+
+      utilisateurs.value = data
+      cache.value[termeLower] = data
+    } catch (e: unknown) {
+      let message = t('csqc.csqcRechercheUtilisateur.erreur')
+      if (e instanceof Error) message = e.message
+      else if (typeof e === 'string') message = e
+      safeClearUsers(message)
+    } finally {
+      chargementInterne.value = false
+    }
+  }
+
+  /** Debounce recherche */
+  let timer: number | undefined
+  watch(
+    search,
+    terme => {
+      if (chargementEffectif.value) return
+      window.clearTimeout(timer)
+      timer = window.setTimeout(() => rechercherUtilisateurs(terme), 250)
+    },
+    { flush: 'post' },
+  )
+
+  /** Émettre la sélection (email & objet complet) */
+  watch(selection, utilisateur => {
+    emit('selection', utilisateur?.courrielProfessionnel ?? null)
+    emit('selectionPlus', utilisateur ?? null)
+  })
+
+  /** Préchargement par matricule par défaut */
+  watch(
+    () => props.matriculeDefaut,
+    async (nv, ov) => {
+      // Si vide / nul → on nettoie
+      if (!nv || nv.trim() === '') {
+        selection.value = null
+        search.value = ''
+        utilisateurs.value = []
+        return
+      }
+
+      // Si la même valeur est déjà sélectionnée → rien à faire
+      if (selection.value?.matricule === nv) return
+
+      // Recherche par matricule par défaut
+      await rechercherUtilisateurs(nv)
+      if (utilisateurs.value.length > 0) {
+        const utilisateur = utilisateurs.value.find(u => u.matricule === nv) ?? null
+        if (utilisateur) {
+          search.value = formatterUtilisateur(utilisateur)
+          selection.value = utilisateur
+        } else {
+          // Pas trouvé → reset “propre”
+          selection.value = null
+          search.value = nv // ou ''
+        }
+      }
+    },
+    { immediate: true },
+  )
+</script>

package/index.ts

@@ -1,74 +1,73 @@
-import csqcAlerteErreur from './composants/csqcAlerteErreur.vue'
-import csqcDialogue from './composants/csqcDialogue.vue'
-import csqcOptionSwitch from './composants/csqcOptionSwitch.vue'
-import csqcRecherche from './composants/csqcRecherche.vue'
-import csqcSnackbar from './composants/csqcSnackbar.vue'
-import csqcTiroir from './composants/csqcTiroir.vue'
-import pivEntete from './composants/gabarit/pivEntete.vue'
-import pivFooter from './composants/gabarit/pivPiedPage.vue'
-import csqcMenu from './composants/gabarit/csqcMenu.vue'
-import csqcConfirmation from './composants/csqcConfirmation.vue'
-import csqcSaisie from './composants/csqcModaleSaisie.vue'
-import csqcDate from './composants/csqcDate.vue'
-import csqcTable from './composants/csqcTable/csqcTable.vue'
-import csqcCodeBudgetaire from './composants/csqcCodeBudgetaireGenerique.vue'
-import csqcChaise from './composants/csqcChaise/chaiseConteneur.vue'
-import csqcAide from './composants/csqcAide.vue'
-import csqcEntete from './composants/csqcEntete.vue'
-import csqcTexteBilingue from './composants/csqcTexteBilingue.vue'
-// @ts-expect-error TS7016
-import csqcEditeurTexteRiche from './composants/csqcEditeurTexteRiche.vue'
-import csqcImportCSV from './composants/csqcImportCSV.vue'
-import csqcRechercheUtilisateur from './composants/csqcRechercheUtilisateur.vue'
-import validateurs from './composants/validateurs'
-
-// modèles
-import NotificationGabaritDefaut from './modeles/notificationGabaritDefaut'
-import modeleSnackbar from './modeles/composants/snackbar'
-import modeleDatatableColonne from './modeles/composants/datatableColonne'
-import apiReponse from './modeles/apiReponse'
-import data from './modeles/data'
-import response from './modeles/response'
-
-// i18n
-import csqcEn from './locales/en.json'
-import csqcFr from './locales/fr.json'
-
-// outils
-import csqcRafraichisseurToken from './outils/rafraichisseurToken'
-import csqcAppAxios from './outils/appAxios'
-
-export {
-  csqcFr,
-  csqcEn,
-  csqcAlerteErreur,
-  csqcDialogue,
-  csqcConfirmation,
-  csqcSaisie,
-  csqcDate,
-  csqcOptionSwitch,
-  csqcRecherche,
-  csqcSnackbar,
-  csqcTable,
-  csqcTiroir,
-  csqcMenu,
-  csqcCodeBudgetaire,
-  csqcChaise,
-  pivFooter,
-  pivEntete,
-  csqcAide,
-  csqcEntete,
-  csqcTexteBilingue,
-  csqcEditeurTexteRiche,
-  validateurs,
-  csqcImportCSV,
-  csqcRechercheUtilisateur,
-  modeleSnackbar,
-  modeleDatatableColonne as colonne,
-  apiReponse,
-  data,
-  response,
-  NotificationGabaritDefaut,
-  csqcAppAxios,
-  csqcRafraichisseurToken,
-}
+import csqcAlerteErreur from './composants/csqcAlerteErreur.vue'
+import csqcDialogue from './composants/csqcDialogue.vue'
+import csqcOptionSwitch from './composants/csqcOptionSwitch.vue'
+import csqcRecherche from './composants/csqcRecherche.vue'
+import csqcSnackbar from './composants/csqcSnackbar.vue'
+import csqcTiroir from './composants/csqcTiroir.vue'
+import pivEntete from './composants/gabarit/pivEntete.vue'
+import pivFooter from './composants/gabarit/pivPiedPage.vue'
+import csqcMenu from './composants/gabarit/csqcMenu.vue'
+import csqcConfirmation from './composants/csqcConfirmation.vue'
+import csqcSaisie from './composants/csqcModaleSaisie.vue'
+import csqcDate from './composants/csqcDate.vue'
+import csqcTable from './composants/csqcTable/csqcTable.vue'
+import csqcCodeBudgetaire from './composants/csqcCodeBudgetaireGenerique.vue'
+import csqcChaise from './composants/csqcChaise/chaiseConteneur.vue'
+import csqcAide from './composants/csqcAide.vue'
+import csqcEntete from './composants/csqcEntete.vue'
+import csqcTexteBilingue from './composants/csqcTexteBilingue.vue'
+// @ts-expect-error TS7016
+import csqcEditeurTexteRiche from './composants/csqcEditeurTexteRiche.vue'
+import csqcImportCSV from './composants/csqcImportCSV.vue'
+import csqcRechercheUtilisateur from './composants/csqcRechercheUtilisateur.vue'
+import validateurs from './composants/validateurs'
+
+// modèles
+import NotificationGabaritDefaut from './modeles/notificationGabaritDefaut'
+import modeleSnackbar from './modeles/composants/snackbar'
+import modeleDatatableColonne from './modeles/composants/datatableColonne'
+import apiReponse from './modeles/apiReponse'
+import data from './modeles/data'
+import response from './modeles/response'
+
+// outils
+import csqcRafraichisseurToken from './outils/rafraichisseurToken'
+
+// i18n
+import csqcEn from './locales/en.json'
+import csqcFr from './locales/fr.json'
+
+
+export {
+  csqcFr,
+  csqcEn,
+  csqcAlerteErreur,
+  csqcDialogue,
+  csqcConfirmation,
+  csqcSaisie,
+  csqcDate,
+  csqcOptionSwitch,
+  csqcRecherche,
+  csqcSnackbar,
+  csqcTable,
+  csqcTiroir,
+  csqcMenu,
+  csqcCodeBudgetaire,
+  csqcChaise,
+  pivFooter,
+  pivEntete,
+  csqcAide,
+  csqcEntete,
+  csqcTexteBilingue,
+  csqcEditeurTexteRiche,
+  validateurs,
+  csqcImportCSV,
+  csqcRechercheUtilisateur,
+  csqcRafraichisseurToken,
+  modeleSnackbar,
+  modeleDatatableColonne as colonne,
+  apiReponse,
+  data,
+  response,
+  NotificationGabaritDefaut,
+}

package/package.json

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

package/outils/appAxios.ts

@@ -1,116 +0,0 @@
-import axios, { type AxiosInstance, type AxiosError, type AxiosResponse } from 'axios'
-import { useAppStore } from '@/store/appStore'
-import router from '@/router'
-
-type ApiReponse<T = unknown> =
-  // Succès
-  | {
-    succes: true
-    resultat: T
-    status?: number
-    message?: string
-    location?: string
-    parametres?: unknown
-    [k: string]: unknown
-  }
-  // Échec (le backend peut quand même renvoyer resultat null/absent)
-  | {
-    succes: false
-    resultat?: unknown
-    status?: number
-    message?: string
-    location?: string
-    parametres?: unknown
-    [k: string]: unknown
-  }
-
-let client: AxiosInstance | null = null
-let cachedBaseUrl = '' // pour éviter de régénérer une instance axios si rien n’a changé
-
-export default {
-  clearCache: false,
-
-  getAxios(): AxiosInstance {
-    // Singleton + clearCache
-    if (client && !this.clearCache) return client
-
-    const appStore = useAppStore()
-
-    const rawUrl = appStore.modeleCharger
-      ? appStore.appModele!.urlBase
-      : window.location.origin + import.meta.env.BASE_URL
-
-    const urlBase = rawUrl.endsWith('/') ? rawUrl.slice(0, -1) : rawUrl
-
-    // Si la base URL n'a pas changé et qu'on a déjà un client, on le renvoie
-    if (client && cachedBaseUrl === urlBase && !this.clearCache) return client
-    cachedBaseUrl = urlBase
-
-    client = axios.create({
-      baseURL: `${urlBase}/api`,
-      withCredentials: true,
-      timeout: 30_000,
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-        'X-Requested-With': 'XMLHttpRequest',
-      },
-      // validateStatus: (s) => s >= 200 && s < 300, // défaut axios
-    })
-
-    client.interceptors.response.use(
-      (response: AxiosResponse<any>) => {
-        const data = response.data
-
-        // Détection de la réponse { succes, resultat }
-        if (data && typeof data === 'object' && 'succes' in data) {
-          const env = data as ApiReponse
-          return env.succes === true ? env.resultat : Promise.reject(env)
-        }
-
-        // Sinon, renvoyer data si présent, sinon la réponse complète
-        return data ?? response
-      },
-
-      (error: AxiosError<any>) => {
-        const status = error.response?.status
-        const payload = error.response?.data?.resultat ?? { message: error.message }
-
-        // 403 / 404
-        if (status === 403 || status === 404) {
-          try {
-            appStore.lancerErreur(payload)
-            if (router.currentRoute.value.name !== '403') {
-              router.push({ name: '403' })
-            }
-          } catch {
-            // no-op
-          }
-          return Promise.reject(payload)
-        }
-
-        // gérer les autres 4XX ici
-
-        // Log minimal
-        console.error('HTTP error', {
-          status,
-          url: error.config?.url,
-          payload,
-        })
-
-        // Remonter l’erreur normalisée dans appstore
-        try {
-          if (payload?.resultat) appStore.lancerErreur(payload)
-          else if (payload) appStore.lancerErreur(payload)
-        } catch {
-          // no-op
-        }
-        return Promise.reject(payload)
-      },
-    )
-
-    // reset le flag si on l’avait utilisé pour forcer la recréation de l'instance
-    this.clearCache = false
-    return client
-  },
-}