feat(课程): 添加课程组合列表接口并优化课程列表页面

添加获取课程组合列表的API接口
将课程列表页面从分页加载改为一次性加载
根据接口返回数据动态设置显示模式

 /*
 /*
  * @Date: 2025-04-15 09:32:07
  * @Date: 2025-04-15 09:32:07
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-06-16 11:34:00
+ * @LastEditTime: 2025-10-21 16:37:51
  * @FilePath: /mlaj/src/api/course.js
  * @FilePath: /mlaj/src/api/course.js
  * @Description: 课程模块相关接口
  * @Description: 课程模块相关接口
  */
  */
@@ -11,6 +11,7 @@ const Api = {
   GET_COURSE_LIST: '/srv/?a=schedule&t=list',
   GET_COURSE_LIST: '/srv/?a=schedule&t=list',
   GET_COURSE_DETAIL: '/srv/?a=schedule&t=detail',
   GET_COURSE_DETAIL: '/srv/?a=schedule&t=detail',
   GET_SCHEDULE_COURSE: '/srv/?a=schedule&t=course',
   GET_SCHEDULE_COURSE: '/srv/?a=schedule&t=course',
+  GET_SCHEDULE_COMBINATION_LIST: '/srv/?a=schedule&t=combination_list',
   GET_GROUP_COMMENT_LIST: '/srv/?a=group_comment_list',
   GET_GROUP_COMMENT_LIST: '/srv/?a=group_comment_list',
   GROUP_COMMENT_ADD: '/srv/?a=group_comment_add',
   GROUP_COMMENT_ADD: '/srv/?a=group_comment_add',
   GROUP_COMMENT_EDIT: '/srv/?a=group_comment_edit',
   GROUP_COMMENT_EDIT: '/srv/?a=group_comment_edit',
@@ -45,6 +46,13 @@ export const getCourseDetailAPI = (params) => fn(fetch.get(Api.GET_COURSE_DETAIL
 export const getScheduleCourseAPI = (params) => fn(fetch.get(Api.GET_SCHEDULE_COURSE, params))
 export const getScheduleCourseAPI = (params) => fn(fetch.get(Api.GET_SCHEDULE_COURSE, params))
 
 
 /**
 /**
+ * @description: 获取课程组合列表
+ * @param: id 课程 ID
+ * @return: data: [{ id, title, price, original_price, feature, highlights, count, cover}]
+ */
+export const getScheduleCombinationListAPI = (params) => fn(fetch.get(Api.GET_SCHEDULE_COMBINATION_LIST, params))
+
+/**
  * @description: 获取课程评论列表
  * @description: 获取课程评论列表
  * @param: i 课程 ID
  * @param: i 课程 ID
  * @param: schedule_id 章节ID，非必须，在课程章节内查询时需要
  * @param: schedule_id 章节ID，非必须，在课程章节内查询时需要

 <!--
 <!--
  * @Date: 2025-03-21 14:31:21
  * @Date: 2025-03-21 14:31:21
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-05-21 16:57:36
+ * @LastEditTime: 2025-10-21 17:12:13
  * @FilePath: /mlaj/src/views/courses/CourseListQRPage.vue
  * @FilePath: /mlaj/src/views/courses/CourseListQRPage.vue
  * @Description: 课程列表页面 - 支持列表和卡片两种显示模式
  * @Description: 课程列表页面 - 支持列表和卡片两种显示模式
 -->
 -->
@@ -10,13 +10,10 @@
     <div class="pb-16">
     <div class="pb-16">
       <!-- Course List -->
       <!-- Course List -->
       <div class="px-4">
       <div class="px-4">
-        <van-list
-          v-model:loading="loading"
-          :finished="finished"
-          finished-text="没有更多课程了"
-          @load="onLoad"
-          class="space-y-4"
-        >
+        <div v-if="loading" class="flex justify-center py-8">
+          <van-loading size="24px">加载中...</van-loading>
+        </div>
+        <div v-else class="space-y-4">
           <!-- 根据type参数显示不同组件 -->
           <!-- 根据type参数显示不同组件 -->
           <template v-if="displayType === 'card'">
           <template v-if="displayType === 'card'">
             <CourseImageCard v-for="course in courses" :key="course.id" :course="course" />
             <CourseImageCard v-for="course in courses" :key="course.id" :course="course" />
@@ -24,7 +21,7 @@
           <template v-else>
           <template v-else>
             <CourseCard v-for="course in courses" :key="course.id" :course="course" />
             <CourseCard v-for="course in courses" :key="course.id" :course="course" />
           </template>
           </template>
-        </van-list>
+        </div>
       </div>
       </div>
     </div>
     </div>
   </AppLayout>
   </AppLayout>
@@ -37,45 +34,45 @@ import AppLayout from '@/components/layout/AppLayout.vue';
 import CourseCard from '@/components/ui/CourseCard.vue';
 import CourseCard from '@/components/ui/CourseCard.vue';
 import CourseImageCard from '@/components/ui/CourseImageCard.vue';
 import CourseImageCard from '@/components/ui/CourseImageCard.vue';
 // 导入接口
 // 导入接口
-import { getCourseListAPI } from "@/api/course";
-import { List } from 'vant';
+import { getScheduleCombinationListAPI } from "@/api/course";
 
 
 const $route = useRoute();
 const $route = useRoute();
 const courses = ref([]);
 const courses = ref([]);
 const loading = ref(false);
 const loading = ref(false);
-const finished = ref(false);
-const limit = ref(5);
-const page = ref(0);
 
 
-// 根据URL参数确定显示类型
-const displayType = computed(() => {
-  return $route.query.type || 'list'; // 默认为list模式
-});
+// 显示类型，默认列表模式
+const displayType = ref('list');
 
 
 // 获取URL参数中的ID
 // 获取URL参数中的ID
 const courseId = computed(() => {
 const courseId = computed(() => {
   return $route.query.id || '';
   return $route.query.id || '';
 });
 });
 
 
-// Load more courses
-const onLoad = async () => {
-  const nextPage = page.value;
-  const params = { 
-    limit: limit.value, 
-    page: nextPage
-  };
+// 加载课程数据
+const loadCourses = async () => {
+  loading.value = true;
+  const params = {};
 
 
   // 如果有ID参数，添加到请求中
   // 如果有ID参数，添加到请求中
   if (courseId.value) {
   if (courseId.value) {
     params.id = courseId.value;
     params.id = courseId.value;
   }
   }
 
 
-  const res = await getCourseListAPI(params);
+  try {
+    const res = await getScheduleCombinationListAPI(params);
     if (res.code) {
     if (res.code) {
-    courses.value = [...courses.value, ...res.data];
-    finished.value = res.data.length < limit.value;
-    page.value = nextPage + 1;
+      courses.value = res.data.group_list;
+      displayType.value = res.data.display_mode;
     }
     }
+  } catch (error) {
+    console.error('加载课程失败:', error);
+  } finally {
     loading.value = false;
     loading.value = false;
+  }
 };
 };
+
+// 页面挂载时加载数据
+onMounted(() => {
+  loadCourses();
+});
 </script>
 </script>