add chart with the features done

src/modules/simulation/SimulationChart.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { useSimulationStore } from '@/modules/simulation/simulation-store'
+import chartXkcd from 'chart.xkcd'
+import { onMounted } from 'vue'
+
+const simulationStore = useSimulationStore()
+
+const reloadGraph = () => {
+  if (
+    simulationStore.dashboards.length === 0 ||
+    simulationStore.dashboards.length > 15
+  ) {
+    return
+  }
+
+  const svg = document.querySelector('.chart')
+  const config = {
+    title: 'Features done per day',
+    xLabel: 'days',
+    yLabel: 'features done',
+    data: {
+      labels: Array.from(
+        {
+          length: Math.max(
+            ...simulationStore.dashboards.map(
+              (dashboard) => dashboard.meta.totalDays
+            )
+          )
+        },
+        (_, index) => index + 1
+      ),
+      datasets: simulationStore.dashboards.map((dashboard, index) => ({
+        label: `${dashboard.analysis.strategy} ${index + 1}`,
+        data: dashboard.meta.featuresDonePerDay
+      }))
+    },
+    options: {
+      showLegend: false
+    }
+  }
+  new chartXkcd.Line(svg, config)
+}
+
+// watch(simulationStore.dashboards, reloadGraph)
+onMounted(reloadGraph)
+</script>
+
+<template>
+  <div class="simulation-chart">
+    <svg class="chart"></svg>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.chart {
+  width: 80vw;
+  height: 100vh;
+}
+</style>

src/modules/simulation/SimulationDashboard.vue

@@ -9,7 +9,7 @@ const strategies: Strategy[] = ['push', 'pull', 'push-dps', 'pull-dps']
 
 <template>
   <div class="simulation-dashboard">
-    <h3>Simulation dashboard</h3>
+    <h3>Dashboard</h3>
     <h4>
       {{ simulationStore.simulationsDone }}/{{
         simulationStore.requestedSimulation
@@ -19,7 +19,7 @@ const strategies: Strategy[] = ['push', 'pull', 'push-dps', 'pull-dps']
     <table>
       <thead>
         <tr>
-          <th></th>
+          <th>mean values</th>
           <th class="numeric">push</th>
           <th class="numeric">pull</th>
           <th class="numeric">push and DPS</th>
@@ -28,13 +28,19 @@ const strategies: Strategy[] = ['push', 'pull', 'push-dps', 'pull-dps']
       </thead>
       <tbody>
         <tr>
-          <td>lead time</td>
+          <td>Total days</td>
+          <td class="numeric" v-for="strategy in strategies" :key="strategy">
+            {{ simulationStore.meanTotalDays(strategy) }}
+          </td>
+        </tr>
+        <tr>
+          <td>Lead time</td>
           <td class="numeric" v-for="strategy in strategies" :key="strategy">
             {{ simulationStore.meanLeadTime(strategy) }}
           </td>
         </tr>
         <tr>
-          <td>takt time</td>
+          <td>Takt time</td>
           <td class="numeric" v-for="strategy in strategies" :key="strategy">
             {{ simulationStore.meanTaktTime(strategy) }}
           </td>
@@ -51,6 +57,12 @@ const strategies: Strategy[] = ['push', 'pull', 'push-dps', 'pull-dps']
             {{ simulationStore.meanQuality(strategy) }}
           </td>
         </tr>
+        <tr>
+          <td>Team work exp.</td>
+          <td class="numeric" v-for="strategy in strategies" :key="strategy">
+            {{ simulationStore.meanTeamWorkExperience(strategy) }}
+          </td>
+        </tr>
       </tbody>
     </table>
   </div>

src/modules/simulation/simulation-store.ts

@@ -4,13 +4,13 @@ import { Dashboard, Meta } from '@/store-type'
 import { getRound } from '@/utils'
 import { defineStore } from 'pinia'
 
-// Get features done per day to plot it
-
 type Mean = {
   leadTimeSum: number
   taktTimeSum: number
   complexitySum: number
   qualityIssueSum: number
+  teamWorkExperienceSum: number
+  totalDaysSum: number
   simulations: number
 }
 
@@ -26,6 +26,8 @@ const newMean = (): Mean => ({
   taktTimeSum: 0,
   complexitySum: 0,
   qualityIssueSum: 0,
+  teamWorkExperienceSum: 0,
+  totalDaysSum: 0,
   simulations: 0
 })
 
@@ -102,6 +104,9 @@ export const useSimulationStore = defineStore('dashboard', {
         dashboard.meta.totalDays / newState.features.length
       this.mean[strategy].complexitySum += dashboard.analysis.meanComplexity
       this.mean[strategy].qualityIssueSum += dashboard.analysis.meanQualityIssue
+      this.mean[strategy].teamWorkExperienceSum +=
+        dashboard.meta.teamWorkExperience
+      this.mean[strategy].totalDaysSum += dashboard.meta.totalDays
       this.mean[strategy].simulations++
     },
     async multiSimulation(simulations: number, strategy: Strategy) {
@@ -139,6 +144,16 @@ export const useSimulationStore = defineStore('dashboard', {
       getRound(
         state.mean[strategy].qualityIssueSum,
         state.mean[strategy].simulations
+      ),
+    meanTeamWorkExperience: (state) => (strategy: Strategy) =>
+      getRound(
+        state.mean[strategy].teamWorkExperienceSum,
+        state.mean[strategy].simulations
+      ),
+    meanTotalDays: (state) => (strategy: Strategy) =>
+      getRound(
+        state.mean[strategy].totalDaysSum,
+        state.mean[strategy].simulations
       )
   }
 })