Add:api-login

Frontend-Learner/pages/auth/login.vue

@@ -16,7 +16,7 @@ useHead({
 })
 
 const router = useRouter()
-const { login } = useAuth()
+const { login, user } = useAuth()
 const { errors, validate, clearFieldError } = useFormValidation()
 
 const isLoading = ref(false)
@@ -41,17 +41,28 @@ const handleLogin = async () => {
   if (!validate(loginForm, loginRules)) return
   
   isLoading.value = true
-  // Simulate API call delay
-  await new Promise(resolve => setTimeout(resolve, 1500))
   
-  // Demo credential check
-  if (loginForm.email === 'student@example.com' && loginForm.password === '123456') {
-    login() // Set token via auth composable
-    isLoading.value = false
-    router.push('/dashboard')
+  const result = await login({
+    email: loginForm.email,
+    password: loginForm.password
+  })
+  
+  isLoading.value = false
+
+  if (result.success) {
+    // Redirect based on user role
+    const role = user.value?.role?.code
+    
+    if (role === 'ADMIN') {
+      router.push('/admin')
+    } else if (role === 'INSTRUCTOR') {
+      router.push('/instructor')
+    } else {
+      router.push('/dashboard')
+    }
   } else {
-    isLoading.value = false
-    alert('อีเมลหรือรหัสผ่านไม่ถูกต้อง! (Demo: student@example.com / 123456)')
+    // Show error from API or fallback
+    alert(result.error || 'อีเมลหรือรหัสผ่านไม่ถูกต้อง')
   }
 }
 </script>
@@ -109,12 +120,8 @@ const handleLogin = async () => {
         <span v-else>เข้าสู่ระบบ</span>
       </button>
 
-      <!-- Demo Credentials Hint (For Development Only) -->
-      <div style="background: var(--neutral-100); padding: 12px; border-radius: 8px; margin-bottom: 16px; border: 1px dashed var(--primary);">
-        <p class="text-xs font-bold text-primary mb-1">🔑 บัญชีทดสอบ:</p>
-        <p class="text-xs text-muted">อีเมล: student@example.com</p>
-        <p class="text-xs text-muted">รหัสผ่าน: 123456</p>
-      </div>
+      
+      
 
       <!-- Social Login (Google) -->
       <button type="button" class="btn-google w-full mb-6 flex items-center justify-center gap-3">