mteacher/src/views/teacher/VIPApply.vue

<template>
	<div class="vipapply">
		<m-header v-if="statusList.headerStatus" />
		<div class="vip-title">课程信息</div>
		<van-cell-group>
			<!-- <van-field v-model="form.name" label="课程班名称" input-align="right" size="large" placeholder="请输入班级名称" /> -->
			<van-field v-model="formName.subjectListName" @click="onGetSheetList('subjectList')" label="科目名称" :readonly="true" input-align="right" is-link size="large" placeholder="请选择" />
			<van-field v-model="formName.vipGroupCategoryName" @click="onGetSheetList('vipGroupCategory')" label="课程形式" :readonly="true" input-align="right" is-link size="large" placeholder="请选择" />
			<van-cell title="上课学生" @click="onCheckStudent" :readonly="true" input-align="right" :is-link="checkboxSelectDataList.length > 0 ? false : true" size="large" :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: .05rem 0;background: #fafbff;">
				<p style="color: #323233;" v-for="(item, index) in checkboxSelectDataList" :key="index">
					{{ item.userName }} - {{ item.phone }}
				</p>
			</div>
			<van-field v-model="formName.vipGroupActivityName" @click="onGetSheetList('vipGroupActivity')" label="活动方案" :readonly="true" input-align="right" is-link size="large" placeholder="请选择" />
			<van-field v-if="statusList.hasOffline" v-model="formName.teacherSchoolName" @click="onGetSheetList('teacherSchool')" label="线下课地址" :readonly="true" input-align="right" is-link size="large" placeholder="请选择" />
		</van-cell-group>
		<div class="vip-title">课时组成</div>
		<van-cell-group>
			<van-field v-model="form.studentNum" label="每班人数" disabled input-align="right" size="large" placeholder="每班预计招收人数" />
			<van-field v-model="form.singleClassMinutes" @click="onClickSingleClass" label="每课时长" :readonly="true" input-align="right" is-link size="large" placeholder="请输入每课时长" />
			<!-- 判断是否选择活动方案 -->
			<van-field v-if="statusList.hasOnline" v-model="form.onlineClassesNums" @keyup="onClassKeyUp" label="线上课" input-align="right" size="large" placeholder="请输入次数" type="number" />
			<van-field v-if="statusList.hasOffline" v-model="form.offlineClassesNums" @keyup="onClassKeyUp" label="线下课" input-align="right" size="large" placeholder="请输入次数" type="number" />

			<!-- <van-field v-if="formName.vipGroupActivityName || statusList.hasOnline" v-model="form.onlineClassesNums" @keyup="onClassKeyUp" label="线上课" input-align="right" size="large" placeholder="请输入次数" type="number" />
            <van-field v-if="formName.vipGroupActivityName || statusList.hasOffline" v-model="form.offlineClassesNums" @keyup="onClassKeyUp" label="线下课" input-align="right" size="large" placeholder="请输入次数" type="number" /> -->

		</van-cell-group>
		<div class="vip-title">时间安排</div>
		<van-cell-group>
			<van-field v-model="form.registrationStartTime" label="报名开始时间" disabled @click="onEnListShow('start', form.registrationStartTime)" input-align="right" is-link size="large" placeholder="请选择" />
			<van-field v-model="form.coursesExpireDate" label="报名截止时间" disabled @click="onEnListShow('end', form.coursesExpireDate)" input-align="right" is-link size="large" placeholder="请选择" />
		</van-cell-group>
		<div class="vip-title">课时安排</div>
		<van-cell-group>
			<van-field v-model="form.totalClassTime" label="课时总数" disabled input-align="right" size="large" placeholder="请输入次数" />
			<van-field v-if="statusList.teachOnOrOff" v-model="formName.giveTeachModeName" @click="onGiveMode" label="赠课类型" :readonly="true" input-align="right" is-link size="large" placeholder="请选择" />
			<van-field @click="dataForm.status = true" v-model="form.courseStart" label="排课开始时间" :readonly="true" input-align="right" is-link size="large" 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 size="large" />
		</van-cell-group>
		<div class="vip-title">课酬设置</div>
		<van-cell-group>
			<van-field v-model="form.onlineClassesUnitPrice" label="线上课单价" type="number" input-align="right" size="large" @keyup="getCalcClass" :disabled="loadData.vipGroupActivitySelect.paymentReadonlyFlag == 0" placeholder="金额(每课时)" v-if="statusList.hasOnline" />
			<van-field v-model="form.offlineClassesUnitPrice" label="线下课单价" type="number" input-align="right" size="large" @keyup="getCalcClass" :disabled="loadData.vipGroupActivitySelect.paymentReadonlyFlag == 0" placeholder="金额(每课时)" v-if="statusList.hasOffline" />
			<van-field v-model="form.onlineTeacherSalary" label="线上课课酬" input-align="right" size="large" :disabled="loadData.vipGroupActivitySelect.salaryReadonlyFlag == 0" placeholder="金额(每课时)" v-if="statusList.hasOnline" type="number" />
			<!--  || other.onlineSalary !='TEACHER_DEFAULT' -->
			<van-field v-model="form.offlineTeacherSalary" label="线下课课酬" input-align="right" size="large" :disabled="loadData.vipGroupActivitySelect.salaryReadonlyFlag == 0" placeholder="金额(每课时)" v-if="statusList.hasOffline" type="number" />
			<!--  || other.offlineSalary !='TEACHER_DEFAULT' -->
			<van-field v-model="form.totalCount" disabled label="课程总价" input-align="right" size="large" placeholder="金额(每课时)" />
		</van-cell-group>

		<div class="button-group">
			<van-button type="primary" @click="onSubmit" round size="large">确认</van-button>
		</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" :max-date="enlistForm.maxDate" :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" :max-date="dataForm.maxDate" :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%' }">
			<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.phone) }}</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" v-else key="data" />
			</div>
			<div class="button-group-popup">
				<span class="btn" @click="onPopupCancel">取消</span>
				<span class="btn primary" @click="onPopupSubmit">确定</span>
			</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>
	/* eslint-disable */
	import MHeader from '@/components/MHeader'
	import {
		browser
	} from '@/common/common'
	import MEmpty from '@/components/MEmpty'
	import {
		findSubSubjects,
		vipGroupCategory,
		findByVipGroupCategory,
		findVipSchoolByTeacher2,
		findByTeacherAndCategory,
		vipGroupApply,
		queryStudentsWithTeacher
	} from '@/api/teacher'
	let minutes = [] // 分钟数
	for (let i = 0; i < 60; i++) {
		let mi = i < 10 ? '0' + i : i
		minutes.push(mi + '分')
	}
	export default {
		name: 'vipapply',
		components: {
			MHeader,
			MEmpty
		},
		data() {
			return {
				dataForm: { // 时间下拉框
					status: false,
					minDate: new Date(),
					maxDate: new Date(2025, 10, 1),
					currentDate: new Date()
				},
				enlistForm: { // 时间下拉框
					updateStatus: '', // 修改哪个状态
					status: false,
					minDate: new Date(),
					maxDate: new Date(2025, 10, 1),
					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
					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, 21, 22, 23],
						className: 'hours',
						defaultIndex: 7
					}, {
						values: minutes,
						className: 'minutes'
					}]
				},
				form: {
					name: null,
					subjectIdList: null,
					vipGroupCategoryId: null,
					vipGroupActivityId: null,
					teacherSchoolId: 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: []
			}
		},
		mounted() {
			let params = this.$route.query
			if (params.Authorization) {
				localStorage.setItem('Authorization', decodeURI(params.Authorization))
				localStorage.setItem('userInfo', decodeURI(params.Authorization))
			}
			document.title = 'VIP课程班申请'
			if (browser().android) {
				this.headerStatus = true
			}
		},
		methods: {
			onCheckStudent() {
				if (!this.form.vipGroupCategoryId) { // 判断是否选择了课程形式
					this.$toast('请选择课程形式')
					return
				}

				// this.checkboxSelectIds = JSON.parse(JSON.stringify(this.checkboxSelectIds))
				// this.checkboxSelectDataList = JSON.parse(JSON.stringify(this.checkboxSelectDataList))
				this.statusList.studentStatus = true
			},
			onGetSheetList(name) { // 获取科目列表
				let sheetForm = this.sheetForm
				sheetForm.columns = []
				if (!this.form.vipGroupCategoryId && name == 'vipGroupActivity') { // 判断是否选择了课程形式
					this.$toast('请选择课程形式')
					return
				}
				sheetForm.sheetStatus = true
				sheetForm.loading = true
				sheetForm.currentType = name
				sheetForm.index = 0
				let arr = this.loadData[name]
				if (arr.length > 0) {
					sheetForm.columns = arr
					sheetForm.index = this.formName[name + 'Index']
					sheetForm.loading = false
				} else {
					this.onLoadingData(name)
				}
			},
			onLoadingData() { // 加载数据
				let sheetForm = this.sheetForm
				if (sheetForm.currentType == 'subjectList') { // 声部列表
					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 => {
								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') { // 活动文案
					findByVipGroupCategory({
						categoryId: this.form.vipGroupCategoryId
					}).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
								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().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
						}
					})
				}
			},
			findTeacherCategory(id) { // 获取教师课酬
				findByTeacherAndCategory({
					categoryId: id
				}).then(res => {
					let result = res.data
					if (result.code == 200) {
						this.loadData.teacherCategory = result.data
					}
				})
			},
			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
				} else if (sheetForm.currentType == 'vipGroupCategory') { // 课程形式赋值
					if (loadData.vipGroupCategorySelect.id != value.id) {
						// 获取教师课酬
						this.findTeacherCategory(value.id)
					}
					form.vipGroupCategoryId = value.value
					formName.vipGroupCategoryName = value.text
					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(",")
					tempSingle.forEach(item => {
						this.loadData.classTimer.push({
							name: item,
							value: item
						})
					})

					// 重置活动文案
					form.vipGroupActivityId = null
					formName.vipGroupActivityName = null
					formName.vipGroupActivityIndex = 0
					loadData.vipGroupActivity = []
					loadData.vipGroupActivitySelect = []
				} 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
					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() { // 线上课&线下课修改时
				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) { // 每课时长设置
				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(/-/ig, '/')).getTime()
						let tempe = new Date(form.coursesExpireDate.replace(/-/ig, '/')).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(/-/ig, '/'))
					} else {
						enlistForm.minDate = new Date()
					}
				} else if (type == 'start') {
					// 开始时默认为当前时间
					enlistForm.minDate = new Date()
				}
				if (value) {
					enlistForm.currentDate = new Date(value.replace(/-/ig, '/'))
				} 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
						}
					}
				})

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

					// scheduleList.sort((a, b) => {
					//     return a.weekStr
					// })


					this.courseForm.teachingStatus = false

					this.setTimeTable()
				} else {
					this.$toast('该时间段已排课请重选时间')
					return
				}
			},
			onShowTimeTable() { // 显示排课列表
				this.statusList.classTime = true
				this.setTimeTable()
			},
			setTimeTable() {
				// 重置排课列表
				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(/-/ig, '/')
				let dateOperation = new Date(tempCourseStart)
				let forMark = 0
				while (totalCount && totalCount > 0) {
					for (let i = 0; i < scheduleList.length; i++) {
						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(/-/ig, '/') + ' ' + scheduleList[i].startTime + ':00').getTime()
						if (nowGetTime < courseTime) {
							let tempArr = {
								'classDate': dataStr,
								'startClassTimeStr': scheduleList[i].startTime,
								"endClassTimeStr": scheduleList[i].endTime
							}
							if (scheduleList[i].type == '线上' && online > 0) {
								tempArr.teachMode = 'ONLINE'
								this.timeTable.push(tempArr)
								online--
							} else if (scheduleList[i].type == '线下' && offline > 0) {
								tempArr.teachMode = 'OFFLINE'
								this.timeTable.push(tempArr)
								offline--
							} else {
								if (online > 0) {
									tempArr.teachMode = 'ONLINE'
									this.timeTable.push(tempArr)
									online--
								} else if (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++
					}
				}
			},
			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)
					}
					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)
					}
				}

				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]
			},
			formatter(type, value) {
				if (type === 'year') {
					return `${value}年`;
				} else if (type === 'month') {
					return `${value}月`
				} else if (type === 'day') {
					return `${value}日`
				}
				return value;
			},
			onSubmit() {
				let form = this.form
				let statusList = this.statusList
				// 排课
				this.setTimeTable()

				// if (!(form.name)) {
				// 	this.$toast('请输入课程班名称')
				// 	return false
				// }
				if (!form.subjectIdList) {
					this.$toast('请选择科目')
					return false
				}
				if (!form.vipGroupCategoryId) {
					this.$toast('请选择课程形式')
					return false
				}
				if (!form.vipGroupActivityId) {
					this.$toast('请选择活动方案')
					return false
				}
				// 判断是否有线下
				if (statusList.hasOffline) {
					if (!form.teacherSchoolId) {
						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.registrationStartTime) {
					this.$toast('请选择报名开始时间')
					return false
				}
				if (!form.coursesExpireDate) {
					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 (statusList.hasOnline) {
					if (!form.onlineClassesUnitPrice) {
						this.$toast('请输入线上课单价')
						return false
					}
					if (!form.onlineTeacherSalary) {
						this.$toast('请输入线上课课酬')
						return false
					}
				}

				if (statusList.hasOffline) {
					if (!form.offlineClassesUnitPrice) {
						this.$toast('请输入线下课单价')
						return false
					}
					if (!form.offlineTeacherSalary) {
						this.$toast('请输入线下课课酬')
						return false
					}
				}

				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(',')
				let params = {
					courseSchedules: this.timeTable,
					vipGroupApplyBaseInfo: form
				}
				if (!this.onSubmitStatus) {
					return
				}
				this.onSubmitStatus = false
				vipGroupApply(params).then(res => {
					let result = res.data
					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)
					}
				})
			},
			// 搜索
			onSearch() {
				this.params.page = 1
				this.dataList = []
				this.dataShow = true
				this.loading = true
				this.finished = false
				this.getStudent()
			},
			getStudent() {
				let params = this.params
				queryStudentsWithTeacher(params).then(res => {
					let result = res.data
					this.loading = false
					if (result.code == 200) {
						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.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>
	@import url("../../assets/commonLess/variable.less");

	.vip-title {
		padding: .06rem 0 .04rem;
		font-size: .12rem;
		color: @mFontColor;
		text-align: center;
	}

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

		.van-icon {
			margin-right: .05rem;
			font-size: .20rem;
		}
	}

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

		.online {
			color: @tFontColor;
		}

		.week {
			padding-left: .4rem;
			padding-right: .15rem;
		}
	}

	/deep/.van-field__label,
	/deep/.van-cell__value {
		flex: 1 auto;
	}

	/deep/.van-field__control:disabled {
		color: #6a6969;
	}

	.button-group {
		margin: .3rem .26rem .2rem;

		.van-button--primary {
			background: @mColor;
			font-size: .18rem;
		}
	}

	.van-row {
		line-height: .4rem;
		border-top: 1px solid #edeef0;
		text-align: center;
		font-size: .14rem;

		&:first-child {
			border-top: 0;
			background: #edeef0;
			color: #444;
			font-size: .15rem;
		}
	}

	.tableContainer {
		max-height: 2.44rem;
		overflow: auto;

		.van-row {
			color: #444;

			&:first-child {
				border-top: 0;
				background: #fff;
				font-size: .14rem;
			}
		}
	}

	.studentContainer {
		/deep/.van-cell__title {
			font-size: .14rem;
			color: @mFontColor;
			flex: 1 auto;
		}

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

		.input-cell {
			padding: .12rem .16rem .2rem;

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

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

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

		/deep/.van-checkbox__icon--checked {
			.van-icon {
				border-color: @orangeColor;
				background: @orangeColor;
			}
		}

		.van-tag {
			margin-left: .08rem;
		}
	}
	.paddingB80 {
	  padding-bottom: .8rem
	}
	.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;
		}
	}
	.studentColor {
		color: #14928A;
	}
</style>