|
@@ -3,14 +3,15 @@
|
|
|
<head-bar @back="back">
|
|
|
<template #title>
|
|
|
<div class="course-nav-box">
|
|
|
- <span class="list" @click="navCheck"></span>
|
|
|
+ <div>{{ courseDetail.title }}</div>
|
|
|
+ <!-- <span class="list" @click="navCheck"></span>
|
|
|
<span class="last" @click="nextOrpreSteps(0)">上一步</span>
|
|
|
<span class="next" @click="nextOrpreSteps(1)">下一步</span>
|
|
|
- <span class="comment" @click="setType(2)">评课</span>
|
|
|
+ <span class="comment" @click="setType(2)">评课</span> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
</head-bar>
|
|
|
- <div class="course-box">
|
|
|
+ <div class="course-box" ref="cBox">
|
|
|
<course-title :chapInfo="chapInfo" :courseType="courseType" :taskCount="taskCount"></course-title>
|
|
|
<course-content-list v-if="false"></course-content-list>
|
|
|
<div class="course-type-box">
|
|
@@ -43,6 +44,24 @@
|
|
|
:taskCount="taskCount"
|
|
|
></comment-box>
|
|
|
</div>
|
|
|
+ <div class="courseNavIcon">
|
|
|
+ <div class="nIcon" @click="navCheck">
|
|
|
+ <div class="iconImg"><img src="../../assets/images/home/mlIcon.png" alt="" /></div>
|
|
|
+ <div>目录</div>
|
|
|
+ </div>
|
|
|
+ <div class="nIcon" @click="nextOrpreSteps(0)">
|
|
|
+ <div class="iconImg"><img src="../../assets/images/home/lastStep.png" alt="" /></div>
|
|
|
+ <div>上一步</div>
|
|
|
+ </div>
|
|
|
+ <div class="nIcon" @click="nextOrpreSteps(1)">
|
|
|
+ <div class="iconImg"><img src="../../assets/images/home/nextStep.png" alt="" /></div>
|
|
|
+ <div>下一步</div>
|
|
|
+ </div>
|
|
|
+ <div class="nIcon" @click="setType(2)">
|
|
|
+ <div class="iconImg"><img src="../../assets/images/home/pk.png" alt="" /></div>
|
|
|
+ <div>评课</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<nav-box
|
|
|
ref="navbox"
|
|
@@ -133,10 +152,12 @@ export default {
|
|
|
},
|
|
|
nextOrpreSteps(t) {
|
|
|
this.$refs.navbox.nextOrpreSteps(t)
|
|
|
+ var a = this.$refs["cBox"];
|
|
|
+ a.scrollTop = 0;
|
|
|
},
|
|
|
back() {
|
|
|
// eslint-disable-next-line prettier/prettier
|
|
|
- this.$router.push({ path: '/courseDetail', query: { courseid: this.courseid }})
|
|
|
+ this.$router.push({ path: '/courseDetail', query: { courseid: this.courseid } })
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -159,7 +180,7 @@ export default {
|
|
|
// padding-left: 0.8rem;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
+ justify-content: center;
|
|
|
font-size: 16px;
|
|
|
> span {
|
|
|
cursor: pointer;
|
|
@@ -182,6 +203,35 @@ export default {
|
|
|
width: 100%;
|
|
|
height: calc(100% - 1.5rem);
|
|
|
overflow: auto;
|
|
|
+ position: relative;
|
|
|
+ .courseNavIcon {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 60px;
|
|
|
+ background: #fff;
|
|
|
+ box-shadow: 0 0 10px 2px #cbcbcb;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ .nIcon {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ width: calc(100% / 4);
|
|
|
+ .iconImg {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.course-type-box {
|
|
|
background: #fff;
|