fixed result measure

src/views/Results.vue

@@ -1,6 +1,9 @@
 <template>
     <div class="results">
         <p>Ihre Wahrscheinlichkeit sich zu infizieren ist</p>
+            <p class="risk-chance alert" v-if="risk >= 66">hoch</p>
+            <p class="risk-chance warning" v-if="risk >= 33 && risk < 66">durchschnittlich</p>
+            <p class="risk-chance success" v-if="risk < 33">niedrig</p>
         <p>Auf Folgendes sollten Sie achten:</p>
         <div v-for="card in bad" v-bind:key="card.description" class="card-advice alert">
             <div class="card-advice-title">{{ card.title }}</div>
@@ -23,12 +26,17 @@
     export default {
         name: "Results",
         mounted() {
-            /*const biased = this.$store.state.answers.map((x, i) => {
+            const summed = this.$store.state.answers.map((x, i) => {
                 return x * this.$store.state.questions[i].multiplicator
-            })
+            }).reduce(function(acc, current) {
-             const summed = biased.reduce(function(acc, current) {
                 return acc + current
-            }) */
+            })
+
+            const sumMult = this.$store.state.questions.reduce(function(acc, current) {
+                return acc + current.multiplicator
+            }, 0)
+
+            this.risk = Math.round(summed / sumMult)
 
             for(let i = 0; i < this.$store.state.answers.length; i ++) {
                 if (this.$store.state.answers[i] < 33) {
@@ -51,6 +59,7 @@
         },
         data() {
             return {
+                risk: -1,
                 bad: [],
                 warning: [],
                 good: []
@@ -81,4 +90,18 @@
     .card-advice.alert {
         background: rgba(233, 74, 71, 0.25);
     }
+    .risk-chance {
+        text-align: center;
+        font-size: 1.5em;
+        font-weight: bold;
+    }
+    .risk-chance.success {
+        color: green;
+    }
+    .risk-chance.warning {
+        color: orange;
+    }
+    .risk-chance.alert {
+        color: red;
+    }
 </style>