First commit

resources/js/components/Pagination.vue

@@ -0,0 +1,28 @@
+<script setup>
+import { Link }  from '@inertiajs/vue3';
+
+defineProps({
+    links: {
+        type: Object,
+        default: () => ({}),
+    },
+    data: {
+        type: Object,
+        default: () => ({}),
+    }
+});
+</script>
+
+<template>
+    <div v-if="links.length > 3">
+        <div class="flex flex-wrap -mb-1">
+            <template v-for="(link, p) in links" :key="p">
+                <div v-if="link.url === null" class="mr-1 mb-1 px-4 py-3 text-sm leading-4 text-gray-400 border rounded"
+                    v-html="link.label" />
+                <Link v-else
+                    class="mr-1 mb-1 px-4 py-3 text-sm leading-4 border rounded hover:bg-white focus:border-indigo-500 focus:text-indigo-500"
+                    :class="{ 'bg-blue-700 text-white': link.active }" method="post" :data="data" :href="link.url" v-html="link.label" as="button" />
+            </template>
+        </div>
+    </div>
+</template>