import { RouteRecordRaw } from 'vue-router';

import FORM_TEST from '../modules/form-test/route';
import TREE from '../modules/tree/route';

const routes: RouteRecordRaw[] = [
  {
    path: '/',
    name: 'MainLayout',
    component: () => import('layouts/MainLayout.vue'),
    children: [
      {
        path: '',
        name: 'LaoutIndexPage',
        component: () => import('pages/IndexPage.vue'),
        redirect: '/tree',
        children: [
          {
            path: 'home',
            name: 'HOME',
            component: () => import('../modules/home/PageHome.vue'),
            meta: {
              title: '主页',
              permission: ['*'],
              keepalive: false,
            },
          },
          {
            path: 'page1',
            name: 'PAGE1',
            component: () => import('../modules/page1/IndexPage.vue'),
            meta: {
              title: '图表',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page2',
            name: 'PAGE2',
            component: () => import('../modules/page2/IndexPage.vue'),
            meta: {
              title: '表单',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page4',
            name: 'PAGE4',
            component: () => import('../modules/page4/IndexPage.vue'),
            meta: {
              title: 'canvas',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page5',
            name: 'PAGE5',
            component: () => import('../modules/page5/IndexPage.vue'),
            meta: {
              title: '防抖节流',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page7',
            name: 'PAGE7',
            component: () => import('../modules/page7/IndexPage.vue'),
            meta: {
              title: '疫情防控',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page8',
            name: 'PAGE8',
            component: () => import('../modules/page8/IndexPage.vue'),
            meta: {
              title: '动画',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page9',
            name: 'PAGE9',
            component: () => import('../modules/page9/IndexPage.vue'),
            meta: {
              title: '表格',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'page10',
            name: 'PAGE10',
            component: () => import('../modules/page10/IndexPage.vue'),
            meta: {
              title: '设计',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'js-page3',
            name: 'JS_PAGE3',
            component: () => import('../modules/page3/IndexPage.vue'),
            meta: {
              title: '链表',
              permission: ['*'],
              keepalive: true,
            },
          },
          {
            path: 'js-page6',
            name: 'JS_PAGE6',
            component: () => import('../modules/page6/IndexPage.vue'),
            meta: {
              title: 'JS',
              permission: ['*'],
              keepalive: true,
            },
          },
          ...FORM_TEST,
          ...TREE,
        ],
      },
    ],
  },

  // Always leave this as last one,
  // but you can also remove it
  {
    path: '/:catchAll(.*)*',
    component: () => import('pages/ErrorNotFound.vue'),
  },
];

export default routes;
