修改

src/components/schedul/appoint-form.vue

@@ -37,23 +37,19 @@
         <div class="Sysuser_Date">
           <q-field filled class="q-pb-lg">
               <template v-slot:control>
-              <el-time-select v-model="addMsg.ClassTime" ref="ClassTime" style="width:100%" :picker-options="{
+              <el-time-select v-model="addMsg.ClassTime" ref="ClassTime" style="width:50%" :picker-options="{
                       start: '09:00',
                       step: '00:15',
-                      end: '21:00'
+                      end: '21:00',
+                      maxTime:addMsg.EndTime
                   }" placeholder="预约开始时间">
               </el-time-select>
-            </template>
-          </q-field>
-        </div>
-        <div class="Sysuser_Date">
-          <q-field filled class="q-pb-lg">
-              <template v-slot:control>
-              <el-time-select v-model="addMsg.EndTime" ref="EndTime" style="width:100%" :picker-options="{
-                      start: '09:00',
-                      step: '00:15',
-                      end: '21:00'
-                  }" placeholder="预约结束时间">
+              <el-time-select v-model="addMsg.EndTime" ref="EndTime" style="width:50%" :picker-options="{
+                  start: '09:00',
+                  step: '00:15',
+                  end: '21:00',
+                  minTime:addMsg.ClassTime
+              }" placeholder="预约结束时间">
               </el-time-select>
             </template>
           </q-field>

src/components/schedul/reserve-form.vue

@@ -24,11 +24,19 @@
           <div class="Sysuser_Date col-6 q-pb-lg">
             <q-field filled>
                 <template v-slot:control>
-                <el-time-select v-model="objOption.ClassTime" ref="ClassTime" style="width:100%" :picker-options="{
+                <el-time-select v-model="objOption.ClassTime" ref="ClassTime" style="width:50%" :picker-options="{
                     start: '09:00',
                     step: '00:15',
-                    end: '21:00'
-                }" placeholder="预约时间">
+                    end: '21:00',
+                    maxTime:objOption.EndTime
+                }" placeholder="预约开始时间">
+                </el-time-select>
+                <el-time-select v-model="objOption.EndTime" ref="EndTime" style="width:50%" :picker-options="{
+                    start: '09:00',
+                    step: '00:15',
+                    end: '21:00',
+                    minTime:objOption.ClassTime
+                }" placeholder="预约结束时间">
                 </el-time-select>
               </template>
             </q-field>
@@ -36,6 +44,7 @@
           <q-select filled stack-label option-value="TId" option-label="TeacherName" v-model="objOption.TeacherId"
             ref="TeacherId" :options="TeacherList" label="选择教师" :dense="false" class="col-6 q-pr-lg q-pb-lg" emit-value
             map-options />
+
           <q-select filled stack-label option-value="RoomId" option-label="RoomName" v-model="objOption.ClassRoomId"
             ref="ClassRoomId" :options="ClassRoomList" label="关联教室" :dense="false" class="col-6 q-pb-lg" emit-value
             map-options />
@@ -78,6 +87,7 @@
           TeacherId: "",
           ClassDate: "",
           ClassTime: "",
+          EndTime: "",
           ClassRoomId: "",
           ClassContent: ''
         },