From 867849a70abe49517a648343f8f8a684a12f73bd Mon Sep 17 00:00:00 2001
From: yuyu <1981343953@qq.com>
Date: 星期三, 30 八月 2023 11:32:31 +0800
Subject: [PATCH] 8.30提交 导出pdf功能

---
 src/views/experiment/checkTheReport/index.vue |   83 +++++++++++++++++++++++++++++++++++++----
 1 files changed, 75 insertions(+), 8 deletions(-)

diff --git a/src/views/experiment/checkTheReport/index.vue b/src/views/experiment/checkTheReport/index.vue
index ab2d6ee..253340f 100644
--- a/src/views/experiment/checkTheReport/index.vue
+++ b/src/views/experiment/checkTheReport/index.vue
@@ -30,7 +30,7 @@
         </el-form-item>
       </el-form>
       <el-form>
-        <el-button class="rightBtn" type="primary" icon="el-icon-document"
+        <el-button @click="exportToPDF" class="rightBtn" type="primary" icon="el-icon-document"
           >瀵煎嚭鎶ュ憡</el-button
         >
       </el-form>
@@ -60,7 +60,8 @@
           <el-button type="primary" @click="printFun()">鎵撳嵃</el-button>
         </span>
         <div class="printStyle">
-          <preview id="printDiv" :reportData="reportData"></preview>
+          <Preview id="printRaw" :reportData="reportData" v-if="reportType===0"></Preview>
+          <TestReport ref="testreport" id="printFinished" :reportData="reportData" v-else></TestReport>
         </div>
       </el-dialog>
       <div class="table-box">
@@ -76,6 +77,7 @@
             textAlign: 'center',
           }"
           :data="reportTable"
+          @selection-change="handleSelectionChange"
           style="width: 100%"
         >
           <el-table-column type="selection" label="" min-width="5%" />
@@ -175,55 +177,118 @@
         </div>
       </div>
     </div>
+    <Preview ref="preview" id="printRaw" :reportData="reportData" v-show="false"></Preview>
+    <TestReport ref="testreport" id="printFinished" :reportData="reportData" v-show="false"></TestReport>
+    <el-dialog
+      title="瀵煎嚭pdf"
+      :visible.sync="dialogPdfVisible"
+      width="30%"
+      :before-close="handleClose">
+      <span>纭畾寮�濮嬪鍑哄悧锛�</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogPdfVisible = false">鍙� 娑�</el-button>
+        <el-button type="primary" @click="confirmExport">纭� 瀹�</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { selectAllReport,getReportData } from "@/api/experiment/checkTheReport";
 import Preview from "@/components/experiment/checkTheReport/index.vue";
+import TestReport from "@/components/experiment/template_testReport/index.vue"
 import PrintJS from 'print-js'
+import html2pdf from 'html2pdf.js'
+
 export default {
   data() {
     return {
       reportData: [],
+      reportType: 0,
       searchData:{
         sample_code:'',
         reportCode:'',
         application_code: ''
       },
       checkStatus: undefined,
-      reportTable: [],
+      reportTable: [
+        {
+          materialCode:'SN23-0517001',
+          reportCode: 'SN23-0517001',
+          inspectionCode: 'SN23-0517001',
+          approver:'榛勫皬鏄�',
+          status: '',
+          conclusion: 1,
+          name: '榛勫皬鏄�'
+        },
+        {
+          materialCode:'SN23-0517001',
+          reportCode: 'SN23-0517001',
+          inspectionCode: 'SN23-0517001',
+          approver:'榛勫皬鏄�',
+          status: '',
+          conclusion: 1,
+          name: '榛勫皬鏄�'
+        }
+      ],
       page: 1,
       total: 0,
       pageSize: 10,
       checked: true,
       dialogVisible: false,
+      dialogPdfVisible: false,
+      selectedRows: []
     };
   },
   created() {
-    this.getData();
+    // this.getData();
   },
   mounted(){
   },
   components:{
-    Preview
+    Preview,
+    TestReport
   },
   methods: {
     async queryReportByRCode(code){
       const resp = await getReportData({code:code});
       this.reportData = resp.data;
+      this.dialogVisible = true;
       console.log(this.reportData);
     },
     //鏌ョ湅鎶ュ憡鎸夐挳
     previewFun(row){
-      this.dialogVisible = true;
+      console.log(row)
+      this.reportType = row.type;
       this.queryReportByRCode(row.reportCode);
+    },
+    handleSelectionChange(selection){
+      this.selectedRows = selection;
+    },
+    // 鎵归噺瀵煎嚭鎶ュ憡
+    exportToPDF() {
+      this.dialogPdfVisible = true;
+    },
+    // 纭瀵煎嚭妯℃�佹
+    confirmExport(){
+      this.selectedRows.forEach(async row => {
+        const element = document.getElementById('printFinished');
+        console.log(element)
+        // 璁剧疆TestReport缁勪欢鐨剅eportData灞炴�т负褰撳墠琛岀殑鎶ュ憡鏁版嵁
+        const resp = await getReportData({code:row.reportCode});
+        this.$nextTick(() => {
+          this.$refs.testreport.reportData = resp.data;
+          html2pdf().from(element).save(`exported_${row.reportCode}.pdf`);
+        });
+      });
+      this.dialogPdfVisible = false;
+      this.selectedRows = [];
     },
     //鎵撳嵃鎸夐挳
     printFun(){
       this.dialogVisible = false;
       PrintJS({
-        printable: "printDiv",
+        printable: this.reportType===0 ? "printRaw" : "printFinished",
         type: "html",
         // header: "鍘熸潗鏂欐娴嬫姤鍛�",
         targetStyles: ["*"],
@@ -295,6 +360,8 @@
   }
 }
 .library-table {
+  height: 80vh;
+  overflow: scroll;
   background-color: #fff;
   flex: 1;
   margin: 0px -15px;
@@ -324,7 +391,7 @@
   }
   .printStyle{
     overflow: scroll;
-    height:600px;
+    height:500px;
     .el-button{
       position: absolute;
       top: 10vh;

--
Gitblit v1.9.3