expanded muscel prop button now knows which exercise was clicked

main
roberts 2023-05-09 18:16:38 +02:00
parent 7991269dcf
commit c036a97d39
5 changed files with 17 additions and 15 deletions

File diff suppressed because one or more lines are too long

2
dist/index.html vendored
View File

@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="UTF-8"><link rel="icon" href="./logo.ico"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Gym Tracker</title><script type="module" crossorigin src="./assets/index-f3984685.js"></script></head><body><div id="app"></div></body></html> <!doctype html><html lang="en"><head><meta charset="UTF-8"><link rel="icon" href="./logo.ico"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Gym Tracker</title><script type="module" crossorigin src="./assets/index-17e1b7ef.js"></script></head><body><div id="app"></div></body></html>

View File

@ -3,10 +3,11 @@
<div class="flex"> <div class="flex">
<div class="exerciseList"> <div class="exerciseList">
<ul class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name"> <ul class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name">
<Button @click="exerciseClick(exercise)" class="btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4" :class="{'btn--primary': primary}">{{ exercise.name }}</Button> <Button @click="exerciseClick(exercise)" class="btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4" >{{ exercise.name }}</Button>
</ul> </ul>
</div> </div>
<div v-if="isClicked"> <div v-show="isClicked" class="show">
<label> {{ exerciseName }}</label>
<WeightsInput/> <WeightsInput/>
</div> </div>
</div> </div>
@ -19,13 +20,17 @@
import WeightsInput from "@/views/weight/WeightsInput.vue"; import WeightsInput from "@/views/weight/WeightsInput.vue";
const muscle = defineProps({ const muscle = defineProps({
muscle: String muscle: String,
warmUpSets: Array,
workingSets: Array,
warmUpReps: Array,
workingReps: Array,
}) })
const isClicked = false let isClicked = false
const primary = true
const json = usePostStore() const json = usePostStore()
const exercises = ref([]) const exercises = ref([])
let exerciseName = ""
onMounted(async () => { onMounted(async () => {
await json.fetchMuscleExercise() await json.fetchMuscleExercise()
@ -65,9 +70,9 @@ const showWeightInput = (isClicked) => {
} }
const exerciseClick = (exercise) => { const exerciseClick = (exercise) => {
console.log(exercise.name)
isClicked = true isClicked = true
return exercise.name exerciseName = exercise.name
console.log(isClicked)
} }

View File

@ -4,16 +4,12 @@
<h1>Chest</h1> <h1>Chest</h1>
<ExerciseList muscle="Chest"/> <ExerciseList muscle="Chest"/>
</div> </div>
<WeightsInput/>
</div> </div>
</template> </template>
<script setup> <script setup>
import {ExerciseList} from "@/components/Index.js"; import {ExerciseList} from "@/components/Index.js";
import WeightsInput from "@/views/weight/WeightsInput.vue";
const exerciseListButton = ExerciseList
ExerciseList.exerciseClick
</script> </script>
<style> <style>

View File

@ -21,7 +21,7 @@
</div> </div>
<label>Reps</label> <label>Reps</label>
<div class="ml-3"> <div class="ml-3">
<input v-model="workingInput" class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1" placeholder="Reps"> <input v-model="ExerciseList.workingReps" class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1" placeholder="Reps">
</div> </div>
</div> </div>
</div> </div>
@ -35,6 +35,7 @@
<script setup> <script setup>
import {ref} from 'vue' import {ref} from 'vue'
import { useWeightStore } from '@/stores/storeWeight'; import { useWeightStore } from '@/stores/storeWeight';
import {ExerciseList} from "@/components/Index.js";
let warmUpSetCount = 0; let warmUpSetCount = 0;
let workingSetCount = 0; let workingSetCount = 0;