课程统计营期课程调整营期下拉框

src/views/course/userCoursePeriod/statistics.vue

@@ -7,7 +7,11 @@
           <el-select
             v-model="queryParams.videoIdList"
             multiple
-            placeholder="请选择营期课程"
+            filterable
+            remote
+            :remote-method="handleCourseSearch"
+            :loading="courseLoading"
+            placeholder="请输入关键词搜索营期课程"
             style="width: 400px"
           >
             <el-option
@@ -146,6 +150,7 @@ export default {
     return {
       // 遮罩层
       loading: false,
+      courseLoading: false,
       // 总条数
       total: 0,
       // 课程选项
@@ -168,7 +173,7 @@ export default {
         pageNum: 1,
         pageSize: 100,
         videoIdList: [],
-        // videoId: '',
+        companyId: '',
         periodId: ''
       },
       // 是否已初始化
@@ -198,10 +203,10 @@ export default {
     /** 初始化数据 */
     initializeData() {
       this.getCourseOptions();
-      this.getCountList();
-      this.getCompanyOptions()
+      this.getCompanyOptions();
       this.initialized = true;
     },
+
     getCompanyOptions() {
       getPeriodCompanyList({
         periodId: this.periodId
@@ -209,9 +214,10 @@ export default {
         this.companyOptions = response.data || [];
       });
     },
+
     /** 获取课程选项 */
     getCourseOptions() {
-      this.loading = true;
+      this.courseLoading = true;
       getDays(this.queryParams).then(r => {
         if (r.code === 200) {
           this.courseOptions = r.rows;
@@ -219,19 +225,44 @@ export default {
         } else {
           this.$message.error(r.msg || '获取数据失败');
         }
-        this.loading = false;
+        this.courseLoading = false;
       }).catch(() => {
-        this.loading = false;
+        this.courseLoading = false;
       });
     },
+
+    /** 营期课程搜索 */
+    handleCourseSearch(query) {
+      if (query !== '') {
+        this.courseLoading = true;
+        // 这里可以根据实际接口调整搜索参数
+        getDays({
+          periodId: this.queryParams.periodId,
+          pageNum: 1,
+          pageSize: 100,
+          videoName: query // 假设接口支持按课程名称搜索
+        }).then(r => {
+          if (r.code === 200) {
+            this.courseOptions = r.rows;
+          } else {
+            this.$message.error(r.msg || '搜索失败');
+          }
+          this.courseLoading = false;
+        }).catch(() => {
+          this.courseLoading = false;
+        });
+      } else {
+        // 如果搜索词为空，重新加载所有课程
+        this.getCourseOptions();
+      }
+    },
+
     /** 查询按钮操作 */
     handleQuery() {
       this.queryParams.pageNum = 1;
       this.getCountList();
     },
-    /** 课程选择变化 */
-    handleCourseChange() {
-    },
+
     /** 获取列表数据 */
     getCountList() {
       this.loading = true;
@@ -255,6 +286,7 @@ export default {
         this.loading = false;
       });
     },
+
     /** 计算总统计数据 */
     calculateTotalStatistics() {
       // 初始化统计数据