import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router';
import { defineAsyncComponent } from 'vue';

const Home = defineAsyncComponent(() => import('@/views/Home.vue'));
const Login = defineAsyncComponent(() => import('@/views/Login.vue'));
const News = defineAsyncComponent(() => import('@/views/News.vue'));
const NewsDetail = defineAsyncComponent(() => import('@/views/NewsDetail.vue'));
const CourseList = defineAsyncComponent(() => import('@/views/CourseList.vue'));
const CourseDetail = defineAsyncComponent(() => import('@/views/CourseDetail.vue'));
const Craft = defineAsyncComponent(() => import('@/views/CollegeGroup/Craft.vue'));
const Generation = defineAsyncComponent(() => import('@/views/CollegeGroup/Generation.vue'));
const Future = defineAsyncComponent(() => import('@/views/CollegeGroup/Future.vue'));

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
  },
  {
    path: '/login',
    name: 'Login',
    component: Login,
  },
  {
    path: '/news',
    name: 'News',
    component: News,
  },
  {
    path: '/news/:id',
    name: 'NewsDetail',
    component: NewsDetail
  },
  {
    path: '/course-list',
    name: 'CourseList',
    component: CourseList
  },
  {
    path: '/course-detail/:id',
    name: 'CourseDetail',
    component: CourseDetail
  },
  {
    path: '/college-group/craft',
    name: 'Craft',
    component: Craft
  },
  {
    path: '/college-group/generation',
    name: 'Generation',
    component: Generation
  },
  {
    path: '/college-group/future',
    name: 'Future',
    component: Future
  },
];

const router = createRouter({
  // history: createWebHashHistory(),
  history: createWebHistory(import.meta.env.BASE_URL),
  routes
});

export default router;