108 lines
2.7 KiB
Vue
108 lines
2.7 KiB
Vue
<script lang="ts" setup>
|
|
import {
|
|
FnTeachLessonPlan,
|
|
FnTeachCaseGen,
|
|
FnTeachStdDesign,
|
|
FnTeachKnowledgeDiagram,
|
|
FnTeachPoliticalCase,
|
|
FnTeachCourseOutline,
|
|
} from '#components'
|
|
import type { NavTertiaryItem } from '~/components/nav/Tertiary.vue'
|
|
|
|
definePageMeta({
|
|
requiresAuth: true,
|
|
})
|
|
|
|
useHead({
|
|
title: 'AI 教学设计 | 备课',
|
|
})
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
const { setBreadcrumbs } = useBreadcrumbs()
|
|
|
|
const tertiaryNavs: NavTertiaryItem[] = [
|
|
{ label: '课程标准', component: FnTeachStdDesign },
|
|
{ label: '教案设计', component: FnTeachLessonPlan },
|
|
{ label: '知识图谱', component: FnTeachKnowledgeDiagram, disabled: true },
|
|
{ label: '课程大纲', component: FnTeachCourseOutline },
|
|
{ label: '教学案例', component: FnTeachCaseGen },
|
|
{ label: '思政案例', component: FnTeachPoliticalCase },
|
|
// { label: '课程章节', component: FnTeachCourseChapter },
|
|
// { label: '教研计划', component: FnTeachResearchPlan },
|
|
// { label: '教学计划', component: FnTeachPlan },
|
|
]
|
|
|
|
const currentNav = ref(0)
|
|
|
|
watch(currentNav, (val) => {
|
|
router.replace({
|
|
query: {
|
|
fn: val,
|
|
},
|
|
})
|
|
})
|
|
|
|
onMounted(() => {
|
|
if (route.query.fn && !isNaN(Number(route.query.fn))) {
|
|
currentNav.value = Number(route.query.fn)
|
|
}
|
|
|
|
setBreadcrumbs([
|
|
{
|
|
label: 'AI 备课',
|
|
path: '/course/prep',
|
|
},
|
|
{
|
|
label: 'AI 教学设计',
|
|
},
|
|
])
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<AppContainer
|
|
:nav-secondary="[]"
|
|
content-class="flex items-start p-0"
|
|
>
|
|
<div class="w-[188px] h-full border-r shadow-xl">
|
|
<div class="flex justify-center items-center h-16 border-b gap-2">
|
|
<Icon
|
|
name="fluent-color:design-ideas-24"
|
|
class="text-2xl"
|
|
/>
|
|
<h1 class="text-base font-medium text-foreground">AI 教学设计</h1>
|
|
</div>
|
|
<div class="p-2">
|
|
<NavTertiary
|
|
v-model="currentNav"
|
|
:navs="tertiaryNavs"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="flex-1 h-full p-6">
|
|
<Suspense>
|
|
<KeepAlive v-if="tertiaryNavs[currentNav].component">
|
|
<component
|
|
:is="tertiaryNavs[currentNav].component"
|
|
v-bind="tertiaryNavs[currentNav].props"
|
|
class="w-full h-full"
|
|
/>
|
|
</KeepAlive>
|
|
<div
|
|
v-else
|
|
class="flex flex-col items-center justify-center w-full h-full gap-2"
|
|
>
|
|
<Icon
|
|
name="tabler:mood-sad"
|
|
class="text-6xl text-muted-foreground"
|
|
/>
|
|
<p class="text text-muted-foreground">该功能暂不可用</p>
|
|
</div>
|
|
</Suspense>
|
|
</div>
|
|
</AppContainer>
|
|
</template>
|
|
|
|
<style scoped></style>
|