first commit

resources/js/Components/LegacyComponents/AdminIndexPaginate.vue

@@ -0,0 +1,49 @@
+<template>
+	<div>
+		<div class="inline-flex gap-x-2">
+			<Link v-if="links.prev" :href="links.prev"
+				  class="py-2 px-3 inline-flex justify-center items-center gap-2 rounded-md border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:bg-slate-900 dark:hover:bg-slate-800 dark:border-gray-700 dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
+				<svg class="w-3 h-3" xmlns="http://www.w3.org/2000/svg" width="16"
+					 height="16" fill="currentColor" viewBox="0 0 16 16">
+					<path fill-rule="evenodd"
+						  d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/>
+				</svg>
+				Prev
+			</Link>
+
+			<Link v-if="links.next" :href="links.next"
+				  class="py-2 px-3 inline-flex justify-center items-center gap-2 rounded-md border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:bg-slate-900 dark:hover:bg-slate-800 dark:border-gray-700 dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
+				Next
+				<svg class="w-3 h-3" xmlns="http://www.w3.org/2000/svg" width="16"
+					 height="16" fill="currentColor" viewBox="0 0 16 16">
+					<path fill-rule="evenodd"
+						  d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/>
+				</svg>
+			</Link>
+		</div>
+	</div>
+
+</template>
+
+<script>
+import {Link} from "@inertiajs/vue3";
+
+export default {
+	name: "AdminIndexPaginate",
+	data() {
+		return {}
+	},
+	props: [
+		'links'
+	],
+	components: {
+		Link,
+	},
+
+}
+
+</script>
+
+<style scoped>
+
+</style>