gx

chenyc

2025-02-28 35a85b085df4c76c38c76dfda74aa4527cea0b5b

 src/views/home/components/editDietary.vue

@@ -1,8 +1,8 @@
<template>
    <div class="dietarySurvey-item">
        <el-dialog  v-model="state.dialogTableVisible" title="膳食生活调查表" :fullscreen="true" width="100%">
        <el-dialog  v-model="state.dialogTableVisible" title="膳食生活调查22表" :fullscreen="true" width="100%">
            <div class="container" style="width: 100%; height: 100%;overflow: auto;">
                <div id="printMe">
                <div ref="printRef">
                    <div>
                        <el-form size="small">
                            <div style="width: 100%">
@@ -906,14 +906,14 @@
                    <el-button type="primary" @click="onSubmit">
                        保存
                    </el-button>
                    <el-button v-if="state.viewInfo.id" type="primary" v-print="'#printMe'">
                    <el-button v-if="state.viewInfo.id" type="primary" @click="onPrint">
                        <el-icon><Printer /></el-icon>
                        打印
                    </el-button>
                    <el-button type="primary" v-if="state.viewInfo.id" @click="generatePDF">
                    <!-- <el-button type="primary" v-if="state.viewInfo.id" @click="generatePDF">
                        <el-icon><Position /></el-icon>
                        导出
                    </el-button>
                    </el-button> -->
                    
                </div>
            </template>
@@ -924,8 +924,9 @@

</template>

<script setup lang="ts" name="visualizingLinkDemo2">
<script setup lang="ts" >
import html2pdf from 'html2pdf.js';
import printJs from 'print-js';
import { reactive, onMounted, onUnmounted, ref } from 'vue';
import { formatDate } from '/@/utils/formatTime';
import { NextLoading } from '/@/utils/loading';
@@ -941,6 +942,8 @@
const { userInfos } = storeToRefs(stores);
const router = useRouter()
const emit = defineEmits([ "shuaxin" ]);
// 定义变量内容
const printRef = ref();
const state = reactive({
    dialogTableVisible:false,
    tableData: {
@@ -1140,7 +1143,13 @@
}
// 打印
const onPrint=()=>{
    
    printJs({
      printable: printRef.value,
      type: 'html',
      css: ['@/assets/css/printcss.css','//at.alicdn.com/t/c/font_2298093_rnp72ifj3ba.css', '//unpkg.com/element-plus/dist/index.css'],
      scanStyles: false,
      style: `@media print{}}`,
   });
}
const generatePDF=()=> {
      const element = document.getElementById('printMe');
@@ -1410,36 +1419,6 @@


<style scoped lang="scss">
@media print {
  body * {
    visibility: hidden;
  }
  #printMe, #printMe * {
    visibility: visible;
  }
  #printMe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  /* 防止内容在页面边界处被截断 */
  p, h1, div {
    page-break-inside: avoid;
  }

  /* 确保表格行不会被截断（如果有表格的话） */
  table tr {
    page-break-inside: avoid;
  }

  /* 设置页面大小和边距 */
  @page {
    size: A4;
    margin: 0mm;
  }
}
.gridtable {
    font-family: verdana, arial, sans-serif;
    font-size: 11px;