Explorar o código

个人画像-导出按钮修改位置,滚动到指定为止头部显示导出按钮

吴朋磊 hai 1 mes
pai
achega
932e4c1c78

+ 63 - 27
src/views/analysisReport/personalProfile/MyGradeHistory.vue

@@ -6,19 +6,24 @@
         <img src="../../../assets/studentAnalysis/echarts.svg" alt="图表" class="btn_icon">
         历次考试对比
       </el-button> -->
+      <button class="export_btn" @click="$emit('export-knowledge-paps')">
+        <i class="iconfont icon_export"></i>
+        导出精准提升试题
+      </button>
     </div>
 
-    <div class="content" v-if="gradeHistoryData && (Array.isArray(gradeHistoryData) ? gradeHistoryData.length > 0 : (gradeHistoryData.records && gradeHistoryData.records.length > 0))">
+    <div class="content"
+      v-if="gradeHistoryData && (Array.isArray(gradeHistoryData) ? gradeHistoryData.length > 0 : (gradeHistoryData.records && gradeHistoryData.records.length > 0))">
       <el-table ref="gradeTable" :data="tableData" style="width: 100%" border :header-cell-style="headerCellStyle"
         :cell-style="cellStyle" stripe @selection-change="handleSelectionChange" width="55" align="center">
         <el-table-column type="selection" width="55" align="center"></el-table-column>
-        <el-table-column type="index" label="序号" width="70" align="center" >
+        <el-table-column type="index" label="序号" width="70" align="center">
           <template slot-scope="scope">
-            {{scope.$index <10 ? '0' + (scope.$index + 1) : scope.$index + 1 }}
-          </template>
+            {{ scope.$index < 10 ? '0' + (scope.$index + 1) : scope.$index + 1 }} </template>
         </el-table-column>
         <template v-for="(header, index) in tableHeaders">
-          <el-table-column v-if="header.display" :key="index" :prop="header.prop" :label="header.label" :width="header.prop === 'examName' ? '225' : ''" align="center">
+          <el-table-column v-if="header.display" :key="index" :prop="header.prop" :label="header.label"
+            :width="header.prop === 'examName' ? '225' : ''" align="center">
             <template slot-scope="scope">
               {{ scope.row[header.prop] != null ? scope.row[header.prop] : '-' }}
             </template>
@@ -33,14 +38,8 @@
 
       <!-- 分页器 -->
       <div class="pagination">
-        <el-pagination
-          background
-          layout="prev, pager, next, total"
-          :total="total"
-          :page-size="pageSize"
-          :current-page="currentPage"
-          @current-change="handleCurrentChange"
-        />
+        <el-pagination background layout="prev, pager, next, total" :total="total" :page-size="pageSize"
+          :current-page="currentPage" @current-change="handleCurrentChange" />
       </div>
 
     </div>
@@ -82,12 +81,12 @@ export default {
     // 接收历次成绩数据
     gradeHistoryData: {
       type: [Array, Object],
-      default: () => {}
+      default: () => { }
     },
     // 接收个人画像数据
     portraitData: {
       type: Object,
-      default: () => {}
+      default: () => { }
     }
   },
   data() {
@@ -95,7 +94,7 @@ export default {
       showStudentPaperDialog: false, //显示答题卡弹框
       paperInfo: {},
       paperTitle: '', //答题卡弹框标题
-      currentPageIndex: 0 ,//当前选中的答题卡第几页
+      currentPageIndex: 0,//当前选中的答题卡第几页
       // 控制弹窗显示/隐藏
       showBenchTaskSelect: false,
       // 是否允许多选
@@ -116,7 +115,7 @@ export default {
       handler(newVal) {
         // 检查数据是否有效
         const hasData = newVal && (Array.isArray(newVal) ? newVal.length > 0 : (newVal.records && newVal.records.length > 0));
-        
+
         if (hasData) {
           // 如果gradeHistoryData是一个对象,可能包含total属性
           if (typeof newVal === 'object' && newVal.total !== undefined) {
@@ -125,7 +124,7 @@ export default {
             // 尝试从父组件获取total值
             this.total = Number(this.$parent.gradeHistoryData.total);
           }
-          
+
           this.$nextTick(() => {
             if (this.$refs.gradeTable) {
               // 设置初始化标志,避免触发selection-change事件
@@ -165,7 +164,7 @@ export default {
       // 获取第一个数据行的displayType
       const firstRow = this.tableData[0];
       if (!firstRow) return '';
-      
+
       switch (firstRow.displayType) {
         case 0:
           return '分数';
@@ -295,11 +294,16 @@ export default {
   box-sizing: border-box;
 
   .chart_title {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 20px;
+    height: 36px;
     .title {
       font-size: 16px;
       font-weight: 600;
       color: #333333;
-      margin: 0 0 20px 0;
+
     }
 
     // 历史考试对比
@@ -325,6 +329,37 @@ export default {
         vertical-align: middle;
       }
     }
+
+    // 导出精准提升试题
+    .export_btn {
+      display: flex;
+      align-items: center;
+      gap: 5px;
+      width: 152px;
+      height: 36px;
+      line-height: 36px;
+      background: #2E64FA;
+      color: white;
+      border: none;
+      border-radius: 4px;
+      font-size: 14px;
+      cursor: pointer;
+      padding: 0;
+      transition: all 0.3s ease;
+
+      &:hover {
+        background: #5883fb;
+      }
+
+      &:active {
+        background: #2E64FA;
+      }
+
+      .iconfont {
+        width: 14px;
+        margin-left: 10px;
+      }
+    }
   }
 
 
@@ -405,36 +440,37 @@ export default {
       display: flex;
       justify-content: flex-end;
       align-items: center;
-      
+
       /* 分页器样式 */
       :deep(.el-pagination) {
-        
+
         /* 分页按钮通用样式 */
         .el-pager li {
           height: 32px;
           line-height: 32px;
           border-radius: 4px;
           margin: 0 5px;
-          
+
           /* 未选中状态 */
           background-color: #f3f3f3;
           color: #606266;
-          
+
           /* 选中状态 */
           &.active {
             background-color: #2e64fa;
             color: #ffffff;
           }
         }
-        
+
         /* 上一页/下一页按钮 */
-        .btn-prev, .btn-next {
+        .btn-prev,
+        .btn-next {
           height: 32px;
           line-height: 32px;
           border-radius: 4px;
           background-color: #f3f3f3;
           color: #606266;
-          
+
           &:hover {
             background-color: #e6e8eb;
           }

+ 7 - 2
src/views/analysisReport/personalProfile/index.vue

@@ -2,7 +2,8 @@
     <div class="personalProfile">
         <!-- 我的历次成绩子组件 -->
         <MyGradeHistory :grade-history-data="gradeHistoryData" v-loading="historyloading"
-            @selection-change="handleSelectionChange" @page-change="handlePageChange" />
+            @selection-change="handleSelectionChange" @page-change="handlePageChange" 
+            @export-knowledge-paps="exportKnowledgePaps"/>
 
         <!-- 历次考试知识点追踪 -->
         <KnowledgeTrack :exam-range="knowledgeMapData.examRange" :knowledge-stats="knowledgeStats"
@@ -22,7 +23,7 @@
             v-loading="historicalChangeLoading" />
         <!-- 薄弱知识点精准提升 -->
         <knowledgePaps :knowledgeName="knowledgeName" v-loading="knowledgePapsLoading" :knowledgData="knowledgData"
-            @export-knowledge-paps="exportKnowledgePaps" />
+             />
         <!-- 下载试题 -->
         <Download ref="downloadRef" :visible.sync="visible" :examId="portraitData.examId"
             :subjectCode="portraitData.subjectCode" :knowledgeId="knowledgeId" />
@@ -687,6 +688,10 @@ export default {
             }
             // 触发Download组件弹窗
             this.visible = true;
+        },
+        // 导出试题(供父组件调用)
+        ExportQuestions() {
+            this.exportKnowledgePaps();
         }
     },
 }

+ 8 - 5
src/views/analysisReport/personalProfile/knowledgePaps.vue

@@ -6,10 +6,10 @@
                 <span class="secondary_title" v-if="titleParts.knowledgeName">{{ titleParts.knowledgeName }} / </span>
                 <span class="main_title">薄弱知识点精准提升</span>
             </div>
-            <button class="export_btn" @click="$emit('export-knowledge-paps')">
+            <!-- <button class="export_btn" @click="$emit('export-knowledge-paps')">
                 <i class="iconfont icon_export"></i>
                 导出精准提升试题
-            </button>
+            </button> -->
         </div>
 
         <div class="data_container" v-if="knowledgData.length > 0">
@@ -34,9 +34,9 @@
                     <p v-html ='item.title || "" '></p>
                 </div>
                 <!-- 推题底部 -->
-                <div class="question_tags">
+                <div class="question_tags" v-if="item.knowledge">
                     <span class="tags_label">知识点:</span>
-                    <span class="tag" v-for="(knowledge, index) in (item.knowledge || '').split('、')" :key="index" v-if="knowledge">
+                    <span class="tag" v-for="(knowledge, index) in getKnowledgeList(item.knowledge)" :key="index">
                         {{ knowledge }}
                     </span>
                 </div>
@@ -88,7 +88,10 @@ export default {
         // }
     },
     methods: {
-        
+        // 处理知识点分割和过滤
+        getKnowledgeList(knowledge) {
+            return (knowledge || '').split('、').filter(item => item);
+        }
     },
 }
 </script>

+ 71 - 19
src/views/analysisReport/studentPage/mainPage.vue

@@ -23,7 +23,16 @@
                     <el-button :disabled="!canBtnClick" type="primary" size="medium"
                         @click="downloadWrongQuestions(1)">下载个性化提升手册</el-button>
                 </template>
-                <el-button v-if="showOneStudOneCase && activeBtn === pathFourth" size="medium" type="primary" @click="EditOneStudOneCase" style="width: 96px;">{{ !isEditOneStudOneCase?`${stuCaseIsEdited?'编辑':'开始编辑'}`:`${stuCaseIsEdited?'重新提交':'提交'}` }}</el-button>
+                <template v-if="isShowExportBtns">
+                    <el-button size="medium" :disabled="!canBtnClick" @click="ExportQuestions" type="primary"
+                        class="export_btn">
+                        <i class="iconfont icon_export"></i> 导出精准提升试题
+                    </el-button>
+                </template>
+                <el-button v-if="showOneStudOneCase && activeBtn === pathFourth" size="medium" type="primary"
+                    @click="EditOneStudOneCase" style="width: 96px;">{{
+                        !isEditOneStudOneCase ? `${stuCaseIsEdited ? '编辑' : '开始编辑'}` : `${stuCaseIsEdited ? '重新提交':'提交'}`
+                    }}</el-button>
                 <!-- <el-button v-if="isShowPadfBtn" style="margin-left: 10px;" size="medium" type="primary" :loading="stuPdfLoading" @click="StuDownloadPDF">下载PDF</el-button> -->
             </div>
         </div>
@@ -37,13 +46,14 @@
                                 <button class="mm_btn mb_10" :class="{ active: activeBtn === pathOne }"
                                     @click="toPage(pathOne)">成绩分析</button>
                                 <!-- v-if="isShowKnowledgeButtons" -->
-                                <button  class="mm_btn mb_10"
-                                    :class="{ active: activeBtn === pathTwo }" @click="toPage(pathTwo)">举一反三</button>
+                                <button class="mm_btn mb_10" :class="{ active: activeBtn === pathTwo }"
+                                    @click="toPage(pathTwo)">举一反三</button>
                                 <button v-if="!isTotalScore" class="mm_btn mb_10"
                                     :class="{ active: activeBtn === pathThree }"
                                     @click="toPage(pathThree)">个人画像</button>
-                                <button class="mm_btn"  v-if="showOneStudOneCase" :class="{ active: activeBtn === pathFourth }"
-                                 @click="toPage(pathFourth)">一生一案</button>    
+                                <button class="mm_btn" v-if="showOneStudOneCase"
+                                    :class="{ active: activeBtn === pathFourth }"
+                                    @click="toPage(pathFourth)">一生一案</button>
                             </div>
                             <!-- 520929546006958081 -->
                             <div class="right">
@@ -52,7 +62,8 @@
                                     </FiltersItem>
                                 </div>
                                 <router-view ref="child" @isPdfDataLoadEnd="isPdfDataLoadEnd"
-                                    @closePdfLoading="closePdfLoading" @StudentCaseIsEdited="StudentCaseIsEdited"></router-view>
+                                    @closePdfLoading="closePdfLoading"
+                                    @StudentCaseIsEdited="StudentCaseIsEdited"></router-view>
                             </div>
                         </div>
                     </template>
@@ -104,7 +115,7 @@ export default {
             }
             // 深拷贝原始数据,避免直接修改
             const updatedFilterData = JSON.parse(JSON.stringify(this.filterData));
-            
+
             // 遍历筛选数据,找到科目名称筛选项
             updatedFilterData.forEach(filterItem => {
                 if (filterItem.type === 'subjectName') {
@@ -112,13 +123,13 @@ export default {
                     filterItem.list = filterItem.list.filter(item => item.isTotal !== 1 && item.subjectGroupType !== 1);
                 }
             });
-            
+
             return updatedFilterData;
         },
         canBtnClick() {
             return this.$store.state.question.canDownloanBtnClick;
         },
-        showOneStudOneCase(){//是否开启了一生一案显示
+        showOneStudOneCase() {//是否开启了一生一案显示
             return this.$store.state.report.examSelectItem.oneStudOneCase
         }
     },
@@ -126,6 +137,7 @@ export default {
         return {
             isShowFilter: false, //是否显示筛选条件
             isShowBtn: false, //是否显示下载按钮
+            isShowExportBtns: false,//是否显示导出精准提升试题按钮
             isShowPadfBtn: false,//是否显示下载pdf按钮
             isPdfLoadEnd: false,//报告册数据是否加载完成
             filterData: [
@@ -145,8 +157,8 @@ export default {
             isLianXiao: false,//是否联校
             stuPdfLoading: false,
             schoolId: this.$store.state.user.userInfo.id,
-            isEditOneStudOneCase:false,//是否编辑
-            stuCaseIsEdited:true,//判断一生一案是否是已经状态
+            isEditOneStudOneCase: false,//是否编辑
+            stuCaseIsEdited: true,//判断一生一案是否是已经状态
         };
     },
 
@@ -253,6 +265,13 @@ export default {
                     this.$refs.child.GetScrollTop(scrollTop);
                 }
             }
+            if (path === '/studentAnalysisReport/reportDetails/personalProfile') {
+                this.isShowExportBtns = (scrollTop >= 150);
+                if (this.$refs.child && typeof this.$refs.child.GetScrollTop === 'function') {
+                    this.$refs.child.GetScrollTop(scrollTop);
+                }
+            }
+
         },
         //重置滚动条
         ResetScroll() {
@@ -266,7 +285,10 @@ export default {
         downloadWrongQuestions(type) {
             this.$store.commit("question/SET_VARIANTION", type);
         },
-
+        //导出精准提升试题
+        ExportQuestions() {
+            this.$refs.child.ExportQuestions();
+        },
         //返回按钮点击
         GoBack() {
             const schoolType = sessionStorage.getItem('schoolType');
@@ -295,21 +317,21 @@ export default {
         handleFilterDataUpdate() {
             // 检查当前是否在个人画像页面
             const isPersonalProfilePage = this.$route.path === '/studentAnalysisReport/reportDetails/personalProfile';
-            
+
             if (isPersonalProfilePage) {
                 // 深拷贝原始数据,避免直接修改props
                 const updatedFilterData = JSON.parse(JSON.stringify(this.filterData));
-                
+
                 // 遍历筛选数据,找到科目名称筛选项
                 updatedFilterData.forEach((filterItem, index) => {
                     if (filterItem.type === 'subjectName') {
                         // 过滤掉总分选项(isTotal为1的选项)
                         const nonTotalItems = filterItem.list.filter(item => item.isTotal !== 1 && item.subjectGroupType !== 1);
-                        
+
                         // 检查当前选中的是否是总分选项
                         const currentSelected = filterItem.list.find(item => item.value === filterItem.value);
                         const isCurrentTotal = currentSelected && (currentSelected.isTotal === 1 || currentSelected.subjectGroupType === 1);
-                        
+
                         // 如果当前选中的是总分选项且有其他选项,切换到第一个非总分选项
                         if (isCurrentTotal && nonTotalItems.length > 0) {
                             this.ChangeFilters({ index, value: nonTotalItems[0].value });
@@ -319,12 +341,12 @@ export default {
             }
         },
         //编辑一生一案
-        EditOneStudOneCase(){
+        EditOneStudOneCase() {
             this.isEditOneStudOneCase = !this.isEditOneStudOneCase;
             this.$refs.child.EditOneStudOneCase(this.isEditOneStudOneCase);
         },
-        StudentCaseIsEdited(id){
-            this.stuCaseIsEdited = id?true:false;
+        StudentCaseIsEdited(id) {
+            this.stuCaseIsEdited = id ? true : false;
         }
     },
     watch: {
@@ -382,4 +404,34 @@ export default {
         width: calc(100% - 180px);
     }
 }
+
+.export_btn {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+    width: 152px;
+    height: 36px;
+    line-height: 36px;
+    background: #2E64FA;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    font-size: 14px;
+    cursor: pointer;
+    padding: 0;
+    transition: all 0.3s ease;
+
+    &:hover {
+        background: #5883fb;
+    }
+
+    &:active {
+        background: #2E64FA;
+    }
+
+    .iconfont {
+        width: 14px;
+        margin-left: 10px;
+    }
+}
 </style>