portal/app/resources/js/components/AppShell.vue

<script setup lang="ts">
/**
 * Корневой shell приложения. Мапит meta.layout текущего route'а на layout-компонент.
 *
 * meta.layout = 'auth' → AuthLayout (двухпанельный для login/register/2fa/forgot/recovery-use).
 * meta.layout = 'error' → RouterView напрямую (ErrorView сам предоставляет v-app + теало-нуар bg).
 * meta.layout не задан или 'app' → AppLayout (sidebar + topbar для авторизованных страниц).
 *
 * Источник дизайна: liderra_v8_handoff/concepts/v8_login.html (auth),
 * v8_dashboard.html (app), v8_errors.html (error).
 */
import { computed, defineAsyncComponent, type Component } from 'vue';
import { RouterView, useRoute } from 'vue-router';
import AdminLayout from '../layouts/AdminLayout.vue';
import AppLayout from '../layouts/AppLayout.vue';
import AuthLayout from '../layouts/AuthLayout.vue';

const route = useRoute();
const layoutName = computed(() => route.meta.layout ?? 'app');

// Dev-only overlay: tree-shaken from production bundle via import.meta.env.DEV guard.
const DevIndexOverlay: Component | null = import.meta.env.DEV
    ? defineAsyncComponent(() => import('./DevIndexOverlay.vue'))
    : null;
</script>

<template>
    <AuthLayout v-if="layoutName === 'auth'" />
    <RouterView v-else-if="layoutName === 'error'" />
    <AdminLayout v-else-if="layoutName === 'admin'" />
    <AppLayout v-else />
    <component :is="DevIndexOverlay" v-if="DevIndexOverlay" />
</template>