2025-10-23 18:57:31 +08:00
|
|
|
<template>
|
|
|
|
|
<CourseDetail
|
|
|
|
|
v-if="courseId"
|
|
|
|
|
:course-id="courseId"
|
|
|
|
|
:show-back-button="true"
|
2025-10-28 19:04:35 +08:00
|
|
|
back-button-text="返回"
|
2025-10-23 18:57:31 +08:00
|
|
|
@back="handleBack"
|
|
|
|
|
@start-learning="handleStartLearning"
|
|
|
|
|
/>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
2025-10-28 19:04:35 +08:00
|
|
|
import { computed, onMounted } from 'vue';
|
2025-10-23 18:57:31 +08:00
|
|
|
import { useRouter, useRoute } from 'vue-router';
|
2025-10-27 17:29:25 +08:00
|
|
|
import { CourseDetail } from '@/views/public/course/components';
|
2025-10-28 19:04:35 +08:00
|
|
|
import { courseApi } from '@/apis/study';
|
2025-10-23 18:57:31 +08:00
|
|
|
|
|
|
|
|
defineOptions({
|
|
|
|
|
name: 'CourseDetailView'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const router = useRouter();
|
|
|
|
|
const route = useRoute();
|
|
|
|
|
|
|
|
|
|
const courseId = computed(() => route.query.courseId as string || '');
|
|
|
|
|
|
|
|
|
|
// 返回上一页
|
|
|
|
|
function handleBack() {
|
|
|
|
|
router.back();
|
|
|
|
|
}
|
2025-10-28 19:04:35 +08:00
|
|
|
onMounted(() => {
|
|
|
|
|
// 调用接口更新浏览记录
|
|
|
|
|
courseApi.incrementViewCount(courseId.value);
|
|
|
|
|
});
|
2025-10-23 18:57:31 +08:00
|
|
|
|
|
|
|
|
// 开始学习课程
|
|
|
|
|
function handleStartLearning(courseId: string, chapterIndex: number, nodeIndex: number) {
|
|
|
|
|
// 跳转到课程学习页面
|
|
|
|
|
router.push({
|
|
|
|
|
path: '/study-plan/course-study',
|
|
|
|
|
query: {
|
|
|
|
|
courseId,
|
|
|
|
|
chapterIndex: chapterIndex.toString(),
|
|
|
|
|
nodeIndex: nodeIndex.toString()
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|