修改

src/api/course/class.js

@@ -58,3 +58,14 @@ export function setClassPlan(data) {
   });
 }
 
+/**
+ * 删除课程安排
+ */
+export function RemoveClassPlan(data) {
+  return request({
+    url: '/Class/RemoveClassPlan',
+    method: 'post',
+    data
+  });
+}
+

src/components/course/lesson-form.vue

 <style>
-  .calendar-day {
+  .lesson_Form .calendar-day {
     text-align: center;
     color: #202535;
     line-height: 30px;
     font-size: 12px;
   }
 
-  .is-selected {
+  .lesson_Form .is-selected {
     color: #F8A535;
     font-size: 10px;
     margin-top: 5px;
@@ -16,23 +16,23 @@
     content: '当月';
   }
 
-  .el-calendar-day {
+  .lesson_Form .el-calendar-day {
     position: relative;
   }
 
-  .calendar-day {
+  .lesson_Form .calendar-day {
     position: absolute;
     bottom: -5px;
     left: 5px;
   }
 
-  .calenderHeader {
+  .lesson_Form .calenderHeader {
     display: flex;
     justify-content: space-between;
     padding: 0 20px;
   }
 
-  .calendarTop {
+  .lesson_Form .calendarTop {
     display: flex;
     justify-content: space-between;
     font-size: 12px;
@@ -41,7 +41,7 @@
     transform: scale(0.9);
   }
 
-  .calendarInner {
+  .lesson_Form .calendarInner {
     font-size: 12px;
     margin: -4px 0 0 -7px;
     transform: scale(0.9);
@@ -51,7 +51,7 @@
     padding: 5px;
   }
 
-  .caldendarTeacher {
+  .lesson_Form .caldendarTeacher {
     display: flex;
     font-size: 12px;
     right: 3px;
@@ -72,6 +72,19 @@
     justify-content: space-between;
     margin-bottom:5px;
   }
+ .delBtnStyle{
+    position:absolute;
+    right:6px;
+    top:-9px;
+    width:20px;
+    height:20px;
+    border:1px solid red;
+    background-color: red;
+    color:#fff;
+    line-height: 18px;
+    text-align: center;
+    border-radius: 50%;
+  }
 </style><template>
   <div class="lesson_Form">
     <div class="calenderHeader">
@@ -106,6 +119,9 @@
                   <q-select filled stack-label option-value="RoomId" option-label="RoomName"
                     v-model="addMsg.ClassRoomId" ref="ClassRoomId" :options="ClassRoomList" label="关联教室" :dense="false"
                     class="col-6 q-pb-lg" emit-value map-options />
+                  <div style="display:flex;justify-content:flex-end;margin-bottom:20px;">
+                    <q-btn @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
+                  </div>
                   <div class="row wrap" style="position:relative;" v-for="(subItem,subIndex) in addMsg.PlanTimeList">
                     <div class="col-6">
                       <q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.StartTime"
@@ -115,11 +131,9 @@
                       <q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.EndTime" ref="EndTime"
                         class="col-6 q-pr-lg q-pb-lg" label="" :rules="[val => !!val || '请填写开始时间']" />
                     </div>
-                    <q-btn v-if="subIndex==0" style="margin-left:10px;position:absolute;right:-10px;top:15px;"
-                      @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
-                    <q-btn v-if="subIndex>0" style="margin-left:10px;position:absolute;right:-10px;top:15px;"
-                      @click="delStep(subIndex)" size="10px" round color="red" icon="iconfont icon-guanbi" />
-
+                    <div class="delBtnStyle">
+                       <i @click="delStep(subIndex)" class="iconfont icon-guanbi"></i>
+                    </div>
                   </div>
                 </template>
                 <q-card-actions align="right" class="bg-white">
@@ -171,6 +185,10 @@
                           <q-select filled stack-label option-value="RoomId" option-label="RoomName"
                             v-model="addMsg.ClassRoomId" ref="ClassRoomId" :options="ClassRoomList" label="关联教室"
                             :dense="false" class="col-6 q-pb-lg" emit-value map-options />
+                          <div style="display:flex;justify-content:flex-end;margin-bottom:20px;">
+                            <q-btn @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
+                          </div>
+
                           <div class="row wrap" style="position:relative;"
                             v-for="(subItem,subIndex) in addMsg.PlanTimeList">
                             <div class="col-6">
@@ -183,8 +201,9 @@
                                 ref="EndTime" class="col-6 q-pr-lg q-pb-lg" label=""
                                 :rules="[val => !!val || '请填写开始时间']" />
                             </div>
-                            <q-btn v-if="subIndex==0" style="margin-left:10px;position:absolute;right:-10px;top:15px;"
-                              @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
+                            <div class="delBtnStyle">
+                              <i @click="delStep(subIndex)" class="iconfont icon-guanbi"></i>
+                            </div>
                           </div>
                         </template>
                         <q-card-actions align="right" class="bg-white">
@@ -211,7 +230,7 @@
                 <q-avatar size="sm" v-if="item.UserIcon">
                   <img :src="item.UserIcon" />
                 </q-avatar>
-                <q-avatar size="md" color="teal-10" text-color="white" v-if="!item.UserIcon">
+                <q-avatar size="sm" color="teal-10" text-color="white" v-if="!item.UserIcon">
                   {{GetFirst(item.TeacherName)}}</q-avatar>
               </div>
             </div>
@@ -273,7 +292,28 @@
       }
     },
     created() {
-
+      this.$nextTick(() => {
+        // 点击上个月
+        var d = new Date(this.value);
+        var datetime = d.getFullYear() + '-' + (d.getMonth() + 1);
+        let prevBtn1 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(1)');
+        prevBtn1.addEventListener('click',() => {
+          console.log('上个月');
+          this.getClassPlan(datetime);
+        })
+        // 点击今天
+        let prevBtn2 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(2)');
+        prevBtn2.addEventListener('click',() => {
+          console.log('今天');
+          this.getClassPlan(datetime);
+        })
+        // 点击下个月
+        let prevBtn3 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(3)');
+        prevBtn3.addEventListener('click',() => {
+          console.log('下个月');
+          this.getClassPlan(datetime);
+        })
+      })
     },
     mounted() {
       var day2 = new Date();
@@ -335,7 +375,8 @@
       },
       //删除
       delStep(index){
-        this.isShowMenu=true;
+        // this.isShowMenu=true;
+        console.log(this.isShowMenu,'this.isShowMenu');
         this.addMsg.PlanTimeList.splice(index,1);
       },
       //点击新增
@@ -401,17 +442,6 @@
         // this.isShowCanlder=false;
       },
     },
-    watch: {
-      'value': {
-        handler(newValue) {
-          var d = new Date(newValue);
-          var datetime = d.getFullYear() + '-' + (d.getMonth() + 1);
-          this.getClassPlan(datetime);
-          console.log(datetime, 'newwww');
-        },
-        deep: true
-      },
-    },
   }
 
 </script>