feat(frontend) : add actions slot to DataTable component
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -10,7 +10,7 @@
|
|||||||
>
|
>
|
||||||
{{ col.label }}
|
{{ col.label }}
|
||||||
</th>
|
</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
|
Actions
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
@@ -32,18 +32,22 @@
|
|||||||
{{ item[col.key] }}
|
{{ item[col.key] }}
|
||||||
</slot>
|
</slot>
|
||||||
</td>
|
</td>
|
||||||
<td v-if="deletable" class="px-4 py-3">
|
<td v-if="deletable || $slots.actions" class="px-4 py-3">
|
||||||
<button
|
<div class="flex items-center gap-2">
|
||||||
class="text-[red-500] hover:text-[red-700]"
|
<slot name="actions" :item="item" />
|
||||||
@click.stop="$emit('delete', item)"
|
<button
|
||||||
>
|
v-if="deletable"
|
||||||
<Icon name="mdi:delete-outline" size="20" />
|
class="text-[red-500] hover:text-[red-700]"
|
||||||
</button>
|
@click.stop="$emit('delete', item)"
|
||||||
|
>
|
||||||
|
<Icon name="mdi:delete-outline" size="20" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr v-if="items.length === 0 && !loading">
|
<tr v-if="items.length === 0 && !loading">
|
||||||
<td
|
<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"
|
class="px-4 py-8 text-center text-neutral-400"
|
||||||
>
|
>
|
||||||
{{ emptyMessage }}
|
{{ emptyMessage }}
|
||||||
|
|||||||
Reference in New Issue
Block a user