dy-admin-manager/src/views/teamBuild/components/teamBaseInfo.vue

<template>
  <div class="base-container">
    <div class="banseLeft">
      <div class="head">乐团基本信息：</div>
      <!-- <div class="num">乐团编号：dywh01</div> -->
      <el-form :model="topFrom"
               :inline="true"
               ref="topinfo"
               label-width="120px"
               style="margin-left: 11px">
        <el-form-item label="收费类型"
                      prop="type"
                      :rules="[{ required: true, message: '收费类型不能为空' }]">
          <el-select v-model.trim="topFrom.type"
                     filterable
                     :disabled="basdisabled"
                     clearable>
            <el-option v-for="(item, index) in typeList"
                       :key="index"
                       :label="item.name"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="所属分部"
                      prop="section"
                      :rules="[{ required: true, message: '所属分部不能为空' }]">
          <el-select v-model.trim="topFrom.section"
                     filterable
                     :disabled="basdisabled"
                     @change="changeSection"
                     clearable>
            <el-option v-for="(item, index) in sectionList"
                       :key="index"
                       :label="item.name"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="合作单位"
                      prop="school"
                      :rules="[{ required: true, message: '合作单位不能为空' }]">
          <el-select v-model.trim="topFrom.school"
                     :disabled="!topFrom.section || basdisabled"
                     @change="chioseSchool"
                     filterable
                     clearable>
            <el-option v-for="(item, index) in cooperationList"
                       :key="index"
                       :label="item.name"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="教学地点"
                      prop="address"
                      :rules="[{ required: true, message: '教学地点不能为空' }]">
          <el-select v-model.trim="topFrom.address"
                     filterable
                     clearable
                     :disabled="!topFrom.section || basdisabled">
            <el-option v-for="(item, index) in addList"
                       :key="index"
                       :label="item.name"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="乐团名称"
                      prop="name"
                      :rules="[{ required: true, message: '乐团名称不能为空' }]">
          <el-input placeholder="请输入乐团名称"
                    v-model.trim="topFrom.name"
                    :disabled="basdisabled"></el-input>
        </el-form-item>
        <el-form-item label="运营主管"
                      prop="boss"
                      :rules="[{ required: true, message: '运营主管不能为空' }]">
          <el-select v-model.trim="topFrom.boss"
                     :disabled="!topFrom.section || basdisabled"
                     filterable
                     clearable>
            <el-option v-for="(item, index) in orgianList"
                       :key="index"
                       :label="item.realName"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="教务老师"
                      prop="teacher"
                      :rules="[{ required: true, message: '教务老师不能为空' }]">
          <el-select v-model.trim="topFrom.teacher"
                     :disabled="!topFrom.section || basdisabled"
                     filterable
                     clearable>
            <el-option v-for="(item, index) in orgianList"
                       :key="index"
                       :label="item.realName"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="维修技师"
                      prop="repairUserId">
          <el-select v-model.trim="topFrom.repairUserId"
                     :disabled="!topFrom.section || basdisabled"
                     filterable
                     clearable>
            <el-option v-for="(item, index) in technician"
                       :key="index"
                       :label="item.userName"
                       :value="item.userId"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="报名截止时间"
                      prop="time"
                      :rules="[{ required: true, message: '请输入报名截止时间' }]">
          <el-date-picker v-model.trim="topFrom.time"
                          :disabled="basdisabled"
                          type="date"
                          value-format="yyyy-MM-dd"
                          :picker-options="{
              firstDayOfWeek: 1,
            }"
                          placeholder="选择日期"></el-date-picker>
        </el-form-item>
        <el-form-item label="预计开团时间"
                      prop="startTime"
                      :rules="[{ required: true, message: '请输入预计开团时间' }]">
          <el-date-picker v-model.trim="topFrom.startTime"
                          :disabled="basdisabled"
                          type="date"
                          value-format="yyyy-MM-dd"
                          :picker-options="{
              firstDayOfWeek: 1,
            }"
                          placeholder="选择日期"></el-date-picker>
        </el-form-item>
        <el-form-item label="缴费方式"
                      prop="paymentPattern"
                      :rules="[{ required: !isNotEditing(), message: '请选择缴费方式' }]">
          <el-select placeholder="缴费方式"
                     :disabled="isNotEditing() || basdisabled"
                     clearable
                     @change="changePaymentPattern"
                     filterable
                     v-model.trim="topFrom.paymentPattern">
            <el-option :value="0"
                       label="按月"></el-option>
            <el-option :value="1"
                       label="按季"></el-option>
            <el-option :value="2"
                       label="一次性"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="缴费有效期开始"
                      prop="paymentValidStartDate"
                      :rules="[
            { required: !isNotEditing(), message: '请选择缴费有效期开始' },
          ]">
          <el-date-picker :disabled="isNotEditing() || basdisabled "
                          v-model="topFrom.paymentValidStartDate"
                          @change="changePaymentValidStartDate"
                          placeholder="开始日期"
                          :picker-options="beginDate(topFrom.time)">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="缴费有效期结束"
                      prop="paymentValidEndDate"
                      :rules="[
            {
              required: !(isNotEditing() || topFrom.paymentPattern === 2),
              message: '请选择缴费有效期结束',
            },
          ]">
          <el-date-picker :disabled="
              isNotEditing() || topFrom.paymentPattern === 2 || basdisabled || !topFrom.paymentValidStartDate
            "
                          v-model="topFrom.paymentValidEndDate"
                          :picker-options="beginDate(topFrom.paymentValidStartDate)"
                          placeholder="结束日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="招生年级"
                      v-if="basdisabled">
          <el-tooltip class="item"
                      effect="dark"
                      :content="startClassString"
                      placement="top-start">
            <div style="width: 180px; overflow: hidden">
              {{ startClassString }}
            </div>
          </el-tooltip>
        </el-form-item>
        <el-form-item label="招生年级"
                      v-else
                      prop="startClass"
                      :rules="[{ required: true, message: '请选择招生年纪' }]">
          <el-select placeholder="起始年级"
                     clearable
                     multiple
                     collapse-tags
                     filterable
                     v-model.trim="topFrom.startClass">
            <el-option v-for="item in classStatus"
                       :value="item.value"
                       :label="item.label"
                       :key="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="课酬结算标准"
                      :rules="[{ required: true, message: '请选择课酬结算标准' }]"
                      prop="salary">
          <el-select v-model.trim="topFrom.salary"
                     clearable
                     :disabled="basdisabled"
                     filterable>
            <el-option label="默认课酬"
                       value="TEACHER_DEFAULT"></el-option>
            <el-option label="3.0课酬"
                       value="GRADIENT_SALARY"></el-option>
            <!-- <el-option label="课堂课酬"
            value="CLASSROOM_SALARY"></el-option>-->
          </el-select>
        </el-form-item>
        <el-form-item label="机构类型"
                      prop="ownershipType">
          <el-select v-model.trim="topFrom.ownershipType"
                     :disabled="basdisabled">
            <el-option label="自有"
                       value="OWN"></el-option>
            <el-option label="三方"
                       value="COOPERATION"></el-option>
            <!-- <el-option label="租赁"
            value="LEASE"></el-option>-->
          </el-select>
        </el-form-item>

        <el-form-item label="乐队指导"
                      v-if="teamStatus == 'resetTeam' || teamStatus == 'teamList'"
                      prop="head">
          <el-select v-model.trim="topFrom.head"
                     filterable
                     clearable>
            <el-option v-for="(item, index) in orgianList"
                       :key="index"
                       :label="item.realName"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="乐团网管课"
                      :rules="[{ required: true, message: '请选择是否排乐团网管课' }]"
                      prop="feeType">
          <el-select v-model="topFrom.feeType"
                     placeholder="是否排乐团网管课"
                     :disabled="basdisabled"
                     @change="changeFeeType">
            <el-option label="需要排一次线上课"
                       value="ONLINE"></el-option>
            <el-option label="只排线下课"
                       value="OFFLINE"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label
                      prop="isClass">
          <el-checkbox v-model.trim="topFrom.isClass"
                       :disabled="basdisabled">课堂课乐团</el-checkbox>
        </el-form-item>
      </el-form>
      <div class="checkList">
        <div class="head noMargin">乐团课程:</div>
        <div class="checkRow">
          <el-checkbox label="乐团声部训练"
                       :disabled="basdisabled"
                       v-model.trim="checkList.soundInfo.ischeck"></el-checkbox>
          <div class="inputWrap">
            原价:
            <el-input type="text"
                      placeholder="请输入"
                      :disabled="basdisabled"
                      v-model.trim="checkList.soundInfo.value" />
          </div>
          <!-- <div class="inputWrap">
            <el-checkbox v-model="checkList.soundInfo.checkBuy">是否可选择购买</el-checkbox>
          </div> -->
        </div>
        <div class="checkRow">
          <el-checkbox label="乐团合奏训练"
                       :disabled="basdisabled"
                       v-model.trim="checkList.allInfo.ischeck"></el-checkbox>
          <div class="inputWrap">
            原价:
            <el-input type="text"
                      placeholder="请输入"
                      :disabled="basdisabled"
                      v-model.trim="checkList.allInfo.value" />
          </div>
          <!-- <div class="inputWrap">
            <el-checkbox v-model="checkList.allInfo.checkBuy">是否可选择购买</el-checkbox>
          </div> -->
        </div>
        <div class="checkRow">
          <el-checkbox label="假期集中训练"
                       :disabled="basdisabled"
                       v-model.trim="checkList.holidayInfo.ischeck"></el-checkbox>
          <div class="inputWrap">
            原价:
            <el-input type="number"
                      @mousewheel.native.prevent
                      :disabled="basdisabled"
                      placeholder="请输入"
                      v-model.trim="checkList.holidayInfo.value" />
          </div>
          <!-- <div class="inputWrap">
            <el-checkbox v-model="checkList.holidayInfo.checkBuy">是否可选择购买</el-checkbox>
          </div> -->
        </div>
        <div class="checkRow"
             v-if="checkList.networkInfo">
          <el-checkbox label="乐团云课堂"
                       :disabled="basdisabled"
                       v-model="checkList.networkInfo.ischeck"></el-checkbox>
          <div class="inputWrap">
            原价:
            <el-input type="number"
                      :disabled="basdisabled"
                      @mousewheel.native.prevent
                      placeholder="请输入"
                      v-model.trim="checkList.networkInfo.value" />
          </div>
          <!-- <div class="inputWrap">
            <el-checkbox v-model="checkList.networkInfo.checkBuy">是否可选择购买</el-checkbox>
          </div> -->
        </div>
        <div class="checkRow">
          <el-checkbox label="网络基础训练"
                       :disabled="basdisabled"
                       v-model.trim="checkList.baseInfo.ischeck"></el-checkbox>
          <div class="inputWrap">
            原价:
            <el-input type="number"
                      :disabled="basdisabled"
                      @mousewheel.native.prevent
                      placeholder="请输入"
                      v-model.trim="checkList.baseInfo.value" />
          </div>
          <!-- <div class="inputWrap">
            <el-checkbox v-model="checkList.baseInfo.checkBuy">是否可选择购买</el-checkbox>
          </div> -->
        </div>
        <div class="checkRow">
          <el-checkbox label="课程提示"
                       :disabled="basdisabled"
                       class="classCheckBox"
                       v-model.trim="checkList.submit.ischeck"></el-checkbox>
          <div class="textWrap"
               v-if="checkList.submit.ischeck">
            <el-input type="textarea"
                      :disabled="basdisabled"
                      :rows="1"
                      style="width: 500px"
                      v-model.trim="checkList.submit.value"></el-input>
          </div>
        </div>
        <div class="head noMargin">新生专享:</div>

        <div class="checkRow"
             v-if="newStudentList.baseInfo">
          <el-checkbox label="网络基础训练"
                       :disabled="basdisabled"
                       v-model="newStudentList.baseInfo.ischeck"></el-checkbox>
          <div class="inputWrap">
            原价:
            <el-input type="number"
                      @mousewheel.native.prevent
                      :disabled="basdisabled"
                      placeholder="请输入"
                      v-model.trim="newStudentList.baseInfo.nowValue" />
          </div>
          <div class="inputWrap">
            现价:
            <el-input type="number"
                      :disabled="basdisabled"
                      @mousewheel.native.prevent
                      placeholder="请输入"
                      v-model.trim="newStudentList.baseInfo.value" />
          </div>
          <!-- <div class="inputWrap">
            <el-checkbox v-model="newStudentList.baseInfo.checkBuy">是否可选择购买</el-checkbox>
          </div> -->
        </div>
        <div class="head noMargin">付费方式：</div>
        <div class="checkRow">
          <el-checkbox label="学校"
                       :disabled="basdisabled"
                       class="classCheckBox"
                       v-model.trim="payList.school.ischeck"></el-checkbox>

          <div class="chioseList">
            <el-radio-group v-model="payList.school.chiose"
                            size="small">
              <el-radio-button label="ONE_OFF">一次性</el-radio-button>
              <el-radio-button label="MONTHLY">一个月</el-radio-button>
              <el-radio-button label="TERM">一学期</el-radio-button>
              <el-radio-button label="YEAR">一学年</el-radio-button>
            </el-radio-group>
            <!-- <el-tag :effect="payList.school.chiose == 'ONE_OFF' ? 'dark' : 'plain'"
                    @click="!basdisabled ? (payList.school.chiose = 'ONE_OFF') : null">一次性</el-tag>
            <el-tag :effect="payList.school.chiose == 'MONTHLY' ? 'dark' : 'plain'"
                    @click="!basdisabled ? (payList.school.chiose = 'MONTHLY') : null">一个月</el-tag>
            <el-tag :effect="payList.school.chiose == 'TERM' ? 'dark' : 'plain'"
                    @click="!basdisabled ? (payList.school.chiose = 'TERM') : null">一学期</el-tag>
            <el-tag :effect="payList.school.chiose == 'YEAR' ? 'dark' : 'plain'"
                    @click="!basdisabled ? (payList.school.chiose = 'YEAR') : null">一学年</el-tag> -->
            <!-- <div class="chioseItem"
                 :class="">

            </div> -->
            <!-- <div class="chioseItem"
                 :class="payList.school.chiose == 'MONTHLY' ? 'active' : ''"
                 @click="!basdisabled ? (payList.school.chiose = 'MONTHLY') : null">
              一个月
            </div>
            <div class="chioseItem"
                 :class="payList.school.chiose == 'TERM' ? 'active' : ''"
                 @click="!basdisabled ? (payList.school.chiose = 'TERM') : null">
              一学期
            </div>
            <div class="chioseItem"
                 :class="payList.school.chiose == 'YEAR' ? 'active' : ''"
                 @click="!basdisabled ? (payList.school.chiose = 'YEAR') : null">
              一学年
            </div> -->
          </div>
          <div class="inputWrap">
            <div>
              预计收费:
              <el-input v-model.trim="payList.school.price"
                        :disabled="basdisabled"
                        placeholder="请输入" />
            </div>

          </div>
          <div class="inputWrap">
            <div>
              备注:
              <el-input v-model.trim="payList.school.value"
                        :disabled="basdisabled"
                        placeholder="请输入" />
            </div>

          </div>
        </div>
        <div class="checkRow">
          <el-checkbox label="公司"
                       class="classCheckBox"
                       :disabled="basdisabled"
                       v-model.trim="payList.company.ischeck"></el-checkbox>
          <div class="chioseList">
            <el-radio-group v-model="payList.company.chiose"
                            size="small">
              <el-radio-button label="ONE_OFF">一次性</el-radio-button>
              <el-radio-button label="MONTHLY">一个月</el-radio-button>
              <el-radio-button label="TERM">一学期</el-radio-button>
              <el-radio-button label="YEAR">一学年</el-radio-button>
            </el-radio-group>
            <!-- <div class="chioseItem"
                 :class="payList.company.chiose == 'ONE_OFF' ? 'active' : ''"
                 @click="
                !basdisabled ? (payList.company.chiose = 'ONE_OFF') : null
              ">
              一次性
            </div>
            <div class="chioseItem"
                 :class="payList.company.chiose == 'MONTHLY' ? 'active' : ''"
                 @click="
                !basdisabled ? (payList.company.chiose = 'MONTHLY') : null
              ">
              一个月
            </div>
            <div class="chioseItem"
                 :class="payList.company.chiose == 'TERM' ? 'active' : ''"
                 @click="!basdisabled ? (payList.company.chiose = 'TERM') : null">
              一学期
            </div>
            <div class="chioseItem"
                 :class="payList.company.chiose == 'YEAR' ? 'active' : ''"
                 @click="!basdisabled ? (payList.company.chiose = 'YEAR') : null">
              一学年
            </div> -->
          </div>
          <div class="inputWrap">
            <div>
              预计收费:
              <el-input placeholder="请输入"
                        :disabled="basdisabled"
                        v-model.trim="payList.company.price" />
            </div>

          </div>
          <div class="inputWrap">
            <div>
              备注:
              <el-input placeholder="请输入"
                        :disabled="basdisabled"
                        v-model.trim="payList.company.value" />
            </div>

          </div>
        </div>
      </div>
      <div class="btnWrap">
        <div class="nextBtn"
             v-if="teamStatus == 'resetTeam'"
             v-permission="{
            child: 'musicGroup/update',
            parent: '/resetTeaming/teamBaseInfo',
          }"
             @click="resetSubmit">
          修改
        </div>
        <!-- 审批或者草稿的下一步 -->
        <div class="nextBtn"
             @click="gotoNext(1)"
             v-if="
            teamStatus == 'newTeam' ||
            teamStatus == 'teamDraft' ||
            teamStatus == 'teamAudit'
          ">
          下一步
        </div>
        <!-- 跨团调整的下一步 -->
        <div class="nextBtn"
             v-if="teamStatus == 'teamList'"
             @click="gotoNext(2)">
          下一步
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import {
  getSection,
  getType,
  getCooperation,
  getTeacher,
  getAddress,
  getPayMaster,
  getPayStatus,
  getTeamBaseInfo,
  resetTeamBaseInfo,
  getEmployeeOrgan,
} from "@/api/buildTeam";
import { findTechnician } from "@/api/repairManager";
import dayjs from 'dayjs'
import {
  queryEmployByOrganId,
  queryByOrganId,
  getSchool,
} from "@/api/systemManage";
import { classStatus } from "@/utils/searchArray";
import { scrollTo } from "@/utils/scroll-to";
import axios from "axios";
import store from "@/store";
import numeral from "numeral";
import { formatData } from "@/utils/utils";
import qs from "qs";
export default {
  name: "teamBaseInfo",
  props: ["getTeamList"],
  data () {
    return {
      classStatus,
      organId: null,
      topFrom: {
        type: "", // 收费类型
        section: "", //所属分部
        school: "", // 合作单位
        teacher: "", // 教务老师
        name: "", //乐团名称
        boss: "", // 运营主管
        time: "", // 报名截止时间
        startClass: [], // 招生年级起始
        address: "", // 教学地点
        salary: "", // 收费模式
        head: "",
        isClass: false, //是否为课堂课
        startTime: "",
        feeType: null,
        paymentPattern: "", // 缴费方式
        paymentValid: [], // 缴费有效期
        paymentValidStartDate: null, // 缴费有效期开始
        paymentValidEndDate: null, // 缴费有效期结束
        ownershipType: "OWN", // 合作机构类型
        repairUserId: null, // 维修技师
      },
      checkList: {
        soundInfo: {
          // 声部
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        allInfo: {
          // 合奏
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        baseInfo: {
          // 基础
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        holidayInfo: {
          // 假期
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        networkInfo: {
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        submit: {
          ischeck: false,
          value:
            "年度安排个月共xxx课时,课时,原价xxx元,现价xxxx元/月(约 xxxx元/课时 )",
        },
      }, // 选中的集合
      newStudentList: {
        baseInfo: {
          ischeck: false,
          value: "",
          checkBuy: true,
          nowValue: "",
          isNew: 1,
          isStatus: false,
        },
      },
      baseInfo: {},
      money: 580,
      orderInfo: {
        marketPrice: 0, // 原价总金额
        referencePrice: 0, // 现价总金额
      }, // 金额列表，金额计算
      sectionList: [], // 分部列表
      typeList: [], // 收费类型列表
      cooperationList: [], // 教学点列表
      teacherList: [], // 获取老师列表
      addList: [], // 教学地点列表
      payList: {
        school: {
          ischeck: false,
          value: "",
          price: "",
          chiose: "",
        },
        company: {
          ischeck: false,
          value: "",
          price: "",
          chiose: "",
        },
        student: {
          ischeck: true,
          chiose: "loop",
        },
        chioseMonth: [], // 选中的月份
      },
      activeTeam: [],
      teamid: "",
      teamStatus: "",
      orgianList: [],
      isInit: false,
      technician: [],
      basdisabled: false,
    };
  },
  created () { },
  activated () {
    console.log(dayjs('2014-12-03').format('YYYY-MM-DD HH:mm:ss'))
    this.payList = {
      school: {
        ischeck: false,
        value: "",
        price: "",
        chiose: "",
      },
      company: {
        ischeck: false,
        value: "",
        price: "",
        chiose: "",
      },
      student: {
        ischeck: true,
        chiose: "loop",
      },
      chioseMonth: [], // 选中的月份
    };
    this.init();
  },
  mounted () {
    this.init();
    this.$forceUpdate()
    // 获取分部下的员工
  },
  beforeDestroy () { },
  methods: {
    isNotEditing: function () {
      return !(this.teamStatus === 'teamDraft' || this.teamStatus === 'teamAudit' || this.teamStatus === 'newTeam' || this.teamStatus === 'teamList')
    },
    changeFeeType (val) {
      // console.log(val == "ONLINE");
    },
    changePaymentValidStartDate (val) {
      if (val) {
        this.$set(this.topFrom, "paymentValidEndDate", "");
      }
    },
    changePaymentPattern (val) {
      if (val === 2) {
        // this.topFrom.paymentValidStartDate = null
        this.$set(this.topFrom, 'paymentValidEndDate', '')
      }
    },
    beginDate (end) {
      return {
        firstDayOfWeek: 1,
        disabledDate (time) {
          if (end) {
            return new Date(end).getTime() - 86400000 >= time.getTime();
          } else {
            return time.getTime() + 86400000 < Date.now();
            //开始时间不选时，结束时间最大值小于等于当天
          }
        },
      };
    },
    init () {
      (this.checkList = {
        soundInfo: {
          // 声部
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        allInfo: {
          // 合奏
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        baseInfo: {
          // 基础
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        holidayInfo: {
          // 假期
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        networkInfo: {
          ischeck: false,
          value: "",
          checkBuy: false,
          isNew: 0,
          isStatus: false,
        },
        submit: {
          ischeck: false,
          value:
            "年度安排个月共xxx课时,课时,原价xxx元,现价xxxx元/月(约 xxxx元/课时 )",
        },
      }),
        (this.newStudentList = {
          baseInfo: {
            // 基础
            ischeck: false,
            value: "",
            checkBuy: true,
            nowValue: "",
            isNew: 1,
            isStatus: false,
          },
        });
      this.isInit = true;
      // 分为3种  this.teamStatus
      //          1.resetTeam 乐团修改
      //          2. newTeam  新建乐团
      //          3.teamList 跨团修改
      //          4.teamDraft 乐团草稿
      this.teamStatus = this.$route.query.type;
      // 传过来的乐团信息
      this.activeTeam = this.getTeamList;
      if (this.teamStatus == "look") {
        this.basdisabled = true;
      } else {
        this.basdisabled = false;
      }
      if (
        this.teamStatus == "resetTeam" ||
        this.teamStatus == "teamDraft" ||
        this.teamStatus == "teamAudit" ||
        this.teamStatus == "look"
      ) {
        // 单团修改
        this.teamid = this.$route.query.id;
        getTeamBaseInfo({ musicGroupId: this.teamid }).then((res) => {
          if (res.code == 200) {
            // 头部
            this.topFrom.name = res.data.musicGroup.name;
            this.$emit("getName", this.topFrom.name);
            this.topFrom.time = res.data.musicGroup.applyExpireDate;
            this.topFrom.type = res.data.musicGroup.chargeTypeId;
            this.topFrom.startClass = res.data.musicGroup.enrollClasses.split(
              ","
            );
            this.topFrom.paymentPattern = res.data.musicGroup.paymentPattern;
            this.topFrom.paymentValidStartDate =
              res.data.musicGroup.paymentValidStartDate;
            this.topFrom.paymentValidEndDate =
              res.data.musicGroup.paymentValidEndDate;
            this.topFrom.section = res.data.musicGroup.organId;
            this.topFrom.school = res.data.musicGroup.cooperationOrganId;
            this.topFrom.teacher = res.data.musicGroup.educationalTeacherId;
            this.topFrom.boss = res.data.musicGroup.teamTeacherId;
            this.topFrom.address = res.data.musicGroup.schoolId;
            this.topFrom.salary = res.data.musicGroup.settlementType;
            this.topFrom.head = res.data.musicGroup.directorUserId ? res.data.musicGroup.directorUserId : null;
            this.topFrom.isClass = res.data.musicGroup.isClassroomLessons;
            this.topFrom.startTime = res.data.musicGroup.expectStartGroupDate;
            this.topFrom.ownershipType = res.data.musicGroup.ownershipType;
            this.topFrom.repairUserId = res.data.musicGroup.repairUserId
              ? res.data.musicGroup.repairUserId
              : null;
            this.topFrom.feeType = res.data.musicGroup.feeType
              ? res.data.musicGroup.feeType
              : null;
            // 课程组成形式
            this.checkList;
            let list = JSON.parse(res.data.musicGroup.courseForm);
            for (let i in this.checkList) {
              if (list[i] && !list[i].isNew) {
                this.checkList[i] = list[i];
              } else if (list[i] && list[i].isNew) {
                this.newStudentList[i] = list[i];
                this.newStudentList[i].checkBuy = true;
              }
            }

            // 付费方式和周期
            for (let i in res.data.musicGroupPaymentEntities) {
              if (res.data.musicGroupPaymentEntities[i].name == "学校") {
                this.payList.school.ischeck = true;
                this.payList.school.value =
                  res.data.musicGroupPaymentEntities[i].memo;
                this.payList.school.price =
                  res.data.musicGroupPaymentEntities[i].amount;
                this.payList.school.chiose =
                  res.data.musicGroupPaymentEntities[i].paymentMethod;
              }
              if (res.data.musicGroupPaymentEntities[i].name == "公司") {
                this.payList.company.ischeck = true;
                this.payList.company.value =
                  res.data.musicGroupPaymentEntities[i].memo;
                this.payList.company.price =
                  res.data.musicGroupPaymentEntities[i].amount;
                this.payList.company.chiose =
                  res.data.musicGroupPaymentEntities[i].paymentMethod;
              }

              if (res.data.months.length > 0) {
                this.payList.student.ischeck = true;
                this.payList.student.chiose = "loop";
                this.chioseMonth = res.data.months;
              } else {
                this.payList.student.ischeck = true;
                this.payList.student.chiose = "ONE_OFF";
              }
            }
            // 循环缴费月
            this.payList.chioseMonth = res.data.months;
            if (res.data.musicGroup.organId) {
              // 获取员工
              queryEmployByOrganId({
                organId: res.data.musicGroup.organId,
                rows: 1000,
              }).then((res) => {
                if (res.code == 200) {
                  this.orgianList = res.data.rows;
                }
              });
              // 获取合作单位
              queryByOrganId({ organId: res.data.musicGroup.organId }).then(
                (res) => {
                  if (res.code == 200) {
                    this.cooperationList = res.data;
                  }
                }
              );
              // 获取教学点
              getSchool({ organId: res.data.musicGroup.organId }).then(
                (res) => {
                  if (res.code == 200) {
                    this.addList = res.data;
                    this.isInit = false;
                  }
                }
              );

              // 获取维修技师
              findTechnician().then((res) => {
                if (res.code == 200) {
                  this.technician = res.data;
                }
              });
            }
          }
        });
      } else {
        (this.topFrom = {
          type: "", // 收费类型
          section: "", //所属分部
          school: "", // 合作单位
          teacher: "", // 教务老师
          name: "", //乐团名称
          boss: "", // 运营主管
          time: "", // 报名截止时间
          startClass: [], // 招生年级起始
          paymentValid: [], // 缴费有效期时间起始
          address: "", // 教学地点
          salary: "", // 收费模式
          head: "",
          paymentPattern: "", // 缴费方式
          isClass: false, //是否为课堂课
          startTime: "",
          ownershipType: "OWN", // 合作机构类型
          feeType: null,
        }),
          this.$refs["topinfo"].resetFields();
      }
      // 1.获取各个选项卡的数据内容
      // getSection({ 'delFlag': 0, 'rows': 1000 }).then(res => {
      //   if (res.code == 200) {
      //     this.sectionList = res.data.rows;
      //   }
      // }).catch()
      getEmployeeOrgan().then((res) => {
        if (res.code == 200) {
          this.sectionList = res.data;
        }
      });
      // 2.获取收费类型选项卡
      getType({ rows: 1000 }).then((res) => {
        if (res.code == 200) {
          this.typeList = res.data.rows;
        }
      });
      // 3.获取合作单位选项卡
      // getCooperation({ 'rows': 1000, search: this.organId }).then(res => {
      //   if (res.code == 200) {
      //     this.cooperationList = res.data.rows;
      //   }
      // })
      // 4.获取老师选项卡
      // getTeacher({ 'rows': 1000, organId: this.organId }).then(res => {
      //   if (res.code == 200) {
      //     this.teacherList = res.data;
      //   }
      // })
      // 5.获取教学地点选项卡
      // getAddress({ 'rows': 1000, }).then(res => {
      //   if (res.code == 200) {
      //     this.addList = res.data.rows;
      //   }
      // })
      // 6.默认支付主体
      // getPayMaster({ 'rows': 1000 }).then(res => {
      //   if (res.code == 200) {
      //     this.payList = res.data.map(item => {
      //       let obj = {};
      //       obj.id = item.id;
      //       obj.ischios
      //     })
      //   }
      // })
      // 缓存设置时的状态
      sessionStorage.setItem("resetCode", "1");
    },
    changeSection (val) {
      // 修改分部的时候 重置运营主管 重置教务老师 重置乐队指导 合作单位  教学点
      this.topFrom.teacher = "";
      this.topFrom.boss = "";
      this.topFrom.head = "";
      this.topFrom.school = "";
      this.topFrom.address = "";
      // 发请求 根据分部id 查询所有员工
      queryEmployByOrganId({ organId: val, rows: 1000 }).then((res) => {
        if (res.code == 200) {
          this.orgianList = res.data.rows;
        }
      });
      // 合作单位
      queryByOrganId({ organId: val }).then((res) => {
        if (res.code == 200) {
          this.cooperationList = res.data;
        }
      });
      // 教学点=>学校
      getSchool({ organId: val }).then((res) => {
        if (res.code == 200) {
          this.addList = res.data;
        }
      });
      // 获取维修技师
      findTechnician().then((res) => {
        if (res.code == 200) {
          this.technician = res.data;
        }
      });
    },
    chioseSchool (val) { },
    gotoNext (num) {
      // 1.效验数据    判断是否数据正常=> 正常放入store存储
      // 不正常=>  进行效验提示
      let check = [];
      for (let i in this.checkList) {
        if (this.checkList[i] && i != "submit") {
          check.push(this.checkList[i].ischeck);
        }
      }
      let checkFlag = false;
      check.forEach((item) => {
        checkFlag = checkFlag || item;
      });
      if (!checkFlag) {
        this.$message.error("请至少选择一种乐团课程类型");
        return;
      }
      this.$refs["topinfo"].validate((valid, object) => {
        if (!valid) {
          this.$message.error("请填写建团必要参数");
        } else {
          // 判断一下是否勾选了课程类型而没有输入金额
          let flagList = [];
          for (let i in this.checkList) {
            if (this.checkList[i].ischeck && !this.checkList[i].value) {
              flagList.push(false);
            } else {
              flagList.push(true);
            }
          }

          for (let i in this.newStudentList) {
            if (
              (this.newStudentList[i].ischeck &&
                !this.newStudentList[i].value) ||
              (this.newStudentList[i].ischeck &&
                !this.newStudentList[i].nowValue)
            ) {
              flagList.push(false);
            } else {
              flagList.push(true);
            }
          }

          let flag = flagList.every((item) => {
            return item == true;
          });
          if (!flag) {
            this.$message.error("课程价格不能为空");
            return;
          }
          // 验证通过
          this.$store.dispatch("topinfo", this.topFrom);
          this.$store.dispatch("checkinfo", this.checkList);
          this.$store.dispatch("getpayInfo", this.payList);
          this.$store.dispatch("newStudentinfo", this.newStudentList);
          if (this.teamStatus == "teamDraft") {
            // 获取数据提交
            this.resetSubmit();
          } else {
            // this.resetSubmit();
            this.$emit("chiosetab", num);
          }
        }
      });
    },
    resetSubmit () {
      let check = [];
      for (let i in this.checkList) {
        if (this.checkList[i] && i != "submit") {
          check.push(this.checkList[i].ischeck);
        }
      }
      let checkFlag = false;
      check.forEach((item) => {
        checkFlag = checkFlag || item;
      });
      if (!checkFlag) {
        this.$message.error("请至少选择一种乐团课程类型");
        return;
      }
      this.$refs["topinfo"].validate((valid, object) => {
        if (!valid) {
          this.$message.error("请填写必要参数");
        } else {
          let flagList = [];
          for (let i in this.checkList) {
            if (this.checkList[i].ischeck && !this.checkList[i].value) {
              flagList.push(false);
            } else {
              flagList.push(true);
            }
          }
          for (let i in this.newStudentList) {
            if (
              (this.newStudentList[i].ischeck &&
                !this.newStudentList[i].value) ||
              (this.newStudentList[i].ischeck &&
                !this.newStudentList[i].nowValue)
            ) {
              flagList.push(false);
            } else {
              flagList.push(true);
            }
          }
          let flag = flagList.every((item) => {
            return item == true;
          });
          if (!flag) {
            this.$message.error("课程价格不能为空");
            return;
          }
          let status = null;
          // 1.resetTeam 乐团修改
          // 2.newTeam 新建乐团
          // 3.teamList 跨团修改
          // 4.teamDraft 乐团草稿
          switch (this.teamStatus) {
            case "resetTeam": {
              status = "PROGRESS";
              break;
            }
            case "newTeam": {
              status = null;
              break;
            }
            case "teamList": {
              status = null;
              break;
            }
            case "teamDraft": {
              status = "DRAFT";
              break;
            }
          }
          let obj = {};
          // topFrom.ownershipType
          //  修改  合并对象
          let courseJson = {};
          for (let i in this.checkList) {
            if (this.checkList[i].ischeck) {
              courseJson[i] = this.checkList[i];
            }
          }
          for (let j in this.newStudentList) {
            if (this.newStudentList[j].ischeck) {
              courseJson[j] = this.newStudentList[j];
            }
          }
          this.payList.student.chiose == "loop"
            ? (obj.months = this.payList.chioseMonth)
            : (obj.months = []);
          obj.musicGroup = {
            settlementType: this.topFrom.salary,
            applyExpireDate: dayjs(this.topFrom.time).format('YYYY-MM-DD HH:mm:ss'),
            chargeTypeId: this.topFrom.type,
            cooperationOrganId: this.topFrom.school,
            teamTeacherId: this.topFrom.boss,
            educationalTeacherId: this.topFrom.teacher,
            enrollClasses: this.topFrom.startClass.join(","),
            name: this.topFrom.name,
            paymentPattern: this.topFrom.paymentPattern,
            paymentValidStartDate: this.topFrom.paymentValidStartDate
              ? dayjs(this.topFrom.paymentValidStartDate).format("YYYY-MM-DD")
              : this.topFrom.paymentValidStartDate,
            paymentValidEndDate: this.topFrom.paymentValidEndDate
              ? dayjs(this.topFrom.paymentValidEndDate).format("YYYY-MM-DD")
              : this.topFrom.paymentValidEndDate,
            organId: this.topFrom.section,
            // paymentMonths:obj.months  有待确认
            schoolId: this.topFrom.address,
            courseForm: JSON.stringify(courseJson),
            id: this.teamid,
            directorUserId: this.topFrom.head,
            isClassroomLessons: this.topFrom.isClass,
            status,
            expectStartGroupDate: this.topFrom.startTime,
            ownershipType: this.topFrom.ownershipType,
            repairUserId: this.topFrom.repairUserId || null,
            feeType: this.topFrom.feeType,
          };
          obj.musicGroupPaymentEntities = [];
          // 添加学校主体付费方式
          if (this.payList.school.ischeck) {
            obj.musicGroupPaymentEntities.push({
              amount: this.payList.school.price,
              memo: this.payList.school.value,
              paymentMethod: this.payList.school.chiose,
              name: "学校",
            });
          }
          // 添加公司主体付费方式
          if (this.payList.company.ischeck) {
            obj.musicGroupPaymentEntities.push({
              amount: this.payList.company.price,
              memo: this.payList.company.value,
              paymentMethod: this.payList.company.chiose,
              name: "公司",
            });
          }
          if (this.payList.student.ischeck) {
            obj.musicGroupPaymentEntities.push({
              paymentMethod: this.payList.student.chiose,
              name: "学生",
            });
          }
          // 发请求
          resetTeamBaseInfo(obj).then((res) => {
            if (res.code == 200) {
              if (this.teamStatus == "teamDraft") {
                this.$message.success("保存成功");
                // 跳到第二页
                // 删掉结束
                this.$emit("chiosetab", 1);
              } else {
                this.$message.success("修改乐团成功");
                // this.$router.push({ path: '/business/teamDetails', query: { id: this.teamid, name: this.topFrom.name } })
              }
            }
          });
        }
      });
    },
    changeApplyTime (val) {
      this.$set(this.topFrom, "paymentValidStartDate", "");
      this.$set(this.topFrom, "paymentValidEndDate", "");
      // this.topFrom.paymentValidStartDate = ''
      // this.topFrom.paymentValidEndDate = ''
    }
  },
  computed: {
    startClassString () {
      return this.topFrom.startClass
        .map((item) => {
          for (let i in this.classStatus) {
            if (item == this.classStatus[i].value) {
              return this.classStatus[i].label;
            }
          }
          // return  this.classStatus[item]
        })
        .join(",");
    },
  },
  watch: {
    newStudentList: {
      handler: function (val) {
        if (val.baseInfo.ischeck) {
          this.checkList.baseInfo.ischeck = false;
        }
      },
      deep: true,
    },
    checkList: {
      handler: function (val) {
        if (val.baseInfo.ischeck) {
          this.newStudentList.baseInfo.ischeck = false;
        }
      },
      deep: true,
    },
  },
};
</script>
<style lang="scss" >
.base-container {
  overflow: auto;
  // display: flex;
  // flex-direction: row;
  // justify-content: flex-start;
  // flex-wrap: nowrap;
  font-size: 14px;
  color: #444;
  // width: fill-available;
  .banseLeft {
    // width: 1050px;
    .head {
      height: 48px;
      line-height: 48px;
      background-color: #edeef0;
      font-size: 14px;
      font-weight: bold;
      color: #444;
      padding: 0 11px;
      margin-bottom: 20px;
    }
    .noMargin.head {
      margin-bottom: 0;
    }
    .num {
      padding: 15px 11px;
    }
    .checkRow {
      min-width: 1200px;
      padding-left: 28px;
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      flex-wrap: nowrap;
      overflow: auto;

      .el-checkbox {
        line-height: 72px;
        width: 120px;
      }
      .inputWrap {
        line-height: 72px;
        font-size: 14px;
        color: #777;
        margin-left: 65px;
        input {
          // border: none;
          // width: 80px;
          // margin-right: 10px;
          // outline: none;
        }
      }
      .inputWrap.rightFirst {
        margin-left: 245px;
      }
      .textWrap {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        font-size: 14px;
        color: #777;
        align-items: center;

        span {
          color: #f97215;
        }
      }
      .selectWrap {
        font-size: 14px;
        padding-top: 5px;
        margin-left: 100px;
        margin-right: 52px;
        .rowSelect {
          .el-input__inner {
            min-height: 69px;
          }
        }
      }

      .chioseList {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        font-size: 14px;
        color: #777;
        margin-left: 64px;
        .chioseItem {
          width: 80px;
          height: 30px;
          border-radius: 15px;
          border: 1px solid #979797;
          margin-right: 10px;
          line-height: 30px;
          text-align: center;
          cursor: pointer;
        }
        .chioseItem.active {
          background-color: #14928a;
          border: 1px solid #14928a;
          color: #fff;
        }
      }
      // &:nth-child(even) {
      //   background-color: #c6cbd4;
      //   input {
      //     background-color: #c6cbd4;
      //   }
      // }
    }
  }
  .btnWrap {
    margin-top: 30px;
  }
  .el-checkbox__input.is-checked + .el-checkbox__label {
    color: #606266;
  }
  .subTitle {
    // width: 1203px;
    height: 40px;
    line-height: 40px;
    background-color: #fefceb;
    padding: 0 25px;
    box-sizing: border-box;
    font-size: 16px;
    color: #474747;
    margin-bottom: 20px;
  }
  .chioseWrap {
    margin-bottom: 30px;
    display: flex;
    flex-direction: row;
    padding: 0 25px;
    p {
      width: 80px;
      font-size: 14px;
      // margin-right: 30px;
    }
  }

  .classCheckBox {
    margin-right: 10px;
  }
}
</style>
<style lang="scss" scoped>
/deep/.el-date-editor {
  width: 180px !important;
}
/deep/.el-checkbox {
  margin-left: 15px !important;
}
/deep/.el-input {
  position: relative;
  font-size: 14px;
  display: inline-block;
  width: 180px;
}
input[disabled] {
  background-color: #fff;
  border-color: #b3b3b3;
  color: #606266;
}
/deep/.el-radio-button__orig-radio:checked + .el-radio-button__inner {
  background-color: rgb(19, 129, 122);
  border-color: rgb(19, 129, 122);
  // -webkit-box-shadow: -1px 0 0 0 rgb (19, 129, 122);
  box-shadow: -1px 0 0 rgb(19, 129, 122);
  color: #fff;
  outline: none;
}
/deep/.el-radio-button__inner {
  &:hover {
    color: rgb(19, 129, 122);
  }
  outline: none;
}
/deep/.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled) {
  -webkit-box-shadow: none;
  box-shadow: none;
}
</style>