1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-30 18:49:41 +02:00

feature/profile-cards (#391)

* unify format

* pass variables

* remove namespace

* rename

* group-card init

* shuffle + icons

* remove console.logs

* token CRUD

* update changelog

* add profile link

* consolidate mealplan to profile dashboard

* update docs

* add query parameter to search page

* update test routes

* update python depts

* basic token tests

Co-authored-by: hay-kot <hay-kot@pm.me>
This commit is contained in:
Hayden 2021-05-06 21:08:27 -08:00 committed by GitHub
parent f4384167f6
commit 95ec13161f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
41 changed files with 977 additions and 449 deletions

View file

@ -1,24 +1,23 @@
<template>
<v-container>
<v-card flat height="100%">
<v-app-bar flat>
<v-spacer></v-spacer>
<v-card-title class="text-center justify-center py-3 ">
{{ title.toUpperCase() }}
</v-card-title>
<v-spacer></v-spacer>
<v-app-bar color="transparent" flat class="mt-n1 rounded">
<v-icon large left>
mdi-tag-multiple-outline
</v-icon>
<v-toolbar-title class="headline"> {{ page.name }} </v-toolbar-title>
</v-app-bar>
<div v-if="render">
<v-tabs v-model="tab" background-color="transparent" grow>
<v-tab v-for="item in categories" :key="item.slug">
<v-tab v-for="item in page.categories" :key="item.slug" :href="`#${item.slug}`">
{{ item.name }}
</v-tab>
</v-tabs>
<v-tabs-items v-model="tab">
<v-tab-item v-for="(item, index) in categories" :key="item.slug + index">
<CardSection class="mb-5 mx-1" :recipes="filterRecipe(item.slug)" />
<v-tab-item v-for="(item, index) in page.categories" :key="item.slug + index" :value="item.slug">
<CardSection class="mb-5 mx-1" :recipes="item.recipes" @sort="sortRecipes($event, index)" />
</v-tab-item>
</v-tabs-items>
</div>
@ -36,8 +35,8 @@ export default {
},
data() {
return {
page: "",
title: "",
tab: null,
render: false,
recipeStore: [],
categories: [],
@ -47,6 +46,14 @@ export default {
pageSlug() {
return this.$route.params.customPage;
},
tab: {
set(tab) {
this.$router.replace({ query: { ...this.$route.query, tab } });
},
get() {
return this.$route.query.tab;
},
},
},
watch: {
@ -61,27 +68,15 @@ export default {
},
methods: {
async buildPage() {
const page = await api.siteSettings.getPage(this.pageSlug);
this.title = page.name;
this.categories = page.categories;
page.categories.forEach(async element => {
let categoryRecipes = await this.getRecipeByCategory(element.slug);
this.recipeStore.push(categoryRecipes);
});
},
async getRecipeByCategory(category) {
return await api.categories.getRecipesInCategory(category);
this.page = await api.siteSettings.getPage(this.pageSlug);
},
filterRecipe(slug) {
const storeCategory = this.recipeStore.find(element => element.slug === slug);
return storeCategory ? storeCategory.recipes : [];
},
sortRecipes(sortedRecipes, destKey) {
this.page.categories[destKey].recipes = sortedRecipes;
},
},
};
</script>
<style>
.header-background {
background-color: #121619;
}
</style>