feat: Introduce core e-learning features with new pages for course details, dashboard, authentication, browsing, and learning, supported by a useCourse composable.

Frontend-Learner/pages/course/[id].vue

@@ -11,9 +11,12 @@ definePageMeta({
 })
 
 const route = useRoute()
+// ดึง courseId จาก URL params (แปลงเป็น integer)
 const courseId = computed(() => parseInt(route.params.id as string))
 const { fetchCourseById, enrollCourse } = useCourse()
 
+// ใช้ useAsyncData ดึงข้อมูลคอร์ส Server-side rendering (SSR)
+// Key: 'course-{id}' เพื่อให้ cache แยกกันตาม ID
 const { data: courseData, error, refresh } = await useAsyncData(`course-${courseId.value}`, () => fetchCourseById(courseId.value))
 
 const course = computed(() => {
@@ -22,18 +25,20 @@ const course = computed(() => {
 
 const isEnrolling = ref(false)
 
+// ฟังก์ชันสำหรับกดปุ่ม "ลงทะเบียนเรียน"
 const handleEnroll = async () => {
     if (!course.value) return
     if (isEnrolling.value) return
     isEnrolling.value = true
 
+    // เรียก API ลงทะเบียนเรียน
     const res = await enrollCourse(course.value.id)
 
     if (res.success) {
-        // Navigate to my-courses
+        // ถ้าสำเร็จ ให้เปลี่ยนหน้าไปที่ "คอร์สของฉัน" พร้อม params enrolled=true
         return navigateTo('/dashboard/my-courses?enrolled=true')
     } else {
-        // Handle error (alert for now, could be toast)
+        // กรณี error แสดง alert (อนาคตอาจเปลี่ยนเป็น Toast notification)
          alert(res.error || 'Failed to enroll')
     }