修改

src/components/course/othercourse-form.vue

+<style>
+
+</style>
+<template>
+  <q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale">
+    <q-card style="width: 600px;max-width:600px;" class="CLM-Form">
+      <q-card-section>
+        <div class="text-h6">关联其他课程</div>
+      </q-card-section>
+      <q-card-section class="q-pt-none scroll" style="max-height: 70vh">
+        <div class="row">
+          <div class="col">
+            <q-select dense standout behavior="menu" filled v-model="chosenCourse" :options="courseOptions"
+              @filter="filterCourseFn" input-debounce="0" use-input option-label="CourseName" option-value="CourseId"
+              emit-value map-options placeholder="请选择" clearable />
+          </div>
+          <div class="q-ml-md">
+            <q-btn color="primary" label="添加" @click="addCourse"></q-btn>
+          </div>
+        </div>
+        <q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat style="margin-top:20px;" class="sticky-column-table"
+          separator="none" :data="dataList" :columns="columns">
+          <template v-slot:bottom>
+            <!-- <q-pagination class="full-width justify-end" v-model="msg.PageIndex" color="primary" :max="msg.PageCount"
+              :input="true" @input="changePage" /> -->
+          </template>
+        </q-table>
+      </q-card-section>
+      <q-separator />
+      <q-card-actions align="right" class="bg-white">
+        <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeCourseForm" />
+        <q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveCourseLoading"
+          @click="saveCourse" />
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
+</template>
+
+<script>
+  export default {
+    components: {},
+    props: {
+
+    },
+    data() {
+      return {
+        persistent: true,
+        saveCourseLoading: false,
+        chosenCourse: null, //选中的课程
+        chosenCourses: [],
+        courseOptions: [{
+          CourseName: '考级保研班1',
+          CourseId: 1
+        }, {
+          CourseName: '考级保研班2',
+          CourseId: 2
+        }],
+        dataList:[],
+        columns: [{
+            name: 'CourseName',
+            label: '课程名称',
+            field: 'CourseName',
+            align: 'left'
+          },
+          {
+            name: 'Price',
+            label: '价格',
+            field: 'Price',
+            align: 'left'
+          },
+          {
+            name: 'CourseHour',
+            label: '课时数',
+            field: 'CourseHour',
+            align: 'left'
+          },
+          {
+            name: 'CateId',
+            label: '操作',
+            field: 'CateId'
+          }
+        ],
+      }
+    },
+    created() {
+
+    },
+    mounted() {
+
+    },
+    methods: {
+      saveCourse() {
+
+      },
+      //关闭弹窗
+      closeCourseForm() {
+        this.$emit('close');
+        this.persistent = false;
+      },
+      //课程筛选
+      filterCourseFn(val, update, abort) {
+        update(() => {
+          //   this.courseOptions = this.courseList.filter(
+          //     v => v.CourseName.indexOf(val) > -1
+          //   );
+        });
+      },
+      addCourse() {
+
+      }
+    }
+  }
+
+</script>