fix: Lors de la selection d'une image le bouton radio doit changer

.drone.yml

@@ -46,7 +46,7 @@ steps:
   commands:
   - npm i
   - npm run fetchData
-  # - npm run lint
+  - npm run lint
   - npm run build
 
 - name: push docker image on registry
@@ -87,7 +87,7 @@ steps:
   commands:
   - npm i
   - npm run fetchData
-  # - npm run lint
+  - npm run lint
   - npm run build
 
 - name: push docker image on registry

src/components/Question.vue

@@ -9,13 +9,10 @@ const props = defineProps({
     required: true,
   },
 });
-defineEmits(["answerSelected"]);
+const emits = defineEmits(["answerSelected", "nextQuestion"]);
 
 const slides = ref();
 
-if (props.question.weight == null) {
-  props.question.weight = props.question.answers[0].weight;
-}
 const answerWeight = ref(props.question.weight);
 
 function selectAnswer(answer) {
@@ -26,7 +23,8 @@ function selectAnswer(answer) {
 }
 
 function slideMove(splide, newIndex) {
-  props.question.weight = props.question.answers[newIndex].weight;
+  answerWeight.value = props.question.answers[newIndex].weight;
+  emits("answerSelected", props.question, answerWeight);
 }
 </script>
 
@@ -43,7 +41,8 @@ function slideMove(splide, newIndex) {
               :name="`question_${question.id}`"
               :value="answer.weight"
               v-model="answerWeight"
-              @click="selectAnswer(answer)"
+              @change="selectAnswer(answer)"
+              @click="nextQuestion"
             />
             {{ answer.title }}
           </label>
@@ -61,7 +60,7 @@ function slideMove(splide, newIndex) {
           <SplideSlide
             v-for="answer in question.answers"
             :key="answer.id"
-            @click="$emit('answerSelected', question, answerWeight)"
+            @click="$emit('nextQuestion')"
           >
             <img height="200" :src="`/answers/${answer.image}.webp`" />
           </SplideSlide>

src/components/Score.vue

@@ -104,6 +104,9 @@ function goQuestionSlide(question) {
 }
 function answerSelected(question, answerWeight) {
   questions.value.find((q) => q.id === question.id).weight = answerWeight;
+}
+
+function nextQuestion() {
   setTimeout(() => slides.value.go(">"), 100);
 }
 </script>
@@ -125,7 +128,11 @@ function answerSelected(question, answerWeight) {
     }"
   >
     <SplideSlide v-for="question in questions" :key="question.id">
-      <Question :question="question" @answerSelected="answerSelected" />
+      <Question
+        :question="question"
+        @answerSelected="answerSelected"
+        @nextQuestion="nextQuestion"
+      />
     </SplideSlide>
     <SplideSlide class="latest">
       <template v-if="displayScoreResult && result">