43 lines
973 B
Vue
43 lines
973 B
Vue
<script lang="ts" setup>
|
|
|
|
import {type Quiz, useQuizStore} from "~/store/quiz";
|
|
|
|
const scores = ref<number[]>();
|
|
const loading = ref(true);
|
|
|
|
onMounted(() => {
|
|
loading.value = true;
|
|
useQuizStore().findById(useRoute().query.quiz).then((quiz: Quiz) => {
|
|
scores.value = quiz.axes.map(value => value.average);
|
|
})
|
|
.finally(() => loading.value = false);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<section>
|
|
<h1>Bravo !</h1>
|
|
<p class="text-center">Merci pour votre contribution à la production locale et bravo pour votre implication.</p>
|
|
<div v-if="!loading" class="chart-area">
|
|
<polar-area-chart :data="scores"/>
|
|
<Legend/>
|
|
</div>
|
|
<loader v-else class="center"/>
|
|
<nuxt-link class="button orange" to="/dashboard">Retour à l'accueil</nuxt-link>
|
|
</section>
|
|
</template>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
@import "assets/css/spacing";
|
|
|
|
.chart-area {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-around;
|
|
margin: $small 0;
|
|
}
|
|
|
|
</style>
|