0731

src/views/drivingSchool/workReport/index.vue

@@ -122,6 +122,13 @@
         </div>
       </div>
     </el-dialog>
+    <el-dialog title="打印预览" :visible.sync="showView" width="80%">
+      <div id="printContent" v-html="htmText"></div>
+      <template #footer>
+        <el-button @click="showView = false">取消</el-button>
+        <el-button type="primary" v-print="printConfig">打印</el-button>
+      </template>
+    </el-dialog>
 
     <!-- 分页组件 -->
     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@@ -135,7 +142,6 @@
 import * as ReportApi from '@/views/drivingSchool/workReport/api/index';
 import ReportForm from './ReportForm.vue';
 import print from 'vue-print-nb'
-import {workReportView} from "@/views/drivingSchool/workReport/api/index";
 
 export default {
   name: "Report",
@@ -186,6 +192,13 @@ export default {
       currentFileName: '',
       currentFileType: '',
       officePreviewUrl: '',
+
+      printConfig: {
+        id: 'printContent',
+        popTitle: '工作汇报', // 打印标题
+        extraCss: 'https://cdn.jsdelivr.net/npm/element-ui/lib/theme-chalk/index.css', // 可选：额外CSS
+        extraHead: '<meta http-equiv="Content-Language" content="zh-cn"/>' // 可选：额外head内容
+      },
     };
   },
   computed: {
@@ -374,4 +387,18 @@ export default {
   background-color: #f0f7ff;
 }
 
+@media print {
+  body * {
+    visibility: hidden;
+  }
+  #printContent, #printContent * {
+    visibility: visible;
+  }
+  #printContent {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+  }
+}
 </style>