|
|
@@ -0,0 +1,1394 @@
|
|
|
+<template>
|
|
|
+ <div class="course_tree">
|
|
|
+ <div v-for="(courseItem, courseIndex) in treeList" :key="courseIndex">
|
|
|
+ <div v-if="courseItem.courseList" class="teacherList_name">
|
|
|
+ <div
|
|
|
+ v-for="tea in courseItem.courseList"
|
|
|
+ :key="tea.courseId"
|
|
|
+ class="names"
|
|
|
+ :class="{ nactive: tea.courseId == courseItem.courseId }"
|
|
|
+ @click="activeFunc(tea.courseId, courseIndex)"
|
|
|
+ >
|
|
|
+ {{ tea.aliasName }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="item__title"
|
|
|
+ @click="getMenuList(courseItem)"
|
|
|
+ v-if="treeList.length != 1"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right': !courseItem.showList,
|
|
|
+ 'el-icon-caret-bottom': courseItem.showList,
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ {{ courseItem.courseName }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="courseItem.showList"
|
|
|
+ :style="{ paddingLeft: treeList.length != 1 ? '12px' : '0' }"
|
|
|
+ >
|
|
|
+ <div class="item" v-for="(menu, index) in courseItem.list" :key="index">
|
|
|
+ <template v-if="menu.type == 1">
|
|
|
+ <div class="item__title" @click="openModule(menu)">
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right': !menu.showList,
|
|
|
+ 'el-icon-caret-bottom': menu.showList,
|
|
|
+ }"
|
|
|
+ ></i>
|
|
|
+ {{ menu.menuName }}
|
|
|
+ </div>
|
|
|
+ <div class="item__content">
|
|
|
+ <div class="bank-chapter" v-if="menu.showList">
|
|
|
+ <div
|
|
|
+ class="bank-chapter__item"
|
|
|
+ v-for="chapter in menu.list"
|
|
|
+ :key="chapter.id"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-if="chapter.type == 1"
|
|
|
+ class="bank-chapter__item__text"
|
|
|
+ @click="openChapter(chapter)"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right': !chapter.showList,
|
|
|
+ 'el-icon-caret-bottom': chapter.showList,
|
|
|
+ }"
|
|
|
+ ></i
|
|
|
+ >{{ chapter.name }}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div
|
|
|
+ class="bank-section"
|
|
|
+ v-if="chapter.showList && chapter.type == 1"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bank-section__item"
|
|
|
+ :class="{
|
|
|
+ active: isActive(section),
|
|
|
+ }"
|
|
|
+ v-for="(section, sectionIndex) in chapter.list"
|
|
|
+ :key="sectionIndex"
|
|
|
+ @click="getResource(section, 1, courseIndex)"
|
|
|
+ >
|
|
|
+ <template v-if="section.type != 2">
|
|
|
+ <template>
|
|
|
+ <div
|
|
|
+ class="note note--blue"
|
|
|
+ v-if="section.sectionType == 1"
|
|
|
+ >
|
|
|
+ 视频
|
|
|
+ </div>
|
|
|
+ <div class="note" v-if="section.sectionType == 2">
|
|
|
+ 直播
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="note note--yellow"
|
|
|
+ v-if="section.sectionType == 3"
|
|
|
+ >
|
|
|
+ 回放
|
|
|
+ </div>
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ section.name }}
|
|
|
+ <div
|
|
|
+ style="font-size: 12px"
|
|
|
+ v-if="section.liveStartTime > nowTime"
|
|
|
+ >
|
|
|
+ <span>{{
|
|
|
+ $tools.timestampToTime(
|
|
|
+ section.liveStartTime,
|
|
|
+ (isDay = false)
|
|
|
+ )
|
|
|
+ }}</span
|
|
|
+ >-
|
|
|
+ <span>{{
|
|
|
+ $tools.timestampToTime(
|
|
|
+ section.liveEndTime,
|
|
|
+ (isDay = false)
|
|
|
+ )
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <div class="lear-state" v-if="isActive(section)">
|
|
|
+ <img src="../../assets/learing.gif" alt="" />
|
|
|
+ </div>
|
|
|
+ <template v-if="section.durationTime > 0">
|
|
|
+ <div class="during">
|
|
|
+ {{ $tools.secondToDate(section.durationTime) }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template>
|
|
|
+ <div class="btn" v-if="section.rebuild > 0">
|
|
|
+ 待重修
|
|
|
+ </div>
|
|
|
+ <template v-else>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="section.learning == 1"
|
|
|
+ >
|
|
|
+ 已学完
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template
|
|
|
+ v-if="
|
|
|
+ section.liveStartTime && section.sectionType == 2
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="live-btn live-btn--blue"
|
|
|
+ v-if="section.liveStartTime > nowTime"
|
|
|
+ >
|
|
|
+ 待开播
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="live-btn live-btn--yellow"
|
|
|
+ v-if="
|
|
|
+ section.liveStartTime <= nowTime &&
|
|
|
+ section.liveEndTime > nowTime
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 直播中
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="live-btn"
|
|
|
+ v-if="section.liveEndTime < nowTime"
|
|
|
+ >
|
|
|
+ 已结束
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template
|
|
|
+ v-if="checkSection(section.sectionId, 'sectionExam')"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="exercises"
|
|
|
+ @click.stop="
|
|
|
+ handelPracticeOrRxam(
|
|
|
+ section,
|
|
|
+ 2,
|
|
|
+ courseItem.courseId
|
|
|
+ )
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 习题
|
|
|
+ <i class="el-icon-arrow-right icons"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="section.type == 2">
|
|
|
+ <template>
|
|
|
+ <div class="test-btn" v-if="section.doType == 1">
|
|
|
+ 练习
|
|
|
+ </div>
|
|
|
+ <div class="test-btn" v-if="section.doType != 1">
|
|
|
+ 考试
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ section.name }}
|
|
|
+ </div>
|
|
|
+ <template>
|
|
|
+ <div class="btn" v-if="section.rebuild > 0">
|
|
|
+ 待重修
|
|
|
+ </div>
|
|
|
+ <template v-else>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="section.learning == 1"
|
|
|
+ >
|
|
|
+ 合格
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="btn btn--red"
|
|
|
+ v-if="section.learning == 0"
|
|
|
+ >
|
|
|
+ 不及格(需重考)
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="section.rebuild > 0"
|
|
|
+ >
|
|
|
+ 待重测
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="chapter.type == 2"
|
|
|
+ class="bank-section__item"
|
|
|
+ @click="getResource(chapter, 3, courseIndex)"
|
|
|
+ >
|
|
|
+ <template>
|
|
|
+ <template>
|
|
|
+ <div class="test-btn" v-if="chapter.doType == 1">
|
|
|
+ 练习
|
|
|
+ </div>
|
|
|
+ <div class="test-btn" v-if="chapter.doType != 1">
|
|
|
+ 考试
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ chapter.name }}
|
|
|
+ </div>
|
|
|
+ <template>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="chapter.learning == 1"
|
|
|
+ >
|
|
|
+ 合格
|
|
|
+ </div>
|
|
|
+ <div class="btn btn--red" v-if="chapter.learning == 0">
|
|
|
+ 不及格(需重考)
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="menu.type == 2">
|
|
|
+ <div class="item__content">
|
|
|
+ <div class="bank-chapter">
|
|
|
+ <div class="bank-chapter__item">
|
|
|
+ <div
|
|
|
+ class="bank-chapter__item__text"
|
|
|
+ @click="openChapter(menu)"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ :class="{
|
|
|
+ 'el-icon-caret-right': !menu.showList,
|
|
|
+ 'el-icon-caret-bottom': menu.showList,
|
|
|
+ }"
|
|
|
+ ></i
|
|
|
+ >{{ menu.menuName }}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="bank-section" v-if="menu.showList">
|
|
|
+ <div
|
|
|
+ class="bank-section__item"
|
|
|
+ :class="{
|
|
|
+ active: isActive(section),
|
|
|
+ }"
|
|
|
+ v-for="(section, sectionIndex) in menu.list"
|
|
|
+ :key="sectionIndex"
|
|
|
+ @click="getResource(section, 1, courseIndex)"
|
|
|
+ >
|
|
|
+ <template v-if="section.type != 2">
|
|
|
+ <template>
|
|
|
+ <div
|
|
|
+ class="note note--blue"
|
|
|
+ v-if="section.sectionType == 1"
|
|
|
+ >
|
|
|
+ 视频
|
|
|
+ </div>
|
|
|
+ <div class="note" v-if="section.sectionType == 2">
|
|
|
+ 直播
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="note note--yellow"
|
|
|
+ v-if="section.sectionType == 3"
|
|
|
+ >
|
|
|
+ 回放
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ section.name }}
|
|
|
+ <div
|
|
|
+ style="font-size: 12px"
|
|
|
+ v-if="section.liveStartTime > nowTime"
|
|
|
+ >
|
|
|
+ <span>{{
|
|
|
+ $tools.timestampToTime(
|
|
|
+ section.liveStartTime,
|
|
|
+ (isDay = false)
|
|
|
+ )
|
|
|
+ }}</span
|
|
|
+ >-
|
|
|
+ <span>{{
|
|
|
+ $tools.timestampToTime(
|
|
|
+ section.liveEndTime,
|
|
|
+ (isDay = false)
|
|
|
+ )
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="lear-state" v-if="isActive(section)">
|
|
|
+ <img src="../../assets/learing.gif" alt="" />
|
|
|
+ </div>
|
|
|
+ <template v-if="section.durationTime > 0">
|
|
|
+ <div class="during">
|
|
|
+ {{ $tools.secondToDate(section.durationTime) }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template>
|
|
|
+ <div class="btn" v-if="section.rebuild > 0">
|
|
|
+ 待重修
|
|
|
+ </div>
|
|
|
+ <template v-else>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="section.learning == 1"
|
|
|
+ >
|
|
|
+ 已学完
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template
|
|
|
+ v-if="
|
|
|
+ section.liveStartTime && section.sectionType == 2
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="live-btn live-btn--blue"
|
|
|
+ v-if="section.liveStartTime > nowTime"
|
|
|
+ >
|
|
|
+ 待开播
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="live-btn live-btn--yellow"
|
|
|
+ v-if="
|
|
|
+ section.liveStartTime <= nowTime &&
|
|
|
+ section.liveEndTime > nowTime
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 直播中
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="live-btn"
|
|
|
+ v-if="section.liveEndTime < nowTime"
|
|
|
+ >
|
|
|
+ 已结束
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template
|
|
|
+ v-if="checkSection(section.sectionId, 'sectionExam')"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="exercises"
|
|
|
+ @click.stop="
|
|
|
+ handelPracticeOrRxam(
|
|
|
+ section,
|
|
|
+ 2,
|
|
|
+ courseItem.courseId
|
|
|
+ )
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 习题
|
|
|
+ <i class="el-icon-arrow-right icons"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="section.type == 2">
|
|
|
+ <template>
|
|
|
+ <div class="test-btn" v-if="section.doType == 1">
|
|
|
+ 练习
|
|
|
+ </div>
|
|
|
+ <div class="test-btn" v-if="section.doType != 1">
|
|
|
+ 考试
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ section.name }}
|
|
|
+ </div>
|
|
|
+ <template>
|
|
|
+ <div class="btn" v-if="section.rebuild > 0">
|
|
|
+ 待重修
|
|
|
+ </div>
|
|
|
+ <template v-else>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="section.learning == 1"
|
|
|
+ >
|
|
|
+ 合格
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="btn btn--red"
|
|
|
+ v-if="section.learning == 0"
|
|
|
+ >
|
|
|
+ 不及格(需重考)
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="btn btn--green"
|
|
|
+ v-if="section.rebuild > 0"
|
|
|
+ >
|
|
|
+ 待重测
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="menu.type == 3">
|
|
|
+ <div class="item__content">
|
|
|
+ <div class="bank-section">
|
|
|
+ <div
|
|
|
+ class="bank-section__item"
|
|
|
+ :class="{
|
|
|
+ active: isActive(menu),
|
|
|
+ }"
|
|
|
+ @click="getResource(menu, 1, courseIndex)"
|
|
|
+ >
|
|
|
+ <template>
|
|
|
+ <div class="note note--blue" v-if="menu.sectionType == 1">
|
|
|
+ 视频
|
|
|
+ </div>
|
|
|
+ <div class="note" v-if="menu.sectionType == 2">直播</div>
|
|
|
+ <div class="note note--yellow" v-if="menu.sectionType == 3">
|
|
|
+ 回放
|
|
|
+ </div>
|
|
|
+ <div class="bank-section__item__text">
|
|
|
+ {{ menu.name }}
|
|
|
+ <div
|
|
|
+ style="font-size: 12px"
|
|
|
+ v-if="menu.liveStartTime > nowTime"
|
|
|
+ >
|
|
|
+ <span>{{
|
|
|
+ $tools.timestampToTime(
|
|
|
+ menu.liveStartTime,
|
|
|
+ (isDay = false)
|
|
|
+ )
|
|
|
+ }}</span
|
|
|
+ >-
|
|
|
+ <span>{{
|
|
|
+ $tools.timestampToTime(
|
|
|
+ menu.liveEndTime,
|
|
|
+ (isDay = false)
|
|
|
+ )
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="lear-state" v-if="isActive(menu)">
|
|
|
+ <img src="../../assets/learing.gif" alt="" />
|
|
|
+ </div>
|
|
|
+ <template v-if="menu.durationTime > 0">
|
|
|
+ <div class="during">
|
|
|
+ {{ $tools.secondToDate(menu.durationTime) }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template>
|
|
|
+ <div class="btn" v-if="menu.rebuild > 0">待重修</div>
|
|
|
+ <template v-else>
|
|
|
+ <div class="btn btn--green" v-if="menu.learning == 1">
|
|
|
+ 已学完
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template v-if="menu.liveStartTime && menu.sectionType == 2">
|
|
|
+ <div
|
|
|
+ class="live-btn live-btn--blue"
|
|
|
+ v-if="menu.liveStartTime > nowTime"
|
|
|
+ >
|
|
|
+ 待开播
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="live-btn live-btn--yellow"
|
|
|
+ v-if="
|
|
|
+ menu.liveStartTime <= nowTime &&
|
|
|
+ menu.liveEndTime > nowTime
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 直播中
|
|
|
+ </div>
|
|
|
+ <div class="live-btn" v-if="menu.liveEndTime < nowTime">
|
|
|
+ 已结束
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="checkSection(menu.menuId, 'sectionExamList')">
|
|
|
+ <div
|
|
|
+ class="exercises"
|
|
|
+ @click.stop="
|
|
|
+ handelPracticeOrRxam(menu, 3, courseItem.courseId)
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 习题
|
|
|
+ <i class="el-icon-arrow-right icons"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog
|
|
|
+ title="温馨提示"
|
|
|
+ width="380px"
|
|
|
+ center
|
|
|
+ class="tip-dialog"
|
|
|
+ :visible.sync="dialogPalyVisible"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :close-on-press-escape="false"
|
|
|
+ :show-close="false"
|
|
|
+ >
|
|
|
+ <template v-if="!isLastVideo">
|
|
|
+ <p>当前视频已学完,继续学习下一个视频?</p>
|
|
|
+ <div class="btn1">
|
|
|
+ <el-button type="info" plain round @click="dialogPalyVisible = false"
|
|
|
+ >取 消</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="comfirm" round>确定</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <p>
|
|
|
+ 当前是最后一个视频并已学习完,请检查所有章节的视频是否已学习完成。
|
|
|
+ </p>
|
|
|
+ <div class="btn2">
|
|
|
+ <el-button type="primary" round @click="dialogPalyVisible = false"
|
|
|
+ >确定</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ props: {
|
|
|
+ courseList: {
|
|
|
+ type: Array,
|
|
|
+ default: () => {
|
|
|
+ return [];
|
|
|
+ },
|
|
|
+ },
|
|
|
+ goodsLearningOrder: {
|
|
|
+ type: Number,
|
|
|
+ },
|
|
|
+ sectionMaxNum: {
|
|
|
+ type: Number,
|
|
|
+ },
|
|
|
+ sectionItem: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {};
|
|
|
+ },
|
|
|
+ },
|
|
|
+ rebuild: {
|
|
|
+ type: Number,
|
|
|
+ default: 0,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ teaIndex: 0,
|
|
|
+ nowTime: 0,
|
|
|
+ treeList: [],
|
|
|
+ query: this.$route.query,
|
|
|
+ sectionExam: [],
|
|
|
+ sectionExamList: [],
|
|
|
+ dialogPalyVisible: false,
|
|
|
+ allSectionList: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async init() {
|
|
|
+ this.nowTime = Number(new Date().getTime() / 1000).toFixed(0);
|
|
|
+ this.treeList = await this.getDoubleTeacherList();
|
|
|
+ let sectionItem = await this.backNextItem(
|
|
|
+ this.treeList.find((e) => e.courseId == this.activeCourseId),
|
|
|
+ 0,
|
|
|
+ false
|
|
|
+ );
|
|
|
+ console.log(sectionItem, "sectionItem");
|
|
|
+ if (this.query.sectionType == 1 && !!this.query.rebuild == this.rebuild) {
|
|
|
+ this.toPlay(sectionItem);
|
|
|
+ }
|
|
|
+ this.getAllSectionList();
|
|
|
+ },
|
|
|
+ activeFunc(courseId, index) {
|
|
|
+ let { courseId: nowCourseId, courseList } = this.treeList[index];
|
|
|
+ if (courseId == nowCourseId) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // if (index) {
|
|
|
+ // let { stuAllNum, secAllNum } = this.treeList[index - 1];
|
|
|
+ // if (stuAllNum != secAllNum) {
|
|
|
+ // return this.$message({
|
|
|
+ // type: "warning",
|
|
|
+ // message: "需按课程顺序学习",
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ let course = this.courseList.find((e) => e.courseId == courseId);
|
|
|
+ if (course) {
|
|
|
+ course.courseList = courseList;
|
|
|
+ course.list = [];
|
|
|
+ course.showList = false;
|
|
|
+ }
|
|
|
+ this.treeList.splice(index, 1, JSON.parse(JSON.stringify(course)));
|
|
|
+ this.getMenuList(this.treeList[index]);
|
|
|
+ },
|
|
|
+ getMenuList(course, isFresh = false) {
|
|
|
+ let { showList, courseId, list } = course;
|
|
|
+ if (!isFresh) {
|
|
|
+ course.showList = !showList;
|
|
|
+ if (list.length) return;
|
|
|
+ }
|
|
|
+ this.$request
|
|
|
+ .reSectionExamList({
|
|
|
+ chapterId: 0,
|
|
|
+ courseId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.sectionExamList = res.data;
|
|
|
+ });
|
|
|
+ return this.$request
|
|
|
+ .reMenuList({ courseId, gradeId: this.gradeId })
|
|
|
+ .then((res) => {
|
|
|
+ for (let i = 0; i < res.rows.length; i++) {
|
|
|
+ let item = res.rows[i];
|
|
|
+ item.id = item.menuId;
|
|
|
+ item.name = item.menuName;
|
|
|
+ item.menuType = item.type;
|
|
|
+ item.showList = false;
|
|
|
+ item.list = [];
|
|
|
+ item.parent = course;
|
|
|
+ }
|
|
|
+ course.list = res.rows;
|
|
|
+ return Promise.resolve(res.rows);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ openModule(module, isFresh = false) {
|
|
|
+ let { list, isRebuild, id, courseId, showList } = module;
|
|
|
+ if (!isFresh) {
|
|
|
+ module.showList = !showList;
|
|
|
+ if (list.length) return;
|
|
|
+ }
|
|
|
+ return this.$request
|
|
|
+ .reChapterList({
|
|
|
+ moduleId: id,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ courseId: courseId,
|
|
|
+ rebuild: isRebuild ? 1 : undefined,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ for (let i = 0; i < res.data.length; i++) {
|
|
|
+ let item = res.data[i];
|
|
|
+ item.id = item.chapterId;
|
|
|
+ item.showList = false;
|
|
|
+ item.list = [];
|
|
|
+ item.parent = module;
|
|
|
+ isRebuild ? (item.isRebuild = 1) : (item.menuType = 2);
|
|
|
+ }
|
|
|
+ module.list = res.data;
|
|
|
+ return Promise.resolve(res.data);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ openChapter(chapter, isFresh = false) {
|
|
|
+ let {
|
|
|
+ chapterId,
|
|
|
+ menuId,
|
|
|
+ list,
|
|
|
+ moduleId,
|
|
|
+ id,
|
|
|
+ isRebuild,
|
|
|
+ courseId,
|
|
|
+ showList,
|
|
|
+ } = chapter;
|
|
|
+ if (!isFresh) {
|
|
|
+ chapter.showList = !showList;
|
|
|
+ if (list.length) return;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$request
|
|
|
+ .reSectionExamList({
|
|
|
+ chapterId: chapterId || menuId,
|
|
|
+ courseId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.sectionExam = [...this.sectionExam, ...res.data];
|
|
|
+ });
|
|
|
+ return this.$request
|
|
|
+ .reSectionList({
|
|
|
+ chapterId: id,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ courseId,
|
|
|
+ rebuild: isRebuild ? 1 : undefined,
|
|
|
+ moduleId: moduleId || 0,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ chapter.canLearn = res.data
|
|
|
+ .filter((item) => item.type != 2)
|
|
|
+ .every((item) => item.learning == 1);
|
|
|
+ res.data.forEach((section) => {
|
|
|
+ section.parent = chapter;
|
|
|
+ section.courseId = courseId;
|
|
|
+ });
|
|
|
+ chapter.list = res.data;
|
|
|
+ return Promise.resolve(chapter.list);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getAllSectionList() {
|
|
|
+ this.$request
|
|
|
+ .getAllSectionList({
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ goodsId: this.goodsId,
|
|
|
+ rebuild: this.rebuild,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.allSectionList = res.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 判断是否是当前播放的节
|
|
|
+ */
|
|
|
+ isActive(section) {
|
|
|
+ let moduleId = section.moduleId || 0;
|
|
|
+ let chapterId = section.chapterId || 0;
|
|
|
+ let sectionId = section.sectionId || section.menuId;
|
|
|
+ let moduleId1 = this.sectionItem.moduleId || 0;
|
|
|
+ let chapterId1 = this.sectionItem.chapterId || 0;
|
|
|
+ let sectionId1 = this.sectionItem.sectionId || this.sectionItem.menuId;
|
|
|
+ return (
|
|
|
+ moduleId == moduleId1 &&
|
|
|
+ chapterId == chapterId1 &&
|
|
|
+ sectionId == sectionId1
|
|
|
+ );
|
|
|
+ },
|
|
|
+ comfirm() {
|
|
|
+ this.dialogPalyVisible = false;
|
|
|
+ this.playNextVideo();
|
|
|
+ },
|
|
|
+ // 自动播放下一个视频
|
|
|
+ async playNextVideo(sectionItem = this.sectionItem) {
|
|
|
+ let { menuId, parent, courseId, projectId } = sectionItem;
|
|
|
+ let list = (
|
|
|
+ menuId
|
|
|
+ ? this.treeList.find((e) => e.courseId == courseId).list
|
|
|
+ : projectId
|
|
|
+ ? this.treeList
|
|
|
+ : parent.list
|
|
|
+ ).filter((e) => !e.doType);
|
|
|
+ let index = list.findIndex((e) => e.id == sectionItem.id);
|
|
|
+ let nextItem = {};
|
|
|
+ if (list.length - 1 > index) {
|
|
|
+ nextItem = list[index + 1];
|
|
|
+ this.toPlay(
|
|
|
+ await this.backNextItem(nextItem, projectId ? 0 : nextItem.menuType)
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ this.playNextVideo(parent);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取模块/章/节
|
|
|
+ async backNextItem(nextItem, type, isNext = true) {
|
|
|
+ if (type == undefined || type == 3) return nextItem;
|
|
|
+ let key = ["getMenuList", "openModule", "openChapter"][type];
|
|
|
+ let list = nextItem.list.length
|
|
|
+ ? nextItem.list
|
|
|
+ : await this[key](nextItem);
|
|
|
+ if (isNext) {
|
|
|
+ nextItem = type == 2 ? list.find((e) => e.type == 1) : list[0];
|
|
|
+ } else {
|
|
|
+ // 初始化 获取播放位置
|
|
|
+ let { moduleId, chapterId, sectionId } = this.query;
|
|
|
+ nextItem = list.find((e) => {
|
|
|
+ if (moduleId * 1 && type == 0) {
|
|
|
+ return e.menuId == moduleId;
|
|
|
+ }
|
|
|
+ if (chapterId * 1 && type < 2) {
|
|
|
+ return e[moduleId * 1 ? "chapterId" : "menuId"] == chapterId;
|
|
|
+ }
|
|
|
+ return (
|
|
|
+ e[moduleId * 1 || chapterId * 1 ? "sectionId" : "id"] == sectionId
|
|
|
+ );
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return this.backNextItem(nextItem, nextItem.menuType, isNext);
|
|
|
+ },
|
|
|
+ async getResource(section, type, courseIndex) {
|
|
|
+ if (
|
|
|
+ section.type != 2 &&
|
|
|
+ this.isActive(section) &&
|
|
|
+ section.sectionType != 3
|
|
|
+ ) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (!(await this.orderTopTobottom(section, type, courseIndex))) {
|
|
|
+ this.clickLock = false;
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message:
|
|
|
+ section.type == 2
|
|
|
+ ? "请学完视频课程再进行练习和测试"
|
|
|
+ : "请按顺序学习视频课程",
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ //视频 回放
|
|
|
+ if (section.sectionType == 1 || section.sectionType == 3) {
|
|
|
+ if (!section.recordingUrl) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: `暂无播放地址数据`,
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 直播
|
|
|
+ if (section.sectionType == 2) {
|
|
|
+ if (!section.liveUrl) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: `暂无直播地址数据`,
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ let data = await this.studyRecordGetChannelBasicInfo(section.liveUrl);
|
|
|
+ if (data.watchStatus == "end" || data.watchStatus == "playback") {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: `直播已结束`,
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (data.watchStatus == "waiting") {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: `直播未开始`,
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 学习次数
|
|
|
+ if (!(await this.exceedLearnNum(section))) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ section.type == 2
|
|
|
+ ? this.toCourseExam(section, type, courseIndex)
|
|
|
+ : this.toPlay(section);
|
|
|
+ },
|
|
|
+ async toCourseExam(section, type, courseIndex) {
|
|
|
+ //试卷
|
|
|
+ // 学习次数
|
|
|
+ let num =
|
|
|
+ this.goodsLearningOrder != 2 || section.rebuild
|
|
|
+ ? await this.bankRecordDoNum(section.typeId)
|
|
|
+ : section.doNum;
|
|
|
+ if (
|
|
|
+ (section.answerNum - num > 0 && section.answerNum > 0) ||
|
|
|
+ section.answerNum == 0
|
|
|
+ ) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/course-exam/" + this.goodsId,
|
|
|
+ query: {
|
|
|
+ courseId: this.treeList[courseIndex].courseId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ moduleId: section.moduleId || 0,
|
|
|
+ sectionId: section.sectionId || 0,
|
|
|
+ examId: section.typeId,
|
|
|
+ learning: section.learning,
|
|
|
+ type: type,
|
|
|
+ chapterId: section.chapterId || 0,
|
|
|
+ orderGoodsId: this.orderGoodsId,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "该试卷只能答题" + section.answerNum + "次",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 节卷不需要控制
|
|
|
+ handelPracticeOrRxam(section, type, courseId) {
|
|
|
+ if (type == 3) {
|
|
|
+ //节卷
|
|
|
+ let data = this.sectionExamList.filter(
|
|
|
+ (x) => x.sectionId == section.menuId
|
|
|
+ );
|
|
|
+ if (data && data.length > 0) {
|
|
|
+ section = data[0];
|
|
|
+ }
|
|
|
+ } else if (type == 2) {
|
|
|
+ //节卷
|
|
|
+ let data = this.sectionExam.filter(
|
|
|
+ (x) => x.sectionId == section.sectionId
|
|
|
+ );
|
|
|
+
|
|
|
+ if (data && data.length > 0) {
|
|
|
+ section = data[0];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$router.push({
|
|
|
+ path: "/course-exam/" + this.goodsId,
|
|
|
+ query: {
|
|
|
+ courseId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ moduleId: section.moduleId || 0,
|
|
|
+ sectionId: section.sectionId || 0,
|
|
|
+ examId: section.typeId,
|
|
|
+ learning: section.learning,
|
|
|
+ type: type,
|
|
|
+ chapterId: section.chapterId || 0,
|
|
|
+ orderGoodsId: this.orderGoodsId,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async exceedLearnNum(section) {
|
|
|
+ let learnNum = await this.goodsTodayStudySectionNum();
|
|
|
+ let hasLearn = await this.gradeCheckGoodsStudy(
|
|
|
+ section.type == 2 ? section.typeId : section
|
|
|
+ );
|
|
|
+ if (this.sectionMaxNum > 0) {
|
|
|
+ if (learnNum >= this.sectionMaxNum && !hasLearn) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: `每天最多学习${this.sectionMaxNum}节`,
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ goodsTodayStudySectionNum() {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ this.$request
|
|
|
+ .goodsTodayStudySectionNum({
|
|
|
+ goodsId: this.goodsId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ resolve(res.data);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ gradeCheckGoodsStudy(option) {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ this.$request
|
|
|
+ .gradeCheckGoodsStudy({
|
|
|
+ goodsId: this.goodsId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ moduleId: option.moduleId || 0,
|
|
|
+ chapterId: option.chapterId || 0,
|
|
|
+ sectionId: option.sectionId || option.menuId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ resolve(res.data);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ bankRecordDoNum(section) {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ this.$request
|
|
|
+ .bankRecordDoNum({
|
|
|
+ goodsId: this.goodsId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ chapterId: section.chapterId,
|
|
|
+ courseId: this.courseId,
|
|
|
+ moduleId: 0,
|
|
|
+ examId: section.typeId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ resolve(res.data);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ toPlay(section) {
|
|
|
+ console.log(section, 777);
|
|
|
+ this.$emit("getResource", section, this.rebuild);
|
|
|
+ },
|
|
|
+ //获取商品双师资模板
|
|
|
+ getDoubleTeacherList() {
|
|
|
+ let rows = JSON.parse(JSON.stringify(this.courseList));
|
|
|
+ rows.forEach((e) => {
|
|
|
+ e.list = [];
|
|
|
+ e.showList = false;
|
|
|
+ e.id = e.courseId;
|
|
|
+ });
|
|
|
+ return this.$request
|
|
|
+ .courseTeacherList({
|
|
|
+ goodsId: this.$route.params.goodsId,
|
|
|
+ })
|
|
|
+ .then(({ data }) => {
|
|
|
+ data.forEach((ele) => {
|
|
|
+ rows.forEach((e, i) => {
|
|
|
+ let actvieIndex = ele.courseIds.indexOf(this.activeCourseId);
|
|
|
+ let index = ele.courseIds.indexOf(e.courseId);
|
|
|
+ if (actvieIndex != -1 && index != -1) {
|
|
|
+ if (e.courseId == this.activeCourseId) {
|
|
|
+ e.courseList = ele.courseList;
|
|
|
+ } else {
|
|
|
+ delete rows[i];
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (index == 0) {
|
|
|
+ e.courseList = ele.courseList;
|
|
|
+ }
|
|
|
+ if (index > 0) {
|
|
|
+ delete rows[i];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ return Promise.resolve(rows.filter((e) => e));
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async orderTopTobottom(section, type, courseIndex) {
|
|
|
+ let { rebuild, moduleId, chapterId } = section;
|
|
|
+ if (this.goodsLearningOrder != 2 || rebuild) {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ if (this.treeList.length > 1 && courseIndex > 0) {
|
|
|
+ let isAllLear = this.treeList
|
|
|
+ .filter((e, i) => i < courseIndex)
|
|
|
+ .every((ele) => ele.stuAllNum == ele.secAllNum);
|
|
|
+ if (!isAllLear) return false;
|
|
|
+ }
|
|
|
+ let list = await this.studyRecordMenuAllList(
|
|
|
+ this.treeList[courseIndex].courseId
|
|
|
+ );
|
|
|
+ type = type == 1 && section.type == 2 ? 2 : type;
|
|
|
+ if (type == 1) {
|
|
|
+ let index = list.findIndex(
|
|
|
+ (e) =>
|
|
|
+ e.moduleId == moduleId &&
|
|
|
+ e.chapterId == chapterId &&
|
|
|
+ e.id == section.sectionId
|
|
|
+ );
|
|
|
+ list = list.slice(0, index);
|
|
|
+ } else if (type != 3) {
|
|
|
+ list = list.filter(
|
|
|
+ (e) => e.moduleId == moduleId && e.chapterId == chapterId
|
|
|
+ );
|
|
|
+ }
|
|
|
+ return list.every((item) => item.studyStatus == 1);
|
|
|
+ },
|
|
|
+ studyRecordMenuAllList(courseId) {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ this.$request
|
|
|
+ .studyRecordMenuAllList({
|
|
|
+ courseId,
|
|
|
+ gradeId: this.gradeId,
|
|
|
+ goodsId: this.goodsId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ resolve(res.data);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //校验节是否有试卷
|
|
|
+ checkSection(sectionId, key) {
|
|
|
+ let _data = this[key];
|
|
|
+ if (_data.length == 0) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ return _data.some((section) => section.sectionId == sectionId);
|
|
|
+ },
|
|
|
+ // 刷新数据
|
|
|
+ refreshList() {
|
|
|
+ let { parent, menuId } = this.sectionItem;
|
|
|
+ if (menuId) {
|
|
|
+ this.getMenuList(playCourse, true);
|
|
|
+ } else {
|
|
|
+ this.openChapter(parent, true);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ studyRecordGetChannelBasicInfo(channelId) {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ this.$request
|
|
|
+ .studyRecordGetChannelBasicInfo({
|
|
|
+ channelId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ resolve(res.data);
|
|
|
+ })
|
|
|
+ .catch((err) => {});
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ gradeId() {
|
|
|
+ return this.query.gradeId;
|
|
|
+ },
|
|
|
+ activeCourseId() {
|
|
|
+ return this.query.courseId;
|
|
|
+ },
|
|
|
+ goodsId() {
|
|
|
+ return this.$route.params.goodsId;
|
|
|
+ },
|
|
|
+ playCourseId() {
|
|
|
+ return this.sectionItem.courseId;
|
|
|
+ },
|
|
|
+ playCourse() {
|
|
|
+ return this.treeList.find((e) => e.courseId == this.playCourseId);
|
|
|
+ },
|
|
|
+ isLastVideo() {
|
|
|
+ try {
|
|
|
+ let { sectionId, chapterId } = this.sectionItem;
|
|
|
+ let lastVideo = this.allSectionList.slice(-1)[0];
|
|
|
+ return (
|
|
|
+ sectionId == lastVideo.sectionId && chapterId == lastVideo.chapterId
|
|
|
+ );
|
|
|
+ } catch (error) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.course_tree {
|
|
|
+ height: 380px;
|
|
|
+ overflow-y: scroll;
|
|
|
+
|
|
|
+ &::-webkit-scrollbar {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ &__title {
|
|
|
+ padding-left: 12px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #fff;
|
|
|
+
|
|
|
+ .el-icon-caret-right,
|
|
|
+ .el-icon-caret-bottom {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__content {
|
|
|
+ .bank-chapter {
|
|
|
+ &__item {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 14px;
|
|
|
+
|
|
|
+ &__text {
|
|
|
+ padding: 8px 8px 8px 24px;
|
|
|
+ cursor: pointer;
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ .el-icon-caret-right,
|
|
|
+ .el-icon-caret-bottom {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bank-section {
|
|
|
+ &__item {
|
|
|
+ user-select: none;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 14px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .lear-state {
|
|
|
+ height: 20px;
|
|
|
+ padding-right: 8px;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ // margin-right: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ background: #132b4d;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #3f8dfd;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__text {
|
|
|
+ flex: 1;
|
|
|
+ padding: 8px 8px 8px 12px;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ cursor: pointer;
|
|
|
+
|
|
|
+ .el-icon-caret-right,
|
|
|
+ .el-icon-caret-bottom {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .test-btn {
|
|
|
+ margin-left: 10px;
|
|
|
+ width: 32px;
|
|
|
+ height: 20px;
|
|
|
+ background: #007aff;
|
|
|
+ border-radius: 4px;
|
|
|
+ line-height: 18px;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .note {
|
|
|
+ margin-left: 10px;
|
|
|
+ width: 32px;
|
|
|
+ height: 20px;
|
|
|
+ border: 1px solid #ff3b30;
|
|
|
+ border-radius: 4px;
|
|
|
+ line-height: 18px;
|
|
|
+ color: #ff3b30;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &--yellow {
|
|
|
+ border-color: #ff9500;
|
|
|
+ color: #ff9500;
|
|
|
+ }
|
|
|
+
|
|
|
+ &--blue {
|
|
|
+ border-color: #3f8dfd;
|
|
|
+ color: #3f8dfd;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .during {
|
|
|
+ color: #999;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn {
|
|
|
+ margin-right: 12px;
|
|
|
+ padding: 0 2px;
|
|
|
+ height: 20px;
|
|
|
+ border: 1px solid #ff3b30;
|
|
|
+ background: #ff3b30;
|
|
|
+ border-radius: 4px;
|
|
|
+ line-height: 18px;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &--green {
|
|
|
+ border: 1px solid #34c759;
|
|
|
+ background: #34c759;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .live-btn {
|
|
|
+ margin-left: 20px;
|
|
|
+ width: 60px;
|
|
|
+ height: 20px;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: #eeeeee;
|
|
|
+ line-height: 18px;
|
|
|
+ color: #666666;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &--yellow {
|
|
|
+ background: #fff7eb;
|
|
|
+ color: #ff9500;
|
|
|
+ }
|
|
|
+
|
|
|
+ &--blue {
|
|
|
+ border-color: #ebf4ff;
|
|
|
+ color: #007aff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .exercises {
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #498afe;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .teacherList_name {
|
|
|
+ display: flex;
|
|
|
+ margin-left: 20px;
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .names {
|
|
|
+ font-size: 13px;
|
|
|
+ color: #383838;
|
|
|
+ margin-right: 8px;
|
|
|
+ cursor: pointer;
|
|
|
+ background: #818181;
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 3px 6px;
|
|
|
+
|
|
|
+ &.nactive {
|
|
|
+ background: #cccccc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tip-dialog {
|
|
|
+ /deep/ {
|
|
|
+ .el-dialog__body {
|
|
|
+ padding: 6px 40px 44px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-dialog__header {
|
|
|
+ padding-top: 36px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-dialog__title {
|
|
|
+ font-weight: bold;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ p {
|
|
|
+ color: #666666;
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn1 {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 50px;
|
|
|
+
|
|
|
+ .el-button {
|
|
|
+ width: 140px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn2 {
|
|
|
+ width: 200px;
|
|
|
+ margin: 32px auto 0;
|
|
|
+
|
|
|
+ .el-button {
|
|
|
+ width: 200px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|