changements menu

Author: RICHARD-Quentin

app/src/components/appbar/Menu.vue

@@ -6,10 +6,30 @@ q-btn(flat icon="mdi-dots-grid" size="xl")
             .col-4(v-for="app in apps" :key="app.name")
                 q-btn(flat stack dense :to="app.to" rounded).full-width
                     q-icon(:name="app.icon.name" :color="app.icon.color" size="xl")
+                    q-badge(v-if="app.badge" :color="app.badge.color" floating) {{ app.badge.value }}
                     div.text-center(:class="`text-${app.title.color}`") {{ app.title.name }}
+                    
 </template>
 
 <script lang="ts" setup>
+import { usePinia, useQuasar } from "#imports";
+const store = usePinia()
+const $q = useQuasar()
+const user = store.state.value.auth.user
+const { data, error } = await useHttpApi('/tickets/ticket', {
+    method: 'get',
+    query: {
+        'filters[@lifestep][]': 1,
+        'filters[^envelope.assigned.name]': `/${user.displayName}/`,
+    }
+})
+if (error.value) {
+    $q.notify({
+        message: 'Impossible de charger les tickets',
+        type: 'negative'
+    })
+}
+const baseFilter = 'sort[metadata.lastUpdatedAt]=desc&skip=0&limit=10'
 const apps: {
     title: {
         name: string
@@ -41,7 +61,11 @@ const apps: {
                 name: 'mdi-ticket',
                 color: 'primary'
             },
-            to: '/tickets'
+            to: `/tickets?filters[^envelope.assigned.name]=/${user.displayName}/&filters[@lifestep][]=1&${baseFilter}`,
+            badge: {
+                color: 'red',
+                value: data.value.total
+            }
         },
         {
             title: {
@@ -52,7 +76,7 @@ const apps: {
                 name: 'mdi-ticket',
                 color: 'primary'
             },
-            to: '/tickets'
+            to: `/tickets?filters[@lifestep][]=1&${baseFilter}`
         },
         {
             title: {
@@ -88,4 +112,6 @@ const apps: {
             to: '/deconnexion'
         }
     ]
+
+
 </script>