unity/resources/js/user/layouts/DefaultLayout.vue

<template>
    <v-app id="benesApp">
        <div  v-if="!loading" class="app-container app-theme-white">
            <transition name="fade" mode="out-in" appear>
                <app-header 
                    :user_detail="user_detail"
                >
                </app-header>
            </transition>
            <transition name="fade" mode="out-in" appear>
                <app-sidebar 
                    :permission_list="permission_list"
                >
                </app-sidebar>
            </transition>
            <div class="app-main__outer">
                <div class="app-main__inner">
                    <slot></slot>
                </div>
                <transition name="fade" mode="out-in" appear>
                    <app-footer></app-footer>
                </transition>
            </div>
        </div>
        <div v-if="loading" class="main-loading-box">
            <vue-element-loading :active="true" spinner="line-scale" color="var(--primary)"></vue-element-loading>
        </div>
    </v-app>
</template>

<script>
    import AppHeader from "./parts/Header";
    import AppSidebar from "./parts/Sidebar";
    import AppFooter from "./parts/Footer";

    export default {
        name: 'app',
        components: {
            AppHeader,
            AppSidebar,
            AppFooter
        },
        data() {
            return {
                form: new Form({}),
                isConfigOpen: false,
                user_detail: {},
                permission_list: [],
                loading: true,
            }
        },
        methods: {
           getUserDetail() {
                let vm = this;
                let url = 'user/self';

                General.getCall(url, vm.form).then(response => {
                    if (response.data) {
                        vm.user_detail = response.data;
                        vm.permission_list = response.data.permission_list;
                        vm.loading = false;
                    }
                });
            }
        },
        created() {
            let vm = this;
            vm.getUserDetail();
        },
    }
</script>