diff --git a/Frontend-Learner/pages/classroom/learning.vue b/Frontend-Learner/pages/classroom/learning.vue index 75f02c6b..975e5454 100644 --- a/Frontend-Learner/pages/classroom/learning.vue +++ b/Frontend-Learner/pages/classroom/learning.vue @@ -99,13 +99,51 @@ const toggleSidebar = () => { sidebarOpen.value = !sidebarOpen.value } +// Helper สำหรับรีเซ็ตข้อมูลและย้ายหน้า (Hard Reload) +const resetAndNavigate = (path: string) => { + if (import.meta.client) { + // 1. เก็บข้อมูลที่ต้องการรักษาไว้ (Whitelist) + const whitelist: Record = {} + const keepKeys = ['remembered_email', 'theme', 'auth_token'] // เพิ่ม auth_token เพื่อไม่ให้หลุด login + + for (let i = 0; i < localStorage.length; i++) { + const key = localStorage.key(i) + if (!key) continue + + // เก็บเฉพาะ key ที่อยู่ใน whitelist หรือเป็นข้อมูลประกาศ/แจ้งเตือน + if (keepKeys.includes(key) || key.startsWith('read_announcements:')) { + const value = localStorage.getItem(key) + if (value !== null) whitelist[key] = value + } + } + + // 2. ล้างข้อมูลใน localStorage ทั้งหมด + localStorage.clear() + + // 3. นำข้อมูลที่ยกเว้นกลับมาใส่คืน + Object.entries(whitelist).forEach(([key, value]) => { + localStorage.setItem(key, value) + }) + + // 4. บังคับโหลดหน้าใหม่ทั้งหมด (Hard Reload) ไปที่ path ใหม่ + window.location.href = path + } else { + // Fallback สำหรับ SSR + router.push(path) + } +} + // Logic loadLesson แยกออกมา const handleLessonSelect = (lessonId: number) => { - loadLesson(lessonId) - // Close sidebar on mobile when selecting a lesson - if (import.meta.client && window.innerWidth <= 1024) { - sidebarOpen.value = false - } + if (currentLesson.value?.id === lessonId) return + const url = new URL(window.location.href) + url.searchParams.set('lesson_id', lessonId.toString()) + resetAndNavigate(url.toString()) +} + +// Logic สำหรับการกดย้อนกลับหรืออกจากหน้าเรียน +const handleExit = (path: string) => { + resetAndNavigate(path) } // Data Fetching @@ -472,13 +510,13 @@ onBeforeUnmount(() => { round dense icon="arrow_back" - class="text-slate-600 dark:text-slate-300 hover:text-blue-600 transition-colors" - @click="$router.push('/dashboard/my-courses')" + class="mr-2 text-blue-600 dark:text-blue-400 bg-blue-50 dark:bg-blue-900/30 border border-blue-100 dark:border-blue-800/50 hover:bg-blue-100 dark:hover:bg-blue-800/50 transition-all" + @click="handleExit('/dashboard/my-courses')" > {{ $t('classroom.backToDashboard') }} -