refactor: update router
This commit is contained in:
Łukasz Holeczek
+174
-165
@@ -1,294 +1,303 @@
|
||||
import { h, resolveComponent } from "vue";
|
||||
import { createRouter, createWebHistory } from "vue-router";
|
||||
// import Home from "../views/Home.vue";
|
||||
import { h, resolveComponent } from 'vue'
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
|
||||
import DefaultLayout from "@/layouts/DefaultLayout";
|
||||
import DefaultLayout from '@/layouts/DefaultLayout'
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: "/",
|
||||
name: "Home",
|
||||
path: '/',
|
||||
name: 'Home',
|
||||
component: DefaultLayout,
|
||||
redirect: "/dashboard",
|
||||
redirect: '/dashboard',
|
||||
children: [
|
||||
{
|
||||
path: "/dashboard",
|
||||
name: "Dashboard",
|
||||
path: '/dashboard',
|
||||
name: 'Dashboard',
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (about.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: () =>
|
||||
import(/* webpackChunkName: "dashboard" */ "@/views/Dashboard.vue"),
|
||||
import(/* webpackChunkName: "dashboard" */ '@/views/Dashboard.vue'),
|
||||
},
|
||||
{
|
||||
path: "/theme",
|
||||
name: "Theme",
|
||||
redirect: "/theme/typography",
|
||||
path: '/theme',
|
||||
name: 'Theme',
|
||||
redirect: '/theme/typography',
|
||||
},
|
||||
{
|
||||
path: "/theme/colors",
|
||||
name: "Colors",
|
||||
component: () => import("@/views/theme/Colors.vue"),
|
||||
path: '/theme/colors',
|
||||
name: 'Colors',
|
||||
component: () => import('@/views/theme/Colors.vue'),
|
||||
},
|
||||
{
|
||||
path: "/theme/typography",
|
||||
name: "Typography",
|
||||
component: () => import("@/views/theme/Typography.vue"),
|
||||
path: '/theme/typography',
|
||||
name: 'Typography',
|
||||
component: () => import('@/views/theme/Typography.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base",
|
||||
name: "Base",
|
||||
path: '/base',
|
||||
name: 'Base',
|
||||
component: {
|
||||
render() {
|
||||
return h(resolveComponent("router-view"));
|
||||
return h(resolveComponent('router-view'))
|
||||
},
|
||||
},
|
||||
redirect: "/base/breadcrumbs",
|
||||
redirect: '/base/breadcrumbs',
|
||||
children: [
|
||||
{
|
||||
path: "/base/accordion",
|
||||
name: "Accordion",
|
||||
component: () =>
|
||||
import(
|
||||
/* webpackChunkName: "dashboard" */ "@/views/base/Accordion.vue"
|
||||
),
|
||||
path: '/base/accordion',
|
||||
name: 'Accordion',
|
||||
component: () => import('@/views/base/Accordion.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/breadcrumbs",
|
||||
name: "Breadcrumbs",
|
||||
component: () =>
|
||||
import(
|
||||
/* webpackChunkName: "dashboard" */ "@/views/base/Breadcrumbs.vue"
|
||||
),
|
||||
path: '/base/breadcrumbs',
|
||||
name: 'Breadcrumbs',
|
||||
component: () => import('@/views/base/Breadcrumbs.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/cards",
|
||||
name: "Cards",
|
||||
component: () => import("@/views/base/Cards.vue"),
|
||||
path: '/base/cards',
|
||||
name: 'Cards',
|
||||
component: () => import('@/views/base/Cards.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/carousels",
|
||||
name: "Carousels",
|
||||
component: () => import("@/views/base/Carousels.vue"),
|
||||
path: '/base/carousels',
|
||||
name: 'Carousels',
|
||||
component: () => import('@/views/base/Carousels.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/collapses",
|
||||
name: "Collapses",
|
||||
component: () => import("@/views/base/Collapses.vue"),
|
||||
},
|
||||
/*
|
||||
{
|
||||
path: "/base/jumbotrons",
|
||||
name: "Jumbotrons",
|
||||
component: () => import("@/views/base/Jumbotrons.vue"),
|
||||
},
|
||||
*/
|
||||
{
|
||||
path: "/base/list-groups",
|
||||
name: "List Groups",
|
||||
component: () => import("@/views/base/ListGroups.vue"),
|
||||
path: '/base/collapses',
|
||||
name: 'Collapses',
|
||||
component: () => import('@/views/base/Collapses.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/navs",
|
||||
name: "Navs",
|
||||
component: () => import("@/views/base/Navs.vue"),
|
||||
path: '/base/list-groups',
|
||||
name: 'List Groups',
|
||||
component: () => import('@/views/base/ListGroups.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/navbars",
|
||||
name: "Navbars",
|
||||
component: () => import("@/views/base/Navbars.vue"),
|
||||
path: '/base/navs',
|
||||
name: 'Navs',
|
||||
component: () => import('@/views/base/Navs.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/paginations",
|
||||
name: "Paginations",
|
||||
component: () => import("@/views/base/Paginations.vue"),
|
||||
path: '/base/navbars',
|
||||
name: 'Navbars',
|
||||
component: () => import('@/views/base/Navbars.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/popovers",
|
||||
name: "Popovers",
|
||||
component: () => import("@/views/base/Popovers.vue"),
|
||||
path: '/base/paginations',
|
||||
name: 'Paginations',
|
||||
component: () => import('@/views/base/Paginations.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/progress",
|
||||
name: "Progress",
|
||||
component: () => import("@/views/base/Progress.vue"),
|
||||
path: '/base/popovers',
|
||||
name: 'Popovers',
|
||||
component: () => import('@/views/base/Popovers.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/spinners",
|
||||
name: "Spinners",
|
||||
component: () => import("@/views/base/Spinners.vue"),
|
||||
path: '/base/progress',
|
||||
name: 'Progress',
|
||||
component: () => import('@/views/base/Progress.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/tables",
|
||||
name: "Tables",
|
||||
component: () => import("@/views/base/Tables.vue"),
|
||||
path: '/base/spinners',
|
||||
name: 'Spinners',
|
||||
component: () => import('@/views/base/Spinners.vue'),
|
||||
},
|
||||
{
|
||||
path: "/base/tooltips",
|
||||
name: "Tooltips",
|
||||
component: () => import("@/views/base/Tooltips.vue"),
|
||||
path: '/base/tables',
|
||||
name: 'Tables',
|
||||
component: () => import('@/views/base/Tables.vue'),
|
||||
},
|
||||
{
|
||||
path: '/base/tooltips',
|
||||
name: 'Tooltips',
|
||||
component: () => import('@/views/base/Tooltips.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/buttons",
|
||||
name: "Buttons",
|
||||
path: '/buttons',
|
||||
name: 'Buttons',
|
||||
component: {
|
||||
render() {
|
||||
return h(resolveComponent("router-view"));
|
||||
return h(resolveComponent('router-view'))
|
||||
},
|
||||
},
|
||||
redirect: "/buttons/standard-buttons",
|
||||
redirect: '/buttons/standard-buttons',
|
||||
children: [
|
||||
{
|
||||
path: "/buttons/standard-buttons",
|
||||
name: "Buttons",
|
||||
component: () => import("@/views/buttons/Buttons.vue"),
|
||||
path: '/buttons/standard-buttons',
|
||||
name: 'Buttons',
|
||||
component: () => import('@/views/buttons/Buttons.vue'),
|
||||
},
|
||||
{
|
||||
path: "/buttons/dropdowns",
|
||||
name: "Dropdowns",
|
||||
component: () => import("@/views/buttons/Dropdowns.vue"),
|
||||
path: '/buttons/dropdowns',
|
||||
name: 'Dropdowns',
|
||||
component: () => import('@/views/buttons/Dropdowns.vue'),
|
||||
},
|
||||
{
|
||||
path: "/buttons/button-groups",
|
||||
name: "Button Groups",
|
||||
component: () => import("@/views/buttons/ButtonGroups.vue"),
|
||||
path: '/buttons/button-groups',
|
||||
name: 'Button Groups',
|
||||
component: () => import('@/views/buttons/ButtonGroups.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/forms",
|
||||
name: "Forms",
|
||||
path: '/forms',
|
||||
name: 'Forms',
|
||||
component: {
|
||||
render() {
|
||||
return h(resolveComponent("router-view"));
|
||||
return h(resolveComponent('router-view'))
|
||||
},
|
||||
},
|
||||
redirect: "/forms/form-control",
|
||||
redirect: '/forms/form-control',
|
||||
children: [
|
||||
{
|
||||
path: "/forms/form-control",
|
||||
name: "Form Control",
|
||||
component: () => import("@/views/forms/FormControl.vue"),
|
||||
path: '/forms/form-control',
|
||||
name: 'Form Control',
|
||||
component: () => import('@/views/forms/FormControl.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/select",
|
||||
name: "Select",
|
||||
component: () => import("@/views/forms/Select.vue"),
|
||||
path: '/forms/select',
|
||||
name: 'Select',
|
||||
component: () => import('@/views/forms/Select.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/checks-radios",
|
||||
name: "Checks & Radios",
|
||||
component: () => import("@/views/forms/ChecksRadios.vue"),
|
||||
path: '/forms/checks-radios',
|
||||
name: 'Checks & Radios',
|
||||
component: () => import('@/views/forms/ChecksRadios.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/range",
|
||||
name: "Range",
|
||||
component: () => import("@/views/forms/Range.vue"),
|
||||
path: '/forms/range',
|
||||
name: 'Range',
|
||||
component: () => import('@/views/forms/Range.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/input-group",
|
||||
name: "Input Group",
|
||||
component: () => import("@/views/forms/InputGroup.vue"),
|
||||
path: '/forms/input-group',
|
||||
name: 'Input Group',
|
||||
component: () => import('@/views/forms/InputGroup.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/floating-labels",
|
||||
name: "Floating Labels",
|
||||
component: () => import("@/views/forms/FloatingLabels.vue"),
|
||||
path: '/forms/floating-labels',
|
||||
name: 'Floating Labels',
|
||||
component: () => import('@/views/forms/FloatingLabels.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/layout",
|
||||
name: "Layout",
|
||||
component: () => import("@/views/forms/Layout.vue"),
|
||||
path: '/forms/layout',
|
||||
name: 'Layout',
|
||||
component: () => import('@/views/forms/Layout.vue'),
|
||||
},
|
||||
{
|
||||
path: "/forms/validation",
|
||||
name: "Validation",
|
||||
component: () => import("@/views/forms/Validation.vue"),
|
||||
path: '/forms/validation',
|
||||
name: 'Validation',
|
||||
component: () => import('@/views/forms/Validation.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/charts",
|
||||
name: "Charts",
|
||||
component: () => import("@/views/charts/Charts.vue"),
|
||||
path: '/charts',
|
||||
name: 'Charts',
|
||||
component: () => import('@/views/charts/Charts.vue'),
|
||||
},
|
||||
{
|
||||
path: "/icons",
|
||||
name: "Icons",
|
||||
path: '/icons',
|
||||
name: 'Icons',
|
||||
component: {
|
||||
render() {
|
||||
return h(resolveComponent("router-view"));
|
||||
return h(resolveComponent('router-view'))
|
||||
},
|
||||
},
|
||||
redirect: "/icons/coreui-icons",
|
||||
redirect: '/icons/coreui-icons',
|
||||
children: [
|
||||
{
|
||||
path: "/icons/coreui-icons",
|
||||
name: "CoreUI Icons",
|
||||
component: () => import("@/views/icons/CoreUIIcons.vue"),
|
||||
path: '/icons/coreui-icons',
|
||||
name: 'CoreUI Icons',
|
||||
component: () => import('@/views/icons/CoreUIIcons.vue'),
|
||||
},
|
||||
{
|
||||
path: "/icons/brands",
|
||||
name: "Brands",
|
||||
component: () => import("@/views/icons/Brands.vue"),
|
||||
path: '/icons/brands',
|
||||
name: 'Brands',
|
||||
component: () => import('@/views/icons/Brands.vue'),
|
||||
},
|
||||
{
|
||||
path: "/icons/flags",
|
||||
name: "Flags",
|
||||
component: () => import("@/views/icons/Flags.vue"),
|
||||
path: '/icons/flags',
|
||||
name: 'Flags',
|
||||
component: () => import('@/views/icons/Flags.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/notifications",
|
||||
name: "Notifications",
|
||||
path: '/notifications',
|
||||
name: 'Notifications',
|
||||
component: {
|
||||
render() {
|
||||
return h(resolveComponent("router-view"));
|
||||
return h(resolveComponent('router-view'))
|
||||
},
|
||||
},
|
||||
redirect: "/notifications/alerts",
|
||||
redirect: '/notifications/alerts',
|
||||
children: [
|
||||
{
|
||||
path: "/notifications/alerts",
|
||||
name: "Alerts",
|
||||
component: () => import("@/views/notifications/Alerts.vue"),
|
||||
path: '/notifications/alerts',
|
||||
name: 'Alerts',
|
||||
component: () => import('@/views/notifications/Alerts.vue'),
|
||||
},
|
||||
{
|
||||
path: "/notifications/badges",
|
||||
name: "Badges",
|
||||
component: () => import("@/views/notifications/Badges.vue"),
|
||||
path: '/notifications/badges',
|
||||
name: 'Badges',
|
||||
component: () => import('@/views/notifications/Badges.vue'),
|
||||
},
|
||||
{
|
||||
path: "/notifications/modals",
|
||||
name: "Modals",
|
||||
component: () => import("@/views/notifications/Modals.vue"),
|
||||
path: '/notifications/modals',
|
||||
name: 'Modals',
|
||||
component: () => import('@/views/notifications/Modals.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/widgets",
|
||||
name: "Widgets",
|
||||
component: () => import("@/views/widgets/Widgets.vue"),
|
||||
path: '/widgets',
|
||||
name: 'Widgets',
|
||||
component: () => import('@/views/widgets/Widgets.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// path: "/about",
|
||||
// name: "About",
|
||||
// // route level code-splitting
|
||||
// // this generates a separate chunk (about.[hash].js) for this route
|
||||
// // which is lazy-loaded when the route is visited.
|
||||
// component: () =>
|
||||
// import(/* webpackChunkName: "about" */ "../views/About.vue")
|
||||
// }
|
||||
];
|
||||
{
|
||||
path: '/pages',
|
||||
redirect: '/pages/404',
|
||||
name: 'Pages',
|
||||
component: {
|
||||
render() {
|
||||
return h(resolveComponent('router-view'))
|
||||
},
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '404',
|
||||
name: 'Page404',
|
||||
component: () => import('@/views/pages/Page404'),
|
||||
},
|
||||
{
|
||||
path: '500',
|
||||
name: 'Page500',
|
||||
component: () => import('@/views/pages/Page500')
|
||||
},
|
||||
{
|
||||
path: 'login',
|
||||
name: 'Login',
|
||||
component: () => import('@/views/pages/Login')
|
||||
},
|
||||
{
|
||||
path: 'register',
|
||||
name: 'Register',
|
||||
component: () => import('@/views/pages/Register')
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(process.env.BASE_URL),
|
||||
routes,
|
||||
});
|
||||
})
|
||||
|
||||
export default router;
|
||||
export default router
|
||||
|
||||
Reference in New Issue
Block a user