Explorar o código

性能验证--报告查询:导出pdf优化以及 “实验数据” 取消滚动条全部展开

ZhuJiaHao hai 5 meses
pai
achega
6af234246e

+ 37 - 1
src/views/business/performance/components/experimental-data.vue

@@ -22,7 +22,8 @@
       </div>
       <div class="content">
         <template v-if="expData && $utils.isNotEmpty(expData.dataDTO)">
-          <el-table
+          <!-- 原始版本(带滚动条) -->
+          <!-- <el-table
             :data="expData.dataDTO.list"
             border
             stripe
@@ -55,6 +56,41 @@
                 </template>
               </el-table-column>
             </el-table-column>
+          </el-table> -->
+          
+          <!-- 新版本(无滚动条,全部展开) -->
+          <el-table
+            :data="expData.dataDTO.list"
+            border
+            stripe
+            highlight-current-row
+            style="width: 100%"
+          >
+            <el-table-column
+              v-for="(h, hIndex) in expData.dataDTO.header"
+              :key="h.children && h.children.length ? hIndex : h.prop"
+              :prop="h.prop"
+              :label="h.label"
+              width="80"
+              header-align="center"
+              align="center"
+            >
+              <template slot="header" slot-scope="scope">
+                <span v-html="scope.column.label" />
+              </template>
+              <el-table-column
+                v-for="c in h.children"
+                :key="c.prop"
+                :prop="c.prop"
+                :label="c.label"
+                header-align="center"
+                align="center"
+              >
+                <template slot="header" slot-scope="scope">
+                  <span v-html="scope.column.label" />
+                </template>
+              </el-table-column>
+            </el-table-column>
           </el-table>
           <div class="note" v-html="expData.dataDTO.note" />
         </template>

+ 2 - 2
src/views/business/performance/experimentalView.vue

@@ -396,8 +396,8 @@ export default {
         const contentWidth = canvas.width
         const contentHeight = canvas.height
         
-        // ========== 自适应长页面(无分页,高清晰度) ==========
-        // 使用canvas原始尺寸作为PDF尺寸,保持高清晰度
+        // ========== 自适应长页面(无分页) ==========
+        // 使用canvas原始尺寸作为PDF尺寸
         const imgWidth = contentWidth
         const imgHeight = contentHeight
         const pageData = canvas.toDataURL('image/jpeg', 1.0)

+ 30 - 18
src/views/business/performance/xnyzReport.vue

@@ -295,26 +295,38 @@ export default {
       }).then((canvas) => {
         const contentWidth = canvas.width
         const contentHeight = canvas.height
-        const pageHeight = (contentWidth / 592.28) * 841.89
-        let leftHeight = contentHeight
-        let position = 0
-        const imgWidth = 595.28
-        const imgHeight = (592.28 / contentWidth) * contentHeight
+
+        // ========== 自适应长页面(无分页) ==========
+        // 使用canvas原始尺寸作为PDF尺寸
+        const imgWidth = contentWidth
+        const imgHeight = contentHeight
         const pageData = canvas.toDataURL('image/jpeg', 1.0)
-        const PDF = new JsPDF('', 'pt', 'a4')
-        if (leftHeight < pageHeight) {
-          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
-        } else {
-          while (leftHeight > 0) {
-            PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
-            leftHeight -= pageHeight
-            position -= 841.89
-            if (leftHeight > 0) {
-              PDF.addPage()
-            }
-          }
-        }
+        // 创建与canvas相同尺寸的PDF,无压缩,无分页
+        const PDF = new JsPDF('p', 'pt', [imgWidth, imgHeight])
+        PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
         PDF.save(title + '.pdf')
+
+        // ========== 原有逻辑:A4分页(备用、勿删!!) ==========
+        // const pageHeight = (contentWidth / 592.28) * 841.89
+        // let leftHeight = contentHeight
+        // let position = 0
+        // const imgWidth = 595.28
+        // const imgHeight = (592.28 / contentWidth) * contentHeight
+        // const pageData = canvas.toDataURL('image/jpeg', 1.0)
+        // const PDF = new JsPDF('', 'pt', 'a4')
+        // if (leftHeight < pageHeight) {
+        //   PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
+        // } else {
+        //   while (leftHeight > 0) {
+        //     PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
+        //     leftHeight -= pageHeight
+        //     position -= 841.89
+        //     if (leftHeight > 0) {
+        //       PDF.addPage()
+        //     }
+        //   }
+        // }
+        // PDF.save(title + '.pdf')
       }).finally(() => {
         // 恢复显示标题和导出按钮
         headerElement.style.display = originalDisplay