Yeti
/
gym
1
0
Fork 0
Code Issues Pull Requests 2 Packages Projects Releases Wiki Activity

wip on button click show weightinput view and state of weigtinput

main
rYeti 2023-05-08 00:51:04 +02:00
parent 3010fd62be
commit 7991269dcf
7 changed files with 160 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
package-lock.json generated
View File

@ -8,6 +8,7 @@
"name": "gym_tracker",
"version": "0.0.0",
"dependencies": {
"@vueuse/core": "^10.1.2",
"pinia": "^2.0.32",
"uuid": "^9.0.0",
"vite-plugin-css-injected-by-js": "^3.1.0",
@ -660,6 +661,11 @@
"integrity": "sha512-E5Kwq2n4SbMzQOn6wnmBjuK9ouqlURrcZDVfbo9ftDDTFt3nk7ZKK4GMOzoYgnpQJKcxwQw+lGaBvvlMo0qN/Q==",
"devOptional": true
},
"node_modules/@types/web-bluetooth": {
"version": "0.0.17",
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.17.tgz",
"integrity": "sha512-4p9vcSmxAayx72yn70joFoL44c9MO/0+iVEBIQXe3v2h2SiAsEIo/G5v6ObFWvNKRFjbrVadNf9LqEEZeQPzdA=="
},
"node_modules/@vitejs/plugin-vue": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.1.0.tgz",
@ -882,6 +888,89 @@
"vue": "^3.0.1"
}
},
"node_modules/@vueuse/core": {
"version": "10.1.2",
"resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.1.2.tgz",
"integrity": "sha512-roNn8WuerI56A5uiTyF/TEYX0Y+VKlhZAF94unUfdhbDUI+NfwQMn4FUnUscIRUhv3344qvAghopU4bzLPNFlA==",
"dependencies": {
"@types/web-bluetooth": "^0.0.17",
"@vueuse/metadata": "10.1.2",
"@vueuse/shared": "10.1.2",
"vue-demi": ">=0.14.0"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/@vueuse/core/node_modules/vue-demi": {
"version": "0.14.0",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.0.tgz",
"integrity": "sha512-gt58r2ogsNQeVoQ3EhoUAvUsH9xviydl0dWJj7dabBC/2L4uBId7ujtCwDRD0JhkGsV1i0CtfLAeyYKBht9oWg==",
"hasInstallScript": true,
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^3.0.0-0 || ^2.6.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/@vueuse/metadata": {
"version": "10.1.2",
"resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.1.2.tgz",
"integrity": "sha512-3mc5BqN9aU2SqBeBuWE7ne4OtXHoHKggNgxZR2K+zIW4YLsy6xoZ4/9vErQs6tvoKDX6QAqm3lvsrv0mczAwIQ==",
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/@vueuse/shared": {
"version": "10.1.2",
"resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.1.2.tgz",
"integrity": "sha512-1uoUTPBlgyscK9v6ScGeVYDDzlPSFXBlxuK7SfrDGyUTBiznb3mNceqhwvZHjtDRELZEN79V5uWPTF1VDV8svA==",
"dependencies": {
"vue-demi": ">=0.14.0"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/@vueuse/shared/node_modules/vue-demi": {
"version": "0.14.0",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.0.tgz",
"integrity": "sha512-gt58r2ogsNQeVoQ3EhoUAvUsH9xviydl0dWJj7dabBC/2L4uBId7ujtCwDRD0JhkGsV1i0CtfLAeyYKBht9oWg==",
"hasInstallScript": true,
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^3.0.0-0 || ^2.6.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/abab": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",

1
package.json
View File

@ -13,6 +13,7 @@
"format": "prettier --write src/"
},
"dependencies": {
"@vueuse/core": "^10.1.2",
"pinia": "^2.0.32",
"uuid": "^9.0.0",
"vite-plugin-css-injected-by-js": "^3.1.0",

17
src/components/ExerciseList.vue
View File

@ -3,9 +3,12 @@
<div class="flex">
<div class="exerciseList">
<ul class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name">
<Button 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" :class="{'btn--primary': primary}">{{ exercise.name }}</Button>
</ul>
</div>
<div v-if="isClicked">
<WeightsInput/>
</div>
</div>
</template>
@ -19,6 +22,7 @@
muscle: String
})
const isClicked = false
const primary = true
const json = usePostStore()
const exercises = ref([])
@ -56,6 +60,17 @@
});
};
const showWeightInput = (isClicked) => {
isClicked.value = true
}
const exerciseClick = (exercise) => {
console.log(exercise.name)
isClicked = true
return exercise.name
}
</script>
<style>

5
src/router/index.js
View File

@ -11,6 +11,11 @@ const router = createRouter({
component: HomeView
},
{... MusclesRouter},
{
path: '/weightsinput',
name: 'weightsinput',
component: () => import('../views/weight/WeightsInput.vue')
}
]
})

22
src/stores/storeWeight.js Normal file
View File

@ -0,0 +1,22 @@
import {defineStore} from 'pinia'
import {useStorage} from '@vueuse/core'
//see https://stephanlangeveld.medium.com/simple-local-storage-implementation-using-vue-3-vueuse-and-pinia-with-zero-extra-lines-of-code-cb9ed2cce42a
export const useWeightStore = defineStore({
id: 'weight',
state: () => ({
weight: [],
reps: []
}),
getters: {
getAllWeights() {
return this.weight.value
},
},
actions: {
addWeight(weight, reps) {
this.weight.push(weight);
this.reps.push(reps);
},
}
})

3
src/views/muscles/Chest.vue
View File

@ -11,6 +11,9 @@
<script setup>
import {ExerciseList} from "@/components/Index.js";
import WeightsInput from "@/views/weight/WeightsInput.vue";
const exerciseListButton = ExerciseList
ExerciseList.exerciseClick
</script>
<style>

32
src/views/weight/WeightsInput.vue
View File

@ -14,33 +14,41 @@
<button @click="workingAddSet()" class="add-btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded ml-7">Add</button>
<div>
<div v-for="workingset in workingSets" class="item flex justify-smart mt-3" :key="workingset">
<div v-for="(workingset, index) in workingSets" class="item flex justify-smart mt-3" :key="index">
{{ workingset }}
<div class="ml-3">
<input type="workingInput" name="workinweight" 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="Weight in Kg"/>
<input v-model="workingSetInput" 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="Weight in Kg"/>
</div>
<label>Reps</label>
<div class="ml-3">
<input type="workingInput" name="workinweight" 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="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">
</div>
</div>
</div>
</div>
<button @click="addWeight()" class="add-btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded mt-5">Save</button>
</div>
</template>
<script setup>
import {ref} from 'vue'
import { useWeightStore } from '@/stores/storeWeight';
let warmUpSetCount = 0;
let workingSetCunt = 0;
let workingSetCount = 0;
const warmUpInput = ref('');
const workingInput = ref('');
const weight = useWeightStore();
const workingSetInput = ref('');
const workingRepsSets = ref('');
const warmUpSets = ref([]);
const workingSets = ref([]);
const warmUpInput = () => {
weightInput.value = warmUpInput.value;
repInput.value = warmUpInput.value;
}
const warmUpAddSet = () => {
const newWarmUpSet = {
id: warmUpSetCount++,
@ -50,11 +58,19 @@ const warmUpAddSet = () => {
}
const workingAddSet = () => { const newWorkingSet = {
id: workingSetCunt++,
content: workingSetCunt + ". Set"
id: workingSetCount++,
content: workingSetCount + ". Set"
};
workingSets.value.push(newWorkingSet.content);};
const addWeight = () => {
weight.addWeight(workingSetInput.value, workingRepsSets.value);
workingSetInput.value = "";
workingRepsSets.value = "";
}
console.log(addWeight);
</script>
<style>