39 lines
1.2 KiB
Vue
39 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import { Link } from '@inertiajs/vue3';
|
|
import { Button } from '@/components/ui/button';
|
|
import type { DataTablePagination, DataTablePaginationLink } from '@/types/data-table';
|
|
|
|
defineProps<{
|
|
summary: string | null;
|
|
pagination?: DataTablePagination;
|
|
paginationLinks?: DataTablePaginationLink[];
|
|
}>();
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="pagination" class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
|
|
<p v-if="summary" class="text-muted-foreground text-sm">
|
|
{{ summary }}
|
|
</p>
|
|
|
|
<div
|
|
v-if="paginationLinks?.length && pagination.lastPage > 1"
|
|
class="flex flex-wrap items-center justify-center gap-1 sm:justify-end"
|
|
>
|
|
<Button
|
|
v-for="link in paginationLinks"
|
|
:key="`${link.label}-${link.url}`"
|
|
variant="outline"
|
|
size="sm"
|
|
:disabled="!link.url || link.active"
|
|
as-child
|
|
>
|
|
<Link v-if="link.url" :href="link.url" preserve-scroll>
|
|
<span v-html="link.label" />
|
|
</Link>
|
|
<span v-else v-html="link.label" />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</template>
|