Currently working on developing a fitness app with Vue, aiming to create personalized workout routines based on user preferences. Users can choose specific options and generate a workout plan by clicking a button. The collected data is stored as an object of arrays, where each array contains objects representing the selected options (e.g., workout duration, difficulty level, preferred exercises).
this.generatorData = {
types: [],
style: [],
muscleGroups: [],
difficulty: [
{ title: 'Beginner', ..some properties },
{ title: 'Intermediate', .. }
]
}
In addition, I have a list of predefined exercises that share similar properties as the generated objects.
exercises: [
{
title: 'Name',
type: 'Weights',
style: ['Strength Building'],
muscleGroups: ['Back', 'Chest'],
difficulty: 'Intermediate'
},
{
title: 'Name',
type: 'Weights',
style: ['Strength Building'],
muscleGroups: ['Back', 'Chest'],
difficulty: 'Intermediate'
}
]
The goal is to match exercises with the user's preferences specified in the data object. Trying to achieve this using a function, but it currently involves hardcoding and does not meet the desired expectations. Want to automate the process of comparing the data from this.generatorData with the exercises - iterate through all exercises and identify those that meet the criteria. Is there a way to enhance this functionality and make the function more efficient?
match() {
let categories = Object.values(this.generatorData)
for(let category of categories) {
if(category.length > 1) {
this.exercises.filter(exercise => {
if(exercise.type === category[0].name || exercise.type === category[1].name || exercise.type === category[2].name) {
if(exercise.difficulty === category[categories.length - 1].name) {
this.matchedExercies.push(exercise)
}
}
})
}
else if(category.length === 1) {
let filtered = this.exercises.filter(exercise => exercise.type === category[0].name)
console.log(filtered)
this.matchedExercies = filtered
}
}
}
Access the codeSandbox here.