<template>
  <div class="container mx-auto px-4 py-8">
    <h1 class="text-4xl font-bold text-primary-600 mb-4">
      E-Learning Management System
    </h1>
    <p class="text-lg text-gray-600 mb-8">
      ระบบจัดการเรียนการสอนออนไลน์
    </p>
    
    <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
      <q-card class="shadow-lg">
        <q-card-section>
          <div class="text-h6 text-primary-600">📚 Courses</div>
          <p class="text-gray-600">จัดการหลักสูตรและเนื้อหา</p>
        </q-card-section>
      </q-card>
      
      <q-card class="shadow-lg">
        <q-card-section>
          <div class="text-h6 text-secondary-500">👥 Students</div>
          <p class="text-gray-600">จัดการผู้เรียน</p>
        </q-card-section>
      </q-card>
      
      <q-card class="shadow-lg">
        <q-card-section>
          <div class="text-h6 text-accent-500">📊 Reports</div>
          <p class="text-gray-600">รายงานและสถิติ</p>
        </q-card-section>
      </q-card>
      <q-btn
              flat
              color="primary"
              label="login"
              @click="handleLogin"
            />
    </div>
  </div>
</template>

<script setup lang="ts">
// Home page
const handleLogin = async () => {
  await navigateTo('/login')
}
</script>

