expanded muscel prop button now knows which exercise was clicked
parent
7991269dcf
commit
c036a97d39
File diff suppressed because one or more lines are too long
|
|
@ -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>
|
||||||
|
|
@ -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)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue