mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-07-19 13:19:41 +02:00
Feature: Global Timeline (#2265)
* extended query filter to accept nested tables * decoupled timeline api from recipe slug * modified frontend to use simplified events api * fixed nested loop index ghosting * updated existing tests * gave mypy a snack * added tests for nested queries * fixed "last made" render error * decoupled recipe timeline from dialog * removed unused props * tweaked recipe get_all to accept ids * created group global timeline added new timeline page to sidebar reformatted the recipe timeline added vertical option to recipe card mobile * extracted timeline item into its own component * fixed apploader centering * added paginated scrolling to recipe timeline * added sort direction config fixed infinite scroll on dialog fixed hasMore var not resetting during instantiation * added sort direction to user preferences * updated API docs with new query filter feature * better error tracing * fix for recipe not found response * simplified recipe crud route for slug/id added test for fetching by slug/id * made query filter UUID validation clearer * moved timeline menu option below shopping lists --------- Co-authored-by: Hayden <64056131+hay-kot@users.noreply.github.com>
This commit is contained in:
parent
0e397b34fd
commit
fe17922bb8
28 changed files with 871 additions and 506 deletions
|
@ -14,17 +14,20 @@
|
|||
{{ $globals.icons.timelineText }}
|
||||
</v-icon>
|
||||
</v-btn>
|
||||
<RecipeDialogTimeline v-model="showTimeline" :slug="slug" :recipe-name="recipeName" />
|
||||
<BaseDialog v-model="showTimeline" :title="timelineAttrs.title" :icon="$globals.icons.timelineText" width="70%">
|
||||
<RecipeTimeline v-model="showTimeline" :query-filter="timelineAttrs.queryFilter" max-height="70vh" />
|
||||
</BaseDialog>
|
||||
|
||||
</template>
|
||||
<span>{{ $t('recipe.open-timeline') }}</span>
|
||||
</v-tooltip>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref } from "@nuxtjs/composition-api";
|
||||
import RecipeDialogTimeline from "./RecipeDialogTimeline.vue";
|
||||
import { computed, defineComponent, ref, useContext } from "@nuxtjs/composition-api";
|
||||
import RecipeTimeline from "./RecipeTimeline.vue";
|
||||
export default defineComponent({
|
||||
components: { RecipeDialogTimeline },
|
||||
components: { RecipeTimeline },
|
||||
|
||||
props: {
|
||||
buttonStyle: {
|
||||
|
@ -41,13 +44,26 @@ export default defineComponent({
|
|||
},
|
||||
},
|
||||
|
||||
setup() {
|
||||
setup(props) {
|
||||
const { $vuetify, i18n } = useContext();
|
||||
const showTimeline = ref(false);
|
||||
function toggleTimeline() {
|
||||
showTimeline.value = !showTimeline.value;
|
||||
}
|
||||
|
||||
return { showTimeline, toggleTimeline };
|
||||
const timelineAttrs = computed(() => {
|
||||
let title = i18n.tc("recipe.timeline")
|
||||
if ($vuetify.breakpoint.smAndDown) {
|
||||
title += ` – ${props.recipeName}`
|
||||
}
|
||||
|
||||
return {
|
||||
title,
|
||||
queryFilter: `recipe.slug="${props.slug}"`,
|
||||
}
|
||||
})
|
||||
|
||||
return { showTimeline, timelineAttrs, toggleTimeline };
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue