web-学习任务

schoolNewsWeb/src/views/study-plan/CourseCenterView.vue

@@ -91,47 +91,14 @@
         </div>
       </div>
     </div>
-
-    <!-- 课程详情对话框 -->
-    <el-drawer
-      v-model="detailDrawerVisible"
-      size="100%"
-      :show-close="false"
-      :with-header="false"
-      direction="rtl"
-    >
-      <CourseDetail
-        v-if="selectedCourseId"
-        :course-id="selectedCourseId"
-        @back="handleCloseDetail"
-        @start-learning="handleStartLearning"
-      />
-    </el-drawer>
-
-    <!-- 课程学习对话框 -->
-    <el-drawer
-      v-model="learningDrawerVisible"
-      size="100%"
-      :show-close="false"
-      :with-header="false"
-      direction="rtl"
-    >
-      <CourseLearning
-        v-if="learningCourseId"
-        :course-id="learningCourseId"
-        :chapter-index="chapterIndex"
-        :node-index="nodeIndex"
-        @back="handleCloseLearning"
-      />
-    </el-drawer>
   </StudyPlanLayout>
 </template>
 
 <script setup lang="ts">
 import { ref, onMounted } from 'vue';
+import { useRouter } from 'vue-router';
 import { ElMessage } from 'element-plus';
 import { Search, VideoPlay } from '@element-plus/icons-vue';
-import { CourseDetail, CourseLearning } from '@/views/course';
 import { courseApi } from '@/apis/study';
 import type { Course, PageParam } from '@/types';
 import { StudyPlanLayout } from '@/views/study-plan';
@@ -142,6 +109,7 @@ defineOptions({
   name: 'CourseCenterView'
 });
 
+const router = useRouter();
 const loading = ref(false);
 const searchKeyword = ref('');
 const courseList = ref<Course[]>([]);
@@ -153,16 +121,6 @@ const pageParam = ref<PageParam>({
   size: 6
 });
 
-// 课程详情
-const detailDrawerVisible = ref(false);
-const selectedCourseId = ref<string>('');
-
-// 课程学习
-const learningDrawerVisible = ref(false);
-const learningCourseId = ref<string>('');
-const chapterIndex = ref(0);
-const nodeIndex = ref(0);
-
 onMounted(() => {
   loadCourseList();
 });
@@ -211,33 +169,14 @@ function handleCurrentChange() {
   loadCourseList();
 }
 
-// 点击课程卡片
+// 点击课程卡片 - 跳转到课程详情路由
 function handleCourseClick(courseId: string) {
-  selectedCourseId.value = courseId;
-  detailDrawerVisible.value = true;
-}
-
-// 关闭课程详情
-function handleCloseDetail() {
-  detailDrawerVisible.value = false;
-  selectedCourseId.value = '';
-}
-
-// 开始学习
-function handleStartLearning(courseId: string, chapter: number, node: number) {
-  detailDrawerVisible.value = false;
-  learningCourseId.value = courseId;
-  chapterIndex.value = chapter;
-  nodeIndex.value = node;
-  learningDrawerVisible.value = true;
-}
-
-// 关闭学习页面
-function handleCloseLearning() {
-  learningDrawerVisible.value = false;
-  learningCourseId.value = '';
-  chapterIndex.value = 0;
-  nodeIndex.value = 0;
+  console.log('handleCourseClick', courseId);
+  console.log('router', router.getRoutes());
+  router.push({
+    path: '/study-plan/course-detail',
+    query: { courseId }
+  });
 }
 
 // 格式化浏览次数
@@ -431,10 +370,4 @@ function getCategoryName(): string {
   justify-content: center;
   margin-top: 40px;
 }
-
-:deep(.el-drawer) {
-  .el-drawer__body {
-    padding: 0;
-  }
-}
 </style>