tethys.backend/resources/js/Layouts/LayoutAuthenticated.vue
Arno Kaimbacher 296c8fd46e - added own provider for drive methods
- renamed middleware Role and Can to role_middleware and can_middleware
- added some typing for inertia vue3 components
- npm updates
2024-04-23 19:36:45 +02:00

45 lines
1.5 KiB
Vue

<script lang="ts" setup>
import { LayoutService } from '@/Stores/layout';
import { StyleService } from '@/Stores/style.service';
import NavBar from '@/Components/NavBar.vue';
import AsideMenu from '@/Components/AsideMenu.vue';
import FooterBar from '@/Components/FooterBar.vue';
import NotificationToast from '@/Components/NotificationToast.vue';
const styleService = StyleService();
const layoutService = LayoutService();
const props = defineProps({
showAsideMenu: {
type: Boolean,
default: true // Set default value to true
}
// user: {
// type: Object,
// default: () => ({}),
// }
});
</script>
<template>
<div :class="{
'dark': styleService.darkMode,
'overflow-hidden lg:overflow-visible': layoutService.isAsideMobileExpanded,
}">
<div :class="{
'ml-60 lg:ml-0': layoutService.isAsideMobileExpanded,
'xl:pl-60': props.showAsideMenu==true }"
class="pt-14 min-h-screen w-screen transition-position lg:w-auto bg-gray-50 dark:bg-slate-800 dark:text-slate-100">
<NavBar :class="{ 'ml-60 lg:ml-0': layoutService.isAsideMobileExpanded }" :showBurger="props.showAsideMenu" />
<!-- Conditionally render AsideMenu based on showAsideMenu prop -->
<template v-if="showAsideMenu">
<AsideMenu />
</template>
<!-- slot for main content -->
<slot></slot>
<FooterBar />
</div>
</div>
<NotificationToast></NotificationToast>
</template>