import { createRouter, createWebHistory } from 'vue-router';
import AppLayout from '@/layout/AppLayout.vue';
import store from '@/store'

const router = createRouter({
    history: createWebHistory(),
    routes: [
        {
            path: '/',
            component: AppLayout,
            children: [
                {
                    path: '/',
                    name: 'dashboard',
                    component: () => import('@/views/Dashboard.vue'),
                    meta: {
                        middleware: "auth",
                        title:"Dashboard"
                    }
                },
                {
                    path:"/security-management/users",
                    name:"userIndex",
                    component:() => import('@/views/pages/security-management/user/Index.vue'),
                    meta:{
                        title:"Users",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/users/:id",
                    name:"userDetail",
                    component:() => import('@/views/pages/security-management/user/Index.vue'),
                    meta:{
                        title:"Users",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/permissions",
                    name:"permissionIndex",
                    component:() => import('@/views/pages/security-management/permission/Index.vue'),
                    meta:{
                        title:"Permission",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/permissions/:id",
                    name:"permissionDetail",
                    component:() => import('@/views/pages/security-management/permission/Index.vue'),
                    meta:{
                        title:"Permission",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/applications",
                    name:"appIndex",
                    component:() => import('@/views/pages/security-management/application/Index.vue'),
                    meta:{
                        title:"Application",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/applications/:id",
                    name:"appDetail",
                    component:() => import('@/views/pages/security-management/application/Index.vue'),
                    meta:{
                        title:"Application",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/functions",
                    name:"functionIndex",
                    component:() => import('@/views/pages/security-management/fnction/Index.vue'),
                    meta:{
                        title:"Function",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/functions/:id",
                    name:"functionDetail",
                    component:() => import('@/views/pages/security-management/fnction/Index.vue'),
                    meta:{
                        title:"Function",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/roles",
                    name:"roleIndex",
                    component:() => import('@/views/pages/security-management/role/Index.vue'),
                    meta:{
                        title:"Role",
                        middleware:"auth"
                    }
                },
                {
                    path:"/security-management/roles/:id",
                    name:"roleDetail",
                    component:() => import('@/views/pages/security-management/role/Index.vue'),
                    meta:{
                        title:"Role",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/slides",
                    name:"slideIndex",
                    component:() => import('@/views/pages/website/slide/Index.vue'),
                    meta:{
                        title:"Slides",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/slides/:id",
                    name:"slideDetail",
                    component:() => import('@/views/pages/website/slide/Index.vue'),
                    meta:{
                        title:"Slides",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/about-us",
                    name:"aboutUsIndex",
                    component:() => import('@/views/pages/website/about-us/Index.vue'),
                    meta:{
                        title:"About Us",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/about-us/:id",
                    name:"aboutUsDetail",
                    component:() => import('@/views/pages/website/about-us/Index.vue'),
                    meta:{
                        title:"About Us",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/visions",
                    name:"visionIndex",
                    component:() => import('@/views/pages/website/vision/Index.vue'),
                    meta:{
                        title:"Vision",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/visions/:id",
                    name:"visionDetail",
                    component:() => import('@/views/pages/website/vision/Index.vue'),
                    meta:{
                        title:"Vision",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/services",
                    name:"serviceIndex",
                    component:() => import('@/views/pages/website/service/Index.vue'),
                    meta:{
                        title:"Service",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/services/:id",
                    name:"serviceDetail",
                    component:() => import('@/views/pages/website/service/Index.vue'),
                    meta:{
                        title:"Service",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/menu",
                    name:"menuIndex",
                    component:() => import('@/views/pages/website/menu/Index.vue'),
                    meta:{
                        title:"Menu",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/menu/:id",
                    name:"menuDetail",
                    component:() => import('@/views/pages/website/menu/Index.vue'),
                    meta:{
                        title:"Menu",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/galleries",
                    name:"galleryIndex",
                    component:() => import('@/views/pages/website/gallery/Index.vue'),
                    meta:{
                        title:"Galleries",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/contacts",
                    name:"contactIndex",
                    component:() => import('@/views/pages/website/contact/Index.vue'),
                    meta:{
                        title:"Contacts",
                        middleware:"auth"
                    }
                },
                {
                    path:"/website/contacts/:id",
                    name:"contactDetail",
                    component:() => import('@/views/pages/website/contact/Index.vue'),
                    meta:{
                        title:"Contacts",
                        middleware:"auth"
                    }
                },
                {
                    path: '/uikit/formlayout',
                    name: 'formlayout',
                    component: () => import('@/views/uikit/FormLayout.vue')
                },
                {
                    path: '/uikit/input',
                    name: 'input',
                    component: () => import('@/views/uikit/Input.vue')
                },
                {
                    path: '/uikit/floatlabel',
                    name: 'floatlabel',
                    component: () => import('@/views/uikit/FloatLabel.vue')
                },
                {
                    path: '/uikit/invalidstate',
                    name: 'invalidstate',
                    component: () => import('@/views/uikit/InvalidState.vue')
                },
                {
                    path: '/uikit/button',
                    name: 'button',
                    component: () => import('@/views/uikit/Button.vue')
                },
                {
                    path: '/uikit/table',
                    name: 'table',
                    component: () => import('@/views/uikit/Table.vue')
                },
                {
                    path: '/uikit/list',
                    name: 'list',
                    component: () => import('@/views/uikit/List.vue')
                },
                {
                    path: '/uikit/tree',
                    name: 'tree',
                    component: () => import('@/views/uikit/Tree.vue')
                },
                {
                    path: '/uikit/panel',
                    name: 'panel',
                    component: () => import('@/views/uikit/Panels.vue')
                },

                {
                    path: '/uikit/overlay',
                    name: 'overlay',
                    component: () => import('@/views/uikit/Overlay.vue')
                },
                {
                    path: '/uikit/media',
                    name: 'media',
                    component: () => import('@/views/uikit/Media.vue')
                },
                {
                    path: '/uikit/menu',
                    component: () => import('@/views/uikit/Menu.vue'),
                    children: [
                        {
                            path: '/uikit/menu',
                            component: () => import('@/views/uikit/menu/PersonalDemo.vue')
                        },
                        {
                            path: '/uikit/menu/seat',
                            component: () => import('@/views/uikit/menu/SeatDemo.vue')
                        },
                        {
                            path: '/uikit/menu/payment',
                            component: () => import('@/views/uikit/menu/PaymentDemo.vue')
                        },
                        {
                            path: '/uikit/menu/confirmation',
                            component: () => import('@/views/uikit/menu/ConfirmationDemo.vue')
                        }
                    ]
                },
                {
                    path: '/uikit/message',
                    name: 'message',
                    component: () => import('@/views/uikit/Messages.vue')
                },
                {
                    path: '/uikit/file',
                    name: 'file',
                    component: () => import('@/views/uikit/File.vue')
                },
                {
                    path: '/uikit/charts',
                    name: 'charts',
                    component: () => import('@/views/uikit/Chart.vue')
                },
                {
                    path: '/uikit/misc',
                    name: 'misc',
                    component: () => import('@/views/uikit/Misc.vue')
                },
                {
                    path: '/blocks',
                    name: 'blocks',
                    component: () => import('@/views/utilities/Blocks.vue')
                },
                {
                    path: '/utilities/icons',
                    name: 'icons',
                    component: () => import('@/views/utilities/Icons.vue')
                },
                {
                    path: '/pages/timeline',
                    name: 'timeline',
                    component: () => import('@/views/pages/Timeline.vue')
                },
                {
                    path: '/pages/empty',
                    name: 'empty',
                    component: () => import('@/views/pages/Empty.vue')
                },
                {
                    path: '/pages/crud',
                    name: 'crud',
                    component: () => import('@/views/pages/Crud.vue')
                },
                {
                    path: '/documentation',
                    name: 'documentation',
                    component: () => import('@/views/utilities/Documentation.vue')
                }
            ]
        },
        {
            path: '/landing',
            name: 'landing',
            component: () => import('@/views/pages/Landing.vue')
        },
        {
            path: '/pages/notfound',
            name: 'notfound',
            component: () => import('@/views/pages/NotFound.vue')
        },

        {
            path: '/auth/login',
            name: 'login',
            component: () => import('@/views/pages/auth/Login.vue'),
            meta: {
                middleware: "guest",
                title: `Login`
            }
        },
        {
            path: '/auth/access',
            name: 'accessDenied',
            component: () => import('@/views/pages/auth/Access.vue')
        },
        {
            path: '/auth/error',
            name: 'error',
            component: () => import('@/views/pages/auth/Error.vue')
        }
    ]
});

router.beforeEach((to, from, next) => {
    document.title = to.meta.title
    if (to.meta.middleware == "guest") {
        if (store.state.auth.authenticated) {
            next({ name: "dashboard" })
        }
        next()
    } else {
        if (store.state.auth.authenticated) {
            next()
        } else {
            next({ name: "login" })
        }
    }
})
export default router;
