summaryrefslogtreecommitdiff
path: root/pages/search.vue
diff options
context:
space:
mode:
authorSanto Cariotti <santo@dcariotti.me>2022-10-04 22:31:35 +0200
committerSanto Cariotti <santo@dcariotti.me>2022-10-04 22:31:35 +0200
commit36b5f74414413e7270d47f52df387697698aeeaf (patch)
tree050fc93827ca595a198bb2618dd817eeac845423 /pages/search.vue
parent8806bb5f857502eec2ad9132757458d714fff442 (diff)
Add pagination
Diffstat (limited to 'pages/search.vue')
-rw-r--r--pages/search.vue14
1 files changed, 12 insertions, 2 deletions
diff --git a/pages/search.vue b/pages/search.vue
index 1c09e3b..6f448af 100644
--- a/pages/search.vue
+++ b/pages/search.vue
@@ -21,11 +21,13 @@
:key="model.id"
:model="model"
)
+ pagination(:page="page" :pages="pages" v-if="count")
</template>
<script>
import ModelLoading from "@/components/ModelLoading.vue";
import ModelBoxCard from "@/components/ModelBoxCard.vue";
+import Pagination from "@/components/Pagination.vue";
import { mapGetters } from "vuex";
@@ -40,20 +42,28 @@ export default {
data() {
return {
q: "",
+ page: 0,
+ pages: 0,
};
},
components: {
"model-loading": ModelLoading,
"model-box-card": ModelBoxCard,
+ pagination: Pagination,
},
computed: {
...mapGetters(["isLoading"]),
...mapGetters("auth", ["isLogged"]),
- ...mapGetters("models", ["models"]),
+ ...mapGetters("models", ["models", "count"]),
},
created() {
this.q = this.$route.query["q"];
- this.$store.dispatch("models/filter", { q: this.q });
+ this.page = this.$route.query.page ?? 0;
+ this.$store
+ .dispatch("models/filter", { q: this.q, page: this.page })
+ .then(() => {
+ this.pages = Math.ceil(this.count / 20);
+ });
},
};
</script>