wip

pages/aigc/generation.vue

@@ -0,0 +1,53 @@
+<script setup lang="tsx">
+import NavItem from '~/components/ppt/NavItem.vue'
+
+useSeoMeta({
+  title: '智能生成',
+})
+</script>
+
+<template>
+  <div class="w-full flex relative">
+
+    <div class="absolute -translate-x-full md:sticky md:translate-x-0 z-10 flex flex-col h-[calc(100vh-4rem)] bg-neutral-100 dark:bg-neutral-900 p-4 w-full md:w-[300px]
+               border-r border-neutral-200 dark:border-neutral-700 transition-all duration-300 ease-out">
+      <div class="flex flex-col flex-1 overflow-auto overflow-x-hidden">
+        <div class="flex flex-col gap-1">
+          <ClientOnly>
+            <NavItem
+                icon="tabler:presentation-analytics"
+                label="微课视频生成"
+                to="/aigc/generation/video-generate"
+            />
+            <NavItem
+                icon="tabler:user-screen"
+                label="数字讲师"
+                to="/aigc/generation/digital-teachers"
+            />
+          </ClientOnly>
+        </div>
+      </div>
+    </div>
+
+    <LoginNeededContent
+        content-class="h-[calc(100vh-4rem)] flex-1 bg-white dark:bg-neutral-900"
+    >
+      <Transition name="subpage" mode="out-in">
+        <NuxtPage :page-key="route => route.fullPath"/>
+      </Transition>
+    </LoginNeededContent>
+
+  </div>
+</template>
+
+<style>
+.subpage-enter-active,
+.subpage-leave-active {
+  transition: opacity 0.3s;
+}
+
+.subpage-enter-from,
+.subpage-leave-to {
+  opacity: 0;
+}
+</style>