add ability to save answers

src/components/Question.vue

@@ -1,16 +1,18 @@
 <template>
     <div class="question">
         <p>{{ question }}</p>
-        <div v-if="type === 'choice'" class="question-choice">
-            <button>Ja</button>
-            <button>Nein</button>
+        <div v-if="type === 'yesno'" class="question-choice">
+            <button v-on:click="$store.commit('nextQuestion')">Ja</button>
+            <button v-on:click="$store.commit('nextQuestion')">Nein</button>
         </div>
         <div v-if="type === 'slider'" class="question-slider">
             <p>{{ selection }}</p>
             <input v-model="selection" type="range" min="0" max="150" value="18" class="slider">
         </div>
-        <div v-if="type === 'options'" class="question-options">
-            <button v-bind:key="answer" v-for="answer in answers">{{ answer }}</button>
+        <div v-if="type === 'choice'" class="question-options">
+            <button v-bind:key="answer.text"
+                    v-for="answer in answers"
+                    v-on:click="answerQuestion(answer.value)">{{ answer.text }}</button>
         </div>
         <router-link to="/questionmaire"><button class="alert">Ich brauche Hilfe zu dieser Frage</button></router-link>
     </div>
@@ -29,6 +31,12 @@
                 selection: 0
             }
         },
+        methods: {
+            answerQuestion(value) {
+                this.$store.commit('answerQuestion', value)
+                this.$store.commit('nextQuestion')
+            }
+        },
     }
 </script>
 

src/store/index.js

@@ -22,11 +22,15 @@ export default new Vuex.Store({
                 this.state.currentQuestion -= 1
             }
         },
+        answerQuestion(state, value) {
+            this.state.answers[this.state.currentQuestion] = value
+        },
         init() {
             axios.get('https://avian-safeguard-214619.firebaseio.com/questions.json')
                 .then(res => {
                     console.log(res)
                     this.state.questions = res.data
+                    this.state.answers = Array.apply(null, Array(res.data.length)).map(function () {})
                 })
         }
     },

src/views/Home.vue

@@ -18,9 +18,6 @@ export default {
   name: 'Home',
   components: {
     // HelloWorld
-  },
-  mounted() {
-    this.$store.commit("init")
   }
 }
 </script>

src/views/Questionnaire.vue

@@ -11,7 +11,10 @@
     import Question from "@/components/Question";
     export default {
         name: "Questionnaire",
-        components: {Question}
+        components: {Question},
+        mounted() {
+            this.$store.commit("init")
+        }
     }
 </script>