dy-admin-manager/src/views/teamDetail/componentCourse/modals/resetCourses.vue

<template>
  <div>
    <el-form :inline="true" v-model="timeForm" ref="timeForm">
      <el-form-item label="开始时间" prop="starttime">
        <el-time-picker
          v-model="timeForm.starttime"
          @change="changeStartTime"
          format="HH:mm"
          value-format="HH:mm"
          :picker-options="{
            selectableRange: `04:00:00 - 23:59:00`,
          }"
          placeholder="选择时间"
        ></el-time-picker>
      </el-form-item>
      <el-form-item label="结束时间" prop="endTime">
        <el-time-picker
          v-model="timeForm.endTime"
          format="HH:mm"
          value-format="HH:mm"
          :disabled="true"
          placeholder="选择时间"
        ></el-time-picker>
      </el-form-item>
      <el-form-item label=" 上课模式" prop="teachMode" v-if="groupType == 'VIP'">
        <el-select
          v-model.trim="timeForm.teachMode"
          style="width: 220px !important"
          @change="()=>{timeForm.address=''}"
        >
          <el-option label="线上课" value="ONLINE"></el-option>
          <el-option label="线下课" value="OFFLINE"></el-option>
          <el-option label="不修改" value=""></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label=" 教学地点" prop="address" v-if="timeForm.teachMode == 'OFFLINE'&&groupType == 'VIP'">
        <el-select
          v-model.trim="timeForm.address"
          style="width: 220px !important"
          filterable
          clearable
        >
          <el-option
            v-for="(item, index) in schoolList"
            :key="index"
            :value="item.id"
            :label="item.name"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label=" 教学地点" prop="address" v-if="groupType == 'MUSIC'">
        <el-select
          v-model.trim="timeForm.address"
          style="width: 220px !important"
          filterable
          clearable
        >
          <el-option label="不修改" :value="''"></el-option>
          <el-option
            v-for="(item, index) in schoolList"
            :key="index"
            :value="item.id"
            :label="item.name"
          ></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <div class="buttonWrap">
      <el-button @click="gotoNext" type="primary">下一步</el-button>
      <el-button @click="()=>{$emit('cancaleMerge')}" >取 消</el-button>
    </div>
  </div>
</template>
<script>
import { diffTimerFormMinute, addTimerFormMinute } from "@/utils/date";
import { getSchool } from "@/api/systemManage";
export default {
  props: ["idList", "dataList"],
  data() {
    return {
      timeForm: {
        starttime: null,
        endTime: "",
        teachMode: "",
        address: "",
      },
      timeRules: {
        endTime: [
          { required: true, message: "请选择结束时间", trigger: "blur" },
        ],
        address: [
          { required: true, message: "请选教学地点", trigger: "blur" },
        ],
      },
      schoolList: [],
      groupType:''
    };
  },
  mounted() {
    this.groupType = this.dataList[0].groupType
    getSchool().then((res) => {
      if (res.code == 200) {
        this.schoolList = res.data;
      }
    });
  },
  methods: {
    changeStartTime(val) {
      let dayjs = this.$helpers.dayjs;
      const time = diffTimerFormMinute(
        dayjs(this.dataList[0]?.classDate).format("YYYY-MM-DD"),
        dayjs(this.dataList[0]?.startClassTime).format("HH:mm"),
        dayjs(this.dataList[0]?.endClassTime).format("HH:mm")
      );

      if (val) {
        this.$nextTick((res) => {
          this.$set(this.timeForm, "starttime", val);
        });

        this.$set(
          this.timeForm,
          "endTime",
          addTimerFormMinute(
            dayjs(this.dataList[0]?.classDate).format("YYYY-MM-DD"),
            this.timeForm.starttime,
            time
          )
        );
      } else {
        this.$set(this.timeForm, "endTime", "");
      }
    },
    gotoNext() {

        if(!this.timeForm.starttime){
          this.$message.error('请选择开始时间')
          return
        }
        if(this.timeForm.teachMode == 'OFFLINE'&&this.groupType == 'VIP'&&!this.timeForm.address){
           this.$message.error('请选择教学点')
          return
        }
          let obj = {
            courseScheduleIds: this.idList,
            changeMainTeacher: false,
            changeTeachingTeacher: false,
            startDate: null,
            startTime: this.timeForm.starttime+":00",
            pauseDate: null,
            recoveryDate: null,
            classGroupTeacherMapperList: null,
            teachMode: this.timeForm.teachMode,
            allowZeroSalary: false,
            schoolId: this.timeForm.address,
            confirmGenerate: false,
            holiday: null,
          };
          this.$emit("submit", obj);


    },
  },
};
</script>
<style  lang="scss" scoped>
.buttonWrap {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
</style>