81 lines
4.4 KiB
JavaScript
81 lines
4.4 KiB
JavaScript
// src/router/index.js
|
|
import { createRouter, createWebHistory } from 'vue-router';
|
|
|
|
// 1. Import Layouts
|
|
import DefaultLayout from "@/layouts/DefaultLayout.vue";
|
|
import LandingLayout from "@/layouts/LandingLayout.vue";
|
|
|
|
// 2. Import Views (สำคัญ: ต้อง import ชื่อที่ถูกต้อง)
|
|
import LandingPageView from "@/views/LandingPageView.vue"; // View สำหรับหน้า Landing Page
|
|
import HomeView from "@/views/HomeView.vue"; // View สำหรับหน้า Home หลัก (ที่มี Calousels, News ฯลฯ)
|
|
|
|
import ContentView from "@/views/ContentView.vue"; // View สำหรับแสดงรายละเอียด เรื่องราวดี ๆ ที่อยากบอกต่อ
|
|
import NewsCategoryView from "@/views/NewsCategoryView.vue"; // View สำหรับแสดงรายการข่าวตามหมวดหมู่
|
|
import NotFoundView from '@/views/NotFoundView.vue'; // View สำหรับแสดงหน้า Not Found
|
|
import TabContentView from "@/views/TabContentView.vue"; // // View สำหรับแสดงรายละเอียดข่าวสารอับเดต
|
|
|
|
const routes = [
|
|
// --- Route สำหรับหน้า Landing Page (ใช้ LandingLayout) ---
|
|
{
|
|
path: '/',
|
|
component: LandingLayout, // LandingLayout คือกรอบของหน้า Landing
|
|
children: [
|
|
{
|
|
path: '', // นี่คือ path สำหรับเนื้อหาที่แสดงเมื่อเข้าถึง '/'
|
|
name: 'landing',
|
|
component: LandingPageView, // ชี้ไปที่ View ที่มีเนื้อหาเฉพาะ Landing
|
|
},
|
|
],
|
|
},
|
|
|
|
// --- Route สำหรับหน้า Home และหน้าอื่นๆ ที่ใช้ DefaultLayout ---
|
|
{
|
|
path: '/',
|
|
component: DefaultLayout, // DefaultLayout คือกรอบของหน้า Home หลัก
|
|
children: [
|
|
{
|
|
path: 'home', // HomeView จะถูกโหลดเมื่อเข้าถึง /home
|
|
name: 'home',
|
|
component: HomeView, // HomeView ที่มี Calousels, News, ฯลฯ
|
|
},
|
|
// !!! เพิ่ม Route สำหรับ ContentView !!!
|
|
{
|
|
path: 'news-content/:id', // Path สำหรับรายละเอียดข่าว เช่น /news-content/1, /news-content/2
|
|
name: 'ContentView',
|
|
component: ContentView,
|
|
props: true // ส่งค่า parameter (id) เป็น props ไปยัง component ได้
|
|
},
|
|
// !!! เพิ่ม Route สำหรับ NewsCategoryView !!!
|
|
{
|
|
path: 'tab-news/:category', // Path สำหรับข่าวตามหมวดหมู่ เช่น /news/RTAFNews
|
|
name: 'NewsCategoryView',
|
|
component: NewsCategoryView,
|
|
props: true // ส่งค่า parameter (category) เป็น props ไปยัง component ได้
|
|
},
|
|
// !!! เพิ่ม Route สำหรับ ContentView !!!
|
|
{
|
|
path: 'tab-news-content/:id', // Path สำหรับรายละเอียดข่าว เช่น /news-content/1, /news-content/2
|
|
name: 'TabContentView',
|
|
component: TabContentView,
|
|
props: true // ส่งค่า parameter (id) เป็น props ไปยัง component ได้
|
|
},
|
|
// ... ( routes อื่นๆ ที่อาจจะใช้ DefaultLayout )
|
|
|
|
// *** เส้นทาง 404 (ต้องอยู่สุดท้ายเสมอ!) ***
|
|
{
|
|
path: '/:pathMatch(.*)*', // นี้คือ catch-all route ที่จะจับ URL ที่ไม่ตรงกับข้างบนทั้งหมด
|
|
name: 'NotFound',
|
|
component: NotFoundView
|
|
}
|
|
],
|
|
},
|
|
|
|
];
|
|
|
|
const router = createRouter({
|
|
history: createWebHistory(import.meta.env.BASE_URL),
|
|
routes,
|
|
});
|
|
|
|
// อย่าลืม export default router; ที่ท้ายไฟล์
|
|
export default router; |