codevdesign 1.0.78 → 2.0.0

package/composants/csqcEntete.vue

@@ -85,7 +85,7 @@
     </v-row>
 
     <!-- Barre en bas -->
-    <div style="position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background-color: #808a9d" />
+    <div style="background-color: #808a9d; bottom: 0; height: 2px; left: 0; position: absolute; right: 0" />
   </v-app-bar>
 </template>
 
@@ -146,21 +146,21 @@
   }
   .titre-texte {
     color: var(--entete-texte, #223654);
+    max-width: 100%;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    max-width: 100%;
   }
   .soustitre-texte {
+    color: var(--entete-texte, #223654);
     display: block;
     font-size: 1rem;
     font-weight: normal;
-    color: var(--entete-texte, #223654);
   }
   .titre-bloc {
     display: inline-block;
-    vertical-align: middle;
     padding-left: 12px;
+    vertical-align: middle;
   }
   /* Couleur de l’icône (retour) + hover */
   .v-icon {
@@ -170,26 +170,26 @@
     filter: brightness(0.85);
   }
   .entete-ligne {
-    display: flex;
     align-items: center;
+    display: flex;
     flex-wrap: wrap;
-    width: 100%;
     gap: 8px;
+    width: 100%;
   }
 
   .entete-gauche {
-    display: flex;
     align-items: center;
-    min-width: 0; /* important pour éviter overflow */
+    display: flex;
     flex: 1;
+    min-width: 0; /* important pour éviter overflow */
   }
 
   .entete-droite {
-    display: flex;
     align-items: center;
+    display: flex;
+    flex-shrink: 0;
     gap: 12px;
     padding-right: 16px;
-    flex-shrink: 0;
   }
 
   @media (max-width: 600px) {
@@ -197,27 +197,27 @@
       width: 100%;
     }
     .entete-droite {
-      width: 100%;
-      padding-right: 8px;
-      padding-left: 0;
       justify-content: flex-end;
+      padding-left: 0;
+      padding-right: 8px;
+      width: 100%;
     }
     .titre {
       font-size: 1.2rem;
     }
     .titre-bloc {
+      align-items: flex-start;
       display: flex;
       flex-direction: column;
-      align-items: flex-start;
-      min-width: 0;
       max-width: 100%;
+      min-width: 0;
       padding-left: 4px;
     }
     .titre-texte {
-      white-space: nowrap;
+      max-width: 100%;
       overflow: hidden;
       text-overflow: ellipsis;
-      max-width: 100%;
+      white-space: nowrap;
     }
     :deep(.v-col) {
       padding-left: 8px !important;

package/composants/csqcImportCSV.vue

@@ -90,7 +90,7 @@
 
           emit('import', data)
         } catch (error) {
-          emit('import-erreur', erreurTexte || t('csqc.csqcImportCSV.erreur.lectureFichier'))
+          emit('import-erreur', erreurTexte.value || t('csqc.csqcImportCSV.erreur.lectureFichier'))
         }
       }
 
@@ -100,7 +100,7 @@
 
       reader.readAsText(file)
     } else {
-      const message = erreurTexte || t('csqc.csqcImportCSV.erreur.erreur')
+      const message = erreurTexte.value || t('csqc.csqcImportCSV.erreur.erreur')
       emit('import-erreur', message)
       csvFile.value = null
     }

package/composants/csqcModaleSaisie.vue

@@ -1,97 +1,97 @@
-<template>
-  <csqcDialogue
-    ref="modale"
-    :titre="titre"
-    activator="supprimer"
-    :largeur="largeur"
-    v-bind="$attrs"
-    @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>
+<template>
+  <csqcDialogue
+    ref="modale"
+    :titre="titre"
+    activator="supprimer"
+    :largeur="largeur"
+    v-bind="$attrs"
+    @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/csqcRecherche.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <v-row
-      dense
+      density="compact"
       class="pt-0 mt-0"
     >
       <v-col
@@ -59,7 +59,7 @@
       </v-col>
     </v-row>
     <v-row
-      dense
+      density="compact"
       class="pt-0 mt-0"
     >
       <v-col
@@ -190,25 +190,25 @@
   }
 
   .BarreRechercheBackIcone {
+    background-color: #095797 !important;
+    border-bottom: 1px solid #808a9d;
+    border-radius: 0 4px 4px 0 !important;
     border-right: 1px solid #808a9d;
     border-top: 1px solid #808a9d;
-    border-bottom: 1px solid #808a9d;
-    background-color: #095797 !important;
     height: 40px !important;
-    width: 40px !important;
+    margin-left: -16px;
     max-width: 40px !important;
     min-width: 40px !important;
-    padding-right: 0 !important;
     padding-left: 0 !important;
-    border-radius: 0 4px 4px 0 !important;
-    margin-left: -16px;
+    padding-right: 0 !important;
+    width: 40px !important;
   }
 
   /* icone loupe */
   .BarreRechercheIcone {
+    color: white !important;
     font-size: 34px !important;
     margin-left: 1px !important;
     margin-top: 2px !important;
-    color: white !important;
   }
 </style>