feat: course generation

components/aigc/NavItem.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+const props = defineProps({
+  icon: {
+    type: String,
+    default: 'i-tabler-photo-filled',
+  },
+  label: {
+    type: String,
+    required: true,
+  },
+  to: {
+    type: String,
+    required: true,
+  },
+})
+
+const route = useRoute()
+
+const active = computed(() => {
+  return route.path === props.to
+})
+</script>
+
+<template>
+  <NuxtLink
+      class="px-4 py-3 flex items-center gap-2 rounded-lg transition cursor-pointer"
+      :class="active ? 'bg-primary text-white' : 'hover:bg-neutral-200'"
+      :to="to"
+  >
+    <Icon :name="icon" class="text-xl inline"/>
+    <h1 class="text-[14px] font-medium">{{ label }}</h1>
+  </NuxtLink>
+</template>
+
+<style scoped>
+
+</style>