feat(frontend) : add actions slot to DataTable component

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Matthieu
2026-03-12 18:06:28 +01:00
parent 0c4363d32b
commit e6bbe66d42

View File

@@ -10,7 +10,7 @@
>
{{ col.label }}
</th>
<th v-if="deletable" class="px-4 py-3 font-semibold text-neutral-700">
<th v-if="deletable || $slots.actions" class="px-4 py-3 font-semibold text-neutral-700">
Actions
</th>
</tr>
@@ -32,18 +32,22 @@
{{ item[col.key] }}
</slot>
</td>
<td v-if="deletable" class="px-4 py-3">
<button
class="text-[red-500] hover:text-[red-700]"
@click.stop="$emit('delete', item)"
>
<Icon name="mdi:delete-outline" size="20" />
</button>
<td v-if="deletable || $slots.actions" class="px-4 py-3">
<div class="flex items-center gap-2">
<slot name="actions" :item="item" />
<button
v-if="deletable"
class="text-[red-500] hover:text-[red-700]"
@click.stop="$emit('delete', item)"
>
<Icon name="mdi:delete-outline" size="20" />
</button>
</div>
</td>
</tr>
<tr v-if="items.length === 0 && !loading">
<td
:colspan="columns.length + (deletable ? 1 : 0)"
:colspan="columns.length + (deletable || $slots.actions ? 1 : 0)"
class="px-4 py-8 text-center text-neutral-400"
>
{{ emptyMessage }}