添加学生报告

src/router/index.js

@@ -102,6 +102,13 @@ let studentAnalysisReport = {
                         title: "一生一案",
                     },
                 },
+                {
+                    path: "studentReport",
+                    component: () => import("@/views/analysisReport/studentPage/downloadPdf/studentReport"),
+                    meta: {
+                        title: "一生一案",
+                    },
+                }
             ],
         },
     ],

src/styles/report.scss

@@ -2389,8 +2389,15 @@
   text-align: center;
   .web_mode{//网页模式
     width: 908px;
-    height: 1285px;
+    // height: 1285px;
     margin: 0 auto;
+    .download_btn{
+      position: fixed;
+      width: 160px;
+      height: 36px;
+      top: 148px;
+      right: 20px;
+    }
     .area_page
     {
       width:908px;

src/views/analysisReport/studentPage/downloadPdf/components/bookFlip.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="['report_page', { 'full_screen': isShowFullScreen }]" style="position: absolute;top: -9999999px;z-index: -10;">
+    <div :class="['report_page', { 'full_screen': isShowFullScreen }]">
         <!-- 点击封面进入全屏 -->
         <div class="joint_print_area">
             <!-- 点击封面进入全屏预览模式 -->
@@ -63,6 +63,7 @@
             <!-- 下载模版 -->
             <!-- style="position: absolute;top: -9999999px;z-index: -10;" -->
             <div class="magazine-viewport web_mode">
+                <el-button class="download_btn" size="small" type="primary" :loading="pdfLoading" @click="DownloadPdfNew">下载PDF</el-button>
                 <!-- 封面 -->
                 <BookCover class="web_cover web_area_page" :showButton="false" :bookBg="`${bookBg}_bg`" :title="coverTitle" :subtitle="subtitle"></BookCover>
                 <slot type="web_mode"></slot>
@@ -70,6 +71,19 @@
                 <BookCover class="web_cover web_area_page" :showButton="false" :isCover="true" :bookBg="`${bookBg}_cover_bg`"></BookCover>
             </div>
         </div>
+        <div class="page_dialog">
+            <el-dialog title="下载PDF" class="page_dialog" :visible.sync="showReportLoading" width="500px" top="15%" append-to-body>
+                <div class="report_loading">
+                    <div class="report_loading_icon">
+                    <img src="@/assets/report/report_loading.png">
+                    </div>
+                    <div class="report_loading_title">正在努力生成PDF中，请稍等...</div> 
+                    <div class="report_loading_progress">
+                    <el-progress :text-inside="true" color="#2E64FA" text-color="#ffffff" :stroke-width="16" :percentage="targetProgress"></el-progress>
+                    </div>
+                </div>
+            </el-dialog>
+        </div>
     </div>
 </template>
 
@@ -124,7 +138,8 @@ export default {
             totalPages: 0, // 总页数（由 turn.js 计算）
             showReportLoading:false,
             targetProgress:0,
-            loading:false
+            loading:false,
+            pdfLoading:false,
         };
     },
     computed: {
@@ -568,10 +583,12 @@ export default {
         async DownloadPdfNew() {
             //获取所有的area_page 元素
             const elements = document.querySelectorAll(".web_mode .web_area_page");
-            const elLens = elements.length - 1;
-            this.loading = true;
-            // this.targetProgress = 1;
-            // this.showReportLoading = true;
+            const elLens = elements.length;
+            const elLensIndex = elLens - 1;
+            this.pdfLoading = true;
+            this.targetProgress = 0;
+            this.showReportLoading = true;
+            const itemProgress = elLens > 0 ? Math.ceil(100 / elLens) : 0; 
             const pdf = new jsPDF("p", "pt", "a4"); // 'p'表示纵向，'a4'表示A4纸张尺寸
             const pdfWidth = pdf.internal.pageSize.getWidth(); //获取pdf的宽度
             const pdfHeight = pdf.internal.pageSize.getHeight(); //获取pdf的高度
@@ -584,6 +601,7 @@ export default {
                     // 确保元素可见并已渲染，并设置为横向排列样式
                     element.style.visibility = 'visible';
                     element.offsetHeight; // 触发重排
+                    
                     // 等待元素完全渲染
                     await new Promise(resolve => setTimeout(resolve, 100));
                     
@@ -594,13 +612,11 @@ export default {
                         width: element.scrollWidth*2,
                         height: element.scrollHeight*2,
                         // 提高画布分辨率以获得更清晰的图像
-                        // canvasWidth: element.scrollWidth * 2,
-                        // canvasHeight: element.scrollHeight * 2,
-                        // 新增高清配置
-                        // pixelRatio: window.devicePixelRatio * 2,
+                        canvasWidth: element.scrollWidth * 2,
+                        canvasHeight: element.scrollHeight * 2,
                         style: {
                         'transform': 'scale(2)',
-                        'transform-origin': 'left top',
+                        'transform-origin': 'top left',
                         'background-color': '#ffffff',
                         // 关键：背景图尺寸适配原元素
                         'background-size': `${element.scrollWidth}px ${element.scrollHeight}px`, // 优先铺满且完整显示
@@ -613,10 +629,8 @@ export default {
                         },
                         bgcolor: '#ffffff'
                     });
-                    
                     // 获取图像属性并计算缩放比例
                     const imgProps = pdf.getImageProperties(dataUrl);
-
                     const imgWidth = imgProps.width;
                     const imgHeight = imgProps.height;
                     
@@ -628,6 +642,7 @@ export default {
                     // 居中放置图像
                     const xPosition = (pdfWidth - adjustWidth) / 2;
                     const yPosition = (pdfHeight - adjustHeight) / 2;
+
                     // console.log("打印pdf图片尺寸", imgWidth, imgHeight);
                     // console.log("打印pdf页面尺寸", pdfWidth, pdfHeight);
                     // console.log("打印pdf缩放比例", ratio);
@@ -640,16 +655,20 @@ export default {
                     }
                     //处理封面图铺满屏
                     let pdfAdjustHeight = adjustHeight;
-                    if(pageIndex == 0 || pageIndex == elLens){
+                    if(pageIndex == 0 || pageIndex == elLensIndex){
                         pdfAdjustHeight = adjustHeight + 6
                     }
                     pdf.addImage(dataUrl, "JPEG", xPosition, yPosition - 6, adjustWidth, pdfAdjustHeight);
+                    this.targetProgress += itemProgress;
+                    // 边界处理：进度值不超过100%
+                    this.targetProgress = Math.min(this.targetProgress, 100);
                 }
             }
             // 保存pdf文件
             pdf.save(`${this.reportTitle}_${this.coverTitle}.pdf`);
-            // this.showReportLoading = false; //关闭加载loading
-            this.loading = false;
+            this.showReportLoading = false; //关闭加载loading
+            this.targetProgress = 0;
+            this.pdfLoading = false;
             this.$emit('PdfLoadEnd');
         },
     }

src/views/analysisReport/studentPage/downloadPdf/studentReport.vue

@@ -1,7 +1,6 @@
 <template>
     <!-- 学生报告 -->
-    <!-- v-loading="loading" element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.5)" :element-loading-text="loadingText" -->
-    <BookFlip :book-pages="bookPageImages" bookBg="student" :requestLoading="loading" :openLoading="openLoading" :coverTitle="`${stuClasName}${studentName}分析报告册`" subtitle="供参考学生使用" ref="bookFlipBox" @OpenBookImages="OpenBookImages" @PdfLoadEnd="PdfLoadEnd">
+    <BookFlip v-loading="loading" element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.5)" :element-loading-text="loadingText" :book-pages="bookPageImages" bookBg="student" :requestLoading="loading" :openLoading="openLoading" :coverTitle="`${stuClasName}${studentName}分析报告册`" subtitle="供参考学生使用" ref="bookFlipBox" @OpenBookImages="OpenBookImages" @PdfLoadEnd="PdfLoadEnd">
         <!-- 自定义每页内容 -->
         <template #default="slotProps">
             <template v-if="slotProps.type == 'web_mode'">
@@ -401,7 +400,7 @@ export default {
                 examLevel: this.$store.state.report.filterObject.examLevel, //1-联考 2-单校
                 contrastExamIds: this.$store.state.report.filterObject.contrastExamIds, //多次考试任务对比ID，不包含当前任务ID
                 examId: this.$store.state.report.filterObject.examId, //考试id
-                subjectCode: this.$store.state.report.filterObject.subjectCode, //科目code
+                subjectCode: 0, //this.$store.state.report.filterObject.subjectCode 科目code
                 subjectGroupType: this.$store.state.report.filterObject.subjectGroupType, //是否为组合科目 1为组合科目 0为非组合科目
                 isTotal: this.$store.state.report.filterObject.isTotal //是否为总分科目 1为总分 0为非总分
             }
@@ -723,7 +722,7 @@ export default {
                     })
                     this.historyExamData.datay = [datay];
                     this.historyExamData.tooltipData = [tooltipData];
-                    this.historyExamData.pageNum = this.SingleChartPage(this.historyExamData.chartData.length > 0 ? 363 : 0);
+                    this.historyExamData.pageNum = this.SingleChartPage(this.historyExamData.chartData.length > 0 && this.multiSubjectData.showHistory==1 ? 363 : 0);
                 } else {
                     this.historyExamData.chartData = [];
                     this.historyExamData.tooltipData = [];
@@ -1006,7 +1005,7 @@ export default {
                     })
                     this.singleSubjectData[index].historyExamData.datay = [datay];
                     this.singleSubjectData[index].historyExamData.tooltipData = [tooltipData];
-                    this.singleSubjectData[index].historyExamData.pageNum = this.SingleChartPage(this.singleSubjectData[index].historyExamData.chartData.length > 0 ? 363 : 0);
+                    this.singleSubjectData[index].historyExamData.pageNum = this.SingleChartPage(this.singleSubjectData[index].historyExamData.chartData.length > 0 && this.singleSubjectData[index]?.showHistory==1 ? 363 : 0);
                 }
             })
         },
@@ -1113,8 +1112,9 @@ export default {
                 chartHeight = datay.length > 0 ? 393 : 0;//雷达图
             }
             const chartPagesNum = this.SingleChartPage(chartHeight);
-            const staticHeader = titleData.slice(0,1);//固定表头
-            const dynamicHeader = titleData.slice(1);//动态分组标头
+            const HeadData = titleData.filter(item=>item.prop!='smallQuestionNames');
+            const staticHeader = HeadData.slice(0,1);//固定表头
+            const dynamicHeader = HeadData.slice(1);//动态分组标头
             
             const pageTableData = this.TableRowAndColumnPage(dynamicHeader,tableData,7,1);//8列一个表
             const tablePagesNum = pageTableData.tablePagesNum;

src/views/analysisReport/studentPage/mainPage.vue

@@ -32,7 +32,7 @@
                     @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>
+                <!-- <el-button v-if="isShowPadfBtn" style="margin-left: 10px;" size="medium" type="primary" :loading="stuPdfLoading" @click="StuDownloadPDF">下载PDF</el-button> -->
             </div>
         </div>
 
@@ -53,10 +53,12 @@
                                 <button class="mm_btn" v-if="showOneStudOneCase"
                                     :class="{ active: activeBtn === pathFourth }"
                                     @click="toPage(pathFourth)">一生一案</button>
+                                <button class="mm_btn" :class="{ active: activeBtn === pathFive }"
+                                    @click="toPage(pathFive)">报告打印</button>    
                             </div>
                             <!-- 520929546006958081 -->
                             <div class="right">
-                                <div class="page_filter" ref="filterContent" v-if="activeBtn != pathFourth">
+                                <div class="page_filter" ref="filterContent" v-if="activeBtn != pathFourth && activeBtn != pathFive">
                                     <FiltersItem :filtersData="filteredFilterData" @selectItem="ChangeFilters">
                                     </FiltersItem>
                                 </div>
@@ -153,6 +155,7 @@ export default {
             pathTwo: '/studentAnalysisReport/reportDetails/personalWrongQuestions',
             pathThree: '/studentAnalysisReport/reportDetails/personalProfile',//个人画像
             pathFourth: '/studentAnalysisReport/reportDetails/studentCase',//一生一案
+            pathFive: '/studentAnalysisReport/reportDetails/studentReport',//一生一案
             isLianXiao: false,//是否联校
             stuPdfLoading: false,
             schoolId: this.$store.state.user.userInfo.id,

src/views/analysisReport/studentPage/scrolReport/transcript.vue

@@ -3,7 +3,7 @@
   <div>
     <TranscriptTotal v-if="isTotalScore" />
     <TranscriptSingle v-else />
-    <StudentReport ref="studentReportPdf" @closePdfLoading="closePdfLoading" @isPdfDataLoadEnd="isPdfDataLoadEnd"></StudentReport>
+    <!-- <StudentReport ref="studentReportPdf" @closePdfLoading="closePdfLoading" @isPdfDataLoadEnd="isPdfDataLoadEnd"></StudentReport> -->
   </div>
 </template>
 
@@ -11,13 +11,13 @@
 
 import TranscriptSingle from "@/views/analysisReport/studentPage/scrolReport/transcript_single";//单科的G组分析
 import TranscriptTotal from "@/views/analysisReport/studentPage/scrolReport/transcript_total";//单科的G组分析
-import StudentReport from '../downloadPdf/studentReport.vue'
+// import StudentReport from '../downloadPdf/studentReport.vue'
 
 export default {
   components: {
     TranscriptSingle,
     TranscriptTotal,
-    StudentReport
+    // StudentReport
   },
   computed: {
     isTotalScore(){