From 68e0a0691628bd918b0b3a59de24bac2e8f84449 Mon Sep 17 00:00:00 2001
From: wxg0103 <727495428@qq.com>
Date: Fri, 21 Oct 2022 19:04:12 +0800
Subject: [PATCH] =?UTF-8?q?refactor(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):?=
 =?UTF-8?q?=20=E4=BC=98=E5=8C=96=E5=9C=BA=E6=99=AF=E6=8A=A5=E5=91=8A?=
 =?UTF-8?q?=E5=AF=BC=E5=87=BA=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--bug=1018154 --user=王孝刚 【接口测试】接口场景测试报告导出样式优化
https://www.tapd.cn/55049933/s/1271480
---
 .../automation/report/ApiReportDetail.vue     | 28 ++++++++++++++-----
 1 file changed, 21 insertions(+), 7 deletions(-)

diff --git a/api-test/frontend/src/business/automation/report/ApiReportDetail.vue b/api-test/frontend/src/business/automation/report/ApiReportDetail.vue
index cb0947788d..4ce2280be3 100644
--- a/api-test/frontend/src/business/automation/report/ApiReportDetail.vue
+++ b/api-test/frontend/src/business/automation/report/ApiReportDetail.vue
@@ -1,5 +1,5 @@
 <template>
-  <ms-container v-loading="loading">
+  <ms-container v-loading="loading || reportExportVisible">
     <ms-main-container class="api-report-content">
       <el-card class="report-body">
         <section class="report-container" v-if="this.report.testId">
@@ -98,7 +98,7 @@
               :title="report.name"
               :content="content"
               :report="report"
-              :total-time="totalTime"/>
+              :total-time="totalTime" class="ms-copy-bottom"/>
           </main>
         </section>
       </el-card>
@@ -119,7 +119,7 @@ import MsApiReportExport from "./ApiReportExport";
 import MsApiReportViewHeader from "./ApiReportViewHeader";
 import {RequestFactory} from "../../definition/model/ApiTestModel";
 import {getCurrentProjectID} from "metersphere-frontend/src/utils/token";
-import {getUUID, windowPrint} from "metersphere-frontend/src/utils";
+import {exportPdf, getUUID} from "metersphere-frontend/src/utils";
 import {hasLicense} from "metersphere-frontend/src/utils/permission";
 import {
   getScenarioReport,
@@ -129,6 +129,7 @@ import {
 } from "../../../api/scenario-report";
 import {STEP} from "../../automation/scenario/Setting";
 import MsCodeEdit from "metersphere-frontend/src/components/MsCodeEdit";
+import html2canvas from "html2canvas";
 
 export default {
   name: "MsApiReport",
@@ -672,7 +673,7 @@ export default {
         } else {
           if (this.fullTreeNodes) {
             this.fullTreeNodes.forEach(item => {
-              if (item.type === "scenario" || item.type === "UiScenario") {
+              if (item.type === "scenario") {
                 let scenario = {name: item.label, requestResults: []};
                 if (this.content.scenarios && this.content.scenarios.length > 0) {
                   this.content.scenarios.push(scenario);
@@ -687,9 +688,15 @@ export default {
       }
       this.reportExportVisible = true;
       let reset = this.exportReportReset;
+      let name = this.report.name;
       this.$nextTick(() => {
-        windowPrint('apiTestReport', 0.57);
-        reset();
+        setTimeout(() => {
+          let promise = html2canvas(document.getElementById("apiTestReport"), {scale: 2});
+          Promise.all([promise]).then(function (canvas) {
+            exportPdf(name || "scenario-report", canvas);
+            reset();
+          });
+        }, 1000);
       });
     },
     handleSave() {
@@ -711,7 +718,8 @@ export default {
       });
     },
     exportReportReset() {
-      this.$router.go(0);
+      this.reportExportVisible = false;
+      this.loading = false;
     },
     handleProjectChange() {
       this.$router.push('/api/automation/report');
@@ -794,4 +802,10 @@ export default {
 .report-body {
   min-width: 750px !important;
 }
+
+.ms-copy-bottom {
+  position: absolute;
+  bottom: 0;
+
+}
 </style>