add ability to save answers

This commit is contained in:
thilo 2020-03-21 20:20:55 +01:00
parent d5b6af6cdc
commit 5246711deb
4 changed files with 21 additions and 9 deletions

View file

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

View file

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

View file

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

View file

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