下载按钮的位置

src/components/course/download-button.vue

@@ -30,9 +30,10 @@ export default {
 .download-button-wrapper {
   display: flex;
   // width: 100%;
-  position: fixed;
+  // position: fixed;
+  position: absolute;
   z-index: 1000;
-  top: 15px;
+  top: 10px;
   right: 0;
   height: 30px;
   align-items: center;

src/views/course-detail.vue

@@ -58,6 +58,7 @@
               <div class="tab-line" :style="{left: `${tabLeft}px`}"></div>
             </div>
           </van-sticky>
+          <DownloadButton v-if="showDownloadButton"></DownloadButton>
         </div>
         <brief-intro v-show="curtTabIdx === 0" :doctor-list="doctors" :intro="course.intro" :harvest="harvest" />
         <course-catalog v-show="curtTabIdx === 1" :list="chapters" :curtId="curtLectureId" :onToggle="onToggle" :onSelect="selectLecture" :download="download" />
@@ -77,7 +78,6 @@
     </div> -->
 
     <Loading v-if="showLoading" />
-    <DownloadButton v-if="showDownloadButton"></DownloadButton>
   </div>
 </template>
 
@@ -471,6 +471,7 @@ export default {
     }
   }
   .tab-box{
+    position: relative; // 用于定位下载按钮
     height: 50px;
   }
   .tab-inner{

src/views/share-merge-detail.vue

@@ -59,6 +59,7 @@
         >
           <span :class="{'focus': tabFlag}" @click="jumpIntro">简介</span>
           <span :class="{'focus': !tabFlag}" @click="jumpCatalogue">目录</span>
+          <DownloadButton v-if="showDownloadButton"></DownloadButton>
         </div>
         <div v-show="fixedFlag" class="fixed-flag-height"></div>
         <div id="intro-content" class="intro-content">
@@ -179,8 +180,6 @@
         @btnClick="download(1)"
       ></CourseCovers>
     </div>
-    <DownloadButton v-if="showDownloadButton"></DownloadButton>
-
   </div>
 </template>
 <script>
@@ -905,18 +904,19 @@ export default {
   }
   .intro-catalogue-container {
     .title {
+      position: relative;
       height: 50px;
       line-height: 30px;
       padding: 0 15px;
       border-bottom: 1px solid #f0f1f2;
-      span {
+      & > span {
         display: inline-block;
         line-height: 15px;
         font-size: 15px;
         color: #979899;
         padding-right: 35px;
       }
-      span.focus {
+      & > span.focus {
         position: relative;
         color: #373839;
       }