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

feat: Implement core e-learning features including course discovery, classroom components, user profile management, and internationalization for English and Thai.

Browse source
This commit is contained in:
supalerk-ar66 2026-02-11 11:25:55 +07:00
parent e7a2ac8b5a
commit 7ead98375e
11 changed files with 107 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

16
Frontend-Learner/components/classroom/AnnouncementModal.vue
View file

@ -13,11 +13,15 @@ const emit = defineEmits<{
(e: 'update:modelValue', value: boolean): void;
}>();
const { locale, t } = useI18n()
// Helper for localization
const getLocalizedText = (text: any) => {
if (!text) return ''
if (typeof text === 'string') return text
return text.th || text.en || ''
const currentLocale = locale.value as 'th' | 'en'
return text[currentLocale] || text.th || text.en || ''
}
</script>
@ -30,9 +34,9 @@ const getLocalizedText = (text: any) => {
<div class="w-10 h-10 rounded-full bg-blue-50 dark:bg-blue-900/30 text-primary flex items-center justify-center">
<q-icon name="campaign" size="22px" />
</div>
{{ $t('classroom.announcements', 'ประกาศในคอร์สเรียน') }}
{{ $t('classroom.announcements') }}
</div>
<div class="text-xs text-slate-500 dark:text-slate-400 ml-12 mt-1">{{ announcements.length }} รายการ</div>
<div class="text-xs text-slate-500 dark:text-slate-400 ml-12 mt-1">{{ announcements.length }} {{ $t('common.items') }}</div>
</div>
<q-btn icon="close" flat round dense v-close-popup class="text-slate-400 hover:text-slate-700 dark:hover:text-white bg-slate-50 dark:bg-slate-800" />
</q-card-section>
@ -62,16 +66,16 @@ const getLocalizedText = (text: any) => {
</q-avatar>
<div class="flex-1">
<div class="font-bold text-lg text-slate-900 dark:text-white leading-tight pr-8 capitalize font-display">
{{ getLocalizedText(ann.title) || 'ประกาศ' }}
{{ getLocalizedText(ann.title) || $t('sidebar.announcements') }}
</div>
<div class="text-xs text-slate-500 dark:text-slate-400 flex items-center gap-2 mt-1.5">
<span class="flex items-center gap-1 bg-slate-100 dark:bg-slate-700 px-2 py-0.5 rounded-md">
<q-icon name="today" size="12px" />
{{ new Date(ann.created_at || Date.now()).toLocaleDateString('th-TH', { day: 'numeric', month: 'short', year: 'numeric' }) }}
{{ new Date(ann.created_at || Date.now()).toLocaleDateString(locale === 'th' ? 'th-TH' : 'en-US', { day: 'numeric', month: 'short', year: 'numeric' }) }}
</span>
<span class="flex items-center gap-1 bg-slate-100 dark:bg-slate-700 px-2 py-0.5 rounded-md">
<q-icon name="access_time" size="12px" />
{{ new Date(ann.created_at || Date.now()).toLocaleTimeString('th-TH', { hour: '2-digit', minute: '2-digit' }) }}
{{ new Date(ann.created_at || Date.now()).toLocaleTimeString(locale === 'th' ? 'th-TH' : 'en-US', { hour: '2-digit', minute: '2-digit' }) }}
</span>
</div>
</div>

6
Frontend-Learner/components/classroom/CurriculumSidebar.vue
View file

@ -19,11 +19,15 @@ const emit = defineEmits<{
(e: 'open-announcements'): void;
}>();
const { locale } = useI18n()
// Helper for localization
const getLocalizedText = (text: any) => {
if (!text) return ''
if (typeof text === 'string') return text
return text.th || text.en || ''
const currentLocale = locale.value as 'th' | 'en'
return text[currentLocale] || text.th || text.en || ''
}
</script>