chamomind/elearning
7
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages 3 Wiki Activity Actions

feat: introduce core e-learning frontend pages and components for dashboard, profile, classroom, and layout.

Browse source
This commit is contained in:
supalerk-ar66 2026-02-09 10:37:42 +07:00
parent 3f93dc8ab5
commit eb248f7ca2
12 changed files with 137 additions and 135 deletions
Download patch file Download diff file Expand all files Collapse all files

43
Frontend-Learner/pages/classroom/learning.vue
View file

@ -471,20 +471,43 @@ onBeforeUnmount(() => {
<q-toolbar>
<q-btn flat round dense icon="menu" class="lg:hidden mr-2 text-slate-900 dark:text-white" @click="toggleSidebar" />
<a
href="/dashboard/my-courses"
class="inline-flex items-center gap-2 text-slate-900 dark:text-white hover:text-blue-600 dark:hover:text-blue-300 transition-all font-black text-sm md:text-base group mr-4 no-underline"
>
<q-icon name="arrow_back" size="24px" class="transition-transform group-hover:-translate-x-1" />
<span>{{ $t('classroom.backToDashboard') }}</span>
</a>
<!-- Back Button & Branding -->
<div class="flex items-center gap-2 mr-6">
<q-btn
flat
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')"
>
<q-tooltip>{{ $t('classroom.backToDashboard') }}</q-tooltip>
</q-btn>
<div class="hidden sm:flex items-center gap-2 cursor-pointer group" @click="$router.push('/dashboard')">
<div class="w-8 h-8 rounded-lg bg-blue-600 flex items-center justify-center text-white font-black shadow-lg shadow-blue-600/30 group-hover:scale-110 transition-transform">
E
</div>
</div>
</div>
<q-toolbar-title class="text-base font-bold text-center lg:text-left truncate text-slate-900 dark:text-white">
<q-toolbar-title class="text-base font-bold text-left truncate text-slate-900 dark:text-white">
{{ courseData ? getLocalizedText(courseData.course.title) : $t('classroom.loadingTitle') }}
</q-toolbar-title>
<div class="flex items-center gap-2">
<!-- Right actions -->
<div class="flex items-center gap-2 pr-2">
<!-- Announcements Button -->
<q-btn
flat
round
dense
icon="campaign"
@click="handleOpenAnnouncements"
class="text-slate-600 dark:text-slate-300 hover:text-blue-600 transition-colors"
>
<q-badge v-if="hasUnreadAnnouncements" color="red" floating rounded />
<q-tooltip>{{ $t('classroom.announcements', 'ประกาศในคอร์ส') }}</q-tooltip>
</q-btn>
</div>
</q-toolbar>
</q-header>