Files
buildpath/frontend/pages/champion/[alias].vue
vhaudiquet 862e3f1b99
All checks were successful
pipeline / build-and-push-images (push) Successful in 25s
Using champions alias instead of id in urls
2024-11-24 12:13:00 +01:00

25 lines
1.0 KiB
Vue

<script setup>
const route = useRoute()
const championAlias = route.params.alias
const { data : championData } = await useFetch("/api/champion/" + championAlias.toLowerCase())
const championId = championData.value.id
</script>
<template>
<Head>
<Title>{{ championData.name }} builds</Title>
</Head>
<div style="display: flex; width: fit-content; margin: auto;">
<div style="margin-top: 64px;">
<ChampionTitle :champion-id="championId" :winrate="championData.winrate" :pickrate="championData.pickrate" :game-count="championData.gameCount" />
<RuneSelector v-if="championData.gameCount > 0" style="margin-top: 20px;" :runes="championData.runes" />
<h2 style="margin: auto; margin-top: 20px; width: fit-content;" v-if="championData.gameCount == 0">Sorry, there is no data for this champion :(</h2>
</div>
<ItemViewer v-if="championData.gameCount > 0" style="margin-top: 64px; margin-left: 64px;" :builds="championData.builds" />
</div>
</template>
<style>
</style>