route lazy loading + route naming improvements

This commit is contained in:
vabene1111
2025-03-16 16:25:55 +01:00
parent e29f318453
commit c4c6eb3ca6
14 changed files with 58 additions and 238 deletions

View File

@@ -98,7 +98,7 @@
@save="(args: ShoppingListEntry) => { useShoppingStore().entries.set(e.id!, args); shoppingListFood.entries.set(e.id!, args) }"></model-edit-dialog>
</v-btn>
<v-btn color="edit" icon="$recipes" v-if="e.listRecipe && e.listRecipeData.recipe && e.ingredient"
:to="{name: 'view_recipe', params: {id: e.listRecipeData.recipe}}">
:to="{name: 'RecipeViewPage', params: {id: e.listRecipeData.recipe}}">
<v-icon icon="$recipes"></v-icon>
</v-btn>
<v-btn icon="" @click="useShoppingStore().deleteObject(e, true); shoppingListFood.entries.delete(e.id!)" color="delete">

View File

@@ -136,7 +136,7 @@ onMounted(() => {
function clickMealPlan(plan: MealPlan){
if(plan.recipe){
router.push( {name: 'view_recipe', params: {id: plan.recipe.id}})
router.push( {name: 'RecipeViewPage', params: {id: plan.recipe.id}})
}
}

View File

@@ -11,7 +11,7 @@
</v-list-item>
</template>
<template v-if="route.name == 'view_mealplan'">
<template v-if="route.name == 'MealPlanPage'">
<v-divider></v-divider>
<v-list-subheader>{{$t('Settings')}}</v-list-subheader>
<v-list-item>

View File

@@ -1,14 +1,14 @@
<template>
<template v-if="!props.loading">
<router-link :to="{name: 'view_recipe', params: {id: props.recipe.id}}">
<router-link :to="{name: 'RecipeViewPage', params: {id: props.recipe.id}}">
<recipe-image :style="{height: props.height}" :recipe="props.recipe" rounded="lg" class="mr-3 ml-3">
</recipe-image>
</router-link>
<div class="ml-3">
<div class="d-flex ">
<div class="flex-grow-1 cursor-pointer" @click="router.push({name: 'view_recipe', params: {id: props.recipe.id}})">
<div class="flex-grow-1 cursor-pointer" @click="router.push({name: 'RecipeViewPage', params: {id: props.recipe.id}})">
<p class="font-weight-bold mt-2">{{ props.recipe.name }}</p>
</div>
<div class="mt-1">

View File

@@ -51,7 +51,7 @@
</v-card-text>
<v-card-actions>
<v-btn @click="dialog=false" :to="{name: 'view_search'}" variant="plain" prepend-icon="$search">{{ $t('Advanced') }}</v-btn>
<v-btn @click="dialog=false" :to="{name: 'SearchPage'}" variant="plain" prepend-icon="$search">{{ $t('Advanced') }}</v-btn>
<v-btn @click="dialog=false" variant="plain">{{ $t('Close') }}</v-btn>
</v-card-actions>
</v-card>
@@ -71,6 +71,7 @@ import VClosableCardTitle from "@/components/dialogs/VClosableCardTitle.vue";
import {useDebounceFn} from "@vueuse/core";
import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
import {useI18n} from "vue-i18n";
import SearchPage from "@/pages/SearchPage.vue";
const router = useRouter()
const {mobile} = useDisplay()
@@ -218,11 +219,11 @@ function goToSelectedRecipe(index: number) {
let searchResult = searchResults.value[index]
if (searchResult.type == 'link_advanced_search') {
router.push({name: 'view_search', query: {'query': searchQuery.value}})
router.push({name: 'SearchPage', query: {'query': searchQuery.value}})
} else {
console.log('going to', searchResult.recipeId)
if (searchResult.recipeId != null) {
router.push({name: 'view_recipe', params: {'id': searchResult.recipeId}})
router.push({name: 'RecipeViewPage', params: {'id': searchResult.recipeId}})
}
}

View File

@@ -110,7 +110,7 @@
<v-card-text v-if="isSpaceAtRecipeLimit(useUserPreferenceStore().activeSpace)">
<v-alert color="warning" icon="fa-solid fa-triangle-exclamation">
{{$t('SpaceLimitReached')}}
<v-btn color="success" variant="flat" :to="{name: 'view_settings_space'}">{{ $t('SpaceSettings') }}</v-btn>
<v-btn color="success" variant="flat" :to="{name: 'SpaceSettings'}">{{ $t('SpaceSettings') }}</v-btn>
</v-alert>
</v-card-text>
</model-editor-base>
@@ -150,6 +150,7 @@ import ClosableHelpAlert from "@/components/display/ClosableHelpAlert.vue";
import {useDisplay} from "vuetify";
import {isSpaceAtRecipeLimit} from "@/utils/logic_utils";
import {useUserPreferenceStore} from "@/stores/UserPreferenceStore";
import SpaceSettings from "@/components/settings/SpaceSettings.vue";
const props = defineProps({