From 365047e0149113f3ec3c6e887e1a08d7c138c8e1 Mon Sep 17 00:00:00 2001
From: fit2-zhao <yong.zhao@fit2cloud.com>
Date: Wed, 26 Oct 2022 13:00:31 +0800
Subject: [PATCH] =?UTF-8?q?style(=E4=BB=BB=E5=8A=A1=E4=B8=AD=E5=BF=83):=20?=
 =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E4=B8=AD=E5=BF=83=E7=BF=BB=E9=A1=B5=E8=A2=AB?=
 =?UTF-8?q?=E9=81=AE=E6=8C=A1=E6=A0=B7=E5=BC=8F=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--bug=1018893 --user=赵勇 【任务中心】任务中心底部看不到分页功能 https://www.tapd.cn/55049933/s/1277969
---
 .../automation/report/ApiReportDetail.vue     |  2 +-
 .../automation/report/ApiReportExport.vue     |  1 +
 .../src/components/task/TaskCenter.vue        |  4 +--
 .../sdk-parent/frontend/src/utils/index.js    | 36 +++----------------
 4 files changed, 8 insertions(+), 35 deletions(-)

diff --git a/api-test/frontend/src/business/automation/report/ApiReportDetail.vue b/api-test/frontend/src/business/automation/report/ApiReportDetail.vue
index 36855feda1..7babd25ee8 100644
--- a/api-test/frontend/src/business/automation/report/ApiReportDetail.vue
+++ b/api-test/frontend/src/business/automation/report/ApiReportDetail.vue
@@ -105,7 +105,7 @@
       :title="report.name"
       :content="content"
       :report="report"
-      :total-time="totalTime" class="target-node-item"/>
+      :total-time="totalTime"/>
   </div>
 </template>
 
diff --git a/api-test/frontend/src/business/automation/report/ApiReportExport.vue b/api-test/frontend/src/business/automation/report/ApiReportExport.vue
index bb078a8f8b..e8f5dc5fc0 100644
--- a/api-test/frontend/src/business/automation/report/ApiReportExport.vue
+++ b/api-test/frontend/src/business/automation/report/ApiReportExport.vue
@@ -122,6 +122,7 @@ export default {
 .scenario-result {
   margin-top: 20px;
   margin-bottom: 20px;
+  min-width: 1200px;
 }
 
 .method {
diff --git a/framework/sdk-parent/frontend/src/components/task/TaskCenter.vue b/framework/sdk-parent/frontend/src/components/task/TaskCenter.vue
index e36f9e811d..5ad0a996d9 100644
--- a/framework/sdk-parent/frontend/src/components/task/TaskCenter.vue
+++ b/framework/sdk-parent/frontend/src/components/task/TaskCenter.vue
@@ -83,7 +83,7 @@
         </div>
         <el-divider direction="horizontal" style="width: 100%"/>
 
-        <div class="report-container">
+        <div class="ms-body-container">
           <div v-for="item in taskData" :key="item.id" style="margin-bottom: 5px;">
             <el-card class="ms-card-task" @click.native="showReport(item)">
               <span>
@@ -443,7 +443,7 @@ export default {
 
 
 <style scoped>
-.report-container {
+.ms-body-container {
   height: calc(100vh - 270px);
   overflow-y: auto;
 }
diff --git a/framework/sdk-parent/frontend/src/utils/index.js b/framework/sdk-parent/frontend/src/utils/index.js
index 18f191f343..092fbc8798 100644
--- a/framework/sdk-parent/frontend/src/utils/index.js
+++ b/framework/sdk-parent/frontend/src/utils/index.js
@@ -363,37 +363,10 @@ export function downloadPDF(ele, pdfName) {
   let context = canvas.getContext("2d");
   context.scale(2, 2);
   context.translate(-eleOffsetLeft - abs, -eleOffsetTop);
-  // 这里默认横向没有滚动条的情况，因为offset.left(),有无滚动条的时候存在差值，因此
-  // translate的时候，要把这个差值去掉
-
-  //  解决分页内容被切割问题
-  let pageHeightNum = canvas.width / 2 / 592.28 * 841.89
-  let lists = document.getElementsByClassName('target-node-item')
-  for (let i = 0; i < lists.length; i++) {
-    let multiple = Math.ceil((lists[i].offsetTop + lists[i].offsetHeight) / pageHeightNum)
-    if (isSplit(lists, i, multiple * pageHeightNum)) {
-      let divParent = lists[i].parentNode // 获取该div的父节点
-      let newNode = document.createElement('div')
-      newNode.className = 'ms-export-div'
-      newNode.style.background = '#ffffff'
-      let _H = multiple * pageHeightNum - (lists[i].offsetTop + lists[i].offsetHeight)
-      newNode.style.height = _H + 50 + 'px'
-      let next = lists[i].nextSibling // 获取div的下一个兄弟节点
-      // 判断兄弟节点是否存在
-      if (next) {
-        // 存在则将新节点插入到div的下一个兄弟节点之前，即div之后
-        divParent.insertBefore(newNode, next)
-      } else {
-        // 不存在则直接添加到最后,appendChild默认添加到divParent的最后
-        divParent.appendChild(newNode)
-      }
-    }
-  }
-
+  let scrollWidth = document.getElementById("apiTestReport").scrollWidth;
   html2canvas(ele, {
-    dpi: 300,
-    backgroundColor: 'white',
-    // allowTaint: true,  //允许 canvas 污染， allowTaint参数要去掉，否则是无法通过toDataURL导出canvas数据的
+    dpi: 100,
+    width: scrollWidth < 1500 ? 1500 : scrollWidth, // 为了使横向滚动条的内容全部展示
     useCORS: true  //允许canvas画布内 可以跨域请求外部链接图片, 允许跨域请求。
   }).then((canvas) => {
     let contentWidth = canvas.width;
@@ -405,7 +378,7 @@ export function downloadPDF(ele, pdfName) {
     //页面偏移
     let position = 0;
     //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
-    let imgWidth = 595.28;
+    let imgWidth = 610.28;
     let imgHeight = 595.28 / contentWidth * contentHeight;
 
     let pageData = canvas.toDataURL('image/jpeg', 1.0);
@@ -416,7 +389,6 @@ export function downloadPDF(ele, pdfName) {
     if (leftHeight < pageHeight) {
       //在pdf.addImage(pageData, 'JPEG', 左，上，宽度，高度)设置在pdf中显示；
       pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight);
-      // pdf.addImage(pageData, 'JPEG', 20, 40, imgWidth, imgHeight);
     } else {    // 分页
       while (leftHeight > 0) {
         pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight);