mteacher/src/views/applyActive/components/vipCourse.vue

<template>
  <div class="vipCourse">
    <div>
      <!-- <van-divider
        content-position="center"
        :style="{ padding: '0 16px', margin: '.05rem 0' }"
        >课程信息</van-divider
      > -->
      <div class="vip-title">课程信息</div>
      <van-field
        label="课程声部"
        input-align="right"
        placeholder="请选择课程声部"
        v-model="formName.subjectListName"
        @click="onSelect('subjectList')"
        readonly
        is-link
      />
      <van-field
        label="课程形式"
        v-model="formName.vipGroupCategoryName"
        input-align="right"
        placeholder="请选择课程形式"
        @click="onSelect('vipGroupCategory')"
        readonly
        is-link
      />
    <van-cell
        class="courseStudent"
        title="上课学员"
        @click="onCheckStudent"
        :readonly="true"
        input-align="right"
        :is-link="checkboxSelectDataList.length > 0 ? false : true"
        :value="checkboxSelectDataList.length > 0 ? '重新选择' : '请选择上课学员'"
        :value-class="checkboxSelectDataList.length > 0 ? 'studentColor' : null"
      />
      <div
        v-if="checkboxSelectDataList.length > 0"
        style="
          text-align: center;
          line-height: 1.8;
          padding: 0.05rem 0;
          background: #fafbff;
        "
      >
        <p
          style="color: #323233"
          v-for="(item, index) in checkboxSelectDataList"
          :key="index"
        >
          {{ item.username }} - {{ item.parentsPhone }}
        </p>
      </div>
      <van-field
        label="活动方案"
        v-model="formName.vipGroupActivityName"
        input-align="right"
        placeholder="请选择活动方案"
        @click="onSelect('vipGroupActivity')"
        readonly
        is-link
      />
      <!-- <van-divider
        content-position="center"
        :style="{ padding: '0 16px', margin: '.05rem 0' }"
        >课时组成</van-divider
      > -->
      <div class="vip-title">课时组成</div>
      <van-field
        label="课时总数"
        input-align="right"
        placeholder="请输入课时总数"
        readonly
        :value="
          loadData.vipGroupActivitySelect.maxCourseNum
            ? loadData.vipGroupActivitySelect.maxCourseNum + '节'
            : 0 + '节'
        "
      />
      <van-field
        label="课程时长"
        v-model="form.singleClassMinutes"
        input-align="right"
        placeholder="请选择课程时长"
        @click="onClickSingleClass"
        readonly
        is-link
      />
      <van-field
        v-if="statusList.hasOnline"
        v-model="form.onlineClassesNums"
        @keyup="onClassKeyUp"
        label="线上课"
        input-align="right"
        placeholder="请输入次数"
        type="number"
      />
      <van-field
        v-if="statusList.hasOffline"
        v-model="form.offlineClassesNums"
        @keyup="onClassKeyUp('offLine')"
        label="线下课"
        input-align="right"
        placeholder="请输入次数"
        type="number"
      />
      <van-field
        v-if="form.offlineClassesNums > 0"
        v-model="formName.teacherSchoolName"
        @click="onSelect('teacherSchool')"
        label="线下课地址"
        :readonly="true"
        input-align="right"
        is-link
        placeholder="请选择"
      />
        <van-field
          @click="dataForm.status = true"
          v-model="form.courseStart"
          label="排课开始时间"
          :readonly="true"
          input-align="right"
          is-link
          placeholder="请选择"
        />

        <van-cell
          title-class="title-time"
          v-for="(item, index) in scheduleList"
          :key="index"
        >
          <template slot="title">
            <span class="online">{{ item.type }}</span>
            <span class="week">{{ item.weekStr }}</span>
            <span class="timer">{{ item.startTime + "-" + item.endTime }}</span>
          </template>
          <template slot="default">
            <van-button
              type="warning"
              @click="onScheduleRemove(item)"
              round
              size="small"
              plain
              >删除</van-button
            >
          </template>
        </van-cell>
        <div class="add-plan van-cell" @click="onCourseShedule">
          <van-icon name="add-o" />课时安排
        </div>
        <van-field
          label="排课列表"
          v-if="scheduleList.length > 0"
          disabled
          input-align="right"
          @click="onShowTimeTable"
          is-link
        />

      <div style="margin: 16px">
        <van-button round block type="info" @click="onSubmit"
          >确认排课</van-button
        >
      </div>
    </div>
    <!-- 每课时长 -->
    <van-action-sheet
      v-model="statusList.classTimerStatus"
      :actions="loadData.classTimer"
      cancel-text="取消"
      @cancel="statusList.classTimerStatus = false"
      @select="onClassTimerSelect"
    />
    <!-- 报名开始时间&报名结束时间 -->
    <van-popup v-model="enlistForm.status" position="bottom">
      <van-datetime-picker
        v-model="enlistForm.currentDate"
        type="date"
        :min-date="enlistForm.minDate"
        :formatter="formatter"
        @cancel="enlistForm.status = false"
        @confirm="onEnlistConfirm"
      />
    </van-popup>
    <!-- 赠课类型 -->
    <van-action-sheet
      v-model="statusList.giveTeachModeStatus"
      :actions="loadData.giveTeachMode"
      cancel-text="取消"
      @cancel="statusList.giveTeachModeStatus = false"
      @select="onModeSelect"
    />
    <!-- 课程信息所用 :close-on-click-overlay="false"  -->
    <van-popup v-model="sheetForm.sheetStatus" position="bottom">
      <van-picker
        :loading="sheetForm.loading"
        :default-index="sheetForm.index"
        :columns="sheetForm.columns"
        show-toolbar
        @cancel="sheetForm.sheetStatus = false"
        @confirm="onSheetConfirm"
      />
    </van-popup>
    <!-- 课时安排 -->
    <van-popup v-model="dataForm.status" position="bottom">
      <van-datetime-picker
        v-model="dataForm.currentDate"
        type="date"
        :min-date="dataForm.minDate"
        :formatter="formatter"
        @cancel="dataForm.status = false"
        @confirm="onCurrentConfirm"
      />
    </van-popup>
    <!-- 课时安排 -->
    <van-popup v-model="courseForm.teachingStatus" position="bottom">
      <van-picker
        :columns="courseForm.columns"
        show-toolbar
        @cancel="courseForm.teachingStatus = false"
        @confirm="onTeachinConfirm"
      />
    </van-popup>
    <!-- 选择上课学生 -->
    <van-popup
      v-model="statusList.studentStatus"
      :lock-scroll="true"
      position="bottom"
      :style="{ height: '180%' }"
      class="studentChiose"
    >
      <div v-if="statusList.studentStatus">
        <van-sticky>
          <van-search
            show-action
            shape="round"
            @search="onSearch"
            v-model="params.search"
            placeholder="请输入学生名或手机号"
          >
            <template #action>
              <div @click="onSearch">搜索</div>
            </template>
          </van-search>
        </van-sticky>
        <div class="paddingB80">
          <van-list
            v-model="loading"
            class="studentContainer"
            v-if="dataShow"
            key="data"
            :finished="finished"
            finished-text=""
            @load="getStudent"
          >
            <van-checkbox-group v-model="checkboxSelect">
              <van-cell-group>
                <van-cell
                  v-for="(item, index) in dataList"
                  :key="index"
                  @click="onCheckboxSelect(item)"
                  class="input-cell"
                  :center="true"
                >
                  <template slot="icon">
                    <img
                      class="logo"
                      v-if="item.avatar"
                      :src="item.avatar"
                      alt=""
                    />
                    <img
                      class="logo"
                      v-else
                      src="@/assets/images/icon_student.png"
                      alt=""
                    />
                  </template>
                  <template slot="title">
                    {{ item.username }}
                  </template>
                  <template slot="label">
                    <span>{{ desensitPhone(item.parentsPhone) }}</span>
                  </template>
                  <template slot="default">
                    <van-checkbox :name="item.userId.toString()"></van-checkbox>
                  </template>
                </van-cell>
              </van-cell-group>
            </van-checkbox-group>
          </van-list>
          <m-empty class="empty" msg="暂无学生" v-else key="data" />
        </div>
        <div class="button-group-popup">
          <span class="btn" @click="onPopupCancel">取消</span>
          <span class="btn primary" @click="onPopupSubmit">确定</span>
        </div>
      </div>
    </van-popup>
    <!-- 课表展示 -->
    <van-popup v-model="statusList.classTime" position="bottom">
      <van-row>
        <van-col span="12">上课类型</van-col>
        <van-col span="12">上课时间</van-col>
      </van-row>
      <div class="tableContainer">
        <van-row v-for="(item, index) in timeTable" :key="index">
          <van-col span="12">
            {{ item.teachMode == "ONLINE" ? "线上" : "线下" }}
          </van-col>
          <van-col span="12">
            {{ item.classDate }} {{ item.startClassTimeStr }}
          </van-col>
        </van-row>
      </div>
    </van-popup>
  </div>
</template>

<script>
import dayjs from "dayjs";
import cleanDeep from 'clean-deep'
import { browser } from "@/common/common";
import {
  findSubSubjects,
  vipGroupCategory,
  findVipSchoolByTeacher2
} from "@/api/teacher";
import { getStudents, createActivityVipGroup, getChildrenDayActivity } from "../api";
import setLoading from "@/utils/loading";
import MEmpty from "@/components/MEmpty";
let minutes = []; // 分钟数
for (let i = 0; i < 60; i++) {
  let mi = i < 10 ? "0" + i : i;
  minutes.push(mi + "分");
}
export default {
  components: {
    MEmpty },
  name: "apply",
  data() {
    return {
      dayjs,
      activityCourseType: null,
      subjectId: null,
      dataForm: {
        // 时间下拉框
        status: false,
        minDate: new Date(),
        currentDate: new Date(),
      },
      enlistForm: {
        // 时间下拉框
        updateStatus: "", // 修改哪个状态
        status: false,
        minDate: new Date(),
        currentDate: new Date(),
      },
      statusList: {
        // 散状态集合
        giveTeachModeStatus: false, // 赠课弹窗状态
        teachOnOrOff: false, // 是否显示赠课
        hasOnline: false, // 是否显示线上
        hasOffline: false, // 是否显示线下
        classTime: false, // 课表展示
        headerStatus: false, // 头部是否展示
        classTimerStatus: false, // 每课时长状态
        studentStatus: false, // 上课学生状态
      },
      loadData: {
        // 下拉加载数据
        subjectList: [], // 声部列表
        subjectListSelect: [], // 选中的声部JSON
        vipGroupCategory: [], // 课程形式
        vipGroupCategorySelect: [], // 选中的课程形式JSON
        vipGroupActivity: [], // 活动文案
        vipGroupActivitySelect: [], // 选中的活动文案JSON
        teacherSchool: [], // 线下课地址
        teacherSchoolSelect: [], // 选中的线下课地址JSON
        teacherList: [], // 线下课地址
        teacherListSelect: [], // 选中的线下课地址JSON
        giveTeachMode: [
          {
            name: "线上课",
            value: "ONLINE",
          },
          {
            name: "线下课",
            value: "OFFLINE",
          },
        ], // 赠课
        giveTeachModeSelect: [], // 选中的赠课JSON
        teacherCategory: [], // 老师课酬信息
        classTimer: [], // 每课时长
      },
      sheetForm: {
        // 上拉弹窗
        currentType: null, // 当前选择的类型
        sheetStatus: false,
        loading: true, // 加载数据
        index: 0, // 选中的索引值
        columns: [],
      },
      courseForm: {
        // 排课弹窗
        teachingStatus: false, // 课时安排状态
        columns: [
          {
            // 课程选项
            values: ["线上", "线下"],
            className: "type",
          },
          {
            values: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
            className: "week",
          },
          {
            values: [
              1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
              20
            ],
            className: "hours",
            defaultIndex: 7,
          },
          {
            values: minutes,
            className: "minutes",
          },
        ],
      },
      form: {
        subjectIdList: null,
        vipGroupCategoryId: null,
        vipGroupActivityId: null,
        teacherSchoolId: null,
        educationalTeacherId: null,
        studentNum: null,
        singleClassMinutes: null,
        onlineClassesNums: null,
        offlineClassesNums: null,
        registrationStartTime: null,
        coursesExpireDate: null,
        totalClassTime: null,
        courseStart: null,
        giveTeachMode: null,
        onlineClassesUnitPrice: null,
        offlineClassesUnitPrice: null,
        onlineTeacherSalary: null,
        offlineTeacherSalary: null,
        totalCount: null,
      },
      formName: {
        subjectListName: null, // 声部名称
        subjectListIndex: 0, // 声部名称
        vipGroupCategoryName: null, // 课程形式
        vipGroupCategoryIndex: 0, // 课程形式
        vipGroupActivityName: null, // 活动文案
        vipGroupActivityIndex: 0, // 活动文案
        teacherSchoolName: null, // 线下课地址
        teacherSchoolIndex: 0, // 线下课地址
        giveTeachModeName: null, // 赠课类型
      },
      other: {
        onlineSalary: null, // 线上课课酬结算方式
        offlineSalary: null, // 线下课课酬结算方式
        giveNum: 0, // 赠送课时
      },
      scheduleList: [], // 课时安排
      timeTable: [], // 生成的课表
      onSubmitStatus: true, // 点击
      checkboxSelect: [],
      checkboxSelectIds: [],
      checkboxSelectList: [], //选中学生列表
      checkboxSelectDataList: [],
      loading: false,
      finished: false,
      params: {
        search: null,
        page: 1,
        rows: 20,
      },
      dataShow: true, // 是否有数据
      dataList: [],
    };
  },
  async mounted() {
  },
  watch: {
    'form.singleClassMinutes'() {
      this.scheduleList = []
    }
  },
  methods: {
    onCheckStudent() {
      if(!this.form.subjectIdList) {
        this.$toast('请选择课程声部')
        return
      }
      if (!this.form.vipGroupCategoryId) {
        // 判断是否选择了课程形式
        this.$toast("请选择课程形式");
        return;
      }
      this.statusList.studentStatus = true;
    },
    onSelect(name) {
      let sheetForm = this.sheetForm;
      sheetForm.columns = [];
      if (!this.form.vipGroupCategoryId && name == "vipGroupActivity") {
        this.$toast("请选择课程形式");
        return;
      } else if (
        (!this.checkboxSelectDataList ||
          (this.checkboxSelectDataList &&
            this.checkboxSelectDataList.length <= 0)) &&
        name == "vipGroupActivity"
      ) {
        // 判断是否选择了课程形式
        this.$toast("请选择上课学生");
        return;
      }
      sheetForm.sheetStatus = true;
      sheetForm.loading = true;
      sheetForm.currentType = name;
      sheetForm.index = 0;
      let arr = this.loadData[name];
      if (arr && arr.length > 0) {
        sheetForm.columns = arr;
        sheetForm.index = this.formName[name + "Index"];
        sheetForm.loading = false;
      } else {
        this.onLoadingData(name);
      }
      this.sheetForm.status = true;
    },
    formatter(type, val) {
      if (type === "year") {
        return `${val}年`;
      } else if (type === "month") {
        return `${val}月`;
      } else if (type == "day") {
        return `${val}日`;
      }
      return val;
    },
    async onLoadingData() {
      // 加载数据
      let sheetForm = this.sheetForm;
      if (sheetForm.currentType == "subjectList") {
        // 请求声部
        await findSubSubjects().then((res) => {
          let result = res.data;
          if (result.code == 200 && result.data.length > 0) {
            let tempArr = [];
            result.data.forEach((item) => {
              item.value = item.id;
              item.text = item.name;
              tempArr.push(item);
            });
            this.loadData.subjectList = tempArr;
            sheetForm.columns = tempArr;
            sheetForm.loading = false;
          } else {
            this.$toast("暂无科目列表");
            sheetForm.loading = false;
          }
        });
      } else if (sheetForm.currentType == "vipGroupCategory") {
        // 课程形式
        vipGroupCategory().then((res) => {
          let result = res.data;
          if (result.code == 200 && result.data.length > 0) {
            let tempArr = [];
            result.data.forEach((item) => {
              if (item.name == "1v1" || item.name == "1v2") {
                item.value = item.id;
                item.text = item.name;
                tempArr.push(item);
              }
            });
            this.loadData.vipGroupCategory = tempArr;
            sheetForm.columns = tempArr;
            sheetForm.loading = false;
          } else {
            this.$toast("暂无课程形式");
            sheetForm.loading = false;
          }
        });
      } else if (sheetForm.currentType == "vipGroupActivity") {
        // 活动文案
        let studentIds = [];
        if (
          this.checkboxSelectDataList &&
          this.checkboxSelectDataList.length > 0
        ) {
          this.checkboxSelectDataList.forEach((item) => {
            studentIds.push(item.userId);
          });
        }
        getChildrenDayActivity({
          categoryId: this.form.vipGroupCategoryId,
          studentIds: studentIds.join(",")
        }).then((res) => {
          let result = res.data;
          if (result.code == 200 && result.data.length > 0) {
            let tempArr = [];
            let regStr = new RegExp("双十一");
            result.data.forEach((item) => {
              if (!regStr.test(item.name)) {
                item.value = item.id;
                item.text = item.name;
                (item.startTime = item.startTime
                  ? item.startTime.split(" ")[0]
                  : null), // 报名开始时间
                  (item.endTime = item.endTime
                    ? item.endTime.split(" ")[0]
                    : null); // 报名结束时间
                tempArr.push(item);
              }
            });
            this.loadData.vipGroupActivity = tempArr;
            sheetForm.columns = tempArr;
            sheetForm.loading = false;
          } else {
            this.$toast("暂无活动方案");
            sheetForm.loading = false;
          }
        });
      } else if(sheetForm.currentType == "teacherSchool") {
        // 教师教学点
        findVipSchoolByTeacher2({ userId: this.teacherId }).then((res) => {
          let result = res.data;
          if (result.code == 200 && result.data.length > 0) {
            let tempArr = [];
            result.data.forEach((item) => {
              item.value = item.id;
              item.text = item.name;
              tempArr.push(item);
            });
            this.loadData.teacherSchool = tempArr;
            sheetForm.columns = tempArr;
            sheetForm.loading = false;
          } else {
            this.$toast("暂无教学点");
            sheetForm.loading = false;
          }
        });
      }
    },
    onSheetConfirm(value, index) {
      // 上拉弹窗
      let sheetForm = this.sheetForm,
        form = this.form,
        formName = this.formName,
        loadData = this.loadData;
      if (sheetForm.currentType == "subjectList") {
        // 科目名称赋值
        form.subjectIdList = value.value;
        formName.subjectListName = value.text;
        formName.subjectListIndex = index;
        loadData.subjectListSelect = value;

        // 重置上课学生
        this.dataList = []
        this.params.search = null
        this.loading = false
        this.finished = false
        this.dataShow = true
        this.params.page = 1
        this.checkboxSelect = [];
        this.checkboxSelectIds = [];
        this.checkboxSelectList = []; //选中学生列表
        this.checkboxSelectDataList = [];
      } else if(sheetForm.currentType == "vipGroupCategory") {
        form.vipGroupCategoryId = value.value;
        formName.vipGroupCategoryName = value.text;
        if(value.studentNum == 1){
          this.activityCourseType = 'vip1'
        }else if(value.studentNum == 2){
          this.activityCourseType = 'vip2'
        }
        formName.vipGroupCategoryIndex = index;
        loadData.vipGroupCategorySelect = value;
        form.studentNum = value.studentNum; // 每班人数
        // form.singleClassMinutes = value.singleClassMinutes // 每课时长
        form.onlineClassesUnitPrice = Math.ceil(value.onlineClassesUnitPrice);
        form.offlineClassesUnitPrice = Math.ceil(value.offlineClassesUnitPrice);

        // 每课时长赋值
        form.singleClassMinutes = null;
        loadData.classTimer = [];
        let tempSingle = value.singleClassMinutes.split(",");
        form.singleClassMinutes = tempSingle.length > 0 ? tempSingle[0] : null
        tempSingle.forEach((item) => {
          this.loadData.classTimer.push({
            name: item,
            value: item,
          });
        });

        // 重置上课学生
        this.dataList = []
        this.params.search = null
        this.loading = false
        this.finished = false
        this.dataShow = true
        this.params.page = 1
        this.checkboxSelect = [];
        this.checkboxSelectIds = [];
        this.checkboxSelectList = []; //选中学生列表
        this.checkboxSelectDataList = [];

        // 重置活动文案
        form.vipGroupActivityId = null;
        formName.vipGroupActivityName = null;
        formName.vipGroupActivityIndex = 0;
        loadData.vipGroupActivity = [];
        loadData.vipGroupActivitySelect = [];

        this.scheduleList = []
        this.timeTable = []
      } else if (sheetForm.currentType == "vipGroupActivity") {
        // 活动方案赋值
        // 重置线上课，线下课次数
        if (form.vipGroupActivityId != value.value) {
          form.offlineClassesNums = null;
          form.onlineClassesNums = null;
        }
        form.vipGroupActivityId = value.value;
        formName.vipGroupActivityName = value.text;
        formName.vipGroupActivityIndex = index;
        if(value.maxCourseNum <= 0) {
          value.maxCourseNum = 0
        }
        loadData.vipGroupActivitySelect = value;

        // 换活动之后单价重置
        form.onlineClassesUnitPrice = Math.ceil(
          loadData.vipGroupCategorySelect.onlineClassesUnitPrice
        );
        form.offlineClassesUnitPrice = Math.ceil(
          loadData.vipGroupCategorySelect.offlineClassesUnitPrice
        );

        this.onCalcClassTimes(value); // 计算时间等.........
        // this.getCalcClass(); // 课酬计算
        this.setTimeTable(); // 重新排课

        // 时间安排
        // form.registrationStartTime = value.startTime
        // form.coursesExpireDate = value.endTime
      } else if (sheetForm.currentType == "teacherSchool") {
        // 线下课地址
        form.teacherSchoolId = value.value;
        formName.teacherSchoolName = value.text;
        formName.teacherSchoolIndex = index;
      }

      sheetForm.sheetStatus = false;
    },
    onClassKeyUp(type) {
      // 线上课&线下课修改时
      if (type == "offLine" && this.form.offlineClassesNums <= 0) {
        this.form.teacherSchoolId = null;
        this.formName.teacherSchoolName = null;
        this.formName.teacherSchoolIndex = 0;
      }
      let vas = this.loadData.vipGroupActivitySelect;
      this.onCalcClassTimes(vas);
      // this.getCalcClass();
      this.setTimeTable();
    },
    onCalcClassTimes(vas) {
      // 计算课时总数
      let form = this.form,
        other = this.other,
        statusList = this.statusList;
      let totalCount =
        Number(form.onlineClassesNums) + Number(form.offlineClassesNums);

      // ...
      if (vas.salarySettlementJson) {
        let obj = JSON.parse(vas.salarySettlementJson);
        if (obj && obj.onlineSalarySettlement) {
          // 有线上课
          statusList.hasOnline = true;
        } else {
          statusList.hasOnline = false;
        }
        if (obj && obj.offlineSalarySettlement) {
          // 有线下课
          statusList.hasOffline = true;
        } else {
          statusList.hasOffline = false;
        }
      }
      if (vas.type == "GIVE_CLASS") {
        // 买赠活动
        this.statusList.teachOnOrOff = true; // 显示赠课
        if (totalCount >= Number(vas.attribute1)) {
          form.totalClassTime = totalCount + "+" + vas.attribute2;
          other.giveNum = vas.attribute2;
        } else {
          form.totalClassTime = totalCount;
          other.giveNum = 0;
        }
      } else {
        // 折扣活动
        form.totalClassTime = totalCount;
        other.giveNum = 0;
        this.statusList.teachOnOrOff = false; // 隐藏赠课
      }
    },
    onModeSelect(value) {
      // 赠课确认
      this.form.giveTeachMode = value.value;
      this.formName.giveTeachModeName = value.name;
      this.statusList.giveTeachModeStatus = false;
      // this.getCalcClass();
    },
    onClickSingleClass() {
      if (!this.formName.vipGroupCategoryName) {
        this.$toast("请选择课程形式");
        return;
      }
      this.statusList.classTimerStatus = true;
    },
    onClassTimerSelect(value) {
      // 每课时长设置
      if(this.form.singleClassMinutes != value.value) {
        this.timeTable = [] // 生成的课表
        this.scheduleList = []
      }
      this.form.singleClassMinutes = value.value;
      this.statusList.classTimerStatus = false;
      // this.getCalcClass();
    },
    onCurrentConfirm(value) {
      // 排课开始时间
      let selectDate = new Date(value);
      let tempMonth =
        selectDate.getMonth() + 1 >= 10
          ? selectDate.getMonth() + 1
          : "0" + (selectDate.getMonth() + 1);
      let tempDay =
        selectDate.getDate() >= 10
          ? selectDate.getDate()
          : "0" + selectDate.getDate();
      this.form.courseStart =
        selectDate.getFullYear() + "-" + tempMonth + "-" + tempDay;
      this.dataForm.status = false;
    },
    onEnlistConfirm(value) {
      // 报名开始/结束时间
      let selectDate = new Date(value);
      let tempMonth =
        selectDate.getMonth() + 1 >= 10
          ? selectDate.getMonth() + 1
          : "0" + (selectDate.getMonth() + 1);
      let tempDay =
        selectDate.getDate() >= 10
          ? selectDate.getDate()
          : "0" + selectDate.getDate();
      let enlistForm = this.enlistForm;
      let form = this.form;
      if (enlistForm.updateStatus == "start") {
        form.registrationStartTime =
          selectDate.getFullYear() + "-" + tempMonth + "-" + tempDay;
        if (form.coursesExpireDate) {
          let temps = new Date(
            form.registrationStartTime.replace(/-/gi, "/")
          ).getTime();
          let tempe = new Date(
            form.coursesExpireDate.replace(/-/gi, "/")
          ).getTime();
          // 如果开始时间大于结束时间，结束时间制空
          if (temps > tempe) {
            form.coursesExpireDate = null;
          }
        }
      } else if (enlistForm.updateStatus == "end") {
        form.coursesExpireDate =
          selectDate.getFullYear() + "-" + tempMonth + "-" + tempDay;
      }
      enlistForm.status = false;
    },
    onEnListShow(type, value) {
      // 报名开始/截止时间
      let enlistForm = this.enlistForm;
      if (type == "end") {
        if (this.form.registrationStartTime) {
          enlistForm.minDate = new Date(
            this.form.registrationStartTime.replace(/-/gi, "/")
          );
        } else {
          enlistForm.minDate = new Date();
        }
      } else if (type == "start") {
        // 开始时默认为当前时间
        enlistForm.minDate = new Date();
      }
      if (value) {
        enlistForm.currentDate = new Date(value.replace(/-/gi, "/"));
      } else {
        enlistForm.currentDate = new Date();
      }
      enlistForm.updateStatus = type;
      enlistForm.status = true;
    },
    onCourseShedule() {
      // 课时安排
      if (!this.form.singleClassMinutes) {
        this.$toast("请选每课时长");
        return;
      }
      if (this.other.giveNum > 0 && !this.form.giveTeachMode) {
        this.$toast("请选择赠课类型");
        return;
      }
      if (!this.form.courseStart) {
        this.$toast("请选择排课开始时间");
        return;
      }
      this.courseForm.teachingStatus = true;
    },
    onScheduleRemove(item) {
      // 删除课程安排
      let index = this.scheduleList.indexOf(item);
      if (index !== -1) {
        this.scheduleList.splice(index, 1);
      }
    },
    onTeachinConfirm(value) {
      // 添加课程
      let scheduleList = this.scheduleList;
      let startTime =
        (value[2] >= 10 ? value[2] : "0" + value[2]) +
        ":" +
        value[3].split("分")[0];
      let endTime = this.MinutesTest(
        value[2],
        value[3],
        this.form.singleClassMinutes
      );

      let isAdd = true;
      scheduleList.forEach((item) => {
        let isStartTime = this.timeIsrange(startTime, endTime, item.startTime);
        let isEndTime = this.timeIsrange(startTime, endTime, item.endTime);
        if (isAdd) {
          //
          if (value[1] == item.weekStr) {
            if (isStartTime || isEndTime) {
              isAdd = false;
            } else {
              isAdd = true;
            }
          } else if (value[1] != item.weekStr) {
            isAdd = true;
          }
        }
      });

      // 判断结束时间
      const endTime1 = endTime ? Number(endTime.split(":")[0]) : 0
      const endTime2 = endTime ? Number(endTime.split(":")[1]) : 0
      if(endTime1 >= 21 && endTime2 > 0) {
          this.$toast("课程安排结束时间超过21:00");
          return;
      }

      if (isAdd) {
        // 判断时间范围是否有重复
        scheduleList.push({
          type: value[0], // 线上还是线下
          weekStr: value[1],
          weekIndex: this.getWeek(value[1]),
          startTime: startTime,
          endTime: endTime,
          id: Date.now(),
        });

        this.courseForm.teachingStatus = false;

        this.setTimeTable();
      } else {
        this.$toast("该时间段已排课请重选时间");
        return;
      }
    },
    onShowTimeTable() {
      // 显示排课列表
      if (!this.checkCourseList()) {
        return;
      }
      this.statusList.classTime = true;
      this.setTimeTable();
    },
    setTimeTable() {
      if (!this.checkCourseList(false)) {
        return;
      }
      // return
      // 重置排课列表
      this.timeTable = [];

      let form = this.form,
        scheduleList = this.scheduleList;

      // if(!form.courseStart) {
      //     this.$toast('请选择排课开始时间')
      //     return
      // }
      // 拿到线上课数与线下课数 以及
      let online = parseInt(
        form.onlineClassesNums ? form.onlineClassesNums : 0
      );
      let offline = parseInt(
        form.offlineClassesNums ? form.offlineClassesNums : 0
      );
      let giveNum = parseInt(this.other.giveNum);

      let giveClassType = form.giveTeachMode;
      if (giveClassType == "ONLINE") {
        // 线上
        online += giveNum;
      } else if (giveClassType == "OFFLINE") {
        offline += giveNum;
      }
      // 判断是否有课程安排
      if (scheduleList.length <= 0) {
        return;
      }
      let totalCount = Number(online) + Number(offline);
      let tempCourseStart = form.courseStart.replace(/-/gi, "/");
      let dateOperation = new Date(tempCourseStart);
      let forMark = 0;
      while (totalCount && totalCount > 0) {
        for (let i = 0; i < scheduleList.length; i++) {
          // console.log(totalCount, scheduleList)
          if (online == 0 && offline == 0) break;
          let num = scheduleList[i].weekIndex - dateOperation.getDay();
          // 如果是同一天一个周期会出现排课都排到一天
          if (forMark > 0 && num == 0 && i == 0) {
            num = num + 7;
          }
          if (num < 0) {
            // 如果为负数则为下周
            num = num + 7;
          }
          let dataStr = this.getThinkDate(dateOperation, num);

          // 判断是否大于当前时间
          let nowGetTime = new Date().getTime();
          let courseTime = new Date(
            dataStr.replace(/-/gi, "/") +
              " " +
              scheduleList[i].startTime +
              ":00"
          ).getTime();
          if (nowGetTime < courseTime) {
            let tempArr = {
              classDate: dataStr,
              startClassTimeStr: scheduleList[i].startTime,
              endClassTimeStr: scheduleList[i].endTime,
            };
            // console.log(scheduleList[i].type, online, offline)
            if (scheduleList[i].type == "线上" && online > 0) {
              tempArr.teachMode = "ONLINE";
              this.timeTable.push(tempArr);
              online--;

              totalCount--;
            } else if (scheduleList[i].type == "线下" && offline > 0) {
              tempArr.teachMode = "OFFLINE";
              this.timeTable.push(tempArr);
              offline--;

              totalCount--;
            }
          }
        }
        // 加一周
        if (scheduleList.length == 1) {
          dateOperation.setDate(dateOperation.getDate() + 7);
        } else if (
          scheduleList.every((item) => item.weekStr === scheduleList[0].weekStr)
        ) {
          // 标记循环次数(标记判断课程安排是不是同一天)
          forMark++;
        }
      }

      this.timeTable.sort((a, b) => {
        let aStr = dayjs(
          dayjs(a.classDate).format("YYYY-MM-DD") +
            " " +
            a.startClassTimeStr +
            ":00"
        ).valueOf();
        let bStr = dayjs(
          dayjs(b.classDate).format("YYYY-MM-DD") +
            " " +
            b.startClassTimeStr +
            ":00"
        ).valueOf();
        return aStr - bStr;
      });
    },
    onGiveMode() {
      // 赠送课改变时
      this.statusList.giveTeachModeStatus = true;
      // this.getCalcClass();
    },
    getCalcClass() {
      // 计算课酬
      let loadData = this.loadData;
      let form = this.form;
      let vas = loadData.vipGroupActivitySelect, // 活动
        // vcs = loadData.vipGroupCategorySelect, // 课程形式
        tc = loadData.teacherCategory, // 老师基本信息
        oncn = form.onlineClassesNums ? form.onlineClassesNums : 0, // 线上课次数
        offcn = form.offlineClassesNums ? form.offlineClassesNums : 0, // 线下课次数
        giveNum = parseInt(this.other.giveNum),
        giveTeachMode = form.giveTeachMode; // 线下或线下
      // 优惠活动
      // ...
      if (vas.salarySettlementJson) {
        let obj = JSON.parse(vas.salarySettlementJson);
        // 获取每课时长
        // 每45Min计算一些课酬
        // let b = form.singleClassMinutes ? (form.singleClassMinutes / 45) : 0
        let tempPrice = 0;
        if (Number(oncn) + Number(offcn) > 0) {
          let countPrice =
            oncn * form.onlineClassesUnitPrice +
            offcn * form.offlineClassesUnitPrice;
          if (giveNum > 0 && !giveTeachMode) {
            countPrice = 0;
          }
          tempPrice =
            (countPrice * form.studentNum) /
            (Number(oncn) + Number(offcn) + Number(giveNum));
          if (vas.type == "DISCOUNT") {
            tempPrice =
              (tempPrice * (vas.attribute1 ? Number(vas.attribute1) : 100)) /
              100;
          }
        }
        // 课程按课来计算
        if (obj && obj.onlineSalarySettlement) {
          let onss = obj.onlineSalarySettlement;
          // 有线上课
          if (onss.salarySettlementType == "TEACHER_DEFAULT") {
            form.onlineTeacherSalary = Math.round(tc.offlineClassesSalary); // 线上课酬
          } else if (onss.salarySettlementType == "RATIO_DISCOUNT") {
            // 老师课酬的折扣 如果有则不打折
            // form.onlineTeacherSalary = Math.round(vcs.onlineClassesUnitPrice * (onss.settlementValue ? onss.settlementValue : 100) / 100)

            form.onlineTeacherSalary = Math.round(
              tempPrice
                ? (tempPrice *
                    (onss.settlementValue ? onss.settlementValue : 100)) /
                    100
                : 0
            );
          } else if (onss.salarySettlementType == "FIXED_SALARY") {
            form.onlineTeacherSalary = Math.round(onss.settlementValue);
          }
          form.onlineTeacherSalary = Number(form.onlineTeacherSalary);
        } else {
          form.onlineTeacherSalary = Math.round(tc.offlineClassesSalary);
        }

        if (obj && obj.offlineSalarySettlement) {
          let offss = obj.offlineSalarySettlement;
          // 有线下课
          if (offss.salarySettlementType == "TEACHER_DEFAULT") {
            form.offlineTeacherSalary = Math.round(tc.offlineClassesSalary); // 线上课酬
          } else if (offss.salarySettlementType == "RATIO_DISCOUNT") {
            // 老师课酬的折扣
            // form.offlineTeacherSalary = Math.round((vcs.offlineClassesUnitPrice * (offss.settlementValue ? offss.settlementValue : 100) / 100))
            form.offlineTeacherSalary = Math.round(
              tempPrice
                ? (tempPrice *
                    (offss.settlementValue ? offss.settlementValue : 100)) /
                    100
                : 0
            );
          } else if (offss.salarySettlementType == "FIXED_SALARY") {
            form.offlineTeacherSalary = Math.round(offss.settlementValue);
          }
          form.offlineTeacherSalary = Number(form.offlineTeacherSalary);
        } else {
          form.offlineTeacherSalary = Math.round(tc.offlineClassesSalary);
        }
      }

      if (vas.type == "GIVE_CLASS" || vas.type == "BASE_ACTIVITY") {
        form.totalCount = Math.round(
          oncn * form.onlineClassesUnitPrice +
            offcn * form.offlineClassesUnitPrice
        );
      } else if (vas.type == "DISCOUNT") {
        form.totalCount = Math.round(
          ((oncn * form.onlineClassesUnitPrice +
            offcn * form.offlineClassesUnitPrice) *
            Number(vas.attribute1)) /
            100
        );
      }
      form.totalCount = Number(form.totalCount);
    },
    getThinkDate(date, num) {
      let Stamp = date;
      Stamp.setDate(date.getDate() + num); // 获取当前月数的第几天
      var year = Stamp.getFullYear(); //获取完整的年份(4位,1970-????)
      var month = Stamp.getMonth() + 1; //获取当前月份(0-11,0代表1月)
      var mvar = "";
      if (month < 10) {
        mvar = "0" + month;
      } else {
        mvar = month + "";
      }
      var day = Stamp.getDate();
      var dvar = "";
      if (day < 10) {
        dvar = "0" + day;
      } else {
        dvar = day + "";
      }
      return year + "-" + mvar + "-" + dvar;
    },
    // 分钟小时相加减
    MinutesTest(houer, mins, interval) {
      let min = mins.split("分")[0];
      let sdate1 = new Date(1900, 1, 1, houer, min);
      sdate1.setMinutes(sdate1.getMinutes() + parseInt(interval));
      let H = sdate1.getHours();
      let M = sdate1.getMinutes();
      if (H < 10) H = "0" + H;
      if (M < 10) M = "0" + M;
      return H + ":" + M;
    },
    // 判断时间是否在时间段内
    timeIsrange(beginTime, endTime, nowTime) {
      var strb = beginTime.split(":");
      if (strb.length != 2) {
        return false;
      }
      var stre = endTime.split(":");
      if (stre.length != 2) {
        return false;
      }
      var strn = nowTime.split(":");
      if (stre.length != 2) {
        return false;
      }
      var b = new Date();
      var e = new Date();
      var n = new Date();
      b.setHours(strb[0]);
      b.setMinutes(strb[1]);
      e.setHours(stre[0]);
      e.setMinutes(stre[1]);
      n.setHours(strn[0]);
      n.setMinutes(strn[1]);

      if (n.getTime() - b.getTime() >= 0 && n.getTime() - e.getTime() <= 0) {
        // 在时间范围内
        return true;
      } else {
        // 不在时间范围内
        return false;
      }
    },
    getWeek(str) {
      // 获取周几索引值
      let template = {
        '周一': 1,
        '周二': 2,
        '周三': 3,
        '周四': 4,
        '周五': 5,
        '周六': 6,
        '周日': 0,
      };
      return template[str];
    },
    async onSubmit() {
      // 次数限制是否可以继续创建
      let form = this.form;
      let statusList = this.statusList;
      if (!form.subjectIdList) {
        this.$toast("请选择课程声部");
        return false;
      }
      if (!form.vipGroupCategoryId) {
        this.$toast("请选择课程形式");
        return false;
      }
      if (this.checkboxSelectIds.length <= 0) {
        this.$toast("请选择上课学生");
        return;
      }

      if (!form.vipGroupActivityId) {
        this.$toast("请选择活动方案");
        return false;
      }

      if (!form.singleClassMinutes) {
        this.$toast("请选择每课时长");
        return false;
      }

      let onlineClassesStatus =
        !form.onlineClassesNums && form.onlineClassesNums <= 0 ? true : false
      let offlineClassesStatus =
        !form.offlineClassesNums && form.offlineClassesNums <= 0 ? true : false

      if (statusList.hasOnline) {
        if (onlineClassesStatus) {
          this.$toast("请输入线上课次数");
          return false;
        }
      }

      if (statusList.hasOffline) {
        if (offlineClassesStatus) {
          this.$toast("请输入线下课次数");
          return false;
        }

        // 判断是否有线下
        if (form.offlineClassesNums > 0 && !form.teacherSchoolId) {
          this.$toast("请选择线下课地址");
          return false;
        }
      }
      let vipGroupActivitySelect = this.loadData.vipGroupActivitySelect
      if (vipGroupActivitySelect.type == "GIVE_CLASS" && !form.giveTeachMode) {
        this.$toast("请选择赠课类型");
        return false;
      }
      if (this.scheduleList.length <= 0) {
        this.$toast("课时安排不能为空");
        return false;
      }

      if(vipGroupActivitySelect.maxCourseNum > 0) {
        let tempCourseCount = parseInt(form.onlineClassesNums) + parseInt(form.offlineClassesNums);
        if(tempCourseCount != vipGroupActivitySelect.maxCourseNum) {
          this.$toast(`课时总数为${vipGroupActivitySelect.maxCourseNum}节`)
          return
        }
      }
      if(vipGroupActivitySelect.maxCourseNum <= 0) {
        this.$toast('当前选择活动有误，请选择其它活动')
        return
      }

      if (!this.checkCourseList()) {
        return;
      }
      // 排课
      this.setTimeTable();

      if (form.giveTeachMode == "ONLINE") {
        form.onlineClassesNum =
          Number(form.onlineClassesNums) + Number(this.other.giveNum);
        form.offlineClassesNum = Number(form.offlineClassesNums);
      } else {
        form.onlineClassesNum = Number(form.onlineClassesNums);
        form.offlineClassesNum =
          Number(form.offlineClassesNums) + Number(this.other.giveNum);
      }

      form.totalClassTimes =
        Number(form.onlineClassesNums) +
        Number(form.offlineClassesNums) +
        Number(this.other.giveNum);
      form.paymentExpireDate = form.coursesExpireDate;
      form.studentIdList = this.checkboxSelectIds.join(",");

      form.firstStudentId =
        this.checkboxSelectDataList.length > 0
          ? this.checkboxSelectDataList[0].userId
          : null;
      let params = {
        courseSchedules: this.timeTable,
        vipGroupApplyBaseInfo: {
          ...form,
          userId: this.teacherId,
          activityCourseType: this.activityCourseType,
        },
      };

      if (!this.onSubmitStatus) {
        return;
      }
      this.onSubmitStatus = false;
      setLoading(true);
      await createActivityVipGroup(params)
        .then((res) => {
          let result = res.data;
          setLoading(false);
          if (result.code == 200) {
            this.$toast("申请成功");
            setTimeout(() => {
              this.onSubmitStatus = true;
              if (browser().iPhone) {
                window.webkit.messageHandlers.DAYA.postMessage(
                  JSON.stringify({
                    api: "back",
                  })
                );
              } else if (browser().android) {
                DAYA.postMessage(
                  JSON.stringify({
                    api: "back",
                  })
                );
              } else {
                this.$router.push("/business");
              }
            }, 500);
          } else {
            this.onSubmitStatus = true;
            this.$toast(result.msg);
          }
        })
        .catch(() => {
          this.onSubmitStatus = true;
          setLoading(false);
        });
    },
    checkCourseList(isShowToast = true) {
      let form = this.form;
      let scheduleList = this.scheduleList || [];
      let hasOnLine = false; // 是否有线上课时安排
      let hasOffLine = false;
      scheduleList.forEach((item) => {
        if (item.type == "线上") {
          hasOnLine = true;
        }
        if (item.type == "线下") {
          hasOffLine = true;
        }
      });
      let statusList = this.statusList;
      let onlineClassesStatus =
        !form.onlineClassesNums && form.onlineClassesNums <= 0 ? true : false;
      let offlineClassesStatus =
        !form.offlineClassesNums && form.offlineClassesNums <= 0 ? true : false;
      if (statusList.hasOnline) {
        if (onlineClassesStatus) {
          if (isShowToast) {
            this.$toast("请输入线上课次数");
          }
          return false;
        }
        if (!onlineClassesStatus && !hasOnLine && form.onlineClassesNums > 0) {
          if (isShowToast) {
            this.$toast("课时安排缺少线上课类型");
          }
          return false;
        }
      }

      if (statusList.hasOffline) {
        if (offlineClassesStatus) {
          if (isShowToast) {
            this.$toast("请输入线下课次数");
          }
          return false;
        }
        if (
          !offlineClassesStatus &&
          !hasOffLine &&
          form.offlineClassesNums > 0
        ) {
          if (isShowToast) {
            this.$toast("课时安排缺少线下课类型");
          }
          return false;
        }
      }
      return true;
    },
    // 搜索
    onSearch() {
      this.params.page = 1;
      this.dataList = [];
      this.dataShow = true;
      this.loading = true;
      this.finished = false;
      this.getStudent();
    },
    getStudent() {
      let params = this.params;
      getStudents(cleanDeep({
        ...params,
        activityCourseType: this.activityCourseType,
        subjectId:this.form.subjectIdList
      })).then((res) => {
        let result = res.data;
        this.loading = false;
        if (result.code == 200) {
          if(this.dataList.length > 0 && result.data.pageNo == 1) {
              return
          }
          params.page = result.data.pageNo;
          this.dataList = this.dataList.concat(result.data.rows);
          if (params.page >= result.data.totalPage) {
            this.finished = true;
          }
          this.params.page++;
        } else {
          this.finished = true;
        }
        // 判断是否有数据
        if (this.dataList.length <= 0) {
          this.dataShow = false;
        }
      });
    },
    onPopupCancel() {
      // 关闭弹窗
      this.statusList.studentStatus = false;
      // this.params.search = null
      this.checkboxSelect = [];
      this.checkboxSelectList = [];
    },
    onPopupSubmit() {
      const vipGroupCategorySelect = this.loadData.vipGroupCategorySelect;
      if (this.checkboxSelect.length != vipGroupCategorySelect.studentNum) {
        this.$toast(
          `请选择学生${vipGroupCategorySelect.studentNum}名，当前选择${this.checkboxSelect.length}名`
        );
        return;
      }
      this.checkboxSelectDataList = JSON.parse(
        JSON.stringify(this.checkboxSelectList)
      );
      this.checkboxSelectIds = JSON.parse(JSON.stringify(this.checkboxSelect));
      this.checkboxSelect = [];
      this.checkboxSelectList = [];

      this.loadData.vipGroupActivity = [];
      this.formName.vipGroupActivityName = null;
      this.formName.vipGroupCategoryIndex = 0;
      this.form.vipGroupActivityId = null;
      this.statusList.studentStatus = false;
    },
    onCheckboxSelect(value) {
      if (this.checkboxSelect.includes(value.userId.toString())) {
        this.checkboxSelect.forEach((item, index) => {
          if (item == value.userId.toString()) {
            this.checkboxSelect.splice(index, 1);
          }
        });
        this.checkboxSelectList.forEach((item, index) => {
          if (item.userId == value.userId) {
            this.checkboxSelectList.splice(index, 1);
          }
        });
      } else {
        this.checkboxSelect.push(value.userId.toString());
        this.checkboxSelectList.push(value);
      }
      // checkboxSelect = item.userId
    },
    desensitPhone(phone) {
      // 手机号脱敏
      let first = phone.substr(0, 3);
      let last = phone.substr(-4);
      return first + "****" + last;
    },
  }
};
</script>

<style lang="less" scoped>
// .vipCourse {
//     min-height: calc(100vh - 44px - 0.44rem);
// }
@import url("../../../assets/commonLess/variable.less");
.studentContainer {
  /deep/.van-cell__title {
    font-size: 0.16rem;
    color: @mFontColor;
    flex: 1 auto;
  }

  .logo {
    width: 0.35rem;
    height: 0.35rem;
    margin-right: 0.12rem;
    border-radius: 100%;
  }

  .input-cell {
    padding: 0.12rem 0.16rem 0.2rem;

    .van-checkbox {
      justify-content: flex-end;
    }
  }

  /deep/.van-cell__value {
    height: 0.2rem;
  }

  /deep/.van-checkbox__icon .van-icon {
    border-color: @sFontColor;
  }

  /deep/.van-checkbox__icon--checked .van-icon {
    border-color: #01C1B5;
  }

  .van-tag {
    margin-left: 0.08rem;
  }
}

.title-time {
  display: flex;
  align-items: center;
  flex: 1 auto;
  color: #4a4a4a;

  .online {
    color: @tFontColor;
  }

  .week {
    padding-left: 0.4rem;
    padding-right: 0.15rem;
  }
}
.van-row {
  line-height: 0.4rem;
  border-top: 1px solid #edeef0;
  text-align: center;
  font-size: 0.14rem;

  &:first-child {
    border-top: 0;
    background: #edeef0;
    color: #444;
    font-size: 0.15rem;
  }
}
.tableContainer {
  max-height: 2.44rem;
  overflow: auto;

  .van-row {
    color: #444;

    &:first-child {
      border-top: 0;
      background: #fff;
      font-size: 0.14rem;
    }
  }
}
.button-group-popup {
  position: fixed;
  bottom: 0;
  padding: 0.2rem 0;
  width: 100%;
  text-align: center;
  background-color: #ffffff;
  .btn {
    padding: 0 0.45rem;
    line-height: 0.4rem;
    display: inline-block;
    border: 1px solid @mColor;
    border-radius: 1rem;
    color: @mColor;
    background: #fff;
    font-size: 0.18rem;
    &.primary {
      color: #fff;
      background: @mColor;
    }
  }
  .btn + .btn {
    margin-left: 0.1rem;
  }
}

.add-plan {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.2rem 0;
  font-size: 0.16rem;
  color: @tFontColor;

  .van-icon {
    margin-right: 0.05rem;
    font-size: 0.2rem;
  }
}

/deep/.van-cell__title {
  -webkit-box-flex: 0;
  -webkit-flex: none;
  flex: none;
  box-sizing: border-box;
  margin-right: 12px;
  color: #646566;
  text-align: left;
  word-wrap: break-word;
  font-size: 16px;
}
.studentColor {
  color: @mColor !important;
}
.courseStudent {
  .van-cell__value {
    color: #c8c9cc;
    font-size: .16rem;
  }
}
.paddingB80 {
  padding-bottom: .8rem;
}
/deep/.van-field__control {
  font-size: .16rem;
}
/deep/.studentChiose {
  border-radius: 0 0 0px 0px;
  overflow: auto;
}
.vip-title {
   padding: .06rem .14rem .04rem;
    font-size: .14rem;
    color: #808080;
}
</style>