Archive/clean-cuts
1
0
Fork 0
mirror of https://github.com/BlossomiShymae/clean-cuts.git synced 2025-12-06 10:10:47 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add champions feat

Browse Source
This commit is contained in:
Blossomi Shymae
2024-05-01 21:56:30 -05:00
parent cab1684b7c
commit 32b961dd32
9 changed files with 217 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
pages/summoner-icons/index.vue
View File

@@ -2,10 +2,8 @@
<div class="d-flex flex-column gap-2">
<h1>Summoner Icons</h1>
<vc:search></vc:search>
<vc:pagination path="/SummonerIcon" list="@Model.Icons.Pages"></vc:pagination>
<Pagination :pages="pages" :count="count" :index="index" :on-prev="prev" :on-next="next"
:on-first="first" :on-last="last"/>
<div class="overflow-hidden rounded border border-light border-opacity-25 p-4">
<table class="sortable table table-borderless">
@@ -17,7 +15,7 @@
</tr>
</thead>
<tbody>
<tr v-for="icon in icons" :key="icon.id">
<tr v-for="icon in pages[index]" :key="icon.id">
<th scope="row">
<NuxtLink class="text-decoration-none text-light" :to="`/summoner-icons/overview/${icon.id}`">
{{ icon.id }}
@@ -30,7 +28,7 @@
</td>
<td>
<NuxtLink class="text-decoration-none text-light" :to="`/summoner-icons/overview/${icon.id}`">
@icon.Title
{{ icon.title }}
</NuxtLink>
</td>
</tr>
@@ -38,15 +36,19 @@
</table>
</div>
<vc:pagination path="/SummonerIcon" list="@Model.Icons.Pages"></vc:pagination>
<Pagination :pages="pages" :count="count" :index="index" :on-prev="prev" :on-next="next"
:on-first="first" :on-last="last"/>
</div>
</template>
<script setup lang="ts">
import Pagination from '~/components/Pagination.vue';
import useClient from '../../composables/useClient';
import { SummonerIcon } from '../../core/models';
import usePagination from '../../composables/usePagination';
const { client } = useClient();
const icons = await client.summonerIcons.listAsync({locale: "default", version: "latest"});
const { count, pages, index, prev, next, first, last } = usePagination(icons, 100);
</script>