mirror of
https://github.com/hay-kot/mealie.git
synced 2025-08-21 05:53:36 -07:00
refactor/breakup router
This commit is contained in:
hay-kot
parent
8534824b3d
commit
ec10a32c8a
7 changed files with 146 additions and 116 deletions
|
|
@ -3,50 +3,16 @@ import App from "./App.vue";
|
|||
import vuetify from "./plugins/vuetify";
|
||||
import store from "./store";
|
||||
import VueRouter from "vue-router";
|
||||
import { routes } from "./routes";
|
||||
import { router } from "./routes";
|
||||
import i18n from "./i18n";
|
||||
import FlashMessage from "@smartweb/vue-flash-message";
|
||||
import "@mdi/font/css/materialdesignicons.css";
|
||||
import "typeface-roboto/index.css";
|
||||
import VueI18n from "@/i18n";
|
||||
import Vuetify from "@/plugins/vuetify";
|
||||
|
||||
Vue.use(FlashMessage);
|
||||
Vue.config.productionTip = false;
|
||||
Vue.use(VueRouter);
|
||||
|
||||
const router = new VueRouter({
|
||||
routes,
|
||||
mode: process.env.NODE_ENV === "production" ? "history" : "hash",
|
||||
});
|
||||
|
||||
const DEFAULT_TITLE = "Mealie";
|
||||
const TITLE_SEPARATOR = "🍴";
|
||||
const TITLE_SUFFIX = " " + TITLE_SEPARATOR + " " + DEFAULT_TITLE;
|
||||
router.afterEach(to => {
|
||||
Vue.nextTick(async () => {
|
||||
if (typeof to.meta.title === "function") {
|
||||
const title = await to.meta.title(to);
|
||||
document.title = title + TITLE_SUFFIX;
|
||||
} else {
|
||||
document.title = to.meta.title
|
||||
? to.meta.title + TITLE_SUFFIX
|
||||
: DEFAULT_TITLE;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
async function loadLocale() {
|
||||
console.log("Router Lang", store.getters.getActiveLang);
|
||||
VueI18n.locale = store.getters.getActiveLang;
|
||||
Vuetify.framework.lang.current = store.getters.getActiveLang;
|
||||
}
|
||||
|
||||
router.beforeEach((__, _, next) => {
|
||||
loadLocale();
|
||||
next();
|
||||
});
|
||||
|
||||
const vueApp = new Vue({
|
||||
vuetify,
|
||||
store,
|
||||
|
|
@ -71,5 +37,4 @@ let titleCase = function(value) {
|
|||
Vue.filter("truncate", truncate);
|
||||
Vue.filter("titleCase", titleCase);
|
||||
|
||||
export { vueApp };
|
||||
export { router };
|
||||
export { router, vueApp };
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import About from "@/pages/Admin/About";
|
|||
import { store } from "../store";
|
||||
import i18n from '@/i18n.js';
|
||||
|
||||
export default {
|
||||
export const adminRoutes = {
|
||||
path: "/admin",
|
||||
component: Admin,
|
||||
beforeEnter: (to, _from, next) => {
|
||||
|
|
|
|||
18
frontend/src/routes/auth.js
Normal file
18
frontend/src/routes/auth.js
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
import LoginPage from "@/pages/LoginPage";
|
||||
import SignUpPage from "@/pages/SignUpPage";
|
||||
import { store } from "../store";
|
||||
|
||||
export const authRoutes = [
|
||||
{
|
||||
path: "/logout",
|
||||
beforeEnter: (_to, _from, next) => {
|
||||
store.commit("setToken", "");
|
||||
store.commit("setIsLoggedIn", false);
|
||||
next("/");
|
||||
},
|
||||
},
|
||||
{ path: "/login", component: LoginPage },
|
||||
|
||||
{ path: "/sign-up", redirect: "/" },
|
||||
{ path: "/sign-up/:token", component: SignUpPage },
|
||||
];
|
||||
15
frontend/src/routes/general.js
Normal file
15
frontend/src/routes/general.js
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
import i18n from "@/i18n.js";
|
||||
import SearchPage from "@/pages/SearchPage";
|
||||
import HomePage from "@/pages/HomePage";
|
||||
|
||||
export const generalRoutes = [
|
||||
{ path: "/", name: "home", component: HomePage },
|
||||
{ path: "/mealie", component: HomePage },
|
||||
{
|
||||
path: "/search",
|
||||
component: SearchPage,
|
||||
meta: {
|
||||
title: i18n.t("search.search"),
|
||||
},
|
||||
},
|
||||
];
|
||||
|
|
@ -1,86 +1,55 @@
|
|||
import HomePage from "@/pages/HomePage";
|
||||
import Page404 from "@/pages/404Page";
|
||||
import SearchPage from "@/pages/SearchPage";
|
||||
import ViewRecipe from "@/pages/Recipe/ViewRecipe";
|
||||
import NewRecipe from "@/pages/Recipe/NewRecipe";
|
||||
import CustomPage from "@/pages/Recipes/CustomPage";
|
||||
import AllRecipes from "@/pages/Recipes/AllRecipes";
|
||||
import CategoryPage from "@/pages/Recipes/CategoryPage";
|
||||
import TagPage from "@/pages/Recipes/TagPage";
|
||||
import Planner from "@/pages/MealPlan/Planner";
|
||||
import Debug from "@/pages/Debug";
|
||||
import LoginPage from "@/pages/LoginPage";
|
||||
import SignUpPage from "@/pages/SignUpPage";
|
||||
import ThisWeek from "@/pages/MealPlan/ThisWeek";
|
||||
import { api } from "@/api";
|
||||
import Admin from "./admin";
|
||||
import { adminRoutes } from "./admin";
|
||||
import { authRoutes } from "./auth";
|
||||
import { recipeRoutes } from "./recipes";
|
||||
import { mealRoutes } from "./meal";
|
||||
import { generalRoutes } from "./general";
|
||||
import { store } from "../store";
|
||||
import i18n from "@/i18n.js";
|
||||
import VueRouter from "vue-router";
|
||||
import VueI18n from "@/i18n";
|
||||
import Vuetify from "@/plugins/vuetify";
|
||||
import Vue from "vue";
|
||||
|
||||
export const routes = [
|
||||
{ path: "/", name: "home", component: HomePage },
|
||||
{
|
||||
path: "/logout",
|
||||
beforeEnter: (_to, _from, next) => {
|
||||
store.commit("setToken", "");
|
||||
store.commit("setIsLoggedIn", false);
|
||||
next("/");
|
||||
},
|
||||
},
|
||||
{ path: "/mealie", component: HomePage },
|
||||
{ path: "/login", component: LoginPage },
|
||||
{ path: "/sign-up", redirect: "/" },
|
||||
{ path: "/sign-up/:token", component: SignUpPage },
|
||||
{ path: "/debug", component: Debug },
|
||||
{
|
||||
path: "/search",
|
||||
component: SearchPage,
|
||||
meta: {
|
||||
title: i18n.t("search.search"),
|
||||
},
|
||||
},
|
||||
{ path: "/recipes/all", component: AllRecipes },
|
||||
{ path: "/pages/:customPage", component: CustomPage },
|
||||
{ path: "/recipes/tag/:tag", component: TagPage },
|
||||
{ path: "/recipes/category/:category", component: CategoryPage },
|
||||
{
|
||||
path: "/recipe/:recipe",
|
||||
component: ViewRecipe,
|
||||
meta: {
|
||||
title: async route => {
|
||||
const recipe = await api.recipes.requestDetails(route.params.recipe);
|
||||
return recipe.name;
|
||||
},
|
||||
},
|
||||
},
|
||||
{ path: "/new/", component: NewRecipe },
|
||||
{
|
||||
path: "/meal-plan/planner",
|
||||
component: Planner,
|
||||
meta: {
|
||||
title: i18n.t("meal-plan.meal-planner"),
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/meal-plan/this-week",
|
||||
component: ThisWeek,
|
||||
meta: {
|
||||
title: i18n.t("meal-plan.dinner-this-week"),
|
||||
},
|
||||
},
|
||||
Admin,
|
||||
{
|
||||
path: "/meal-plan/today",
|
||||
beforeEnter: async (_to, _from, next) => {
|
||||
await todaysMealRoute().then(redirect => {
|
||||
next(redirect);
|
||||
});
|
||||
},
|
||||
},
|
||||
...generalRoutes,
|
||||
adminRoutes,
|
||||
...authRoutes,
|
||||
...mealRoutes,
|
||||
...recipeRoutes,
|
||||
|
||||
{ path: "*", component: Page404 },
|
||||
];
|
||||
|
||||
async function todaysMealRoute() {
|
||||
const response = await api.mealPlans.today();
|
||||
return "/recipe/" + response.data;
|
||||
const router = new VueRouter({
|
||||
routes,
|
||||
mode: process.env.NODE_ENV === "production" ? "history" : "hash",
|
||||
});
|
||||
|
||||
const DEFAULT_TITLE = "Mealie";
|
||||
const TITLE_SEPARATOR = "🍴";
|
||||
const TITLE_SUFFIX = " " + TITLE_SEPARATOR + " " + DEFAULT_TITLE;
|
||||
router.afterEach(to => {
|
||||
Vue.nextTick(async () => {
|
||||
if (typeof to.meta.title === "function") {
|
||||
const title = await to.meta.title(to);
|
||||
document.title = title + TITLE_SUFFIX;
|
||||
} else {
|
||||
document.title = to.meta.title
|
||||
? to.meta.title + TITLE_SUFFIX
|
||||
: DEFAULT_TITLE;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function loadLocale() {
|
||||
console.log("Router Lang", store.getters.getActiveLang);
|
||||
VueI18n.locale = store.getters.getActiveLang;
|
||||
Vuetify.framework.lang.current = store.getters.getActiveLang;
|
||||
}
|
||||
|
||||
router.beforeEach((__, _, next) => {
|
||||
loadLocale();
|
||||
next();
|
||||
});
|
||||
|
||||
export { router };
|
||||
|
|
|
|||
34
frontend/src/routes/meal.js
Normal file
34
frontend/src/routes/meal.js
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
import Planner from "@/pages/MealPlan/Planner";
|
||||
import ThisWeek from "@/pages/MealPlan/ThisWeek";
|
||||
import i18n from "@/i18n.js";
|
||||
import { api } from "@/api";
|
||||
|
||||
export const mealRoutes = [
|
||||
{
|
||||
path: "/meal-plan/planner",
|
||||
component: Planner,
|
||||
meta: {
|
||||
title: i18n.t("meal-plan.meal-planner"),
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/meal-plan/this-week",
|
||||
component: ThisWeek,
|
||||
meta: {
|
||||
title: i18n.t("meal-plan.dinner-this-week"),
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/meal-plan/today",
|
||||
beforeEnter: async (_to, _from, next) => {
|
||||
await todaysMealRoute().then(redirect => {
|
||||
next(redirect);
|
||||
});
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
async function todaysMealRoute() {
|
||||
const response = await api.mealPlans.today();
|
||||
return "/recipe/" + response.data;
|
||||
}
|
||||
29
frontend/src/routes/recipes.js
Normal file
29
frontend/src/routes/recipes.js
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
import ViewRecipe from "@/pages/Recipe/ViewRecipe";
|
||||
import NewRecipe from "@/pages/Recipe/NewRecipe";
|
||||
import CustomPage from "@/pages/Recipes/CustomPage";
|
||||
import AllRecipes from "@/pages/Recipes/AllRecipes";
|
||||
import CategoryPage from "@/pages/Recipes/CategoryPage";
|
||||
import TagPage from "@/pages/Recipes/TagPage";
|
||||
import { api } from "@/api";
|
||||
|
||||
export const recipeRoutes = [
|
||||
// Recipes
|
||||
{ path: "/recipes/all", component: AllRecipes },
|
||||
{ path: "/recipes/tag/:tag", component: TagPage },
|
||||
{ path: "/recipes/category/:category", component: CategoryPage },
|
||||
// Misc
|
||||
{ path: "/new/", component: NewRecipe },
|
||||
{ path: "/pages/:customPage", component: CustomPage },
|
||||
|
||||
// Recipe Page
|
||||
{
|
||||
path: "/recipe/:recipe",
|
||||
component: ViewRecipe,
|
||||
meta: {
|
||||
title: async route => {
|
||||
const recipe = await api.recipes.requestDetails(route.params.recipe);
|
||||
return recipe.name;
|
||||
},
|
||||
},
|
||||
},
|
||||
];
|
||||
Loading…
Add table
Add a link
Reference in a new issue