实现当滚动条下滑时，下载按钮出现在头部的功能

src/store/index.js

@@ -6,12 +6,14 @@ import getters from './getters'
 import user from './modules/user'
 import analysis from './modules/analysis'
 import report from "./modules/report";
+import question from "./modules/question";
 Vue.use(Vuex)
 const store = new Vuex.Store({
   modules: {
     user,
     analysis,
-    report
+    report,
+    question
   },
   getters,
   plugins: [createPersistedState()]

src/store/modules/question.js

@@ -0,0 +1,15 @@
+const state = {
+    isVariation: -1
+}
+
+const mutations = {
+    SET_VARIANTION: (state, data) => {
+        state.isVariation = data
+    },
+}
+
+export default {
+    namespaced: true,
+    state,
+    mutations
+}

src/views/analysisReport/studentPage/mainPage.vue

@@ -17,6 +17,10 @@
                             :value="item.value"></el-option>
                     </el-select>
                 </div>
+                <template v-if="isShowBtn">
+                    <el-button size="medium" @click="downloadWrongQuestions(0)">下载错题本</el-button>
+                    <el-button type="primary" size="medium" @click="downloadWrongQuestions(1)">下载个性化提升手册</el-button>
+                </template>
             </div>
         </div>
 
@@ -25,8 +29,10 @@
                 <div class="content_right_scroll" ref="contentRightScroll">
                     <div class="mm_body">
                         <div class="left">
-                            <button class="mm_btn mb_10" :class="{active: activeBtn === pathOne}" @click="toPage(pathOne)">成绩分析</button>
-                            <button class="mm_btn" :class="{active: activeBtn === pathTwo}" @click="toPage(pathTwo)">个性化错题</button>
+                            <button class="mm_btn mb_10" :class="{ active: activeBtn === pathOne }"
+                                @click="toPage(pathOne)">成绩分析</button>
+                            <button class="mm_btn" :class="{ active: activeBtn === pathTwo }"
+                                @click="toPage(pathTwo)">个性化错题</button>
                         </div>
                         <div class="right">
                             <div class="page_filter" ref="filterContent">
@@ -60,6 +66,7 @@ export default {
     data() {
         return {
             isShowFilter: false, //是否显示筛选条件
+            isShowBtn: false, //是否显示下载按钮
             filterData: [
                 {
                     name: "科目名称",
@@ -138,25 +145,30 @@ export default {
 
         // 滚动条事件
         ScrollChange() {
+            const path = this.$route.path;
+
             let scrollTop = this.$refs.rightContent.scrollTop;
-            const filterContent = this.$refs.filterContent;
-            let scrollHeight = 242;
-            if (filterContent) {
-                scrollHeight = filterContent.clientHeight;
+            if (path === '/studentAnalysisReport/reportDetails/scrolReport') {
+                const filterContent = this.$refs.filterContent;
+                let scrollHeight = 242;
+                if (filterContent) {
+                    scrollHeight = filterContent.clientHeight;
+                }
+                this.isShowFilter = (scrollTop >= scrollHeight);
+                this.$store.commit("report/set_state", {
+                    key: "isShowFilter",
+                    value: this.isShowFilter,
+                });
+                if (this.$refs.child && typeof this.$refs.child.GetScrollTop === 'function') {
+                    this.$refs.child.GetScrollTop(scrollTop);
+                }
             }
-            if (scrollTop >= scrollHeight) {
-                this.isShowFilter = true;
 
-            }
-            else {
-                this.isShowFilter = false;
-            }
-            this.$store.commit("report/set_state", {
-                key: "isShowFilter",
-                value: this.isShowFilter,
-            });
-            if (this.$refs.child && typeof this.$refs.child.GetScrollTop === 'function') {
-                this.$refs.child.GetScrollTop(scrollTop);
+            if (path === '/studentAnalysisReport/reportDetails/personalWrongQuestions') {
+                this.isShowBtn = (scrollTop >= 250);
+                if (this.$refs.child && typeof this.$refs.child.GetScrollTop === 'function') {
+                    this.$refs.child.GetScrollTop(scrollTop);
+                }
             }
         },
         //重置滚动条
@@ -167,6 +179,10 @@ export default {
                 }
             })
         },
+        
+        downloadWrongQuestions(type) {
+            this.$store.commit("question/SET_VARIANTION", type);    
+        },
 
         //返回按钮点击
         GoBack() {
@@ -199,6 +215,7 @@ export default {
     display: flex;
     width: 100%;
     justify-content: space-between;
+
     .left {
         width: 170px;
         padding: 20px;

src/views/analysisReport/wrongQuestion/Download.vue

@@ -69,6 +69,7 @@ export default {
                 this.$message.error('下载失败，请稍后重试');
             }).finally(() => {
                 loadingInstance.close();
+                this.$store.commit("question/SET_VARIANTION", -1); 
             });
         }
     }

src/views/analysisReport/wrongQuestion/index.vue

@@ -243,6 +243,10 @@ export default {
         subjectCode() {
             return this.$store.state.report.filterObject.subjectCode;
         }, //分析报告公共参数变量
+
+        IsVariation() {
+            return this.$store.state.question.isVariation;
+        },
     },
 
     watch: {
@@ -251,6 +255,13 @@ export default {
                 this._queryStudentErrorQuestion();
             }
         },
+
+       IsVariation(newVal) {
+           if (newVal === 0 || newVal === 1) {
+                this.downloadDialogVisible = true
+                this.isVariation = newVal
+           }
+        },
     },
 
     created() {