|
|
@@ -0,0 +1,228 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-dialog
|
|
|
+ title="创建班级"
|
|
|
+ append-to-body
|
|
|
+ width="800px"
|
|
|
+ :visible.sync="transClassVisible"
|
|
|
+ >
|
|
|
+ <div v-if="transClassVisible">
|
|
|
+ <el-alert type="warning" :closable="false" class="tramsAlert">
|
|
|
+ <p class="title">温馨提醒：</p>
|
|
|
+ <p class="descript">您正在操作声部课、集训声部课转换线上基础技能课</p>
|
|
|
+ <p class="descript">
|
|
|
+ 若转换后仅创建1个线上基础技能班，转换后班级将根据转换前课程总时长排课
|
|
|
+ </p>
|
|
|
+ <p class="descript">
|
|
|
+ 若转转后创建多个线上基础技能班，则转换后班级按转换前课时数排课
|
|
|
+ </p>
|
|
|
+ </el-alert>
|
|
|
+ <el-form :model="form" ref="form">
|
|
|
+ <div class="classWrap">
|
|
|
+ <h2 class="classTitle">
|
|
|
+ <span>线上基础技能班</span>
|
|
|
+ <i
|
|
|
+ @click="remove(scope.$index)"
|
|
|
+ v-if="form.classList.length > 1"
|
|
|
+ class="close-icon el-icon-delete-solid"
|
|
|
+ ></i>
|
|
|
+ </h2>
|
|
|
+ <el-row :gutter="40">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item
|
|
|
+ prop="classNames"
|
|
|
+ :rules="[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '输入班级名称',
|
|
|
+ trigger: 'blur',
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ ref="paymentDate"
|
|
|
+ >
|
|
|
+ <template slot="label">
|
|
|
+ <p style="position: relative">
|
|
|
+ <span style="color: #f56c6c; margin-right: 4px">*</span>
|
|
|
+ 班级名称
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <el-input
|
|
|
+ v-model="form.classNames"
|
|
|
+ style="width: 100%"
|
|
|
+ placeholder="请输入班级名称"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item
|
|
|
+ :label="'声部'"
|
|
|
+ style="margin-right: 0"
|
|
|
+ prop="sound"
|
|
|
+ :rules="[
|
|
|
+ { required: true, message: '请选择声部', trigger: 'blur' },
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <template slot="label">
|
|
|
+ <p style="position: relative">
|
|
|
+ <span style="color: #f56c6c; margin-right: 4px">*</span>
|
|
|
+ 声部
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <select-all
|
|
|
+ v-model="form.sound"
|
|
|
+ style="width: 100%"
|
|
|
+ clearable
|
|
|
+ multiple
|
|
|
+ collapse-tags
|
|
|
+ filterable
|
|
|
+ placeholder="请选择声部"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in soundList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item
|
|
|
+ label="主教老师"
|
|
|
+ prop="coreTeacher"
|
|
|
+ :rules="[{ required: true, message: '请选择主教老师' }]"
|
|
|
+ >
|
|
|
+ <template slot="label">
|
|
|
+ <p style="position: relative">
|
|
|
+ <span style="color: #f56c6c; margin-right: 4px">*</span>
|
|
|
+ 主教老师
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <el-select
|
|
|
+ v-model.trim="form.coreTeacher"
|
|
|
+ placeholder="请选择主教老师"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in teacherList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.realName"
|
|
|
+ :value="String(item.id)"
|
|
|
+ >
|
|
|
+ <span style="float: left">{{ item.realName }}</span>
|
|
|
+ <span
|
|
|
+ style="float: right; color: #8492a6; font-size: 13px"
|
|
|
+ >{{ String(item.id) }}</span
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <!-- <remote-search :commit="'setTeachers'" v-model="form.coreTeacher" /> -->
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { getCourseScheduleConvert } from "../../api";
|
|
|
+import { findSound, getTeacher } from "@/api/buildTeam";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ transClassVisible: false,
|
|
|
+ form: {
|
|
|
+ classList: [{}, {}],
|
|
|
+ },
|
|
|
+ soundList: [],
|
|
|
+ teacherList: [],
|
|
|
+ teamid: "",
|
|
|
+ organId: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ async openDialog() {
|
|
|
+ // 获取列表
|
|
|
+ this.transClassVisible = true;
|
|
|
+ },
|
|
|
+ getList() {},
|
|
|
+ gotoNext() {},
|
|
|
+ remove(index) {},
|
|
|
+ init() {
|
|
|
+ this.teamid = this.$route.query.id;
|
|
|
+ this.organId = this.$route.query.organId;
|
|
|
+ getTeacher({ organId: this.organId }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.teacherList = res.data;
|
|
|
+ if (this.teacherList.length <= 0) {
|
|
|
+ this.$bus.$emit("showguide", ["teacher"]);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ findSound({ musicGroupId: this.teamid }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.soundList = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ chioseCourse() {
|
|
|
+ return this.activeCourseList;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.subtitle {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ span {
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
+}
|
|
|
+.tramsAlert {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ p {
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.classWrap {
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ padding: 10px;
|
|
|
+ .classTitle {
|
|
|
+ // width: 760px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ .close-icon {
|
|
|
+ color: #c1c1c1;
|
|
|
+ cursor: pointer;
|
|
|
+ // background: #c1c1c1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+::v-deep .el-form-item__label{
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ text-align: left;
|
|
|
+ &::before{
|
|
|
+ content: "" !important;
|
|
|
+ position: absolute;
|
|
|
+ color: transparent;
|
|
|
+ margin-right: 4px;
|
|
|
+ }
|
|
|
+}
|
|
|
+::v-deep .el-form-item__content {
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
+</style>>
|
mo