✨ feature: Data table component updated

src/components/table/VDataTable.vue

@@ -2,6 +2,7 @@
 import DataTable from 'primevue/datatable';
 import type { DataTableProps, DataTableSlots } from 'primevue/datatable';
 import { useId, ref, watch, computed } from 'vue';
+import styles from '@visua/typography.module.css';
 
 export interface IVDataTable extends Partial<Omit<DataTableProps, 'pt' | 'dt' | 'ptOptions' | 'unstyled'>>{
   id?: string
@@ -415,6 +416,12 @@ watch(localEditingRows, (newVal) => {
       <slot :name="name" v-bind="slotProps" />
     </template>
     <slot></slot>
+    <template #empty>
+      <div class="datatable-empty" :class="[styles['text-body-SM-detail-text-Regular']]">
+        <i class="ri-database-line database-icon"></i>
+        <p> Aucune donnée trouvée. </p>
+      </div>
+    </template>
   </DataTable>
 </template>
 
@@ -422,4 +429,17 @@ watch(localEditingRows, (newVal) => {
 .p-datatable{
   box-sizing: border-box;
 }
+
+.datatable-empty{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 1rem;
+  gap: 1.5rem;
+}
+
+.database-icon{
+  font-size: 5rem;
+  color: var(--border-contrast-grey);
+}
 </style>