wip state management

src/stores/storeInput.js

@@ -1,24 +1,30 @@
 import { defineStore } from 'pinia'
-import { useExerciseStore } from './storeExercise.js';
+import { reactive } from 'vue'
 
-//see https://stephanlangeveld.medium.com/simple-local-storage-implementation-using-vue-3-vueuse-and-pinia-with-zero-extra-lines-of-code-cb9ed2cce42a
 export const useWeightInputStore = defineStore(('weightInput'),{
-    state: () => ({
+    state: () => reactive ({
-        selectedExercise: "",
         workingSets: [
             {
-                // workingSets: [],
+                selectedExercise: '',
-                // workingReps: [],
+                workingSet: [
-                // workingSetsWeight: [],
+                    {
-                // workingSetCount: 0,
+                        workingReps: [],
+                        workingSetsWeight: []
+                    }
+                ],
+                workingSetCount: 0,
             }
         ],
         warmUpSets: [
             {
-                // warmUpSets: [],
+                selectedExercise: '',
-                // warmUpReps: [],
+                warmUpSet: [
-                // warmUpSetsWeight: [],
+                    {
-                // warmUpSetCount: 0,
+                        warmUpReps: [],
+                        warmUpSetsWeight: [],
+                    }
+                ],
+                warmUpSetCount: 0,
             }
         ],
     }),
@@ -29,14 +35,9 @@ export const useWeightInputStore = defineStore(('weightInput'),{
         removeWorkingSet(selectedExercise) {
             this.sets = this.sets.filter(e => {return e.selectedExercise !== selectedExercise})
         },
-        addWorkingSet(selectedExercise) {
+        addWorkingSet(selectedExercise, workingSetCount, workingReps, workingSetsWeight){              
-            this.workingSets.push({
+            const neWworkingSet = {
-                selectedExercise: selectedExercise,
+            }
-                workingSets: [],
-                workingReps: [],
-                workingSetsWeight: [],
-                workingSetCount: this.workingSetCount++,
-            })
         },
         addWarmUpSet(selectedExercise) {
             this.warmUpSets.push({
@@ -44,7 +45,7 @@ export const useWeightInputStore = defineStore(('weightInput'),{
                 warmUpSets: [],
                 warmUpReps: [],
                 warmUpSetsWeight: [],
-                warmUpSetCount: this.warmUpSetCount++,
+                warmUpSetCount: warmUpSetCount++,
             })
         }
     }

src/views/weight/WeightsInput.vue

@@ -2,7 +2,7 @@
     <div class="w-2/3 mx-auto">
       <div class="warmup-sets mt-2">
         <label>Warm-Up Sets</label>
-        <button @click="weightInput.addWarmUpSet(selectedExercise)" 
+        <button @click="addWarmUpSet(selectedExercise)" 
                 class="bg-accent hover:bg-primary-button text-white font-bold py-2 px-2 rounded ml-5">
                 Add
         </button>
@@ -36,7 +36,7 @@
 
       <div class="working-set mt-5">
         <label>Working Sets</label>
-        <button @click="weightInput.addWorkingSet(selectedExercise)" 
+        <button @click="workingAddSet()" 
         class="bg-accent hover:bg-primary-button text-white font-bold py-2 px-2 rounded ml-7">
         Add
       </button>
@@ -51,7 +51,7 @@
             {{ workingset }}  
           <div class="ml-3">
             <input
-            v-model="weightInput.workingSets.workingSetsWeight[workingSetCount]" 
+            v-model="weightInput.workingSets.workingSetsWeight.workingSetsWeight[workingSetCount]" 
             type="number" 
             class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none block rounded-md sm:text-sm " 
             placeholder="Weight (Kg)"
@@ -59,7 +59,7 @@
           </div>
           <label class="ml-3 mt-2">Reps</label>
           <div class="ml-3">
-            <input v-model="weightInput.workingSets.workingReps[workingSetCount]" 
+            <input v-model="weightInput.workingSets.workingSets.workingReps[workingSetCount]" 
             type="number" 
             class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none block rounded-md sm:text-sm " 
             placeholder="Reps"
@@ -82,21 +82,19 @@ const selectedExercise = defineProps({
 
 const weightInput = useWeightInputStore();
 weightInput.selectedExercise = ref(selectedExercise.selectedExercise);
+let workingSetCount = ref(0);
 
 const warmUpAddSet = () => { 
   const newWarmUpSet = {
-    id: weightInput.sets.warmUpSetCount++,
+   id: weightInput.warmUpSets.warmUpSetCount++,
-    content:weightInput.sets.warmUpSetCount.toString().concat('. Set'),
+   content:weightInput.warmUpSets.warmUpSetCount.toString().concat('. Set'),
+
   };
-  weightInput.sets.warmUpSets.push(newWarmUpSet.content);
+  weightInput.warmUpSets.push(newWarmUpSet.content);
 };
 
 const workingAddSet = () => {   
-  const newWorkingSet = {
+  weightInput.workingSets.workingSetCount = ++workingSetCount;
-    id: weightInput.sets.workingSetCount++,
-    content: weightInput.sets.workingSetCount.toString().concat('. Set'),
-  };
-  weightInput.sets.workingSets.push(newWorkingSet.content);
 };
 
 const removeWarmUpSet = () => {