|
|
@@ -1,30 +1,38 @@
|
|
|
<template>
|
|
|
- <el-dialog :visible.sync="visible" :show-close="false" :maskClosable="false" :close-on-click-modal="false"
|
|
|
- @cancel="hideModal" :width="350 + 'mm'">
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="visible"
|
|
|
+ :show-close="false"
|
|
|
+ :maskClosable="false"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ @cancel="hideModal"
|
|
|
+ :width="350 + 'mm'"
|
|
|
+ >
|
|
|
<div :spinning="spinning" style="min-height: 100px">
|
|
|
- <div id="preview_content" ref="printDom">
|
|
|
-
|
|
|
- </div>
|
|
|
+ <div id="preview_content" ref="printDom"></div>
|
|
|
</div>
|
|
|
<template slot="title">
|
|
|
<div>
|
|
|
<!-- <div style="margin-right: 20px">打印预览</div> -->
|
|
|
- <el-button :loading="waitShowPrinter" type="primary" icon="printer" @click.stop="print">打印</el-button>
|
|
|
+ <el-button
|
|
|
+ :loading="waitShowPrinter"
|
|
|
+ type="primary"
|
|
|
+ icon="printer"
|
|
|
+ @click.stop="print"
|
|
|
+ >打印</el-button
|
|
|
+ >
|
|
|
<!-- <el-button type="primary" icon="printer" @click.stop="toPdf">pdf</el-button> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
<template slot="footer">
|
|
|
- <el-button key="close" type="info" @click="hideModal">
|
|
|
- 关闭
|
|
|
- </el-button>
|
|
|
+ <el-button key="close" type="info" @click="hideModal"> 关闭 </el-button>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
// import { downloadPDF } from '@/utils/pdf'
|
|
|
-import { addPrint } from './print-data'
|
|
|
-import { detailArr } from './print-data'
|
|
|
+import { addPrint } from "./print-data";
|
|
|
+import { detailArr } from "./print-data";
|
|
|
export default {
|
|
|
name: "printPreview",
|
|
|
props: {},
|
|
|
@@ -38,60 +46,62 @@ export default {
|
|
|
// 模板
|
|
|
hiprintTemplate: {},
|
|
|
// 数据
|
|
|
- printData: {}
|
|
|
- }
|
|
|
+ printData: {},
|
|
|
+ };
|
|
|
},
|
|
|
computed: {},
|
|
|
watch: {},
|
|
|
- created() {
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- },
|
|
|
+ created() {},
|
|
|
+ mounted() {},
|
|
|
methods: {
|
|
|
// handleExport() {
|
|
|
// downloadPDF(this.$refs.printDom);
|
|
|
// },
|
|
|
hideModal() {
|
|
|
- this.visible = false
|
|
|
- this.waitShowPrinter = false
|
|
|
+ this.visible = false;
|
|
|
+ this.waitShowPrinter = false;
|
|
|
// console.log(this.$parent);
|
|
|
},
|
|
|
- show(hiprintTemplate, printData, width = '210') {
|
|
|
- this.visible = true
|
|
|
- this.width = width
|
|
|
- this.hiprintTemplate = hiprintTemplate
|
|
|
- printData.addPrintHtml({ options: { width: 140, height: 35, top: 180, left: 20, content:this.$refs.printData } });
|
|
|
+ show(hiprintTemplate, printData, width = "210") {
|
|
|
+ this.visible = true;
|
|
|
+ this.width = width;
|
|
|
+ this.hiprintTemplate = hiprintTemplate;
|
|
|
+ printData.addPrintHtml({
|
|
|
+ options: {
|
|
|
+ width: 140,
|
|
|
+ height: 35,
|
|
|
+ top: 180,
|
|
|
+ left: 20,
|
|
|
+ content: this.$refs.printData,
|
|
|
+ },
|
|
|
+ });
|
|
|
|
|
|
setTimeout(() => {
|
|
|
// eslint-disable-next-line no-undef
|
|
|
- $('#preview_content').html(hiprintTemplate.getHtml(printData))
|
|
|
- this.spinning = false
|
|
|
- }, 500)
|
|
|
+ $("#preview_content").html(hiprintTemplate.getHtml(printData));
|
|
|
+ this.spinning = false;
|
|
|
+ }, 500);
|
|
|
},
|
|
|
print() {
|
|
|
- this.hiprintTemplate.print({});
|
|
|
+ this.hiprintTemplate.print({});
|
|
|
|
|
|
- setTimeout(()=>{
|
|
|
- this.hideModal()
|
|
|
- },2000)
|
|
|
+ setTimeout(() => {
|
|
|
+ this.hideModal();
|
|
|
+ }, 2000);
|
|
|
},
|
|
|
// toPdf() {
|
|
|
// downloadPDF(this.$refs.printDom);
|
|
|
// this.hiprintTemplate.toPdf({}, '打印预览');
|
|
|
// },
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
-
|
|
|
-
|
|
|
::v-deep .el-dialog__body {
|
|
|
padding: 0;
|
|
|
}
|
|
|
|
|
|
-
|
|
|
::v-deep tr {
|
|
|
height: 40px !important;
|
|
|
}
|
|
|
@@ -115,86 +125,7 @@ export default {
|
|
|
|
|
|
.ant-modal-content {
|
|
|
margin-bottom: 24px;
|
|
|
-
|
|
|
}
|
|
|
|
|
|
-@media print {
|
|
|
-
|
|
|
-/*
|
|
|
- td {
|
|
|
- border: none !important;
|
|
|
- } */
|
|
|
-
|
|
|
- .drag_item_box {
|
|
|
- height: 100%;
|
|
|
- padding: 6px;
|
|
|
- }
|
|
|
-
|
|
|
- .drag_item_box>div {
|
|
|
- height: 100%;
|
|
|
- width: 100%;
|
|
|
- background-color: #fff;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
|
|
|
- .drag_item_box>div>a {
|
|
|
- text-align: center;
|
|
|
- text-decoration-line: none;
|
|
|
- }
|
|
|
-
|
|
|
- .drag_item_box>div>a>span {
|
|
|
- font-size: 28px;
|
|
|
- }
|
|
|
-
|
|
|
- .drag_item_box>div>a>p {
|
|
|
- margin: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .drag_item_title {
|
|
|
- font-size: 16px;
|
|
|
- padding: 12px 6px 0 6px;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .card-design {
|
|
|
- overflow: hidden;
|
|
|
- overflow-x: auto;
|
|
|
- overflow-y: auto;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep .el-dialog__body {
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep table {
|
|
|
- height: 240px !important;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep tr {
|
|
|
- height: 40px !important;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep .hiprint-printPaper {
|
|
|
- margin: 0 auto;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep tr td {
|
|
|
- border: 0 !important;
|
|
|
- /* width: 911px !important;
|
|
|
- height: 529px !important; */
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .ant-modal-body {
|
|
|
- padding: 0px;
|
|
|
- }
|
|
|
-
|
|
|
- .ant-modal-content {
|
|
|
- margin-bottom: 24px;
|
|
|
-
|
|
|
- }
|
|
|
-}
|
|
|
</style>
|
howie