课程列表 修复 日课、月课切换异常的问题

src/components/lesson/dialog.vue

@@ -26,7 +26,10 @@
         <el-row>
           <el-col :span="10">
             <el-form-item label="课程类型">
-              <el-select v-model="form.type" placeholder="请选择课程类型" @change="selectedLesson = [],selectedLessonList = []">
+              <el-select
+                v-model="form.type" placeholder="请选择课程类型"
+                @change="changLessonItem">
+                <!--@change="selectedLesson = [], selectedLessonList = []">-->
                 <el-option label="月课" :value="0"></el-option>
                 <el-option label="日课" :value="1"></el-option>
               </el-select>
@@ -35,14 +38,15 @@
           <el-col :span="10">
             <el-form-item label="选择课程">
               <el-cascader
+                ref="cascader"
                 clearable
                 :value="selectedLesson"
                 :options="showLessonList"
                 :show-all-levels="false"
-                @active-item-change="changLessonItem"
                 @change="selectLesson"
                 :props="{label: 'name',value:'id',children:'children'}"
               ></el-cascader>
+                <!--@active-item-change="changLessonItem"-->
             </el-form-item>
           </el-col>
         </el-row>
@@ -120,10 +124,12 @@
     ],
     data(){
       return{
+        lessList: [],
+        fullList: [],
+        showLessonList:[],
         selectedLesson:[],
         selectedLessonList:[],
         lessonList:[],
-        showLessonList:[],
         selectedBox:[],
         selectedBoxList:[],
         boxList:[],
@@ -152,18 +158,24 @@
 
       },
       changLessonItem(){
-        if(this.form.type === 0){
-          this.showLessonList.forEach(a=>{
+        this.selectedLesson = [];
+        this.selectedLessonList = [];
+        // debugger
+        // this.$refs.cascader.clearCheckedNodes();
+        /*if(this.form.type == 0){
+          /!*var arr = JSON.parse(JSON.stringify(this.lessonList));
+          arr.forEach(a=>{
             a.children =  a.children || [];
             a.children.forEach(b=>{
               if(b.children){
                 delete b.children
               }
             })
-          })
-        }else{
-          this.showLessonList = this.lessonList
-        }
+          })*!/
+          this.showLessonList = this.lessList;
+        } else {
+          this.showLessonList = this.fullList;
+        }*/
       },
       delLesson(data){
         this.selectedLessonList = this.selectedLessonList.filter(i=>{
@@ -275,7 +287,25 @@
         });
         getCategoryApi().then(res=>{
           this.lessonList = res;
-          this.showLessonList = JSON.parse(JSON.stringify(res))
+
+          var lessList = JSON.parse(JSON.stringify(res));
+          lessList.forEach(a=>{
+            a.children =  a.children || [];
+            a.children.forEach(b=>{
+              if(b.children){
+                delete b.children
+              }
+            })
+          })
+          this.lessList = lessList;
+          this.fullList = JSON.parse(JSON.stringify(res));
+
+          if (this.form.type == 0) {
+            this.showLessonList = this.lessList;
+          } else {
+            this.showLessonList = this.fullList;
+          }
+
           switch(this.dialogObj.type){
             case 0:
               this.form={
@@ -372,12 +402,19 @@
         this.selectedLessonList.splice(second,1,oFirst);
       }
     },
-    watch:{
-     'dialogObj.show'(val){
-       if(val){
-         this.initDialog()
-       }
-     }
+    watch: {
+      'form.type'() {
+        if (this.form.type == 0) {
+          this.showLessonList = this.lessList;
+        } else {
+          this.showLessonList = this.fullList;
+        }
+      },
+      'dialogObj.show'(val) {
+        if (val) {
+          this.initDialog()
+        }
+      }
     },
     // mounted(){
     //   this.initDialog()