feat: 课程中心增加课程包主题筛选，过滤导入课/集体课

- 后端: 套餐筛选元数据新增 themes，getPackages 支持 themeId - 前端: 学校端/教师端课程中心增加课程包主题下拉筛选 - 课程配置筛选和卡片展示均过滤导入课、集体课 Made-with: Cursor
2026-03-23 18:28:54 +08:00 · 2026-03-23 18:28:54 +08:00 · 2d9856edac
commit 2d9856edac
parent 212559fd9f
9 changed files with 140 additions and 64 deletions
--- a/reading-platform-frontend/src/api/course-center.ts
+++ b/reading-platform-frontend/src/api/course-center.ts
@ -52,10 +52,18 @@ export interface LessonTypeOption {
  count: number;
 }

+/** 筛选元数据 - 课程包主题选项 */
+export interface ThemeOption {
+  themeId: number;
+  name: string;
+  count: number;
+}
+
 /** 筛选元数据响应 */
 export interface FilterMetaResponse {
  grades: GradeOption[];
  lessonTypes: LessonTypeOption[];
+  themes?: ThemeOption[];
 }

 // ============= API 接口 =============
@ -75,6 +83,7 @@ export function getPackages(
  params?: {
    grade?: string;
    lessonType?: string;
+    themeId?: number;
    keyword?: string;
  }
 ): Promise<CoursePackage[]> {
--- a/reading-platform-frontend/src/views/school/courses-new/CourseCenterView.vue
+++ b/reading-platform-frontend/src/views/school/courses-new/CourseCenterView.vue
@ -59,19 +59,31 @@
          </div>

          <div class="filter-row">
+            <!-- 课程包主题筛选 -->
+            <div class="filter-group">
+              <span class="filter-label">课程包主题：</span>
+              <a-select v-model:value="selectedThemeId" placeholder="全部课程包主题" style="width: 180px" allowClear
+                @change="loadPackages">
+                <a-select-option :value="undefined">全部课程包主题</a-select-option>
+                <a-select-option v-for="opt in (filterMeta.themes || [])" :key="opt.themeId" :value="opt.themeId">
+                  {{ opt.name }} ({{ opt.count }})
+                </a-select-option>
+              </a-select>
+            </div>
            <!-- 课程配置筛选 -->
            <div class="filter-group">
              <span class="filter-label">课程配置：</span>
              <a-select v-model:value="selectedLessonType" placeholder="全部课程配置" style="width: 180px" allowClear
                @change="loadPackages">
                <a-select-option :value="undefined">全部课程配置</a-select-option>
-                <a-select-option v-for="opt in (filterMeta.lessonTypes || [])" :key="opt.lessonType"
+                <a-select-option v-for="opt in filteredLessonTypes" :key="opt.lessonType"
                  :value="opt.lessonType">
                  {{ opt.name }} ({{ opt.count }})
                </a-select-option>
              </a-select>
            </div>

+
            <!-- 搜索 -->
            <div class="filter-group search-group">
              <a-input-search v-model:value="searchKeyword" placeholder="搜索课程包..." style="width: 220px" allowClear
@ -137,7 +149,14 @@ const selectedCollection = computed(() =>
 );

 // 筛选元数据
-const filterMeta = ref<FilterMetaResponse>({ grades: [], themes: [] });
+const filterMeta = ref<FilterMetaResponse>({ grades: [], lessonTypes: [], themes: [] });
+
+// 课程配置筛选选项（过滤导入课、集体课）
+const EXCLUDED_LESSON_TYPES = new Set(['INTRODUCTION', 'INTRO', 'COLLECTIVE']);
+const filteredLessonTypes = computed(() => {
+  const list = filterMeta.value.lessonTypes || [];
+  return list.filter(opt => !EXCLUDED_LESSON_TYPES.has((opt.lessonType || '').toUpperCase()));
+});

 // 课程包列表
 const packages = ref<CoursePackage[]>([]);
@ -176,6 +195,7 @@ const selectCollection = async (collection: CourseCollection) => {
  // 重置筛选条件
  selectedGrade.value = '';
  selectedLessonType.value = undefined;
+  selectedThemeId.value = undefined;
  searchKeyword.value = '';
  descExpanded.value = false;

@ -205,7 +225,7 @@ const loadFilterMeta = async () => {
    filterMeta.value = await getFilterMeta(selectedCollectionId.value);
  } catch (error) {
    console.error('获取筛选元数据失败', error);
-    filterMeta.value = { grades: [], lessonTypes: [] };
+    filterMeta.value = { grades: [], lessonTypes: [], themes: [] };
  }
 };

@ -217,6 +237,7 @@ const loadPackages = async () => {
    packages.value = await getPackages(selectedCollectionId.value, {
      grade: selectedGrade.value || undefined,
      lessonType: selectedLessonType.value,
+      themeId: selectedThemeId.value,
      keyword: searchKeyword.value || undefined,
    });
  } catch (error: any) {
@ -227,8 +248,8 @@ const loadPackages = async () => {
  }
 };

-// 监听年级、课程配置变化
-watch([selectedGrade, selectedLessonType], () => {
+// 监听年级、课程配置、主题变化
+watch([selectedGrade, selectedLessonType, selectedThemeId], () => {
  loadPackages();
 });

--- a/reading-platform-frontend/src/views/school/courses-new/components/CoursePackageCard.vue
+++ b/reading-platform-frontend/src/views/school/courses-new/components/CoursePackageCard.vue
@ -88,13 +88,14 @@ const gradeText = computed(() => {
  return grades.join(' · ');
 });

-// 从 courses 提取课程类型列表（去重，与管理端一致）
+// 从 courses 提取课程类型列表（去重，过滤导入课、集体课）
+const EXCLUDED_LESSON_TYPES = new Set(['INTRODUCTION', 'INTRO', 'COLLECTIVE']);
 const lessonTypes = computed(() => {
  const courses = props.pkg.courses || [];
  const types = new Set<string>();
  for (const c of courses) {
    const t = c.lessonType;
-    if (t) types.add(t);
+    if (t && !EXCLUDED_LESSON_TYPES.has(t.toUpperCase())) types.add(t);
  }
  return Array.from(types);
 });
--- a/reading-platform-frontend/src/views/teacher/courses-new/CourseCenterView.vue
+++ b/reading-platform-frontend/src/views/teacher/courses-new/CourseCenterView.vue
@ -7,12 +7,9 @@
      </div>
      <a-spin :spinning="loadingCollections">
        <div class="collection-list">
-          <div
-            v-for="collection in collections"
-            :key="collection.id"
+          <div v-for="collection in collections" :key="collection.id"
            :class="['collection-item', { active: selectedCollectionId === collection.id }]"
-            @click="selectCollection(collection)"
-          >
+            @click="selectCollection(collection)">
            <div class="collection-name">{{ collection.name }}</div>
            <div class="collection-count">{{ collection.packageCount || 0 }}个课程包</div>
          </div>
@ -34,11 +31,7 @@
            <div ref="descRef" :class="['desc-text', { expanded: descExpanded }]">
              {{ selectedCollection.description }}
            </div>
-            <button
-              v-if="showExpandBtn"
-              class="expand-btn"
-              @click="descExpanded = !descExpanded"
-            >
+            <button v-if="showExpandBtn" class="expand-btn" @click="descExpanded = !descExpanded">
              {{ descExpanded ? '收起' : '展开更多' }}
              <DownOutlined :class="{ rotated: descExpanded }" />
            </button>
@ -52,18 +45,12 @@
            <div class="filter-group">
              <span class="filter-label">年级：</span>
              <div class="grade-tags">
-                <span
-                  :class="['grade-tag', { active: !selectedGrade }]"
-                  @click="selectedGrade = ''"
-                >
+                <span :class="['grade-tag', { active: !selectedGrade }]" @click="selectedGrade = ''">
                  全部
                </span>
-                <span
-                  v-for="grade in filterMeta.grades"
-                  :key="grade.label"
+                <span v-for="grade in filterMeta.grades" :key="grade.label"
                  :class="['grade-tag', { active: selectedGrade === grade.label }]"
-                  @click="selectedGrade = grade.label"
-                >
+                  @click="selectedGrade = grade.label">
                  {{ grade.label }}
                  <span class="count">({{ grade.count }})</span>
                </span>
@ -71,37 +58,36 @@
            </div>
          </div>

-          <div class="filter-row">
+          <div class="filter-row"><!-- 课程包主题筛选 -->
+            <div class="filter-group">
+              <span class="filter-label">课程包主题：</span>
+              <a-select v-model:value="selectedThemeId" placeholder="全部课程包主题" style="width: 180px" allowClear
+                @change="loadPackages">
+                <a-select-option :value="undefined">全部课程包主题</a-select-option>
+                <a-select-option v-for="opt in (filterMeta.themes || [])" :key="opt.themeId" :value="opt.themeId">
+                  {{ opt.name }} ({{ opt.count }})
+                </a-select-option>
+              </a-select>
+            </div>
            <!-- 课程配置筛选 -->
            <div class="filter-group">
              <span class="filter-label">课程配置：</span>
-              <a-select
-                v-model:value="selectedLessonType"
-                placeholder="全部课程配置"
-                style="width: 180px"
-                allowClear
-                @change="loadPackages"
-              >
+              <a-select v-model:value="selectedLessonType" placeholder="全部课程配置" style="width: 180px" allowClear
+                @change="loadPackages">
                <a-select-option :value="undefined">全部课程配置</a-select-option>
-                <a-select-option
-                  v-for="opt in (filterMeta.lessonTypes || [])"
-                  :key="opt.lessonType"
-                  :value="opt.lessonType"
-                >
+                <a-select-option v-for="opt in filteredLessonTypes" :key="opt.lessonType"
+                  :value="opt.lessonType">
                  {{ opt.name }} ({{ opt.count }})
                </a-select-option>
              </a-select>
            </div>

+
+
            <!-- 搜索 -->
            <div class="filter-group search-group">
-              <a-input-search
-                v-model:value="searchKeyword"
-                placeholder="搜索课程包..."
-                style="width: 220px"
-                allowClear
-                @search="loadPackages"
-              />
+              <a-input-search v-model:value="searchKeyword" placeholder="搜索课程包..." style="width: 220px" allowClear
+                @search="loadPackages" />
            </div>
          </div>
        </section>
@ -110,13 +96,8 @@
        <section class="packages-section">
          <a-spin :spinning="loadingPackages">
            <div v-if="packages.length > 0" class="packages-grid">
-              <CoursePackageCard
-                v-for="pkg in packages"
-                :key="pkg.id"
-                :pkg="pkg"
-                @click="handlePackageClick"
-                @prepare="handlePrepare"
-              />
+              <CoursePackageCard v-for="pkg in packages" :key="pkg.id" :pkg="pkg" @click="handlePackageClick"
+                @prepare="handlePrepare" />
            </div>
            <div v-else class="empty-packages">
              <InboxOutlined class="empty-icon" />
@ -166,7 +147,14 @@ const selectedCollection = computed(() =>
 );

 // 筛选元数据
-const filterMeta = ref<FilterMetaResponse>({ grades: [], lessonTypes: [] });
+const filterMeta = ref<FilterMetaResponse>({ grades: [], lessonTypes: [], themes: [] });
+
+// 课程配置筛选选项（过滤导入课、集体课）
+const EXCLUDED_LESSON_TYPES = new Set(['INTRODUCTION', 'INTRO', 'COLLECTIVE']);
+const filteredLessonTypes = computed(() => {
+  const list = filterMeta.value.lessonTypes || [];
+  return list.filter(opt => !EXCLUDED_LESSON_TYPES.has((opt.lessonType || '').toUpperCase()));
+});

 // 课程包列表
 const packages = ref<CoursePackage[]>([]);
@ -175,6 +163,7 @@ const loadingPackages = ref(false);
 // 筛选条件
 const selectedGrade = ref('');
 const selectedLessonType = ref<string | undefined>(undefined);
+const selectedThemeId = ref<number | undefined>(undefined);
 const searchKeyword = ref('');

 // 描述展开
@ -205,6 +194,7 @@ const selectCollection = async (collection: CourseCollection) => {
  // 重置筛选条件
  selectedGrade.value = '';
  selectedLessonType.value = undefined;
+  selectedThemeId.value = undefined;
  searchKeyword.value = '';
  descExpanded.value = false;

@ -234,7 +224,7 @@ const loadFilterMeta = async () => {
    filterMeta.value = await getFilterMeta(selectedCollectionId.value);
  } catch (error) {
    console.error('获取筛选元数据失败', error);
-    filterMeta.value = { grades: [], lessonTypes: [] };
+    filterMeta.value = { grades: [], lessonTypes: [], themes: [] };
  }
 };

@ -246,6 +236,7 @@ const loadPackages = async () => {
    packages.value = await getPackages(selectedCollectionId.value, {
      grade: selectedGrade.value || undefined,
      lessonType: selectedLessonType.value,
+      themeId: selectedThemeId.value,
      keyword: searchKeyword.value || undefined,
    });
  } catch (error: any) {
@ -266,8 +257,8 @@ const handlePrepare = (pkg: CoursePackage) => {
  router.push(`/teacher/courses/${pkg.id}/prepare`);
 };

-// 监听年级、课程配置变化
-watch([selectedGrade, selectedLessonType], () => {
+// 监听年级、课程配置、主题变化
+watch([selectedGrade, selectedLessonType, selectedThemeId], () => {
  loadPackages();
 });

--- a/reading-platform-frontend/src/views/teacher/courses-new/components/CoursePackageCard.vue
+++ b/reading-platform-frontend/src/views/teacher/courses-new/components/CoursePackageCard.vue
@ -88,13 +88,14 @@ const gradeText = computed(() => {
  return grades.join(' · ');
 });

-// 从 courses 提取课程类型列表（去重，与管理端一致）
+// 从 courses 提取课程类型列表（去重，过滤导入课、集体课）
+const EXCLUDED_LESSON_TYPES = new Set(['INTRODUCTION', 'INTRO', 'COLLECTIVE']);
 const lessonTypes = computed(() => {
  const courses = props.pkg.courses || [];
  const types = new Set<string>();
  for (const c of courses) {
    const t = c.lessonType;
-    if (t) types.add(t);
+    if (t && !EXCLUDED_LESSON_TYPES.has(t.toUpperCase())) types.add(t);
  }
  return Array.from(types);
 });
--- a/reading-platform-java/src/main/java/com/reading/platform/controller/school/SchoolPackageController.java
+++ b/reading-platform-java/src/main/java/com/reading/platform/controller/school/SchoolPackageController.java
@ -51,8 +51,9 @@ public class SchoolPackageController {
            @PathVariable Long collectionId,
            @RequestParam(required = false) String grade,
            @RequestParam(required = false) String lessonType,
+            @RequestParam(required = false) Long themeId,
            @RequestParam(required = false) String keyword) {
-        return Result.success(collectionService.getPackagesByCollection(collectionId, grade, lessonType, keyword));
+        return Result.success(collectionService.getPackagesByCollection(collectionId, grade, lessonType, themeId, keyword));
    }

    @GetMapping("/{collectionId}/filter-meta")
--- a/reading-platform-java/src/main/java/com/reading/platform/dto/response/PackageFilterMetaResponse.java
+++ b/reading-platform-java/src/main/java/com/reading/platform/dto/response/PackageFilterMetaResponse.java
@ -25,6 +25,9 @@ public class PackageFilterMetaResponse {
    @Schema(description = "课程配置选项列表（导入课、集体课、健康、科学等）")
    private List<LessonTypeOption> lessonTypes;

+    @Schema(description = "课程包主题选项列表")
+    private List<ThemeOption> themes;
+
    /**
     * 年级选项
     */
@ -59,4 +62,23 @@ public class PackageFilterMetaResponse {
        @Schema(description = "包含该类型环节的课程包数量")
        private Integer count;
    }
+
+    /**
+     * 课程包主题选项
+     */
+    @Data
+    @Builder
+    @NoArgsConstructor
+    @AllArgsConstructor
+    @Schema(description = "课程包主题选项")
+    public static class ThemeOption {
+        @Schema(description = "主题ID")
+        private Long themeId;
+
+        @Schema(description = "主题名称")
+        private String name;
+
+        @Schema(description = "该主题下的课程包数量")
+        private Integer count;
+    }
 }
--- a/reading-platform-java/src/main/java/com/reading/platform/service/CourseCollectionService.java
+++ b/reading-platform-java/src/main/java/com/reading/platform/service/CourseCollectionService.java
@ -40,10 +40,11 @@ public interface CourseCollectionService extends IService<CourseCollection> {
     * @param collectionId 套餐ID
     * @param grade 年级筛选
     * @param lessonType 课程配置筛选（INTRODUCTION、COLLECTIVE、HEALTH、LANGUAGE、SCIENCE、SOCIAL、ART）
+     * @param themeId 课程包主题筛选
     * @param keyword 关键词搜索
     * @return 课程包列表
     */
-    List<CoursePackageResponse> getPackagesByCollection(Long collectionId, String grade, String lessonType, String keyword);
+    List<CoursePackageResponse> getPackagesByCollection(Long collectionId, String grade, String lessonType, Long themeId, String keyword);

    /**
     * 获取套餐的筛选元数据（年级、课程配置选项）
--- a/reading-platform-java/src/main/java/com/reading/platform/service/impl/CourseCollectionServiceImpl.java
+++ b/reading-platform-java/src/main/java/com/reading/platform/service/impl/CourseCollectionServiceImpl.java
@ -213,8 +213,8 @@ public class CourseCollectionServiceImpl extends ServiceImpl<CourseCollectionMap
     * 获取课程套餐下的课程包列表（支持筛选）
     */
    @Override
-    public List<CoursePackageResponse> getPackagesByCollection(Long collectionId, String grade, String lessonType, String keyword) {
-        log.info("获取课程套餐的课程包列表（筛选），collectionId={}, grade={}, lessonType={}, keyword={}", collectionId, grade, lessonType, keyword);
+    public List<CoursePackageResponse> getPackagesByCollection(Long collectionId, String grade, String lessonType, Long themeId, String keyword) {
+        log.info("获取课程套餐的课程包列表（筛选），collectionId={}, grade={}, lessonType={}, themeId={}, keyword={}", collectionId, grade, lessonType, themeId, keyword);

        // 查询关联关系
        List<CourseCollectionPackage> associations = collectionPackageMapper.selectList(
@ -252,6 +252,11 @@ public class CourseCollectionServiceImpl extends ServiceImpl<CourseCollectionMap
            wrapper.apply("JSON_CONTAINS(grade_tags, {0})", "\"" + grade + "\"");
        }

+        // 课程包主题筛选
+        if (themeId != null) {
+            wrapper.eq(CoursePackage::getThemeId, themeId);
+        }
+
        // 关键词搜索
        if (StringUtils.hasText(keyword)) {
            wrapper.and(w -> w
@ -315,6 +320,7 @@ public class CourseCollectionServiceImpl extends ServiceImpl<CourseCollectionMap
            return PackageFilterMetaResponse.builder()
                    .grades(new ArrayList<>())
                    .lessonTypes(new ArrayList<>())
+                    .themes(new ArrayList<>())
                    .build();
        }

@ -373,9 +379,32 @@ public class CourseCollectionServiceImpl extends ServiceImpl<CourseCollectionMap
                        .build())
                .collect(Collectors.toList());

+        // 统计课程包主题分布
+        Map<Long, Integer> themeCountMap = new HashMap<>();
+        Map<Long, String> themeNameMap = new HashMap<>();
+        for (CoursePackage pkg : packages) {
+            Long tid = pkg.getThemeId();
+            if (tid != null) {
+                themeCountMap.merge(tid, 1, Integer::sum);
+                if (!themeNameMap.containsKey(tid)) {
+                    Theme theme = themeMapper.selectById(tid);
+                    themeNameMap.put(tid, theme != null ? theme.getName() : "主题" + tid);
+                }
+            }
+        }
+        List<PackageFilterMetaResponse.ThemeOption> themes = themeCountMap.entrySet().stream()
+                .map(e -> PackageFilterMetaResponse.ThemeOption.builder()
+                        .themeId(e.getKey())
+                        .name(themeNameMap.getOrDefault(e.getKey(), ""))
+                        .count(e.getValue())
+                        .build())
+                .sorted((a, b) -> themeNameMap.getOrDefault(a.getThemeId(), "").compareTo(themeNameMap.getOrDefault(b.getThemeId(), "")))
+                .collect(Collectors.toList());
+
        return PackageFilterMetaResponse.builder()
                .grades(grades)
                .lessonTypes(lessonTypes)
+                .themes(themes)
                .build();
    }