zc_saas_h5/pages/learn/index.vue

<template>
    <view class="learnings">
		<u-navbar :is-back="false" title="学习中心" :border-bottom="false"  title-color="#333333" back-icon-color="#ffffff">
			<view class="slot-wrap">
				<image  src="/static/logo2.png" style="width: 178rpx;height: 31rpx;margin-left: 30rpx;"></image>
			</view>
		</u-navbar>
		<u-line color="#D6D6DB" />
		<view class="contents">
			<view class="diatance">
				<image class="clock" src="/static/learn/clock.png" mode=""></image>
				<text>
					一级建造师，距离考试还有
				</text>
				<u-count-down :timestamp="leftDays" :show-days="true" separator="zh" 
					:show-hours="false" :show-minutes="false" :show-seconds="false" font-size="28"
					bg-color="#007AFF" separator-color="#fff" color="#fff" separator-size="28">
				</u-count-down>
			</view>
			<!-- 有学习的课程 -->
			<view v-if="allCourse" class="had_courses">
				<!-- 直播 -->
				<view v-if="livingLists.length" class="lives">
					<view v-for="(live, l_index) in livingLists" :key="l_index" class="live_item" @click="toLiveLook(live)">
						<view class="live_con">
							<view class="live_status">
								<image v-if="bgShow(live.liveStartTime, live.watchStatus)" src="/static/learn/living.png" class="liv_icon"></image>
								<image v-else src="/static/learn/wlive.png" class="liv_icon"></image>
								<text class="status_s">{{ live.liveStartTime | liveStatus(live.watchStatus)}}</text>
								<view class="look_bt" 
									:class="{'living': lookTimeStatus(live.liveStartTime, live.watchStatus) == 1, 
											'futuring': lookTimeStatus(live.liveStartTime, live.watchStatus) == 4,
											'curring': [2,3].includes(lookTimeStatus(live.liveStartTime, live.watchStatus))}"
									>
									<text v-if="lookTimeStatus(live.liveStartTime, live.watchStatus) == 1">点击观看</text>
									<text v-if="lookTimeStatus(live.liveStartTime, live.watchStatus) == 2">即将开播</text>
									<template v-if="lookTimeStatus(live.liveStartTime, live.watchStatus) == 3">
										剩余：
										<u-count-down :timestamp="curTimeTamp(live.liveStartTime)" :show-days="false"
											color="#fff" separator-color="#fff" font-size="24" separator-size="24" bg-color="#FFB102">
										</u-count-down>
									</template>
									<template v-if="lookTimeStatus(live.liveStartTime, live.watchStatus) == 4">
										剩余：
										<u-count-down :timestamp="curTimeTamp(live.liveStartTime)" :show-days="true" separator="zh"
											color="#fff" separator-color="#fff" bg-color="#007AFF"
											:show-hours="false" :show-minutes="false" :show-seconds="false" font-size="24" separator-size="24">
										</u-count-down>
										<u-count-down :timestamp="curTimeTamp(live.liveStartTime)" :show-days="false"
											color="#fff" separator-color="#fff" bg-color="#007AFF"
											font-size="24" separator-size="24">
										</u-count-down>
									</template>
								</view>
							</view>
							<view class="liv_time">
								<text class="timeR">{{ live.liveStartTime | formate('mm月dd日')}}</text>
								<text>{{ live.liveStartTime | formate('hh:mm')}}</text>
							</view>
							<view class="liv_title">{{ live.name }}</view>
						</view>
						<image v-if="bgShow(live.liveStartTime, live.watchStatus)" src="/static/learn/living_bg.png" class="my_bg"></image>
						<image v-else src="/static/learn/wlive_bg.png" class="my_bg"></image>
						
					</view>
				</view>

				<!-- 我的课程 -->
				<view v-if="courseLists.length" class="my_courses">
					<text class="titles">我的课程</text>

					<view v-for="(item, index) in courseLists" :key="index" class="course_item">
						<view class="titlews" @click="studyIn(item.goodsId,item.gradeId,item,index)">
							<view class="cou_titles">{{ item.goodsName }}</view>
							<view v-if="item.serviceStartTime && item.serviceEndTime" class="learn_ranges">
								<image class="l_range" src="/static/learn/learn_range.png"></image>
								学习周期：
								<text class="l_time">{{ item.serviceStartTime | formate('yyyy.mm.dd') }} - {{ item.serviceEndTime | formate('yyyy.mm.dd') }}</text>
							</view>
						</view>

						<!-- 状态 -->
						<view v-if="item.goodsType == 1" class="all_status"  @click="studyIn(item.goodsId,item.gradeId,item,index)">
							<!-- 不在学习服务期 -->
							<template v-if="item.serviceStartTime && (sysTime < item.serviceStartTime || sysTime > item.serviceEndTime)">
								<view class="class-warm" v-if="item.gradeId != 0 && item.gradeStatus == 1">
									<view class="class-warm__text">
										<view class="date">
											不在学习服务期，不可以学习了哦
										</view>
									</view>
								</view>
							</template>

							<template v-else>
								<!-- 班级有效期过了 -->
								<template v-if="item.classEndTime && (item.classEndTime < sysTime) ">
									<view class="class-warm">
										<u-icon class="class-warm__icon" size="30" color="#FF3B30" name="error-circle-fill">
										</u-icon>
										<view class="class-warm__text">
											<view class="date">班级有效期：{{$method.timestampToTime(item.classStartTime,true,true)}} - {{$method.timestampToTime(item.classEndTime,true,true)}}</view>
											<view class="date">班级状态：已过期，有疑问请联系 <text @click="call()">020-87085982</text></view>
										</view>
									</view>
								</template>

								<!-- 班级有效期之前 -->
								<template v-else-if="item.classStartTime && (item.classStartTime > sysTime) ">
									<view class="class-warm">
										<u-icon class="class-warm__icon" size="30" color="#FF3B30" name="error-circle-fill">
										</u-icon>
										<view class="class-warm__text">
											<view class="date">班级有效期：{{$method.timestampToTime(item.classStartTime,true,true)}} -
												{{$method.timestampToTime(item.classEndTime,true,true)}}</view>
											<view class="date">班级状态：未到学习时间，有疑问请联系 <text @click="call()">020-87085982</text></view>
										</view>
									</view>
								</template>

								<!-- 在班级有效期之间或者没有班级有效期 -->
								<template v-else>
									<view class="class-warm"
										v-if="item.gradeId != 0 && item.gradeStatus == 1 && item.classStatus != null">
										<view class="class-warm__text">
											<view class="date">
												班级状态：
												<text v-if="item.classStatus == 1">已开班</text>
												<text v-if="item.classStatus == 0">未开班</text>
											</view>
											<view class="date" v-if="item.classStatus == 0">教务处正在为您开通班级，请耐心等待</view>
											<view class="date"
												v-if="item.classStatus == 1 && item.classStartTime && item.classEndTime">
												班级有效期：{{$method.timestampToTime(item.classStartTime,true,true)}}-{{$method.timestampToTime(item.classEndTime,true,true)}}
											</view>
										</view>
									</view>
									<!-- 学时审核状态不可审核 -->
									<template v-if="item.periodStatus == -1 || item.periodStatus == 2">
										<view class="class-warm" v-if="item.classStatus == 1 || item.classStatus === null">
											<view class="class-warm__text">
												<view class="date">
													<template
														v-if="sysTime >= item.serviceStartTime && sysTime <= item.serviceEndTime">
														学习状态：
														<text v-if="item.stuAllNum+item.recordNum == 0">未学习</text>
														<text
															v-else-if="item.stuAllNum+item.recordNum > 0 && item.stuAllNum+item.recordNum < item.secAllNum+item.examNum">学习中</text>
														<text v-else-if="item.stuAllNum+item.recordNum >= item.secAllNum+item.examNum">已学完</text>
													</template>
													<template v-else>
														<template v-if="item.serviceStartTime">已过学习服务期，不可以学习了哦！</template>
													</template>
												</view>
											</view>
										</view>

									</template>

									<!-- 学时审核状态可以审核 -->
									<template v-if="item.periodStatus != -1">
										<view class="class-warm">
											<view class="class-warm__text">
												<view class="date">
													<text v-if="item.periodStatus == 0">机构审核：学时审核不通过</text>
													<!-- <text v-else-if="item.periodStatus == 2">学时待审核</text> -->
													<text v-else-if="item.periodStatus == 3">学时审核中</text>
													<text v-else-if="item.periodStatus == 1">
														<text v-if="item.periodPlush > 0">学时已上报注册中心</text>
														<text v-else>机构审核：学时审核通过</text>
													</text>
												</view>
											</view>
										</view>

										<view class="class-warm" v-if="item.subscribeId != null && item.periodStatus == 1">
											<view class="class-warm__text">
												<view class="date">
													<view v-if="item.subExamStatus === null">待预约考试</view>
													<view
														v-else-if="item.subExamStatus === 0 &&  sysTime < $method.TimeTotimestamp(
															$method.timestampToTime(item.subApplySiteExamTime, true) +
																' ' +
																item.subApplySiteStartTime
														)">
														待考试，考试时间：
														{{
															$method.timestampToTime(item.subApplySiteExamTime, true) +
															" " +
															item.subApplySiteStartTime
														}}
														-
														{{
															$method.timestampToTime(item.subApplySiteExamTime, true) +
															" " +
															item.subApplySiteEndTime
														}}
													</view>
													<view v-else-if="item.subExamStatus === 0">待出考试结果</view>
													<view v-else-if="item.subExamStatus === 1">
														<text v-if="item.subResult === null">待出考试结果</text>
														<text v-if="item.subResult === 0">考试结果：不通过，需补考</text>
														<text
															v-else-if="item.subResult === 1">考试结果：通过，考试成绩为{{item.subPerformance}}</text>
													</view>
													<view v-else-if="item.subExamStatus === 2">缺考，无成绩，需补考</view>
													<view v-else-if="item.subExamStatus === 3">作弊，无成绩，需补考</view>
													<view v-else-if="item.subExamStatus === 4">替考，无成绩，需补考</view>

												</view>
											</view>
										</view>
									</template>

								</template>

							</template>
						</view>

						<view class="c_downs"  @click="studyIn(item.goodsId,item.gradeId,item,index)">
							<view class="lefts">
								<image class="lefet_img" :src="$method.splitImgHost(item.coverUrl, true)" mode=""></image>
								<view v-if="item.goodsType == 6" class="live_icon">直播</view>
							</view>
							<view class="rights">
								<template
									v-if="item.gradeStatus == 1 && item.status == 1 && (item.serviceEndTime > sysTime) && (item.serviceStartTime < sysTime) 
									&& (item.classEndTime && (item.classEndTime < sysTime)) && (item.periodStatus == 0 || item.periodStatus == -1) 
									&& item.studyCount > 0">
								</template>
								<view v-else class="learn_progress">
									<view class="progress_up">
										<!-- 学习进度 (已做试卷+已做节)/(试卷数+节数) -->
										<view>
											学习进度：{{ item.stuAllNum+item.recordNum }}/{{ item.secAllNum+item.examNum }}
										</view>
										<view class="progress_bar" style="width: 100%;">
											<u-line-progress :showText="false" height="22" active-color="#ff9900" :show-percent="false"
												:percent="((item.stuAllNum+item.recordNum) / (item.secAllNum+item.examNum)) * 100"></u-line-progress>
										</view>
									</view>
								</view>
							</view>
						</view>
						
						<!-- 按钮 -->
						<view class="study_btns">
							<template
								v-if="item.gradeStatus == 1 && item.status == 1 && (item.serviceEndTime > sysTime) && (item.serviceStartTime < sysTime) && 
								(item.classEndTime && (item.classEndTime < sysTime)) && (item.periodStatus == 0 || item.periodStatus == -1) && 
								item.userStudyCount > 0">
								<view class="exam_word ones" @click.stop="selectClass(item,index)">
									选班重学
								</view>
							</template>
							<!-- examApplyGoodsList.length -是判断是否关联指定学员 -->
							<view v-else class="exam_btns">
								<view class="box_appoint" v-if="item.applyStatus === 1 && !( sysTime <= item.serviceStartTime || sysTime >= item.serviceEndTime
									 || (item.classStartTime && sysTime <= item.classStartTime) || (item.classEndTime && sysTime >= item.classEndTime) || 
									 item.learningStatus == 2 || item.classStatus == 0 || (item.learningStatus == 3 && sysTime < item.learningTimeStart) || 
									 !item.examApplyGoodsList.length)"
									 @click="appointment(item,appoint)">
									<view class="exam_word ones">预约考试</view>
								</view>
								<view class="box_appoint" v-if="item.beforeStatus === 1 && !( sysTime <= item.serviceStartTime || sysTime >= item.serviceEndTime
									 || (item.classStartTime && sysTime <= item.classStartTime) || (item.classEndTime && sysTime >= item.classEndTime) || 
									 item.learningStatus == 2 || item.classStatus == 0 || (item.learningStatus == 3 && sysTime < item.learningTimeStart))"
									 @click="appBeforeAddress(item.goodsId,item)">
									<view class="exam_word ones">进入刷题</view>
								</view>
							</view>
							<view class="box_appoint" @click="studyIn(item.goodsId,item.gradeId,item,index)">
								<view class="exam_word  intos">进入学习</view>
							</view> 
						</view>

					</view>
				</view>

				<!-- 我的题库 -->
				<!-- <view class="my_courses">
					<text class="titles">我的题库</text>
					<view class="bottoms">
						<navigator hover-class="none" url="/pages2/subject/collect">
							<view class="item collect">
								<view class="text">收藏集<u-icon name="arrow-right"></u-icon></view>
								<image class="img" src="/static/questionBank_collect.png"></image>
							</view>
						</navigator>
						<view class="item list">
							<navigator  hover-class="none" url="/pages2/bank/question_record">
								<view class="list-in">
									<image class="img" src="/static/questionBank_record.png" ></image>
									<view class="text">
										做题记录 <u-icon name="arrow-right"></u-icon>
									</view>
									
								</view>
							</navigator>
							
							<navigator  hover-class="none" url="/pages2/subject/wrong">
								<view class="list-in">
									<image class="img" src="/static/questionBank_wrong.png"></image>
									<view class="text">
										错题集 <u-icon name="arrow-right"></u-icon>
									</view>
								</view>
							</navigator>
						</view>
					</view>

					<template v-if="questionLists.length">
						<view v-for="(item, indexq) in questionLists" :key="indexq" class="course_item">
							<view>
								<view class="cou_titles">{{ item.goodsName }}</view>
								<view v-if="item.serviceStartTime && item.serviceEndTime" class="learn_ranges">
									<image class="l_range" src="/static/learn/learn_range.png"></image>
									学习周期：
									<text class="l_time">{{ item.serviceStartTime | formate('yyyy.mm.dd') }} - {{ item.serviceEndTime | formate('yyyy.mm.dd') }}</text>
								</view>
							</view>
							<view class="c_downs">
								<view class="lefts">
									<image class="lefet_img" :src="$method.splitImgHost(item.coverUrl, true)" mode=""></image>
								</view>
								<view class="rights">
									
									<view class="learn_progress">
										<view class="progress_up">
											<view>
												学习进度：{{item.doNum}}/{{item.totalNum}}
											</view>
											<view class="progress_bar" style="width: 100%;">
												<u-line-progress :show-percent="false" height="22" active-color="#ff9900" :percent="(item.doNum/item.totalNum)*100"></u-line-progress>
											</view>
										</view>
										<view class="progress_down">
											
											<view class="enter_into" @click="studyques(item,index)">进入练习</view>
										</view>

									</view>
								</view>
							</view>
							
						</view>
					</template>
					
				</view> -->
			</view>
			<!-- 没有学习的课程 -->
			<view v-if="!allLoading && !allCourse" class="no_datas">
				<image class="courses" src="/static/learn/no_course.png" mode=""></image>
				<view class="no_learns">您目前没有可学习的课程</view>
				<view class="choose" @click="toChoose()">立即去选购</view>
			</view>
				
		</view>
		<!-- 弹窗 -->
		<u-popup v-model="selectClassModal" @close="gradeValue = -1" mode="bottom" border-radius="40">
			<view class="popup_box">
				<view style="margin-bottom: 20rpx;">
					<view class="line1"></view>
					<view class="grade">选择班级</view>
				</view>
				<u-line color="#D6D6DB" />
				<view>
					<scroll-view scroll-y="true" style="height: 500rpx;">
						<view>
							<u-radio-group v-model="gradeValue" @change="radioGroupChange">
								<view v-for="(item, index) in gradeList" :key="index">
									<view style="display: flex;align-items: center;padding: 20rpx;">
										<view>
											<u-radio shape="circle" :name="index"
												:disabled="item.studentNum > 0 && item.studentNum == item.studentUpper">
												<view :class="item.checked?'white-box blue-box':'white-box'">
													<view>
														<view class="blackTxt">{{item.className}}</view>
														<view class="redTxt" v-if="item.classEndTime">
															有效期至：{{$method.timestampToTime(item.classEndTime,true,true)}}
														</view>
														<view class="redTxt" v-if="item.classEndTime">
															本班还剩{{$method.GetRTime(item.classEndTime)}}天将结束学习</view>
													</view>
												</view>
											</u-radio>
										</view>

									</view>
								</view>
							</u-radio-group>
						</view>
					</scroll-view>
				</view>
				<view class="confrim-btn">
					<view class="okBtn" @click="okPopup()">确定</view>
				</view>
			</view>
		</u-popup>
		<!-- <select-class :selectClassModal.sync="selectClassModal" :gradeList="gradeList" @okPopup="okPopup()" @closeModal="closeModal()"></select-class> -->

		<u-modal v-model="showUserConfirmInfo" @confirm="confirmUserConfirm"  ref="uModal" :async-close="true" 
			@cancel="cancelUserConfirm" :confirm-text="'确认' + (confirmCount > 0 ? '('+confirmCount+')' : '')" 
			:confirm-color="confirmCount > 0 ? '#999' : '#2979ff'" class="confirm-modal" title="实名验证确认" 
			cancel="取消" :show-cancel-button="true">
			<view class="slot-content">
				<view class="content">
					为避免个人信息不正确导致您的学习时长无效，请认真核对以下信息是否正确，如信息有误请取消当前操作，立刻联系020-38946666
					
					<view class="msg-list">
						<view class="item">
							<text class="item__left">姓名：</text>
							<text class="item__right">{{userInfo.realname}}</text>
						</view>
						<view class="item">
							<text class="item__left">手机号：</text>
							<text class="item__right">{{userInfo.telphone}}</text>
						</view>
						<view class="item">
							<text class="item__left">身份号：</text>
							<text class="item__right">{{userInfo.idCard}}</text>
						</view>
						<view class="item">
							<u-checkbox v-model="confirmChecked" :label-disabled="false">确认个人信息无误</u-checkbox>
						</view>
					</view>
				</view>
				
			</view>
		</u-modal>

		<!-- 多个预约考试时的弹窗 -->
    	<u-popup v-model="appointTestShow" mode="bottom" border-radius="40">
			<view class="popuptest_box">
				<view class="check_head">
            	<view class="headers">
					<view class="grade">切换课程</view>
						<u-icon name="close" color="#9C9C9C" size="40" @click="closePop()"></u-icon>
					</view>
				</view>
				<view class="check_con">
					<scroll-view scroll-y="true" style="height: 700rpx;">
						<view class="course_items"  v-for="(appoint, index) in appointTestList" :key="index">
							<view class="course_lefts">
								<view class="course_title">{{ appoint.applyName }}</view>
							</view>
							<view class="course_rights" @click="jumpTest(appointItemIndex, appoint)">
								<view class="intoStudy">预约</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</u-popup>
    </view>
</template>

<script>
var curTime = new Date().getTime() // 当前时间的时间戳
import {mapGetters,mapActions} from 'vuex'
import { WEBVIEW_URL } from '@/common/request.js'
export default {
    data() {
        return {
			leftDays: 0,
			paramC: {
				pageNum: 1,
				pageSize: 50
			},
			activeItem: {},
			itemIndex: '',
			confirmTimer:null,
			confirmCount:10,
			confirmChecked:false,
			showUserConfirmInfo:false,
			selectItem: {},
			selectClassModal: false,
			gradeList: [],
			gradeValue: -1,
			sysTime: 0,
			courseLists: [], // 课程列表
			// questionLists: [], // 题库列表
			// paramQ: {
			// 	pageNum: 1,
			// 	pageSize: 50
			// },
			// queitemIndex:'',
			livingLists: [], // 直播列表
			allLoading: false, // 加载样式
			current: 2,
			appointTestShow: false, //预约考试弹窗
			appointTestList: [],
			appointItemIndex: {}, // 点击了哪项课程
        }
    },
	filters: {
		liveStatus(liveTime, watchStatus) {
			let value = liveTime * 1000
			if (curTime < value) { // 判断当前时间和直播开始时间
				return ' 未开播'
			} else {
				return watchStatus == 'live' ? '正在直播中' : '即将开播'
			}
		}
	},
	computed: {
		...mapGetters(['userInfo']),
		allCourse() {
			return this.courseLists.length || this.livingLists.length ? true : false
		}
	},
	onLoad() {
		// 1668873600 ，2022.11.20的时间戳
		this.leftDays = 1668873600 - parseInt(curTime/1000)
		// this.sysTime = +this.$method.timest()
	},
	async onShow() {
		this.getCourseLiveQues()
		await this.commonSystemTime()
	},
	 onPullDownRefresh() {
		this.getCourseLiveQues()
	},
	methods: {
		...mapActions(['getUserInfo']),
		bgShow(liveTime, watchStatus) {
			let value = liveTime * 1000
			if (curTime > value) { // 判断当前时间和直播开始时间
				return watchStatus == 'live' ? true : false
			}
		},
		lookTimeStatus(liveTime, watchStatus) {
			if (liveTime) {
				let value = new Date(liveTime * 1000)
				var Y = value.getFullYear()
				var M = value.getMonth() + 1 < 10 ? '0' + (value.getMonth() + 1) : value.getMonth() + 1
				var D = value.getDate() < 10 ? '0' + value.getDate() : value.getDate()
				var valZ = Y + '/' + M + '/' + D
				let curZeroTime = new Date(valZ).getTime() // 获取开始直播时间当天的零点时间戳
				if (curTime > value) { // 判断当前时间和直播开始时间
					if (watchStatus == 'live') { // 
						return 1
					} else {
						return 2
					}
				} else {
					if (curZeroTime <= curTime && curTime <= value) { //当天
						return 3
					} else {
						return 4
					}
					
				}
			}
			
		},
		curTimeTamp(liveTime) {
			let min = liveTime - parseInt(curTime / 1000)
			return min
		},
		toChoose() {
			uni.switchTab({
				url:'/pages/course/index'
			})
		},
		// 查询直播课
		getCourseLiveQues() {
			this.allLoading = true
			// this.$api.listUserFreeUnionBuyGoodsList(this.paramQ), // 查询用户拥有免费+自购题库商品 /bank/question/listUserFreeUnionBuyGoodsList
			let arrs = [
				this.$api.listUserVideoLive(this.paramC), // 查询用户拥有视频+直播商品 /goods/listUserVideoLive
				this.$api.getgoodsLiveList({
					pageNum: 1,
					pageSize: 3 // 默认3条
				})
			]
			wx.stopPullDownRefresh()
			Promise.all(arrs).then((res) => {
				// if (res.data.code == 200) {
					const [{ data: res1}, { data: res2}] = res
					if (res1.code == 200) {
						this.courseLists = res1.rows || []
					}
					// if (res2.code == 200) {
					// 	this.questionLists = res2.rows || []
					// }
					if (res2.code == 200) {
						this.livingLists = res2.rows || []
					} else {
						this.$u.toast(res2.msg)
					}
					this.allLoading = false
				// }
				uni.hideLoading()
			}).catch(err => {
				uni.hideLoading()
				this.allLoading = false
			})
		},
		commonSystemTime() {
			return new Promise(resolve => {
				this.$api.commonSystemTime().then(res => {
					this.sysTime = res.data.data;
				})
			})
		},
		// 看直播
		toLiveLook(item) {
			let moduleId = item.moduleId || 0
			let chapterId = item.chapterId || 0
			let sectionId = item.sectionId || item.menuId
			let uuid = new Date().valueOf() + ""
          	// buyCourse 是否购买课程：1是 0否
			let encode = encodeURIComponent(WEBVIEW_URL+'pages/live/index?token='+uni.getStorageSync('token')+'&userInfo='+JSON.stringify(this.userInfo)+'&channelId='
			+item.liveUrl+'&gradeId='+0+'&courseId='+item.courseId+'&goodsId='+item.goodsId+'&orderGoodsId='+item.orderGoodsId+'&sectionId='+sectionId+'&chapterId='
			+chapterId+'&moduleId='+moduleId+'&buyCourse=1'+'&ident='+uuid+'&sectionType=2')
			uni.navigateTo({
				url:`../../pages/webview/index?url=`+encode
			})
		},
		toLive(item) {
			this.$api.courseCourseList({
				pageNum: 1,
				pageSize: 1,
				goodsId: item.goodsId,
				gradeId: 0,
				orderGoodsId: item.orderGoodsId,
			}).then(res => {
				if (res.data.code == 200) {
					if(res.data.total > 1) {
						// uni.navigateTo({
						// 	url:'/pages5/liveDetail/course?orderGoodsId='+item.orderGoodsId+'&goodsId='+item.goodsId+'&gradeId=0'
						// })
						uni.navigateTo({
							url:'/pages3/live/detail?orderGoodsId='+item.orderGoodsId+'&goodsId='+item.goodsId+'&gradeId=0&courseId=""'
						})
					} else if(res.data.total == 1) {
						uni.navigateTo({
							url:'/pages3/live/detail?orderGoodsId='+item.orderGoodsId+'&goodsId='+item.goodsId+'&gradeId=0&courseId='+ res.data.rows[0].courseId
						})
					} else {
						uni.showToast({
							icon:'none',
							title:'暂无可观看的直播课程'
						})
					}
				
				}
			})
		},
		async studyIn(v, i, item, index) {
			if (item.goodsType == 6) { // 进入直播课
				this.toLive(item)
				return
			}

			// 进入视频课
			this.activeItem = item
			if (item.interfaceAccountId > 0) { //学习账号已开通

				if (item.learnStatus == 1) { //跳转第三方h5
					uni.navigateTo({
						url: `/pages3/polyv/detail?goodsId=${item.goodsId}&orderGoodsId=${item.orderGoodsId}&isOther=1`
					})
					return;
				} else {
					uni.showModal({
						showCancel: false,
						content: '您的学习账号未开通，请稍后再尝试，有疑问，请联系020-87085982！'
					});
					return;
				}
				return;
			}
			
			if (item.serviceStartTime && (this.sysTime <= item.serviceStartTime || this.sysTime >= item.serviceEndTime)) {
				uni.showToast({
					icon: 'none',
					title: '不在学习服务期，不能进入学习'
				})
				return;
			}

			if ((item.classStartTime && this.sysTime <= item.classStartTime) || (item.classEndTime && this
					.sysTime >= item.classEndTime)) {
				uni.showToast({
					icon: 'none',
					title: '不在班级有效期，不能进入学习'
				})
				return
			}

			if (item.learningStatus == 2) {
				uni.showToast({
					icon: 'none',
					title: '开放学习时间待定，不能进入学习'
				})
				return
			}

			if (item.classStatus == 0) {
				uni.showToast({
					icon: 'none',
					title: '尚未开班，不能进入学习'
				})
				return
			}
			if (item.learningStatus == 3 && (this.sysTime < item.learningTimeStart)) {
				uni.showToast({
					icon: 'none',
					title: '不在开放学习时间,不能进入学习'
				})
				return;
			}
			uni.showLoading({
				title: '拼命加载中...',
				mask:true,
			})
			var confirmDetail = true;
			if (item.educationName == '继续教育') { 
				if(item.officialName && item.businessName == '二级' && item.projectName == '建造师') { 
					confirmDetail = await this.userConfirmInfoDetail()
				}
			}
			
			if(!confirmDetail) {
				return;
			}

			this.itemIndex = index
			if (item.gradeStatus == 1 && item.status == 1 && (item.serviceEndTime > this.sysTime) && (item
					.classEndTime && (item.classEndTime < this.sysTime)) && (item.periodStatus == 0 || item
					.periodStatus == -1) && item.studyCount > 0) {
				this.selectClass(item, index, 'loading')
				return
			}

			// /course/goodsRebuildStatus查询用户商品重修状态
			let rebuildStatus = await this.courseGoodsRebuildStatus(item.goodsId, item.gradeId)

			if (rebuildStatus == 0) {
				uni.hideLoading()
				this.$navTo.togo('/pages2/learn/details', {
					gradeId: item.gradeId,
					goodsId: item.goodsId,
					orderGoodsId: item.orderGoodsId,
				});
				return;
			}

				// /lock/lockStatus
				this.$api.lockLockStatus({
					action: 'jxjy',
					uuid:this.$method.getUuid()
				}).then(res => {
					if (res.data.code == 200) { //有其他端在操作，不能学习
						uni.showToast({
							icon: 'none',
							title: res.data.msg,
							mask: true,
							duration: 3000
						})
					} else if (res.data.code == 500) { //可以学习
							this.$http({
								url: '/course/courseList',
								method: 'get',
								data: {
									pageNum: 1,
									pageSize: 100,
									goodsId: item.goodsId,
									gradeId: item.gradeId,
									orderGoodsId: item.orderGoodsId,
								},
								noLoading: true
							})
							.then(res => {
								if (res.data.code == 200) {

									if(res.data.total > 1) {
										// this.$navTo.togo(`/pages2/wd/course?id=${v}&gid=${i}&orderGoodsId=${item.orderGoodsId}`);
										uni.navigateTo({
											url: `/pages3/polyv/detail?id=''&goodsId=${item.goodsId}&orderGoodsId=${item.orderGoodsId}&gradeId=${item.gradeId}`
										})
									} else if(res.data.total == 1) {
										uni.navigateTo({
											url: `/pages3/polyv/detail?id=${res.data.rows[0].courseId}&goodsId=${item.goodsId}&orderGoodsId=${item.orderGoodsId}&gradeId=${item.gradeId}`
										})
									} else {
										uni.showToast({
											icon:'none',
											title:'暂无可观看的视频课程'
										})
									}

								}
							});
							return;
					}
				})

		},
		/**
		 * @param {Object} goodsId 商品id
		 * 查询商品重修状态
		 */
		courseGoodsRebuildStatus(goodsId, gradeId) {
			return new Promise(resolve => {
				this.$http({
					url: '/course/goodsRebuildStatus',
					method: 'get',
					data: {
						goodsId: goodsId,
						gradeId: gradeId
					},
					noLoading: true,
					compleLoading: true, // 请求成功是否还要继续显示加载中
				})
				.then(res => {
					resolve(res.data.data)
				})
			})
		},
		userConfirmInfoDetail(){
			return new Promise(resolve => {
				this.$http({
					url: '/user/confirm/info/detail',
					method: 'get',
					data: { orderGoodsId:this.activeItem.orderGoodsId },
					noLoading:true,
				})
				.then(res => {
					if(!res.data.data) {
						clearInterval(this.confirmTimer);
						this.confirmCount = 10;
						this.showUserConfirmInfo = true;
							this.confirmTimer = setInterval(() => {
							if(this.confirmCount > 0) {
								this.confirmCount-- 
							} else {
								clearInterval(this.confirmTimer);
							}
							
						},1000)
					} else {
						if(res.data.data.pushInfo) {
							resolve(true)
						} else {
							uni.showModal({
								showCancel:false,
								title:'提示',
								content:'开通信息推送不成功，无法进入学习，请联系020-87085982！'
							})
							resolve(false)
						}
						
					}
				})
			})
		},
		selectClass(item, index, load) {
			this.itemIndex = index;
			this.selectItem = item;
			this.selectClassModal = true;
			this.goodsGradeList(item.goodsId, load);
		},
		goodsGradeList(id, load) {
			this.$http({
				url: '/grade/grade/list',
				method: 'get',
				data: { goodsId: id },
				noLoading: load ? true : false,
			})
			.then(res => {
				if (res.data.code == 200) {
					this.gradeList = res.data.rows
					if (this.gradeList.length == 0) {
						let item = {
							className: '系统分班',
							gradeId: 0
						}
						this.gradeList.push(item)
					} else {
						let isGradeFull = this.gradeList.every(item => (item.studentNum > 0 && item
							.studentNum == item.studentUpper))
						//所有班级都满了
						if (isGradeFull) {
							let item = {
								className: '系统分班',
								gradeId: 0
							}
							this.gradeList.unshift(item)
						}
					}
				}
			});
		},
		radioGroupChange(e) {
			// console.log(e)
		},
		okPopup() {
			if (this.gradeValue == -1) {
				uni.showToast({
					icon: 'none',
					title: '请选择班级'
				})
				return;
			}
			this.$api.changeGrade({
				goodsId: this.selectItem.goodsId,
				gradeId: this.gradeValue,
				oldGradeId: this.selectItem.gradeId,
				orderGoodsId: this.selectItem.orderGoodsId,
				userId: this.selectItem.userId
			}).then(res => {
				if (res.data.code == 200) {
					if (this.itemIndex !== '') {
						this.refreshByIndex();
					}
					this.selectClassModal = false;
					uni.showToast({
						title: '选班成功'
					})
				} else {
					uni.showToast({
						icon: 'none',
						title: res.data.msg
					})
				}
			})
		},
		/**
		 * 返回刷新之前进入的课程数据
		 */
		refreshByIndex() {
			this.$api.listUserVideoLive({
				pageNum: this.itemIndex + 1,
				pageSize: 1
			}).then(res => {
				if (res.data.code == 200) {
					this.$set(this.courseLists, this.itemIndex, res.data.rows[0])
				}
			});
		},
		confirmUserConfirm() {
			this.$refs.uModal.clearLoading();
			if(this.confirmCount <= 0) {
				if(this.confirmChecked) {
					let infoJson = {
						realname:this.userInfo.realname,
						idCard:this.userInfo.idCard,
						telphone:this.userInfo.telphone
					}
					this.$api.userConfirminfo({
						orderGoodsId:this.activeItem.orderGoodsId,
						infoJson:JSON.stringify(infoJson)
					}).then(res => {
						if(res.data.data.pushInfo) {
							uni.showToast({
								icon:'none',
								title:'提交成功'
							})
						} else {
							uni.showModal({
								showCancel:false,
								title:'提示',
								content:'开通信息推送不成功，无法进入学习，请联系020-87085982！'
							})
						}
						this.showUserConfirmInfo = false;
					})
				} else {
					uni.showToast({
						icon:'none',
						title:'请勾选确认个人信息无误'
					})
				}
			} else {
				return;
			}
		},
		cancelUserConfirm() {
			clearInterval(this.confirmTimer)
		},
		call() {
			uni.makePhoneCall({
				phoneNumber: '020-87085982' //仅为示例
			})
		},
		closePop() {
			this.appointTestShow = false
		},
		jumpTest(item, appoint) {
			this.appoint_an(item, appoint)
			this.appointTestShow = false
		},
		appointment(item, appoint) {
			this.appointItemIndex = item
			if (item.examApplyGoodsList.length > 1) { // 多个考试预约				 
				this.appointTestList = item.examApplyGoodsList
				this.appointTestShow = true
				return
			}
			let appoint_item = item.examApplyGoodsList[0]
			this.appoint_an(item, appoint_item)
		},
		appoint_an(item, appoint) {
			var data = {
				goodsId: item.goodsId,
				gradeId: item.gradeId,
				applyId:appoint.applyId,
				orderGoodsId:item.orderGoodsId
			};
			this.$api.getApplysubscribe(data).then(res => {
				if (res.data.code === 500) {
					uni.showModal({
						showCancel: false,
						content: res.data.msg
					});
				}
				if (res.data.code === 200) {
					this.$navTo.togo('/pages2/appointment/index', {
						goodsId: item.goodsId,
						gradeId: item.gradeId,
						orderGoodsId: item.orderGoodsId,
						applyId:appoint.applyId
					});
				}
			});
		},
		// 进入刷题，调整小程序
		appBeforeAddress(goodsId,item) {
			this.$api.appBeforeAddress({
				orderGoodsId:item.orderGoodsId
			}).then(res => {
				if (res.data.code == 200) {
					uni.navigateToMiniProgram({
						appId: res.data.data.url,
						success(res) {
							// 打开成功
						}
					})
				} else {
					uni.showModal({
						title:'提示',
						content:res.data.msg,
						showCancel:false,
					})
				}
			})
		},
	}
}
</script>

<style>
page {
	background: #eaeef1;
}
</style>
<style lang="scss" scoped>
@import './index.scss';
</style>