Ajout tooltip

abes-esr · Dec 6, 2024 · 30f8ba5 · 30f8ba5
1 parent 514f5e6
commit 30f8ba5
Show file tree

Hide file tree

Showing 5 changed files with 99 additions and 39 deletions.
diff --git a/src/components/Supp/BtnStop.vue b/src/components/Supp/BtnStop.vue
@@ -1,24 +1,28 @@
 <template>
-  <v-btn icon="mdi-stop"  variant="plain" @click="click">
-  </v-btn>
+  <v-tooltip text="Annuler">
+    <template v-slot:activator="{ props }">
+      <v-btn v-bind="props" icon="mdi-stop" variant="plain" @click="click">
+      </v-btn>
+    </template>
+  </v-tooltip>
   <dialog-confirmation-stop v-model="dialog" :id="id" @stop="emits('stop')">
   </dialog-confirmation-stop>
 </template>
 <script setup>
-import DialogConfirmationStop from "@/components/Supp/DialogConfirmationStop.vue";
-import {ref} from "vue";
+import DialogConfirmationStop from '@/components/Supp/DialogConfirmationStop.vue';
+import { ref } from 'vue';
 
-const emits = defineEmits(['stop'])
+const emits = defineEmits(['stop']);
 const props = defineProps({
-  id:{
-    required:true,
-    type:Number
+  id: {
+    required: true,
+    type: Number
   }
-})
+});
 const dialog = ref(false);
 
 function click() {
-  dialog.value = true
+  dialog.value = true;
 }
 
 

diff --git a/src/views/Exemplarisation/ExempTable.vue b/src/views/Exemplarisation/ExempTable.vue
@@ -26,7 +26,8 @@
       </v-tooltip>
     </v-chip>
   </v-container>
-  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered" :items-length="totalItemsFound"
+  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered"
+                :items-length="totalItemsFound"
                 :loading="!isDataLoaded" show-expand :sort-by="sortBy"
                 item-key="id"
   >
@@ -119,9 +120,20 @@
         </td>
         <td class="text-center">
           <!-- Colonne Action -->
-          <v-btn v-if="canArchive(item)" variant="plain" icon="mdi-archive" @click="archiverDemande(item)"></v-btn>
-          <v-btn v-else-if="canCancel(item)" variant="plain" icon="mdi-delete" @click="supprimerDemande(item)"></v-btn>
-
+          <v-tooltip v-if="canArchive(item)" text="Archiver">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-archive"
+                     @click="archiverDemande(item)"
+                     aria-label="Archiver"></v-btn>
+            </template>
+          </v-tooltip>
+          <v-tooltip v-else-if="canCancel(item)" text="Supprimer">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-delete"
+                     @click="supprimerDemande(item)"
+                     aria-label="Supprimer"></v-btn>
+            </template>
+          </v-tooltip>
         </td>
       </tr>
     </template>
@@ -138,12 +150,13 @@ import DialogCommentaire from '@/components/Dialog/DialogCommentaire.vue';
 import itemService from '@/service/ItemService';
 import MenuDownloadFile from '@/components/MenuDownloadFile.vue';
 import moment from 'moment';
-import {useAuthStore} from '@/store/authStore'
+import { useAuthStore } from '@/store/authStore';
 //Emit
 const emit = defineEmits(['backendError', 'backendSuccess']);
 
 //Data
-const isAdmin = useAuthStore().isAdmin();
+const isAdmin = useAuthStore()
+  .isAdmin();
 const extendedAllILN = ref(false);
 
 const headingsDemandes = [
@@ -249,7 +262,7 @@ const headingsDemandes = [
 ];
 const filteredHeadingsDemandes = computed(() =>
   headingsDemandes.filter(heading => heading.display !== false)
-)
+);
 
 const listStatut = [
   'En saisie',

diff --git a/src/views/Modification/ModifTable.vue b/src/views/Modification/ModifTable.vue
@@ -26,7 +26,8 @@
       </v-tooltip>
     </v-chip>
   </v-container>
-  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered" :items-length="totalItemsFound"
+  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered"
+                :items-length="totalItemsFound"
                 :loading="!isDataLoaded" show-expand :sort-by="sortBy"
                 item-key="id">
     <template v-slot:body.prepend>
@@ -118,8 +119,20 @@
         </td>
         <td class="text-center">
           <!-- Colonne Action -->
-          <v-btn v-if="canArchive(item)" variant="plain" icon="mdi-archive" @click="archiverDemande(item)"></v-btn>
-          <v-btn v-else-if="canCancel(item)" variant="plain" icon="mdi-delete" @click="supprimerDemande(item)"></v-btn>
+          <v-tooltip v-if="canArchive(item)" text="Archiver">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-archive"
+                     @click="archiverDemande(item)"
+                     aria-label="Archiver"></v-btn>
+            </template>
+          </v-tooltip>
+          <v-tooltip v-else-if="canCancel(item)" text="Supprimer">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-delete"
+                     @click="supprimerDemande(item)"
+                     aria-label="Supprimer"></v-btn>
+            </template>
+          </v-tooltip>
         </td>
       </tr>
     </template>
@@ -136,13 +149,14 @@ import DialogSuppression from '@/components/Dialog/DialogSuppression.vue';
 import DialogCommentaire from '@/components/Dialog/DialogCommentaire.vue';
 import MenuDownloadFile from '@/components/MenuDownloadFile.vue';
 import moment from 'moment/moment';
-import {useAuthStore} from "@/store/authStore";
+import { useAuthStore } from '@/store/authStore';
 
 //Emit
 const emit = defineEmits(['backendError', 'backendSuccess']);
 
 //Data
-const isAdmin = useAuthStore().isAdmin();
+const isAdmin = useAuthStore()
+  .isAdmin();
 const extendedAllILN = ref(false);
 const headingsDemandes = [
   {
@@ -247,7 +261,7 @@ const headingsDemandes = [
 ];
 const filteredHeadingsDemandes = computed(() =>
   headingsDemandes.filter(heading => heading.display !== false)
-)
+);
 
 const listStatut = [
   'En saisie',

diff --git a/src/views/Recouvrement/RecouvTable.vue b/src/views/Recouvrement/RecouvTable.vue
@@ -25,7 +25,8 @@
       </v-tooltip>
     </v-chip>
   </v-container>
-  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered" :items-length="totalItemsFound"
+  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered"
+                :items-length="totalItemsFound"
                 :loading="!isDataLoaded" show-expand :sort-by="sortBy"
                 item-key="id">
     <template v-slot:body.prepend>
@@ -106,8 +107,20 @@
         </td>
         <td class="text-center">
           <!-- Colonne Action -->
-          <v-btn v-if="canArchive(item)" variant="plain" icon="mdi-archive" @click="archiverDemande(item)"></v-btn>
-          <v-btn v-else-if="canCancel(item)" variant="plain" icon="mdi-delete" @click="supprimerDemande(item)"></v-btn>
+          <v-tooltip v-if="canArchive(item)" text="Archiver">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-archive"
+                     @click="archiverDemande(item)"
+                     aria-label="Archiver"></v-btn>
+            </template>
+          </v-tooltip>
+          <v-tooltip v-else-if="canCancel(item)" text="Supprimer">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-delete"
+                     @click="supprimerDemande(item)"
+                     aria-label="Supprimer"></v-btn>
+            </template>
+          </v-tooltip>
         </td>
       </tr>
     </template>
@@ -124,13 +137,14 @@ import DialogSuppression from '@/components/Dialog/DialogSuppression.vue';
 import DialogCommentaire from '@/components/Dialog/DialogCommentaire.vue';
 import MenuDownloadFile from '@/components/MenuDownloadFile.vue';
 import moment from 'moment/moment';
-import {useAuthStore} from "@/store/authStore";
+import { useAuthStore } from '@/store/authStore';
 
 //Emit
 const emit = defineEmits(['backendError', 'backendSuccess']);
 
 //Data
-const isAdmin = useAuthStore().isAdmin();
+const isAdmin = useAuthStore()
+  .isAdmin();
 const extendedAllILN = ref(false);
 const headingsDemandes = [
   {
@@ -223,7 +237,7 @@ const headingsDemandes = [
 ];
 const filteredHeadingsDemandes = computed(() =>
   headingsDemandes.filter(heading => heading.display !== false)
-)
+);
 
 const listStatut = [
   'En saisie',

diff --git a/src/views/Suppression/SuppTable.vue b/src/views/Suppression/SuppTable.vue
@@ -27,7 +27,8 @@
       </v-tooltip>
     </v-chip>
   </v-container>
-  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered" :items-length="totalItemsFound"
+  <v-data-table :headers="filteredHeadingsDemandes" :items="contentsDemandesFrontFiltered"
+                :items-length="totalItemsFound"
                 :loading="!isDataLoaded" show-expand :sort-by="sortBy"
                 item-key="id">
     <template v-slot:body.prepend>
@@ -107,9 +108,22 @@
         </td>
         <td class="text-center">
           <!-- Colonne Action -->
-          <btn-stop v-if="canStop(item)" :id="item.id" @stop="loadItems('SUPP', isArchiveDemandesDisplayed)"></btn-stop>
-          <v-btn v-if="canArchive(item)" variant="plain" icon="mdi-archive" @click="archiverDemande(item)"></v-btn>
-          <v-btn v-else-if="canCancel(item)" variant="plain" icon="mdi-delete" @click="supprimerDemande(item)"></v-btn>
+          <btn-stop v-if="canStop(item)" :id="item.id" @stop="loadItems('SUPP', isArchiveDemandesDisplayed)"
+                    aria-label="Annuler"></btn-stop>
+          <v-tooltip v-if="canArchive(item)" text="Archiver">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-archive"
+                     @click="archiverDemande(item)"
+                     aria-label="Archiver"></v-btn>
+            </template>
+          </v-tooltip>
+          <v-tooltip v-if="canCancel(item)" text="Supprimer">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="plain" icon="mdi-delete"
+                     @click="supprimerDemande(item)"
+                     aria-label="Supprimer"></v-btn>
+            </template>
+          </v-tooltip>
         </td>
       </tr>
     </template>
@@ -126,14 +140,15 @@ import DialogSuppression from '@/components/Dialog/DialogSuppression.vue';
 import DialogCommentaire from '@/components/Dialog/DialogCommentaire.vue';
 import MenuDownloadFile from '@/components/MenuDownloadFile.vue';
 import moment from 'moment/moment';
-import {useAuthStore} from "@/store/authStore";
-import BtnStop from "@/components/Supp/BtnStop.vue";
+import { useAuthStore } from '@/store/authStore';
+import BtnStop from '@/components/Supp/BtnStop.vue';
 
 //Emit
 const emit = defineEmits(['backendError', 'backendSuccess']);
 
 //Data
-const isAdmin = useAuthStore().isAdmin();
+const isAdmin = useAuthStore()
+  .isAdmin();
 const extendedAllILN = ref(false);
 const headingsDemandes = [
   {
@@ -226,7 +241,7 @@ const headingsDemandes = [
 ];
 const filteredHeadingsDemandes = computed(() =>
   headingsDemandes.filter(heading => heading.display !== false)
-)
+);
 
 const listStatut = [
   'En saisie',
@@ -353,11 +368,11 @@ function canArchive(item) {
 }
 
 function canCancel(item) {
-  return item.etatDemande !== 'Terminé' && item.etatDemande !== 'En cours de traitement' && item.etatDemande !== 'En attente' && item.etatDemande !== 'Annulé';
+  return item.etatDemande !== 'Terminé' && item.etatDemande !== 'En cours de traitement' && item.etatDemande !== 'En attente';
 }
 
 function canStop(item) {
-  return item.etatDemande === 'En cours de traitement' || item.etatDemande === 'En attente'
+  return item.etatDemande === 'En cours de traitement' || item.etatDemande === 'En attente';
 }
 
 //Suppression d'une demande