49 lines
1.8 KiB
Vue
49 lines
1.8 KiB
Vue
<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> |