31 lines
1.0 KiB
Vue
31 lines
1.0 KiB
Vue
<script setup>
|
|
import {useMediumStore} from "../../store/Medium.js";
|
|
import Pagination from "../Pagination.vue";
|
|
import Media from "./Media.vue";
|
|
|
|
const MediumStore = useMediumStore();
|
|
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<section class="grid grid-cols-1 mt-4">
|
|
<div class="grid grid-cols-5 max-xl:grid-cols-4 max-lg:grid-cols-3 max-md:grid-cols-2 gap-4 justify-center max-sm:grid-cols-1">
|
|
<Media :action="true" v-for="medium in MediumStore.mediums" :medium="medium" :key="medium.id"
|
|
:class="{'active' : medium.id === MediumStore.selected }"></Media>
|
|
</div>
|
|
<div class="bottom">
|
|
<Pagination
|
|
:total="MediumStore.paginate.total"
|
|
:current-page="MediumStore.paginate.current_page"
|
|
:perPage="MediumStore.paginate.per_page"
|
|
:lastPage="MediumStore.paginate.last_page"
|
|
:links="MediumStore.paginate.links"></Pagination>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<style scoped lang="css">
|
|
|
|
</style>
|