|
@@ -0,0 +1,246 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-dialog title="课程调整"
|
|
|
+ destroy-on-close
|
|
|
+ width="400px"
|
|
|
+ :visible.sync="courseVisible">
|
|
|
+ <el-form :model="maskForm"
|
|
|
+ class="maskForm"
|
|
|
+ ref="maskForm"
|
|
|
+ :rules="maskRules"
|
|
|
+ label-position="right"
|
|
|
+ label-width="120px"
|
|
|
+ :inline="true">
|
|
|
+ <el-form-item label="主教老师"
|
|
|
+ prop="teacher">
|
|
|
+ <el-select v-model.trim="maskForm.teacher"
|
|
|
+ clearable
|
|
|
+ filterable>
|
|
|
+ <el-option v-for="(item,index) in teacherList"
|
|
|
+ :key="index"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.realName"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="助教老师"
|
|
|
+ v-if="maskForm.type != 'MUSIC_NETWORK'&&maskForm.type != 'HIGH_ONLINE'"
|
|
|
+ prop="assistant">
|
|
|
+ <el-select v-model.trim="maskForm.assistant"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ multiple
|
|
|
+ collapse-tags>
|
|
|
+ <el-option v-for="(item,index) in teacherList"
|
|
|
+ :key="index"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.realName"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="上课日期"
|
|
|
+ prop="date">
|
|
|
+ <el-date-picker v-model.trim="maskForm.date"
|
|
|
+ type="date"
|
|
|
+ :picker-options="{
|
|
|
+ firstDayOfWeek:1
|
|
|
+ }"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ placeholder="选择日期"></el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="课程时长(分钟)"
|
|
|
+ prop="timer">
|
|
|
+ <el-input type='number'
|
|
|
+ v-model="maskForm.timer"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="开始时间"
|
|
|
+ prop="startTime">
|
|
|
+ <el-time-picker placeholder="起始时间"
|
|
|
+ v-model.trim="maskForm.startTime"
|
|
|
+ @change="changeStartTime"
|
|
|
+ format='HH:mm'
|
|
|
+ value-format='HH:mm'
|
|
|
+ :picker-options="{
|
|
|
+ selectableRange: '04:30:00 - 23:30:00'
|
|
|
+ }"></el-time-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="结束时间"
|
|
|
+ prop="endTime">
|
|
|
+ <el-time-picker placeholder="结束时间"
|
|
|
+ v-model.trim="maskForm.endTime"
|
|
|
+ disabled
|
|
|
+ format='HH:mm'
|
|
|
+ value-format='HH:mm'
|
|
|
+ :picker-options="{
|
|
|
+ start: '04:30',
|
|
|
+ step: '00:05',
|
|
|
+ end: '23:30',
|
|
|
+ minTime: maskForm.startTime
|
|
|
+ }"></el-time-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer"
|
|
|
+ class="dialog-footer">
|
|
|
+ <el-button @click="$listeners.closeReset">取 消</el-button>
|
|
|
+ <el-button type="primary"
|
|
|
+ @click="submitResetClass">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { diffTimerFormMinute, addTimerFormMinute } from '@/utils/date'
|
|
|
+import { getTeacher, resetCourse } from "@/api/buildTeam";
|
|
|
+import cleanDeep from 'clean-deep'
|
|
|
+import dayjs from 'dayjs';
|
|
|
+export default {
|
|
|
+ props: ["show", "item"],
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ courseVisible: false,
|
|
|
+ maskForm: {
|
|
|
+ teacher: null,
|
|
|
+ assistant: null,
|
|
|
+ date: null,
|
|
|
+ timer: null,
|
|
|
+ startTime: null,
|
|
|
+ endTime: null
|
|
|
+ },
|
|
|
+ maskRules: {
|
|
|
+ teacher: [
|
|
|
+ { required: true, message: "请选择主教老师名称", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ date: [{ required: true, message: "请选择上课时间", trigger: "blur" }],
|
|
|
+ startTime: [{ required: true, message: '请选择上课开始时间', trigger: 'blur' },],
|
|
|
+ endTime: [{ required: true, message: '请选择上课结束时间', trigger: 'blur' },],
|
|
|
+ },
|
|
|
+ teacherList: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ getTeacher().then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.teacherList = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ submitResetClass () {
|
|
|
+ let maskForm = this.maskForm;
|
|
|
+ if (!maskForm.startTime || !maskForm.endTime) {
|
|
|
+ this.$message.error("请填写开始时间或结束时间");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$confirm("是否确定?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ let teachingTeacherIdList = maskForm.assistant.join(",");
|
|
|
+ if (teachingTeacherIdList.length <= 0) {
|
|
|
+ let teachingTeacherIdList = null;
|
|
|
+ }
|
|
|
+ let obj = {
|
|
|
+ actualTeacherId: maskForm.teacher,
|
|
|
+ startClassTimeStr: maskForm.startTime,
|
|
|
+ endClassTimeStr: maskForm.endTime,
|
|
|
+ id: maskForm.id,
|
|
|
+ teachingTeacherIdList,
|
|
|
+ classDate: maskForm.date,
|
|
|
+ type: maskForm.type,
|
|
|
+ groupType: 'MUSIC'
|
|
|
+ };
|
|
|
+ resetCourse(cleanDeep(obj)).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success("修改成功");
|
|
|
+ this.$emit('getList')
|
|
|
+ this.$emit('closeReset')
|
|
|
+ // this.getList();
|
|
|
+ // this.courseVisible = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => { });
|
|
|
+ },
|
|
|
+ changeStartTime (val) {
|
|
|
+
|
|
|
+ this.$nextTick(res => {
|
|
|
+ console.log(this.maskForm.date, val, this.maskForm.timer)
|
|
|
+ console.log(addTimerFormMinute(this.maskForm.date, val, this.maskForm.timer))
|
|
|
+ if (val) {
|
|
|
+ this.$set(this.maskForm, 'endTime', addTimerFormMinute(this.maskForm.date, val, this.maskForm.timer))
|
|
|
+ } else {
|
|
|
+ this.$set(this.maskForm, 'endTime', '')
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ watch: {
|
|
|
+ show (val) {
|
|
|
+ console.log(val)
|
|
|
+ this.courseVisible = val;
|
|
|
+ },
|
|
|
+ courseVisible (val) {
|
|
|
+ if (!val) {
|
|
|
+ this.$emit("closeReset");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ item: {
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
+ handler (row, oldValue) {
|
|
|
+ if (row) {
|
|
|
+
|
|
|
+ this.maskForm = {
|
|
|
+ id: row.id,
|
|
|
+ teacher: row.actualTeacherId,
|
|
|
+ assistant: [],
|
|
|
+ date: dayjs(row.classDate).format('YYYY-MM-DD'),
|
|
|
+ startTime: dayjs(row.startClassTime).format('HH:mm'),
|
|
|
+ endTime: dayjs(row.endClassTime).format('HH:mm'),
|
|
|
+ timer: null,
|
|
|
+ type: row.type,
|
|
|
+ groupType: row.groupType
|
|
|
+
|
|
|
+ }
|
|
|
+ this.maskForm.assistant = [];
|
|
|
+ for (let i in row.teachingTeachers) {
|
|
|
+ if (row.teachingTeachers[i].teacherRole == "TEACHING") {
|
|
|
+ this.maskForm.assistant.push(row.teachingTeachers[i].userId);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let time = diffTimerFormMinute(dayjs(row.classDate).format('YYYY-MM-DD'), dayjs(row.startClassTime).format('HH:mm'), dayjs(row.endClassTime).format('HH:mm'))
|
|
|
+ console.log(dayjs(row.startClassTime).format('HH:mm'))
|
|
|
+ this.maskForm.timer = time;
|
|
|
+ } else {
|
|
|
+ this.maskForm = {
|
|
|
+ id: null,
|
|
|
+ teacher: null,
|
|
|
+ assistant: null,
|
|
|
+ date: null,
|
|
|
+ startTime: null,
|
|
|
+ endTime: null,
|
|
|
+ timer: null,
|
|
|
+ type: null,
|
|
|
+ groupType: null
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ 'maskForm.timer' (val) {
|
|
|
+ this.$nextTick(res => {
|
|
|
+ if (val) {
|
|
|
+ this.$set(this.maskForm, 'endTime', addTimerFormMinute(this.maskForm.date, this.maskForm.startTime, val))
|
|
|
+ } else {
|
|
|
+ this.$set(this.maskForm, 'endTime', '')
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+</style>
|