49 lines
1.2 KiB
Vue
49 lines
1.2 KiB
Vue
<template>
|
|
<nav
|
|
class="border-t border-gray-200 flex items-center justify-between max-w-2xl mx-auto p-4 sm:px-6 lg:max-w-7xl"
|
|
>
|
|
<div class="-mt-px w-0 flex-1 flex">
|
|
<NuxtLink
|
|
v-if="prevPageToken"
|
|
:to="{ name: 'index', query: { pageToken: prevPageToken } }"
|
|
href="#"
|
|
class="border-t-2 border-transparent pt-4 pr-1 inline-flex items-center text-sm font-medium text-gray-500 hover:text-gray-700 hover:border-gray-300"
|
|
>
|
|
Previous
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="-mt-px w-0 flex-1 flex justify-end">
|
|
<NuxtLink
|
|
v-if="nextPageToken"
|
|
:to="{ name: 'index', query: { pageToken: nextPageToken } }"
|
|
href="#"
|
|
class="border-t-2 border-transparent pt-4 pl-1 inline-flex items-center text-sm font-medium text-gray-500 hover:text-gray-700 hover:border-gray-300"
|
|
>
|
|
Next
|
|
</NuxtLink>
|
|
</div>
|
|
</nav>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import Vue from 'vue'
|
|
|
|
export default Vue.extend({
|
|
name: 'SimplePagination',
|
|
|
|
props: {
|
|
nextPageToken: {
|
|
type: String,
|
|
default: () => {
|
|
return ''
|
|
},
|
|
},
|
|
prevPageToken: {
|
|
type: String,
|
|
default: () => {
|
|
return ''
|
|
},
|
|
},
|
|
},
|
|
})
|
|
</script>
|