exercises from the json file are now read in the specific view

main
roberts 2023-05-02 16:29:28 +02:00
parent 6cfe95c5ee
commit cb586bdddb
12 changed files with 105 additions and 79 deletions

2
dist/assets/index-505cb6e5.js vendored Normal file

File diff suppressed because one or more lines are too long

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-fc3f27a6.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-505cb6e5.js"></script></head><body><div id="app"></div></body></html>

View File

@ -1,4 +1,4 @@
"muscle" [
{ "muscle": [
{
"name": "Legs",
"exercises":
@ -760,4 +760,4 @@
]
}
]
export default muscleExercise;
}

View File

@ -11,54 +11,6 @@ const router = createRouter({
component: HomeView
},
{... MusclesRouter},
// {
// path: '/chest',
// name: 'chest',
// // route level code-splitting
// // this generates a separate chunk (About.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import('../views/Muscles/ChestView.vue')
// },
// {
// path: '/shoulder',
// name: 'shoulder',
// // route level code-splitting
// // this generates a separate chunk (About.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import('../views/Muscles/ShoulderView.vue')
// },
// {
// path: '/legs',
// name: 'legs',
// // route level code-splitting
// // this generates a separate chunk (About.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import('../views/Muscles/LegsView.vue')
// },
// {
// path: '/back',
// name: 'back',
// // route level code-splitting
// // this generates a separate chunk (About.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import('../views/Muscles/BackView.vue')
// },
// {
// path: '/biceps',
// name: 'biceps',
// // route level code-splitting
// // this generates a separate chunk (About.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import('../views/Muscles/BicepsView.vue')
// },
// {
// path: '/triceps',
// name: 'triceps',
// // route level code-splitting
// // this generates a separate chunk (About.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import('../views/Muscles/TricepsView.vue')
// },
]
})

View File

@ -2,10 +2,9 @@ import {defineStore} from 'pinia'
import muscleExercise from '../assets/muscleExercise';
import { ref } from 'vue'
export const usePostStore = defineStore('post', () => {
export const usePostStore = defineStore('json', () => {
const postList = ref([])
const currentPost = ref(null)
const error = ref(null)
const error = ref([])
async function fetchMuscleExercise() {
postList.value = muscleExercise
@ -14,7 +13,6 @@ export const usePostStore = defineStore('post', () => {
return {
postList,
currentPost,
error,
fetchMuscleExercise
}

View File

@ -1,12 +1,27 @@
<template>
<div class="back">
<h1>Back</h1>
<label> Search</label>
<button v-for="exercise in exercises" :key="exercise.name">
{{exercise.name}}
</button>
</div>
</template>
<script setup>
</script>
<script setup>
import { usePostStore } from '@/stores/store.js'
import { onMounted, ref } from 'vue';
const json = usePostStore()
const exercises = ref([])
onMounted(async () => {
await json.fetchMuscleExercise()
exercises.value = json.postList.muscle[1].exercises
}
)
</script>
<style>
@media (min-width: 1024px) {

View File

@ -1,12 +1,27 @@
<template>
<div class="biceps">
<h1>Biceps</h1>
<label> Search</label>
<button v-for="exercise in exercises" :key="exercise.name">
{{exercise.name}}
</button>
</div>
</template>
<script setup>
</script>
<script setup>
import { usePostStore } from '@/stores/store.js'
import { onMounted, ref } from 'vue';
const json = usePostStore()
const exercises = ref([])
onMounted(async () => {
await json.fetchMuscleExercise()
exercises.value = json.postList.muscle[4].exercises
}
)
</script>
<style>
@media (min-width: 1024px) {

View File

@ -1,13 +1,27 @@
<template>
<div class="chest">
<h1>Chest</h1>
</div>
</template>
<label> Search</label>
<button v-for="exercise in exercises" :key="exercise.name">
{{exercise.name}}
</button>
</div>
</template>
<script setup>
import { usePostStore } from '@/stores/store.js'
import { onMounted, ref } from 'vue';
</script>
const json = usePostStore()
const exercises = ref([])
onMounted(async () => {
await json.fetchMuscleExercise()
exercises.value = json.postList.muscle[2].exercises
}
)
</script>
<style>
@media (min-width: 1024px) {
.about {

View File

@ -1,23 +1,25 @@
<template>
<div class="legs">
<h1>Legs</h1>
<div v-for="post in post.postList">
<h2>{{post.exercise}}</h2>
<p>{{post.body}}</p>
</div>
<label> Search</label>
<button v-for="exercise in exercises" :key="exercise.name">
{{exercise.name}}
</button>
</div>
</template>
<script setup>
import { usePostStore } from '@/stores/post.js'
import { onMounted } from 'vue';
import { usePostStore } from '@/stores/store.js'
import { onMounted, ref } from 'vue';
const post = usePostStore()
const json = usePostStore()
const exercises = ref([])
onMounted(() => {
post.fetchMuscleExercise()
}
)
onMounted(async () => {
await json.fetchMuscleExercise()
exercises.value = json.postList.muscle[0].exercises
}
)
</script>

View File

@ -1,12 +1,27 @@
<template>
<div class="shoulder">
<h1>Shoulder</h1>
<label> Search</label>
<button v-for="exercise in exercises" :key="exercise.name">
{{exercise.name}}
</button>
</div>
</template>
<script setup>
import { usePostStore } from '@/stores/store.js'
import { onMounted, ref } from 'vue';
</script>
const json = usePostStore()
const exercises = ref([])
onMounted(async () => {
await json.fetchMuscleExercise()
exercises.value = json.postList.muscle[3].exercises
}
)
</script>
<style>
@media (min-width: 1024px) {

View File

@ -1,12 +1,27 @@
<template>
<div class="triceps">
<h1><button>Triceps</button></h1>
<label> Search</label>
<button v-for="exercise in exercises" :key="exercise.name">
{{exercise.name}}
</button>
</div>
</template>
<script setup>
import { usePostStore } from '@/stores/store.js'
import { onMounted, ref } from 'vue';
</script>
const json = usePostStore()
const exercises = ref([])
onMounted(async () => {
await json.fetchMuscleExercise()
exercises.value = json.postList.muscle[5].exercises
}
)
</script>
<style>
@media (min-width: 1024px) {