saas_miniprogram/pages/learn/index.vue

<template>
	<view class="learnings">
		<nav-logo title="学习中心"></nav-logo>
		<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="tenantId == '867735392558919680' && oldPageJumpData && oldPageJumpData.goodsNames.length > 0"
				class="oldPageJump">
				<template>
					<h4>因系统升级，您的部分课程：</h4>
					<ul>
						<li v-for="(items, indexs) in oldPageJumpData.goodsNames" :key="indexs">
							{{ items }}
						</li>
					</ul>
					<p>
						需进入旧系统学习，给您带来不便敬请谅解！我们正在加快完成系统升级合并中！
					</p>
				</template>
				<!-- #ifdef H5 -->
				<p style="font-weight:bold;color:#409eff;">
					请问是否现在进入旧系统学习：
				</p>
				<u-button type="primary" @click="goPage(oldPageJumpData.pcUrl,1)">点击进入</u-button>
				<!-- #endif -->
				<!-- #ifdef MP-WEIXIN -->
				<p style="font-weight:bold;color:#409eff;">
					进入浏览器粘贴登录
				</p>
				<u-button type="primary" @click="goPage(oldPageJumpData.pcUrl,2)">点击复制</u-button>
				<!-- #endif -->
			</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="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">
								<view class="learn_progress">
									<view class="progress_up">
										<view class="cou_titles line2">{{ item.goodsName }}</view>
										<view class="classHour">
											<text>{{
                          item.courseNum || item.courseNum == 0
                            ? item.courseNum
                            : "-"
                        }}课程/</text>
											<text>{{
                          item.classHours || item.classHours == 0
                            ? item.classHours
                            : "-"
                        }}学时/</text>
											<text>{{ item.secAllNum + item.examNum || "-" }}节</text>
										</view>
									</view>
								</view>
							</view>
						</view>
						<view class="course_item_info" v-if="item.goodsType !== 6">
							<view v-if="item.orderYear"><text>课程年份：</text><text>{{ item.orderYear }}</text></view>
							<view>
								<text>学习状态：</text>
								<view style="display: inline-block; font-size: 24rpx" v-html="backLearStatusText(item)">
								</view>
							</view>
							<view>
								<text>学习进度：</text>
								<text>
									{{ item.stuAllNum + item.recordNum }}/{{
                    item.secAllNum + item.examNum
                  }}
								</text>
							</view>
							<view v-if="item.educationName != '继续教育'">
								<text>学习服务：</text>
								<text>
									{{
                    $method.formDate(item.serviceStartTime, "yyyy/mm/dd")
                  }}至{{
                    $method.formDate(item.serviceEndTime, "yyyy/mm/dd")
                  }}</text>
								<!-- 关于二建继教提示 -->
								<text class="eb"
									v-if="item.serviceEndTime && $method.GetRTime(item.serviceEndTime) <= 15">
									（剩余{{ $method.GetRTime(item.serviceEndTime) > 0 ? $method.GetRTime(item.serviceEndTime): 0 }}天）
								</text>
							</view>
							<view v-if="item.educationName != '考前培训'">
								<text>班级状态：</text>
								<text>
									{{ classStatusCompt(item, sysTime) }}
								</text>
							</view>
							<view v-if="item.educationName != '考前培训'">
								<text>班级有效：</text>
								<template v-if="item.classEndTime">
									<text>
										{{ $method.formDate(item.classEndTime, "yyyy/mm/dd") }}
									</text>
									<text class="eb"
										v-if="item.classEndTime && $method.GetRTime(item.classEndTime) <= 15">（剩余{{
                      $method.GetRTime(item.classEndTime) > 0
                        ? $method.GetRTime(item.classEndTime)
                        : 0
                    }}天）</text>
								</template>
								<text v-else>——</text>
							</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>
						</view>
						<view class="study_tips">
							<div v-if="
                  (item.erJianErZao || sevenFunc(item)) && !item.classEndTime && !item.classStartTime
                ">
								温馨提示：当前班级正在申请中，正式开班后方可进行学习，请耐心等待
							</div>
							<div v-if="item.officialStatus != 1
							">
								推送失败原因：{{item.pushFailReason || '请先完善个人信息'}}
							</div>
							<!-- <div v-if="
                  (item.periodStatus == 0 || item.periodStatus == -1)
                ">
								<span v-if="$method.GetRTime(item.classEndTime) >= 0">
									温馨提示：当前学习有效期至{{
				  $method.timestampToTime(item.classEndTime)
				}}，超期学时无效，为防审核异常请于{{
				  $method.timestampToTime(item.classEndTime - 864000, false)
				}}
									前完成学习，当前剩余有效学习时间为{{
				  $method.GetRTime(item.classEndTime) < 0
				    ? 0
				    : $method.GetRTime(item.classEndTime)
				}}天。
								</span>
								<span v-else-if="$method.GetRTime(item.serviceEndTime) >= 0">
									温馨提示：当前学习有效期至{{
				  $method.timestampToTime(item.serviceEndTime)
				}}，超期学时无效，为防审核异常请于{{
				  $method.timestampToTime(item.serviceEndTime - 864000, false)
				}}
									前完成学习，当前剩余有效学习时间为{{
				  $method.GetRTime(item.serviceEndTime) < 0
				    ? 0
				    : $method.GetRTime(item.serviceEndTime)
				}}天。
								</span>
							</div> -->
							<!-- 关于二建继教提示 -->
							<div v-if="
							  (item.periodStatus == 0 || item.periodStatus == -1) 
							">
								<span
									v-if="$method.GetRTime(item.classEndTime) >= 0 && $method.GetRTime(item.classEndTime) <= 15 && item.educationName != '考前培训'">
									温馨提示：您当前的课程班级有效期还剩
									{{ $method.GetRTime(item.classEndTime) > 0 ? $method.GetRTime(item.classEndTime): 0  }}
									天,
									请在{{ $method.timestampToTime(item.classEndTime, false) }}
									前完成学习及考试，到期未完成学时将清零，需重新学习。
								</span>
								<span
									v-if="$method.GetRTime(item.serviceEndTime) >= 0 && $method.GetRTime(item.serviceEndTime) <= 15 && item.educationName != '继续教育'">
									温馨提示：您当前的课程学习服务期还剩
									{{ $method.GetRTime(item.serviceEndTime) > 0 ? $method.GetRTime(item.serviceEndTime): 0  }}
									天,
									请在{{ $method.timestampToTime(item.serviceEndTime, false) }}
									前完成学习，避免课程过期作废，无法学习给您带来不便。
								</span>
							</div>
							<div v-if="isTwoEducation(item)">
								<span v-if="item.sevenPushReason === '培训周期时间未到'">
									温馨提示：您{{item.orderYear}}年公路工程专业培训周期还没到，请在{{ $method.timestampToTime(item.sevenPushDate) }}后再进行继教。
								</span>
								<span v-if="item.sevenPushReason === '无相关专业专书'">
									温馨提示：您当前的课程{{item.orderYear}}年公路工程专业，未能匹配到可继教证书，可前往住建证书官网查询。
									<span style="color: #2f9aff; cursor: pointer"
										@click="goPage('https://rcgz.mohurd.gov.cn/Login/NetworkingSearch?type=2', 2) ">
										复制官网链接
									</span>
								</span>
								<span v-if="item.sevenPushReason === '无需2024继续教育'">
									温馨提示：您{{item.orderYear}}年公路工程专业已完成继教，无需重复继教，可前往住建证书官网查询。
									<span style="color: #2f9aff; cursor: pointer"
										@click="copy('https://rcgz.mohurd.gov.cn/Login/NetworkingSearch?type=2', 2)">
										复制官网链接
									</span>
								</span>
							</div>
							<div 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)
                ">
								<span v-if="item.studyCount > 0">温馨提示：班级已过期，如需重新学习，请点击右侧“选班重学”按钮。</span>
								<span v-else>温馨提示：班级已过期，您的重学次数已用完，如有疑问请联系{{
                    eduPhone
                  }}</span>
							</div>
							<div v-if="item.serviceEndTime && item.serviceEndTime < sysTime">
								温馨提示：学习服务期已截至，如有疑问请联系：{{ eduPhone }}
							</div>
							<!-- 关于二建继教通过提示 -->
							<div v-if="item.periodStatus === 1 && isTwoEducation(item)">
								温馨提示：您的学时{{ $method.timestampToTime(item.periodTime) }}机构已审核通过，
								需等待信息中心约15个工作日复审通过后即可获得继续教育学时，届时请前往信息中心官网查看学时及申请证书延期。
								<span style="color: #2f9aff; cursor: pointer;"
									@click="goPage('http://gdzczx.gdcic.net/', 2)"> 复制官网链接 </span>
							</div>
							<!-- 						<div v-if="item.periodStatus === 2 && !sevenFunc(item)">
								温馨提示：您已完成本课程所有学时学习，我校将对学时进行审核，审核及推送时长预估15个工作日，如有疑问请联系：{{
                  eduPhone
                }}，学时查询网址：http://gdzczx.gdcic.net
							</div> -->
							<!-- <div v-if="item.periodStatus === 1 && !sevenFunc(item)">
								温馨提示：您的班级学习初审已通过，待广东省建设信息中心归集学时，归集完成即为完成本次继续教育学习。归集学时需约10-15个工作日，具体以广东省建设执业资格注册服务平台的“继续教育学时查询”公布学时记录为准，学时查询网址：http://gdzczx.gdcic.net
							</div> -->
						</view>
						<!-- 按钮 -->
						<view class="study_btns">
							<view v-if="
                      ((item.profileChangeStatus == 1 &&
                        (item.profileStatus == 1 || item.profileStatus == 2)) ||
                        (item.profileChangeStatus == 2 &&
                          item.profileStatus != -1)) && item.educationName == '考前培训' &&
                          item.projectName == '施工现场专业人员'" class="box_appoint" @click="toInput(item)">
								<view class="exam_word intos">学习资料</view>
							</view>
							<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>
							<view v-else class="exam_btns">
								<view class="box_appoint" v-if="item.openQuestion === 1 && false"
									@click="toBuyQuestionBank(item)">
									<view class="exam_word ones">购买题库</view>
								</view>
								<view class="box_appoint" v-if="item.examApplyGoodsList" @click="appointment(item)">
									<view class="exam_word ones">{{
                    item.subscribeSign == 4 ? "预约记录" : "预约考试"
                  }}</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 v-if="item.periodStatus == 1 && !(item.periodPlush > 0) && 
                        item.educationName == '继续教育' &&
                        item.projectName == '专业技术人员' &&
                        item.businessName == '职称继续教育'" class="box_appoint" @click="toSeeClassHours">
								<view class="exam_word intos">学习凭证</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>
			<!-- 没有学习的课程 -->
			<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.studentNumAll > 0 &&
                          item.studentNumAll == 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>

		<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" v-if="userInfo">
						<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 style="color: #999999; margin-top: 10rpx; font-size: 24rpx">
									<text style="margin-right: 8rpx">预约人数</text>
									{{ appoint.subscribeNum }}/{{ appoint.applyNum }}
								</view>
							</view>
							<view class="course_rights" @click="jumpTest(appoint)">
								<view class="intoStudy" v-if="appointItemIndex.subscribeSign !== 2">预约</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</u-popup>
		<!-- 考前须知 -->
		<u-modal v-model="showTip" title="考前须知" :show-cancel-button="true" @confirm="confirmTip">
			<view class="slot-content ql-editor" style="white-space: pre-wrap">
				<rich-text :nodes="nodesCcontent | formatRichText"></rich-text>
			</view>
		</u-modal>
		<!-- tabbar -->
		<myTabbar :backTopBtn="backTopBtn"></myTabbar>
	</view>
</template>

<script>
	var curTime = new Date().getTime(); // 当前时间的时间戳
	import {
		mapGetters,
		mapActions
	} from "vuex";
	import {
		tenantId
	} from "../../common/request.js"
	import filters from "../../filters/index";
	export default {
		data() {
			return {
				backTopBtn: false,
				leftDays: 0,
				paramC: {
					pageNum: 1,
					pageSize: 5,
				},
				activeItem: {},
				itemIndex: "",
				confirmTimer: null,
				confirmCount: 10,
				confirmChecked: false,
				showUserConfirmInfo: false,
				selectItem: {},
				selectClassModal: false,
				gradeList: [],
				gradeValue: -1,
				sysTime: 0,
				courseLists: [], // 课程列表
				total: 0,
				livingLists: [], // 直播列表
				allLoading: false, // 加载样式
				current: 2,
				appointTestShow: false, //预约考试弹窗
				appointTestList: [],
				appointItemIndex: {}, // 点击了哪项课程
				appoint: {},
				imgwidth: 0,
				imgheight: 0,
				showTip: false,
				nodesCcontent: "",
				oldPageJumpData: null,
				tenantId: tenantId
			};
		},
		filters: {
			liveStatus(liveTime, watchStatus) {
				let value = liveTime * 1000;
				if (curTime < value) {
					// 判断当前时间和直播开始时间
					return " 未开播";
				} else {
					return watchStatus == "live" ? "正在直播中" : "即将开播";
				}
			},
			formatRichText: filters.formatRichText,
		},
		computed: {
			...mapGetters(["userInfo", "other"]),
			allCourse() {
				return this.courseLists.length || this.livingLists.length ? true : false;
			},
			eduPhone() {
				return this.userInfo.eduPhone;
			},
			backLearStatusText() {
				return ({
					periodStatus,
					stuAllNum,
					recordNum,
					secAllNum,
					examNum,
					periodPlush,
					studyStatus,
					educationName
				}) => {
					let text = "";
					let color = "";
					if (periodStatus === -1 || educationName == '考前培训') {
						let index = 0;
						if (studyStatus == 1) {
							index = 0;
						} else if (stuAllNum + recordNum < secAllNum + examNum) {
							index = 1;
						} else {
							index = 2;
						}
						text = ["未开始", "学习中", "已学完"][index];
						color = ["#EB5757", "#498AFE", "#498AFE"][index];
					} else if (educationName != '考前培训') {
						// "学时审核通过" ——> 初审通过
						text = [
							"审核不通过",
							periodPlush > 0 ? "初审完成" : "初审通过",
							"待审核",
							"初审完成",
						][periodStatus];
						color = ["#EB5757", "#F67205", "#F67205", "#F67205"][periodStatus];
					}
					return `<span style='color: ${color}'>${text}</span>`;
				};
			},
			classStatusCompt: function() {
				return function(item, sysTime) {
					var str = "未开班";
					if (item.classEndTime && item.classEndTime < sysTime) {
						str = "已过期";
					} else if (item.classStartTime && item.classStartTime > sysTime) {
						str = "未开始";
					} else if (
						item.gradeId &&
						item.gradeStatus == 1 &&
						item.classStatus === 1
					) {
						str = "已开班";
					} else if (
						item.gradeId &&
						item.gradeStatus == 1 &&
						item.classStatus === 0
					) {
						str = "未开班";
					}
					return str;
				};
			},
			// 二建继教提示判断
			isTwoEducation() {
				return function(item) {
					return (
						item.educationName + item.businessName + item.projectName ===
						"继续教育二级建造师"
					);
				}
			},
		},
		async onLoad(options) {
			uni.hideTabBar();
			this.leftDays = 1668873600 - parseInt(curTime / 1000);
			this.sysTime = +this.$method.timest();
			if (options.skipPort) {
				await this.$method.skipLogin(options.skipPort);
			}
			if (this.$method.isLogin()) {
				!this.userInfo && this.$api.refreshUserInfo();
			}
		},
		onShow() {
			uni.pageScrollTo({
				duration: 0,
				scrollTop: 0, // number number number！
			});
			// #ifdef H5
			this.getCourseoldgoodslist()
			// #endif
			this.getCourseLiveQues();
		},
		onPullDownRefresh() {
			this.getCourseLiveQues();
		},
		onPageScroll(e) {
			if (e.scrollTop > 100) {
				this.backTopBtn = true
			} else {
				this.backTopBtn = false
			}
		},
		onReachBottom() {
			if (this.courseLists.length < this.total) {
				this.paramC.pageNum++;
				this.getCourseList();
			}
		},
		methods: {
			...mapActions(["getUserInfo"]),

			sevenFunc(item) {
				return (
					item.educationName == "继续教育" &&
					item.projectName == "施工现场专业人员"
				);
			},
			goPage(url, type) {
				if (type == 1) {
					window.location.href = url
				}
				if (type == 2) {
					uni.setClipboardData({
						data: url,
						success: function() {
							console.log('复制成功');
						}
					})
				}
			},
			getCourseoldgoodslist() {
				if (!this.$method.isLogin()) {
					return;
				}
				this.$api.courseoldgoodslist().then(res => {
					if (res.data.data && res.data.data.goodsNames.length > 3) {
						res.data.data.goodsNames.splice(3, res.data.data.goodsNames.length, "...");
					}
					this.oldPageJumpData = res.data.data || null
				})
			},
			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;
			},
			toSeeClassHours() {
				uni.navigateTo({
					url: "/pages2/learn/my_learn",
				});
			},
			toChoose() {
				this.$store.state.current = 0
				uni.switchTab({
					url: '/pages/course/index'
				});
			},
			// 查询直播课
			getCourseLiveQues() {
				if (!this.$method.isLogin()) {
					return;
				}
				this.allLoading = true;
				this.paramC.pageNum = 1;
				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.total = res1.total;
							this.courseLists = res1.rows || [];
							const goods = this.courseLists.find(
								(e) => e.subscribeSign == 1 || e.subscribeSign == 3
							);
							if (goods) {
								let {
									goodsName,
									subscribeSign
								} = goods;
								console.log(goods, 'goods')
								let text =
									`您七大员新考【${goodsName}】课程` +
									(subscribeSign == 1 ?
										"已学完，可以预约考试了！" :
										"课程考试未通过，请重新预约考试！");
								uni.showModal({
									title: "提示",
									content: text,
									success: (res) => {
										if (res.confirm) {
											this.appointment(goods);
										}
									},
								});
							}
						}
						if (res2.code == 200) {
							this.livingLists = res2.rows || [];
						} else {
							this.$u.toast(res2.msg);
						}
						this.allLoading = false;
						this.sysTime = +this.$method.timest();
						// }
						uni.hideLoading();
					})
					.catch((err) => {
						uni.hideLoading();
						this.allLoading = false;
					});
			},
			getCourseList() {
				this.$api
					.listUserVideoLive(this.paramC)
					.then((res) => {
						this.courseLists.push(...res.data.rows);
					})
					.finally((e) => {
						uni.hideLoading();
					});
			},
			// 看直播
			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(
					this.other.hostLive +
					"/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: `/pages5/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.externalLinkStatus) {
					this.$method.toLink(item.externalLink);
					return;
				}
				if (item.goodsType == 6) {
					// 进入直播课
					this.toLive(item);
					return;
				}

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

					if (item.learnStatus > 0) {
						//跳转第三方h5
						uni.navigateTo({
							url: `/pages3/polyv/detail?goodsId=${item.goodsId}&orderGoodsId=${item.orderGoodsId}&gradeId=${item.gradeId}&isOther=1`,
						});
						return;
					} else {
						const text = this.eduPhone ? "，有疑问，请联系" + this.eduPhone : "";
						uni.showModal({
							showCancel: false,
							content: "您的学习账号未开通，请稍后再尝试" + text,
						});
						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;
				}
				// learningStatus： 1即刻，2待定，3不在日期内
				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;
				}

				this.$method.checkLock().then(() => {
					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) {
								uni.navigateTo({
									url: `/pages3/polyv/detail?id=''&goodsId=${
                  item.goodsId
                }&orderGoodsId=${item.orderGoodsId}&gradeId=${
                  item.gradeId
                }&periodWaitTime=${item.periodWaitTime ? 1 : ""}&isQ=${
                  item.orderYear ? 1 : ""
                }`,
								});
							} 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}&periodWaitTime=${
                  item.periodWaitTime ? "" : 1
                }&isQ=${item.orderYear ? 1 : ""}`,
								});
							} else {
								uni.showToast({
									icon: "none",
									title: "暂无可观看的视频课程",
								});
							}
						}
					});
				});
			},
			toDetail() {
				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
              }&periodWaitTime=${item.periodWaitTime ? 1 : ""}`,
							});
						} 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}&periodWaitTime=${
                item.periodWaitTime ? "" : 1
              }`,
							});
						} else {
							uni.showToast({
								icon: "none",
								title: "暂无可观看的视频课程",
							});
						}
					}
				});
			},
			toInput(item) {
				this.$navTo.togo("/pages2/verify/input", {
					id: item.goodsId,
					orderGoodsId: item.orderGoodsId,
					gradeId: item.gradeId,
					type: 1,
				});
			},
			/**
			 * @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 {
								const text = this.eduPhone ?
									"，有疑问，请联系" + this.eduPhone :
									"";
								uni.showModal({
									showCancel: false,
									title: "提示",
									content: "开通信息推送不成功，无法进入学习" + text,
								});
								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) {
						if (res.data.rows && res.data.rows.length > 0) {
							res.data.rows = res.data.rows.filter(i => {
								return !(i.studentNumAll > 0 && i.studentNumAll == i.studentUpper)
							})
						}
						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.studentNumAll > 0 && item.studentNumAll == 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.code != 200) {
									this.showUserConfirmInfo = false;
									uni.showToast({
										icon: "none",
										title: res.data.msg,
									});
									return;
								}
								if (res.data.data.pushInfo) {
									uni.showToast({
										icon: "none",
										title: "提交成功",
									});
								} else {
									const text = this.eduPhone ?
										"，有疑问，请联系" + this.eduPhone :
										"";
									uni.showModal({
										showCancel: false,
										title: "提示",
										content: "开通信息推送不成功，无法进入学！" + text,
									});
								}
								this.showUserConfirmInfo = false;
							});
					} else {
						uni.showToast({
							icon: "none",
							title: "请勾选确认个人信息无误",
						});
					}
				} else {
					return;
				}
			},
			cancelUserConfirm() {
				clearInterval(this.confirmTimer);
			},
			call() {
				// #ifdef MP-WEIXIN
				uni.makePhoneCall({
					phoneNumber: "020-87085982", //仅为示例
				});
				// #endif
			},
			closePop() {
				this.appointTestShow = false;
			},
			jumpTest(appoint) {
				this.$api
					.getExamTip()
					.then((res) => {
						this.nodesCcontent = res.data.data.value;
						this.appoint = appoint;
						this.showTip = true;
					})
					.catch(() => {
						this.appoint_an(appoint);
						this.appointTestShow = false;
					});
			},
			confirmTip() {
				this.showTip = false;
				this.appointTestShow = false;
				this.appoint_an(this.appoint);
			},
			toBuyQuestionBank(item) {
				this.$api.goodsDetail(item.questionGoodsId).then((res) => {
					this.$store.commit("setShoppingCartList", {
						shoppingCartList: [{
							relevanceId: item.orderGoodsId,
							...res.data.data
						}, ],
					});
					this.$navTo.togo("/pages2/order/confirm_pay");
				});
			},
			async appointment(item) {
				// #ifdef H5
				const {
					data
				} = await this.$api.courseoldgoodsredirect()
				if (data.data) {
					window.location.href = data.data.h5Url
					return
				}
				// #endif
				if (item.subscribeSign == 4) {
					this.$navTo.togo("/pages2/exam/exam_appointment");
					return;
				}
				this.appointItemIndex = item;
				this.appointTestList = item.examApplyGoodsList;
				this.appointTestShow = true;
				if (item.examApplyGoodsList.length >= 1) {
					// 多个考试预约
					this.appointTestList = item.examApplyGoodsList;
					this.appointTestShow = true;
					return;
				}
				// let appoint_item = item.examApplyGoodsList[0];
				// this.appoint_an(appoint_item);
			},
			appoint_an(appoint) {
				const {
					goodsId,
					gradeId,
					orderGoodsId
				} = this.appointItemIndex;
				var data = {
					goodsId,
					gradeId,
					applyId: appoint.applyId,
					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,
							gradeId,
							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";
	@import "./quill.core";

	.oldPageJump {
		margin-top: 20rpx;
		border: 1rpx solid #eee;
		border-left: none;
		border-right: none;
		padding: 20rpx 24rpx;

		&>h4 {
			margin-bottom: 10rpx;
			font-weight: 400;
		}

		ul {
			padding-left: 0rpx;

			li {
				list-style: none;
				margin-bottom: 10rpx;
				font-weight: bold;
			}
		}

		p {
			margin-bottom: 10rpx;
		}
	}
</style>