46 lines
1.0 KiB
Vue
46 lines
1.0 KiB
Vue
|
<script setup>
|
||
|
|
import data from "@/data.json";
|
||
|
|
import { useStore } from "@/stores";
|
||
|
|
|
||
|
|
const store = useStore();
|
||
|
|
const language = store.language;
|
||
|
|
|
||
|
|
const translationKey = "languages_id";
|
||
|
|
const scores = data.filter((score) => {
|
||
|
|
return (
|
||
|
|
!!score.translations.find(
|
||
|
|
(translation) => translation[translationKey] == language
|
||
|
|
) &&
|
||
|
|
score.results.length &&
|
||
|
|
score.questions.length
|
||
|
|
);
|
||
|
|
});
|
||
|
|
function getTranslation(translations, key) {
|
||
|
|
return translations.find((translation) => translation[key] == language);
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<h1>Ceiba Scores App</h1>
|
||
|
|
<template v-if="scores">
|
||
|
|
<ul>
|
||
|
|
<li v-for="score in scores" :key="score.id">
|
||
|
|
<router-link :to="{ name: 'score', params: { id: score.id } }">{{
|
||
|
|
getTranslation(score.translations, "languages_id").title
|
||
|
|
}}</router-link>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</template>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style lang="sass" scoped>
|
||
|
|
h1
|
||
|
|
background: var(--color-background)
|
||
|
|
text-align: center
|
||
|
|
margin: 1rem
|
||
|
|
padding: 0
|
||
|
|
ul
|
||
|
|
margin: 1rem
|
||
|
|
padding: 0 0 0 1rem
|
||
|
|
</style>
|