Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-24 15:49:42 +02:00
Code Issues Releases Activity

feat: Migrate to Nuxt 3 framework (#5184)

Browse source 
Co-authored-by: Michael Genson <71845777+michael-genson@users.noreply.github.com>
Co-authored-by: Kuchenpirat <24235032+Kuchenpirat@users.noreply.github.com>
This commit is contained in:
Hoa (Kyle) Trinh 2025-06-20 00:09:12 +07:00 • committed by GitHub
parent 89ab7fac25
commit c24d532608
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
403 changed files with 23959 additions and 19557 deletions
Download patch file Download diff file Expand all files Collapse all files

184
frontend/layouts/admin.vue
View file

@ -1,5 +1,16 @@
<template>
<v-app dark>
<TheSnackbar />
<AppHeader>
<v-btn
icon
@click.stop="sidebar = !sidebar"
>
<v-icon> {{ $globals.icons.menu }}</v-icon>
</v-btn>
</AppHeader>
<AppSidebar
v-model="sidebar"
absolute
@ -10,123 +21,104 @@
:secondary-links="developerLinks"
/>
<TheSnackbar />
<AppHeader>
<v-btn icon @click.stop="sidebar = !sidebar">
<v-icon> {{ $globals.icons.menu }}</v-icon>
</v-btn>
</AppHeader>
<v-main>
<v-scroll-x-transition>
<Nuxt />
<div>
<NuxtPage />
</div>
</v-scroll-x-transition>
</v-main>
</v-app>
</template>
<script lang="ts">
import { defineComponent, ref, useContext, onMounted } from "@nuxtjs/composition-api";
<script setup lang="ts">
import AppHeader from "@/components/Layout/LayoutParts/AppHeader.vue";
import AppSidebar from "@/components/Layout/LayoutParts/AppSidebar.vue";
import TheSnackbar from "~/components/Layout/LayoutParts/TheSnackbar.vue";
import { SidebarLinks } from "~/types/application-types";
import type { SidebarLinks } from "~/types/application-types";
export default defineComponent({
components: { AppHeader, AppSidebar, TheSnackbar },
middleware: ["auth", "admin-only"],
auth: true,
setup() {
const { $globals, i18n, $vuetify } = useContext();
const i18n = useI18n();
const { $globals, $vuetify } = useNuxtApp();
const sidebar = ref<boolean | null>(null);
onMounted(() => {
sidebar.value = !$vuetify.breakpoint.md;
});
const sidebar = ref<boolean>(false);
onMounted(() => {
sidebar.value = !$vuetify.display.md.value;
});
const topLinks: SidebarLinks = [
{
icon: $globals.icons.cog,
to: "/admin/site-settings",
title: i18n.tc("sidebar.site-settings"),
restricted: true,
},
const topLinks: SidebarLinks = [
{
icon: $globals.icons.cog,
to: "/admin/site-settings",
title: i18n.t("sidebar.site-settings"),
restricted: true,
},
// {
// icon: $globals.icons.chart,
// to: "/admin/analytics",
// title: "Analytics",
// restricted: true,
// },
{
icon: $globals.icons.user,
to: "/admin/manage/users",
title: i18n.tc("user.users"),
restricted: true,
},
{
icon: $globals.icons.household,
to: "/admin/manage/households",
title: i18n.tc("household.households"),
restricted: true,
},
{
icon: $globals.icons.group,
to: "/admin/manage/groups",
title: i18n.tc("group.groups"),
restricted: true,
},
{
icon: $globals.icons.database,
to: "/admin/backups",
title: i18n.tc("sidebar.backups"),
restricted: true,
},
];
// {
// icon: $globals.icons.chart,
// to: "/admin/analytics",
// title: "Analytics",
// restricted: true,
// },
{
icon: $globals.icons.user,
to: "/admin/manage/users",
title: i18n.t("user.users"),
restricted: true,
},
{
icon: $globals.icons.household,
to: "/admin/manage/households",
title: i18n.t("household.households"),
restricted: true,
},
{
icon: $globals.icons.group,
to: "/admin/manage/groups",
title: i18n.t("group.groups"),
restricted: true,
},
{
icon: $globals.icons.database,
to: "/admin/backups",
title: i18n.t("sidebar.backups"),
restricted: true,
},
];
const developerLinks: SidebarLinks = [
{
icon: $globals.icons.wrench,
to: "/admin/maintenance",
title: i18n.tc("sidebar.maintenance"),
restricted: true,
},
const developerLinks: SidebarLinks = [
{
icon: $globals.icons.wrench,
to: "/admin/maintenance",
title: i18n.t("sidebar.maintenance"),
restricted: true,
},
{
icon: $globals.icons.robot,
title: i18n.t("recipe.debug"),
restricted: true,
children: [
{
icon: $globals.icons.robot,
title: i18n.tc("recipe.debug"),
to: "/admin/debug/openai",
title: i18n.t("admin.openai"),
restricted: true,
children: [
{
icon: $globals.icons.robot,
to: "/admin/debug/openai",
title: i18n.tc("admin.openai"),
restricted: true,
},
{
icon: $globals.icons.slotMachine,
to: "/admin/debug/parser",
title: i18n.tc("sidebar.parser"),
restricted: true,
},
]
},
];
const bottomLinks: SidebarLinks = [
{
icon: $globals.icons.heart,
title: i18n.tc("about.support"),
href: "https://github.com/sponsors/hay-kot",
icon: $globals.icons.slotMachine,
to: "/admin/debug/parser",
title: i18n.t("sidebar.parser"),
restricted: true,
},
];
return {
sidebar,
topLinks,
bottomLinks,
developerLinks,
};
],
},
});
];
const bottomLinks: SidebarLinks = [
{
icon: $globals.icons.heart,
title: i18n.t("about.support"),
href: "https://github.com/sponsors/hay-kot",
restricted: true,
},
];
</script>