Fix images not loading, add pagination and search

This commit is contained in:
BlossomiShymae
2024-06-10 16:32:18 -05:00
parent d7f75807ba
commit 67f93478f9
2 changed files with 5 additions and 8 deletions

View File

@@ -319,6 +319,6 @@ export class Companion extends CommunityDragonObject {
} }
getLoadoutsIcon(version: string): string { getLoadoutsIcon(version: string): string {
return this.resolveGamePath({path: this.loadoutsIcon, version: version}); return this.resolveClientPath({path: this.loadoutsIcon, args: {locale: "default", version: version}});
} }
} }

View File

@@ -17,27 +17,23 @@
<th scope="col">Item Id</th> <th scope="col">Item Id</th>
<th scope="col">Icon</th> <th scope="col">Icon</th>
<th scope="col">Name</th> <th scope="col">Name</th>
<th scope="col">Species Name</th>
<th scope="col">Species ID</th> <th scope="col">Species ID</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr v-for="companion in p.pages[p.index.value]" :key="companion.contentId" style="positon: relative;"> <tr v-for="companion in p.pages[p.index.value]" :key="companion.contentId" style="position: relative;">
<td scope="row"> <td scope="row">
<NuxtLink class="text-decoration-none text-light stretched-link" :to="`/companions/overview/${companion.contentId}`"> <NuxtLink class="text-decoration-none text-light stretched-link" :to="`/companions/overview/${companion.contentId}`">
{{ companion.itemId }} {{ companion.itemId }}
</NuxtLink> </NuxtLink>
</td> </td>
<td> <td>
<img :src="companion.getLoadoutsIcon('latest')" width="32px" height="32px" loading="lazy" <img :src="companion.getLoadoutsIcon('latest')" height="48px" loading="lazy"
onerror="this.onerror = null; this.src='/clean-cuts/img/error.png'" /> onerror="this.onerror = null; this.src='/clean-cuts/img/error.png'" />
</td> </td>
<td> <td>
{{ companion.name }} {{ companion.name }}
</td> </td>
<td>
{{ companion.speciesName }}
</td>
<td> <td>
{{ companion.speciesId }} {{ companion.speciesId }}
</td> </td>
@@ -61,7 +57,8 @@ const { client } = useClient();
const query = ref(""); const query = ref("");
const companions = await client.companions.listAsync({locale: "default", version: "latest"}); const companions = (await client.companions.listAsync({locale: "default", version: "latest"}))
.sort((a, b) => a.itemId - b.itemId);
const { isNumeric } = useIsNumeric(); const { isNumeric } = useIsNumeric();
const p = computed(() => { const p = computed(() => {