feat: add new pages for authentication (register, forgot password) and course browsing (discovery, course detail)

Frontend-Learner/pages/auth/forgot-password.vue

@@ -47,6 +47,7 @@ const handleInput = (val: string | number | null) => {
 }
 
 const { requestPasswordReset } = useAuth()
+const $q = useQuasar()
 
 const sendResetLink = async () => {
   if (!validate(forgotForm, forgotRules)) return
@@ -60,8 +61,13 @@ const sendResetLink = async () => {
   if (result.success) {
     forgotStep.value = 'success'
   } else {
-    // Basic alert for now, could be improved with q-notify later
-    alert(result.error || 'ไม่สามารถส่งลิงก์รีเซ็ตได้ กรุณาลองใหม่')
+    $q.notify({
+        type: 'negative',
+        message: result.error || 'ไม่สามารถส่งลิงก์รีเซ็ตได้ กรุณาลองใหม่',
+        position: 'top',
+        timeout: 3000,
+        actions: [{ icon: 'close', color: 'white' }]
+    })
   }
 }
 </script>

Frontend-Learner/pages/auth/register.vue

@@ -17,6 +17,7 @@ useHead({
 
 const router = useRouter();
 const { register } = useAuth();
+const $q = useQuasar();
 const { errors, validate, clearFieldError } = useFormValidation();
 
 const isLoading = ref(false);
@@ -181,10 +182,21 @@ const handleRegister = async () => {
   isLoading.value = false;
 
   if (result.success) {
-      alert('สมัครสมาชิกสำเร็จ! กรุณาเข้าสู่ระบบ');
+      $q.notify({
+          type: 'positive',
+          message: 'สมัครสมาชิกสำเร็จ! กรุณาเข้าสู่ระบบ',
+          position: 'top',
+          timeout: 4000
+      });
       router.push("/auth/login");
   } else {
-      alert(result.error || 'การลงทะเบียนล้มเหลว');
+      $q.notify({
+          type: 'negative',
+          message: result.error || 'การลงทะเบียนล้มเหลว',
+          position: 'top',
+          timeout: 3000,
+          actions: [{ icon: 'close', color: 'white' }]
+      });
   }
 };
 </script>

Frontend-Learner/pages/browse/discovery.vue

@@ -36,6 +36,7 @@ const itemsPerPage = 12;
 
 const { t, locale } = useI18n();
 const { currentUser } = useAuth();
+const $q = useQuasar();
 const { fetchCategories } = useCategory();
 const { fetchCourses, fetchCourseById, enrollCourse, getLocalizedText } = useCourse();
 
@@ -109,7 +110,13 @@ const handleEnroll = async (id: number) => {
   if (res.success) {
     return navigateTo('/dashboard/my-courses?enrolled=true');
   } else {
-    alert(res.error || 'Failed to enroll');
+    $q.notify({
+        type: 'negative',
+        message: res.error || 'Failed to enroll',
+        position: 'top',
+        timeout: 3000,
+        actions: [{ icon: 'close', color: 'white' }]
+    })
   }
   isEnrolling.value = false;
 };

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

@@ -14,6 +14,7 @@ const route = useRoute()
 // ดึง courseId จาก URL params (แปลงเป็น integer)
 const courseId = computed(() => parseInt(route.params.id as string))
 const { currentUser } = useAuth()
+const $q = useQuasar()
 const { fetchCourseById, enrollCourse, getLocalizedText } = useCourse()
 
 // ใช้ useAsyncData ดึงข้อมูลคอร์ส Server-side rendering (SSR)
@@ -46,9 +47,14 @@ const handleEnroll = async () => {
                 course_id: String(targetId)
             }
         })
-    } else {
-        // กรณี error แสดง alert (อนาคตอาจเปลี่ยนเป็น Toast notification)
-         alert(res.error || 'Failed to enroll')
+        // กรณี error แสดง Toast notification แทน alert
+        $q.notify({
+            type: 'negative',
+            message: res.error || 'Failed to enroll',
+            position: 'top',
+            timeout: 3000,
+            actions: [{ icon: 'close', color: 'white' }]
+        })
     }
 
     isEnrolling.value = false