30 lines
773 B
Vue
30 lines
773 B
Vue
|
<script setup lang="ts">
|
||
|
|
const route = useRoute()
|
||
|
|
|
||
|
|
const navItems = [
|
||
|
|
{ to: '/dashboard', icon: '🏠', label: 'หน้าหลัก' },
|
||
|
|
{ to: '/browse/discovery', icon: '🔍', label: 'รายการคอร์ส' },
|
||
|
|
{ to: '/dashboard/my-courses', icon: '📚', label: 'คอร์สของฉัน' }
|
||
|
|
]
|
||
|
|
|
||
|
|
const isActive = (path: string) => {
|
||
|
|
if (path === '/') return route.path === '/'
|
||
|
|
return route.path.startsWith(path)
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<nav class="mobile-nav">
|
||
|
|
<NuxtLink
|
||
|
|
v-for="item in navItems"
|
||
|
|
:key="item.to"
|
||
|
|
:to="item.to"
|
||
|
|
class="mobile-nav-item"
|
||
|
|
:class="{ active: isActive(item.to) }"
|
||
|
|
>
|
||
|
|
<span>{{ item.icon }}</span>
|
||
|
|
<span>{{ item.label }}</span>
|
||
|
|
</NuxtLink>
|
||
|
|
</nav>
|
||
|
|
</template>
|