feat: review backend and frontend

- update to the latest version of Java/SpringBoot
- update to the latest version NuxtJS
- add account/password update
- add account creation
- add account password reset
- add bundle to regroup questions and add default questions on user creation
- add bundle creation

frontend/pages/details.vue

@@ -1,91 +1,76 @@
+<script lang="ts" setup>
+
+import {type AxeResponses, type QuizResponse, useQuizStore} from "~/store/quiz";
+import Quiz from "~/pages/quiz.vue";
+import {type Axe, useAxeStore} from "~/store/axe";
+
+const loading = ref(true);
+const quiz = ref<Quiz>();
+const axes = ref<Axe[]>();
+
+onMounted(() => {
+  if (!useRoute().query.quiz) {
+    navigateTo("/dashboard");
+  }
+  loading.value = true;
+  const quizId = Number.parseInt(useRoute().query.quiz as string);
+  useQuizStore().findById(quizId)
+    .then((result: Quiz) => {
+      quiz.value = result;
+    })
+    .then(() => {
+      useAxeStore().findAxes().then(result => {
+        axes.value = result.filter(axe => {
+          return quiz.value.axes.filter(axeResponse => axeResponse.axeIdentifier === axe.identifier).length > 0;
+        });
+      });
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+});
+
+function getAverage(axe: Axe): number {
+  const axeResponses = quiz.value.axes.filter((response: AxeResponses) => response.axeIdentifier === axe.identifier);
+  if (axeResponses.length === 1) {
+    return axeResponses[0].average;
+  }
+  return 0;
+}
+
+function getResponses(axe: Axe): QuizResponse[] {
+  const axeResponses = quiz.value.axes.filter((response: AxeResponses) => response.axeIdentifier === axe.identifier);
+  if (axeResponses.length === 1) {
+    return axeResponses[0].responses;
+  }
+  return [];
+}
+
+function print() {
+  window.print();
+}
+</script>
 <template>
-  <div class="content">
-    <team-header/>
-    <hr/>
-    <div v-if="!loading">
-      <span class="date">{{ quiz.createdDate | formatDate }}</span>
-      <quiz-axe-details
-        v-for="axe in axes"
-        :key="axe.identifier"
-        :axe="axe"
-        :score="getScore(axe)"
-        :responses="getResponses(axe)"/>
-    </div>
-    <loader v-else class="center"/>
-    <div class="button-container">
-      <nuxt-link class="button orange" to="/dashboard">Retour à l'accueil</nuxt-link>
-    </div>
+  <section v-if="!loading">
+    <span class="date">{{ formatDateTime(quiz.createdDate) }}</span>
+    <quiz-axe-details
+      v-for="axe in axes"
+      :axe="axe"
+      :average="getAverage(axe)"
+      :responses="getResponses(axe)"/>
+  </section>
+  <loader v-else class="center"/>
+  <div class="button-container">
+    <nuxt-link class="button gray button-back" to="/dashboard" aria-label="Retour à l'accueil">❮</nuxt-link>
+    <button class="button orange button-print" @click="print">Imprimer</button>
   </div>
 </template>
 
-<script lang="ts">
-import {Component, Vue} from "nuxt-property-decorator";
-import {AxiosResponse} from "axios";
-import {RepositoryFactory} from "~/repositories/RepositoryFactory";
-import {Quiz, ResponseWithQuestion, Score} from "~/repositories/models/quiz.model";
-import QuizAxeDetails from "~/components/QuizAxeDetails.vue";
-import {Axe} from "~/repositories/models/axe.model";
-import {RestResponse} from "~/repositories/models/rest-response.model";
-
-@Component({
-  components: {QuizAxeDetails}
-})
-export default class Result extends Vue {
-
-  readonly axeRepository = RepositoryFactory.get('axe');
-  readonly quizRepository = RepositoryFactory.get('quiz');
-
-  private axes: Axe[] = [];
-  private quiz: Quiz | null = null;
-  private responses: ResponseWithQuestion[] = [];
-  private loading = false;
-
-  created() {
-    if (!this.$route.query.quiz) {
-      this.$router.push("/dashboard");
-    }
-    try {
-      this.loading = true;
-      const quizId = Number.parseInt(this.$route.query.quiz as string);
-      this.quizRepository.findById(quizId)
-        .then((response: AxiosResponse<Quiz>) => {
-          this.quiz = response.data;
-          this.responses = response.data._embedded.responses;
-          return response;
-        })
-        .then(() => {
-          return this.axeRepository.findAll()
-            .then((response: AxiosResponse<RestResponse<Axe>>) => {
-              this.axes = response.data._embedded.axes;
-              return response;
-            });
-        })
-        .finally(() => {
-          this.loading = false;
-        });
-    } catch (e: any) {
-      console.info("error", e);
-      this.loading = false;
-    }
-  }
-
-  getScore(axe: Axe): Score {
-    const responses = this.getResponses(axe);
-    return {
-      axeIdentifier: axe.identifier,
-      scoreAvg: responses.reduce((total, response) => total + response.score, 0) / responses.length
-    };
-  }
-
-  getResponses(axe: Axe) {
-    return this.responses.filter((response: ResponseWithQuestion) => response.axeIdentifier === axe.identifier);
-  }
-}
-</script>
 
 <style lang="scss" scoped>
-@import "assets/css/color";
-@import "assets/css/font";
+section {
+  margin: $x_small 0;
+}
 
 .date {
   font-weight: 700;
@@ -93,4 +78,10 @@ export default class Result extends Vue {
   color: $gray_4;
 }
 
+@media print {
+  .button-container {
+    display: none;
+  }
+}
+
 </style>