| | |
| | | </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> |
| | |
| | | <el-button type="primary" @click="printFun()">打印</el-button> |
| | | </span> |
| | | <div class="printStyle"> |
| | | <preview id="printDiv" :reportData="reportData" v-if="reportType===0"></preview> |
| | | <div v-else>成品检测报告</div> |
| | | <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"> |
| | |
| | | textAlign: 'center', |
| | | }" |
| | | :data="reportTable" |
| | | @selection-change="handleSelectionChange" |
| | | style="width: 100%" |
| | | > |
| | | <el-table-column type="selection" label="" min-width="5%" /> |
| | |
| | | </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 { |
| | |
| | | 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){ |
| | |
| | | }, |
| | | //查看报告按钮 |
| | | 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组件的reportData属性为当前行的报告数据 |
| | | 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: ["*"], |