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 | 114 +++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 94 insertions(+), 20 deletions(-)
diff --git a/src/views/experiment/checkTheReport/index.vue b/src/views/experiment/checkTheReport/index.vue
index 171ca9d..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>
@@ -57,10 +57,11 @@
:visible.sync="dialogVisible"
width="60%">
<span slot="footer" class="dialog-footer">
- <el-button type="primary" size="small" @click="printFun()">鎵撳嵃</el-button>
+ <el-button type="primary" @click="printFun()">鎵撳嵃</el-button>
</span>
<div class="printStyle">
- <preview id="printDiv"></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%" />
@@ -93,14 +95,14 @@
</template></el-table-column
>
<el-table-column
- prop="materialCode"
+ prop="reportCode"
label="鎶ュ憡鍗曞彿"
sortable
min-width="10%"
>
<template slot-scope="scope">
<span style="color: #409eff;">
- {{ scope.row.materialCode }}
+ {{ scope.row.reportCode }}
</span>
</template></el-table-column
>
@@ -175,53 +177,123 @@
</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 } from "@/api/experiment/checkTheReport";
+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(){
- // this.dialogVisible = true;
},
components:{
- Preview
+ Preview,
+ TestReport
},
methods: {
- //棰勮鎸夐挳
- previewFun(){
+ async queryReportByRCode(code){
+ const resp = await getReportData({code:code});
+ this.reportData = resp.data;
this.dialogVisible = true;
+ console.log(this.reportData);
+ },
+ //鏌ョ湅鎶ュ憡鎸夐挳
+ previewFun(row){
+ 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(){
- PrintJS({
- printable: "printDiv",
- type: "html",
- // header: "鍘熸潗鏂欐娴嬫姤鍛�",
- targetStyles: ["*"],
- ignoreElements: ["no-ignore"],
- });
+ this.dialogVisible = false;
+ PrintJS({
+ printable: this.reportType===0 ? "printRaw" : "printFinished",
+ type: "html",
+ // header: "鍘熸潗鏂欐娴嬫姤鍛�",
+ targetStyles: ["*"],
+ ignoreElements: ["no-ignore"],
+ });
},
// 鐘舵�佹寜閽�
handleRadioChange() {
@@ -288,6 +360,8 @@
}
}
.library-table {
+ height: 80vh;
+ overflow: scroll;
background-color: #fff;
flex: 1;
margin: 0px -15px;
@@ -317,7 +391,7 @@
}
.printStyle{
overflow: scroll;
- height:600px;
+ height:500px;
.el-button{
position: absolute;
top: 10vh;
--
Gitblit v1.9.3