59 lines
2.1 KiB
Vue
59 lines
2.1 KiB
Vue
<template>
|
|
<div class="results">
|
|
<p>Ihre Wahrscheinlichkeit sich zu infizieren ist</p>
|
|
<p>Auf Folgendes sollten Sie achten:</p>
|
|
<div class="card-advice alert">
|
|
<div class="card-advice-title">Sie sollten sich die Hände mindestens drei mal am Tag waschen</div>
|
|
<div class="card-advice-description">Hier kommt eine Erläuterung und evtl. ein Bezug auf den Einfluss den man auf die Virusverbreitung hat</div>
|
|
</div>
|
|
<p>Hier können Sie sich noch verbessern:</p>
|
|
<div class="card-advice warning">
|
|
<div class="card-advice-title">Sie sollten sich die Hände mindestens drei mal am Tag waschen</div>
|
|
<div class="card-advice-description">Hier kommt eine Erläuterung und evtl. ein Bezug auf den Einfluss den man auf die Virusverbreitung hat</div>
|
|
</div>
|
|
<p>Das machen Sie schon gut:</p>
|
|
<div class="card-advice success">
|
|
<div class="card-advice-title">Sie sollten sich die Hände mindestens drei mal am Tag waschen</div>
|
|
<div class="card-advice-description">Hier kommt eine Erläuterung und evtl. ein Bezug auf den Einfluss den man auf die Virusverbreitung hat</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "Results",
|
|
mounted() {
|
|
const biased = this.$store.state.answers.map((x, i) => {
|
|
return x * this.$store.state.questions[i].multiplicator
|
|
})
|
|
const summed = biased.reduce(function(acc, current) {
|
|
return acc + current
|
|
})
|
|
console.log(Math.round(summed / 10))
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.results {
|
|
padding: 1em;
|
|
}
|
|
.card-advice {
|
|
padding: 0.8em;
|
|
border-radius: 0.8em;
|
|
}
|
|
.card-advice .card-advice-title {
|
|
font-weight: bolder;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
.card-advice.success {
|
|
background: rgba(98, 225, 96, 0.25);
|
|
}
|
|
.card-advice.warning {
|
|
background: rgba(255, 233, 36, 0.25);
|
|
}
|
|
.card-advice.alert {
|
|
background: rgba(233, 74, 71, 0.25);
|
|
}
|
|
</style>
|