codevdesign 1.0.69 → 1.0.71

package/composants/csqcTable/csqcTable.vue

@@ -458,7 +458,7 @@
     val => {
       listeInterne.value = [...val]
     },
-    { immediate: true },
+    { immediate: true, deep: true },
   )
 
   // Init/destroy Sortable si la prop change en cours de vie du composant

package/composants/csqcTiroir.vue

@@ -1,156 +1,195 @@
-<template>
-  <v-navigation-drawer
-    v-model="visible"
-    location="right"
-    temporary
-    v-bind="$attrs"
-    :width="grosseurTiroir"
-    class="pa-0 elevation-2 csqc-ligneBleue"
-    :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 iconeHover"
-        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 text-h5>{{ 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"
-        >
-          {{ 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>
-
-<style>
-  .csqc-ligneBleue {
-    border-left: 30px #095797 solid !important;
-  }
-</style>
+<template>
+  <v-navigation-drawer
+    v-model="visible"
+    location="right"
+    temporary
+    v-bind="$attrs"
+    :width="grosseurTiroir"
+    class="pa-0 elevation-2 csqc-ligneBleue"
+    :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 iconeHover"
+        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 text-h5>{{ 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"
+        >
+          {{ props.btnOkTexte ? props.btnOkTexte : $t('csqc.bouton.ok') }}
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-navigation-drawer>
+  <Teleport to="body">
+    <v-fab
+      v-if="retourEnHaut && afficherBoutonHaut"
+      style="position: fixed; bottom: 24px; right: 24px; z-index: 2000"
+      elevation="8"
+      color="primary"
+      icon="mdi-arrow-up"
+      @click="allerEnHaut"
+    />
+  </Teleport>
+</template>
+<script lang="ts" setup>
+  import { ref, computed, watch, nextTick } 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,
+    },
+    retourEnHaut: {
+      type: Boolean,
+      default: true,
+    },
+  })
+
+  // Déclaration des événements
+  const emit = defineEmits(['fermer', 'ok'])
+
+  // Back to top
+  const afficherBoutonHaut = ref(false)
+  let conteneurScroll: Element | null = null
+
+  function onScroll() {
+    afficherBoutonHaut.value = (conteneurScroll?.scrollTop ?? 0) > 350
+  }
+
+  function allerEnHaut() {
+    conteneurScroll?.scrollTo({ top: 0, behavior: 'smooth' })
+  }
+
+  watch(visible, async val => {
+    if (!props.retourEnHaut) return
+    if (val) {
+      await nextTick()
+      conteneurScroll = document.querySelector('.v-navigation-drawer--active .v-navigation-drawer__content')
+      conteneurScroll?.addEventListener('scroll', onScroll)
+    } else {
+      conteneurScroll?.removeEventListener('scroll', onScroll)
+      conteneurScroll = null
+      afficherBoutonHaut.value = false
+    }
+  })
+
+  // 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>
+
+<style>
+  .csqc-ligneBleue {
+    border-left: 30px #095797 solid !important;
+  }
+</style>

package/outils/rafraichisseurToken.ts

@@ -1,245 +1,245 @@
-class RafraichisseurToken {
-  private intervalleEnSecondes = 15
-  private secondesAvantExpirationTokenPourRafraichir = 20
-  private skewSeconds = 5 // marge anti-derives d'horloge
-  private popupAffiche = false
-  private timerId: number | null = null
-  private nomTemoin = 'csqc_jeton_secure_expiration'
-  private urlPortail = ''
-  private refreshPromise: Promise<void> | null = null
-
-  // Lance une seule fois
-  public async demarrer(nomTemoin: string | null, urlPortail: string): Promise<void> {
-    urlPortail = urlPortail.replace(/\/+$/, '')
-    if (nomTemoin == null || nomTemoin === '') nomTemoin = 'csqc_jeton_secure_expiration'
-    this.nomTemoin = nomTemoin as string
-    this.urlPortail = urlPortail
-    await this.verifierJeton(nomTemoin as string, urlPortail)
-    if (this.timerId != null) return
-    this.timerId = window.setInterval(() => {
-      this.verifierJeton(nomTemoin as string, urlPortail)
-    }, this.intervalleEnSecondes * 1000)
-  }
-
-  public attendreRefreshSiNecessaire(force = false): Promise<void> {
-    if (this.refreshPromise) return this.refreshPromise
-    if (force || !this.estJetonValide(this.nomTemoin)) {
-      this.refreshPromise = this.rafraichir(this.nomTemoin, this.urlPortail).finally(() => {
-        this.refreshPromise = null
-      })
-      return this.refreshPromise
-    }
-    return Promise.resolve()
-  }
-
-  // Permet d'arrêter le timer (ex: au logout / destroy)
-  public arreter(): void {
-    if (this.timerId != null) {
-      clearInterval(this.timerId)
-      this.timerId = null
-    }
-  }
-
-  public existeJeton = (nomTemoin: string) => {
-    return this.estJetonValide(nomTemoin)
-  }
-
-  private async verifierJeton(nomTemoin: string, urlPortail: string): Promise<void> {
-    if (this.popupAffiche) return
-
-    if (!this.estJetonValide(nomTemoin)) {
-      if (!this.refreshPromise) {
-        this.refreshPromise = this.rafraichir(nomTemoin, urlPortail).finally(() => {
-          this.refreshPromise = null
-        })
-      }
-    }
-  }
-
-  private estJetonValide(nomTemoin: string): boolean {
-    if (this.popupAffiche || !nomTemoin) return true //On fait semblant que c'est valide pour ne pas provoquer un autre affichage du popup.
-
-    const tokenEncode = this.lireCookie(nomTemoin)
-    if (!tokenEncode) {
-      return false
-    }
-
-    let token: any
-    try {
-      token = this.parseJwt(tokenEncode)
-    } catch {
-      return false
-    }
-
-    const exp = Number(token?.exp)
-    if (!Number.isFinite(exp)) {
-      return false
-    }
-
-    const now = Math.floor(Date.now() / 1000)
-    const refreshAt = exp - this.secondesAvantExpirationTokenPourRafraichir - this.skewSeconds
-    if (now >= refreshAt) {
-      return false
-    }
-
-    return true
-  }
-
-  private async rafraichir(nomCookie: string, urlPortail: string): Promise<void> {
-    if (!nomCookie) return
-    //console.log('[RafraichisseurToken] rafraichir() appelé')
-    if (urlPortail == null || urlPortail == '') return
-    this.popupAffiche = true // bloquer tout nouveau tick pendant le refresh
-    const url = this.getRefreshUrl(urlPortail)
-    const controller = new AbortController()
-    const timeout = setTimeout(() => controller.abort(), 10_000)
-
-    try {
-      //Première tentative sans iframe, pour la majorité des cas.
-      const resp = await fetch(url, {
-        method: 'POST',
-        credentials: 'include',
-        headers: { Accept: 'application/json' },
-        redirect: 'manual',
-        signal: controller.signal,
-      })
-
-      // redirection vers Azure AD → session expirée, l'iframe ne peut pas compléter le flow OIDC cross-site
-      //console.log('[RafraichisseurToken] fetch réponse type:', resp.type, 'status:', resp.status)
-      if (resp.type === 'opaqueredirect' || resp.status === 302) {
-        this.estDeconnecteAzure(urlPortail)
-        return
-      }
-
-      // OK ou No Content: le cookie devrait être réécrit
-      if (resp.status === 200 || resp.status === 204) {
-        const jeton = this.lireCookie(nomCookie)
-        if (!jeton) {
-          //   console.log('[RafraichisseurToken] 200 mais cookie absent → iframe')
-          this.rafraichirParIframe(nomCookie, urlPortail)
-        } else {
-          this.popupAffiche = false // succès, reprendre la surveillance
-        }
-        return
-      }
-
-      // non auth / expiré (401, 419) + IIS timeout (440)
-      if (resp.status === 401 || resp.status === 419 || resp.status === 440) {
-        //   console.log('[RafraichisseurToken] statut auth → iframe')
-        this.rafraichirParIframe(nomCookie, urlPortail)
-        return
-      }
-
-      console.warn('Rafraichisseur token: statut inattendu', resp.status)
-      this.popupAffiche = false // statut inattendu, permettre un retry
-    } catch (err: any) {
-      if (err?.name === 'AbortError') console.warn('RafraichisseurToken timeout')
-      else console.error('Erreur rafraichisseur de token', err)
-      this.reloadSiErreurReseau()
-    } finally {
-      clearTimeout(timeout)
-    }
-  }
-
-  private rafraichirParIframe(nomCookie: string, urlPortail: string): void {
-    this.popupAffiche = true // bloquer le timer pendant que l'iframe tente l'auth
-    let iframe = document.createElement('iframe')
-    const url = this.getRefreshUrl(urlPortail)
-    iframe.src = `${url}?urlRetour=${encodeURI(window.location.href)}`
-    iframe.id = 'idRafrToken'
-    iframe.style.display = 'none'
-    document.body.appendChild(iframe)
-
-    const iframeTimeout = setTimeout(() => {
-      iframe.onload = null
-      iframe.src = 'about:blank'
-      iframe.remove()
-      this.popupAffiche = false
-      console.warn('[RafraichisseurToken] iframe timeout — popupAffiche réinitialisé')
-    }, 15_000)
-
-    iframe.onload = () => {
-      clearTimeout(iframeTimeout)
-      iframe.onload = null // empêcher les re-entrées sur les redirects OIDC internes
-      const nomSecure = nomCookie.replace('_expiration', '')
-      const cookieAVerifier = nomSecure !== nomCookie ? nomSecure : nomCookie
-      const jeton = this.lireCookie(cookieAVerifier)
-      if (jeton == null || jeton === '') {
-        this.estDeconnecteAzure(urlPortail)
-      } else {
-        this.popupAffiche = false // cookie recréé avec succès, reprendre la surveillance
-      }
-
-      iframe.src = 'about:blank' // stopper les navigations internes
-      iframe.remove()
-    }
-  }
-
-  private estDeconnecteAzure(urlPortail: string): void {
-    //on envoie au portail, pas le choix
-    urlPortail = urlPortail.replace(/\/+$/, '')
-    const retour = encodeURI(window.location.href)
-    window.open(`${urlPortail}/home/SeConnecter?urlRetour=${retour}`, '_self')
-    return
-  }
-
-  public deconnecterPortail(urlPortail: string): void {
-    urlPortail = urlPortail.replace(/\/+$/, '')
-    window.location.replace(`${urlPortail}/deconnecte?urlRetour=${encodeURIComponent(window.location.href)}`)
-  }
-
-  private lireCookie(nom: string): string | null {
-    if (!document.cookie) return null
-    const cookies = document.cookie.split(';').map(c => c.trim())
-    for (const cookie of cookies) {
-      if (cookie.startsWith(`${nom}=`)) {
-        try {
-          return decodeURIComponent(cookie.substring(nom.length + 1))
-        } catch {
-          return cookie.substring(nom.length + 1)
-        }
-      }
-    }
-    return null
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  private parseJwt(token: string): any {
-    const parts = token.split('.')
-    const base64Url = parts[1]
-    if (!base64Url) throw new Error('Invalid JWT format')
-    const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/')
-    const jsonPayload = decodeURIComponent(
-      atob(base64)
-        .split('')
-        .map(c => `%${`00${c.charCodeAt(0).toString(16)}`.slice(-2)}`)
-        .join(''),
-    )
-    return JSON.parse(jsonPayload)
-  }
-
-  private reloadSiErreurReseau(): void {
-    const CLE = 'rafraichisseur_dernierReload'
-    //  console.log('[RafraichisseurToken] reload si erreur')
-    const maintenant = Date.now()
-    const dernierReload = Number(sessionStorage.getItem(CLE) ?? 0)
-    if (maintenant - dernierReload > 30_000) {
-      //  console.log('[RafraichisseurToken] Écriture sessionStorage:', CLE, maintenant)
-      sessionStorage.setItem(CLE, String(maintenant))
-
-      globalThis.location.reload()
-    } else {
-      this.popupAffiche = false
-    }
-  }
-
-  // URL refresh selon env (dev = proxy Vite ; prod = portail)
-  private getRefreshUrl(urlPortail: string): string {
-    if (import.meta.env.MODE === 'development') return '/portail-refresh'
-    return urlPortail + '/home/Refresh'
-  }
-}
-
-// Instance
-const rafraichisseurToken = new RafraichisseurToken()
-export default rafraichisseurToken
+class RafraichisseurToken {
+  private intervalleEnSecondes = 15
+  private secondesAvantExpirationTokenPourRafraichir = 20
+  private skewSeconds = 5 // marge anti-derives d'horloge
+  private popupAffiche = false
+  private timerId: number | null = null
+  private nomTemoin = 'csqc_jeton_secure_expiration'
+  private urlPortail = ''
+  private refreshPromise: Promise<void> | null = null
+
+  // Lance une seule fois
+  public async demarrer(nomTemoin: string | null, urlPortail: string): Promise<void> {
+    urlPortail = urlPortail.replace(/\/+$/, '')
+    if (nomTemoin == null || nomTemoin === '') nomTemoin = 'csqc_jeton_secure_expiration'
+    this.nomTemoin = nomTemoin as string
+    this.urlPortail = urlPortail
+    await this.verifierJeton(nomTemoin as string, urlPortail)
+    if (this.timerId != null) return
+    this.timerId = window.setInterval(() => {
+      this.verifierJeton(nomTemoin as string, urlPortail)
+    }, this.intervalleEnSecondes * 1000)
+  }
+
+  public attendreRefreshSiNecessaire(force = false): Promise<void> {
+    if (this.refreshPromise) return this.refreshPromise
+    if (force || !this.estJetonValide(this.nomTemoin)) {
+      this.refreshPromise = this.rafraichir(this.nomTemoin, this.urlPortail).finally(() => {
+        this.refreshPromise = null
+      })
+      return this.refreshPromise
+    }
+    return Promise.resolve()
+  }
+
+  // Permet d'arrêter le timer (ex: au logout / destroy)
+  public arreter(): void {
+    if (this.timerId != null) {
+      clearInterval(this.timerId)
+      this.timerId = null
+    }
+  }
+
+  public existeJeton = (nomTemoin: string) => {
+    return this.estJetonValide(nomTemoin)
+  }
+
+  private async verifierJeton(nomTemoin: string, urlPortail: string): Promise<void> {
+    if (this.popupAffiche) return
+
+    if (!this.estJetonValide(nomTemoin)) {
+      if (!this.refreshPromise) {
+        this.refreshPromise = this.rafraichir(nomTemoin, urlPortail).finally(() => {
+          this.refreshPromise = null
+        })
+      }
+    }
+  }
+
+  private estJetonValide(nomTemoin: string): boolean {
+    if (this.popupAffiche || !nomTemoin) return true //On fait semblant que c'est valide pour ne pas provoquer un autre affichage du popup.
+
+    const tokenEncode = this.lireCookie(nomTemoin)
+    if (!tokenEncode) {
+      return false
+    }
+
+    let token: any
+    try {
+      token = this.parseJwt(tokenEncode)
+    } catch {
+      return false
+    }
+
+    const exp = Number(token?.exp)
+    if (!Number.isFinite(exp)) {
+      return false
+    }
+
+    const now = Math.floor(Date.now() / 1000)
+    const refreshAt = exp - this.secondesAvantExpirationTokenPourRafraichir - this.skewSeconds
+    if (now >= refreshAt) {
+      return false
+    }
+
+    return true
+  }
+
+  private async rafraichir(nomCookie: string, urlPortail: string): Promise<void> {
+    if (!nomCookie) return
+    //console.log('[RafraichisseurToken] rafraichir() appelé')
+    if (urlPortail == null || urlPortail == '') return
+    this.popupAffiche = true // bloquer tout nouveau tick pendant le refresh
+    const url = this.getRefreshUrl(urlPortail)
+    const controller = new AbortController()
+    const timeout = setTimeout(() => controller.abort(), 10_000)
+
+    try {
+      //Première tentative sans iframe, pour la majorité des cas.
+      const resp = await fetch(url, {
+        method: 'POST',
+        credentials: 'include',
+        headers: { Accept: 'application/json' },
+        redirect: 'manual',
+        signal: controller.signal,
+      })
+
+      // redirection vers Azure AD → session expirée, l'iframe ne peut pas compléter le flow OIDC cross-site
+      //console.log('[RafraichisseurToken] fetch réponse type:', resp.type, 'status:', resp.status)
+      if (resp.type === 'opaqueredirect' || resp.status === 302) {
+        this.estDeconnecteAzure(urlPortail)
+        return
+      }
+
+      // OK ou No Content: le cookie devrait être réécrit
+      if (resp.status === 200 || resp.status === 204) {
+        const jeton = this.lireCookie(nomCookie)
+        if (!jeton) {
+          //   console.log('[RafraichisseurToken] 200 mais cookie absent → iframe')
+          this.rafraichirParIframe(nomCookie, urlPortail)
+        } else {
+          this.popupAffiche = false // succès, reprendre la surveillance
+        }
+        return
+      }
+
+      // non auth / expiré (401, 419) + IIS timeout (440)
+      if (resp.status === 401 || resp.status === 419 || resp.status === 440) {
+        //   console.log('[RafraichisseurToken] statut auth → iframe')
+        this.rafraichirParIframe(nomCookie, urlPortail)
+        return
+      }
+
+      console.warn('Rafraichisseur token: statut inattendu', resp.status)
+      this.popupAffiche = false // statut inattendu, permettre un retry
+    } catch (err: any) {
+      if (err?.name === 'AbortError') console.warn('RafraichisseurToken timeout')
+      else console.error('Erreur rafraichisseur de token', err)
+      this.reloadSiErreurReseau()
+    } finally {
+      clearTimeout(timeout)
+    }
+  }
+
+  private rafraichirParIframe(nomCookie: string, urlPortail: string): void {
+    this.popupAffiche = true // bloquer le timer pendant que l'iframe tente l'auth
+    let iframe = document.createElement('iframe')
+    const url = this.getRefreshUrl(urlPortail)
+    iframe.src = `${url}?urlRetour=${encodeURI(window.location.href)}`
+    iframe.id = 'idRafrToken'
+    iframe.style.display = 'none'
+    document.body.appendChild(iframe)
+
+    const iframeTimeout = setTimeout(() => {
+      iframe.onload = null
+      iframe.src = 'about:blank'
+      iframe.remove()
+      this.popupAffiche = false
+      console.warn('[RafraichisseurToken] iframe timeout — popupAffiche réinitialisé')
+    }, 15_000)
+
+    iframe.onload = () => {
+      clearTimeout(iframeTimeout)
+      iframe.onload = null // empêcher les re-entrées sur les redirects OIDC internes
+      const nomSecure = nomCookie.replace('_expiration', '')
+      const cookieAVerifier = nomSecure !== nomCookie ? nomSecure : nomCookie
+      const jeton = this.lireCookie(cookieAVerifier)
+      if (jeton == null || jeton === '') {
+        this.estDeconnecteAzure(urlPortail)
+      } else {
+        this.popupAffiche = false // cookie recréé avec succès, reprendre la surveillance
+      }
+
+      iframe.src = 'about:blank' // stopper les navigations internes
+      iframe.remove()
+    }
+  }
+
+  private estDeconnecteAzure(urlPortail: string): void {
+    //on envoie au portail, pas le choix
+    urlPortail = urlPortail.replace(/\/+$/, '')
+    const retour = encodeURI(window.location.href)
+    window.open(`${urlPortail}/home/SeConnecter?urlRetour=${retour}`, '_self')
+    return
+  }
+
+  public deconnecterPortail(urlPortail: string): void {
+    urlPortail = urlPortail.replace(/\/+$/, '')
+    window.location.replace(`${urlPortail}/deconnecte?urlRetour=${encodeURIComponent(window.location.href)}`)
+  }
+
+  private lireCookie(nom: string): string | null {
+    if (!document.cookie) return null
+    const cookies = document.cookie.split(';').map(c => c.trim())
+    for (const cookie of cookies) {
+      if (cookie.startsWith(`${nom}=`)) {
+        try {
+          return decodeURIComponent(cookie.substring(nom.length + 1))
+        } catch {
+          return cookie.substring(nom.length + 1)
+        }
+      }
+    }
+    return null
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  private parseJwt(token: string): any {
+    const parts = token.split('.')
+    const base64Url = parts[1]
+    if (!base64Url) throw new Error('Invalid JWT format')
+    const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/')
+    const jsonPayload = decodeURIComponent(
+      atob(base64)
+        .split('')
+        .map(c => `%${`00${c.charCodeAt(0).toString(16)}`.slice(-2)}`)
+        .join(''),
+    )
+    return JSON.parse(jsonPayload)
+  }
+
+  private reloadSiErreurReseau(): void {
+    const CLE = 'rafraichisseur_dernierReload'
+    //  console.log('[RafraichisseurToken] reload si erreur')
+    const maintenant = Date.now()
+    const dernierReload = Number(sessionStorage.getItem(CLE) ?? 0)
+    if (maintenant - dernierReload > 30_000) {
+      //  console.log('[RafraichisseurToken] Écriture sessionStorage:', CLE, maintenant)
+      sessionStorage.setItem(CLE, String(maintenant))
+
+      globalThis.location.reload()
+    } else {
+      this.popupAffiche = false
+    }
+  }
+
+  // URL refresh selon env (dev = proxy Vite ; prod = portail)
+  private getRefreshUrl(urlPortail: string): string {
+    if (import.meta.env.MODE === 'development') return '/portail-refresh'
+    return urlPortail + '/home/Refresh'
+  }
+}
+
+// Instance
+const rafraichisseurToken = new RafraichisseurToken()
+export default rafraichisseurToken

package/package.json

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