chenyc
2024-12-21 83ef13dab87cb59fccf0514d7d47f2ca0cae9f0f
src/views/home/components/pingubiao/editDietary4.vue
@@ -2,7 +2,7 @@
    <div class="dietarySurvey-item">
        <el-dialog  v-model="state.dialogTableVisible" title="PEW(蛋白质能量消耗评估)" :fullscreen="true" width="100%">
            <div class="container" style="width: 100%; height: 100%;overflow: auto;">
                <div>
                <div id="pinggu4">
                    <div>
                        <el-form size="small" >
                            <div style="width: 100%">
@@ -11,14 +11,14 @@
                                    <tr>
                                        <th colspan="2">
                                            <el-form-item label="初次调查日期">
                                                <el-date-picker v-model="state.tableData.初次调查日期" type="date" style="width: 100px;"
                                                <el-date-picker v-model="state.tableData.初次调查日期" type="date" readonly style="width: 100px;"
                                                    placeholder="" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
                                            </el-form-item>
                                        </th>
                                        <th colspan="2">
                                            <el-form-item label="更新日期">
                                                <el-date-picker v-model="state.tableData.更新日期" type="date" style="width: 100px;"
                                                <el-date-picker v-model="state.tableData.更新日期" type="date" readonly style="width: 100px;"
                                                    placeholder="" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
                                            </el-form-item>
@@ -26,7 +26,7 @@
                                        </th>
                                        <th colspan="2">
                                            <el-form-item label="记录者">
                                                <el-input v-model="state.tableData.记录者" style="width: 100px;"   placeholder="" />
                                                <el-input v-model="state.tableData.记录者" style="width: 100px;"  readonly  placeholder="" />
                                            </el-form-item>
                                        </th>
@@ -132,6 +132,14 @@
                    <el-button type="primary" @click="onSubmit">
                        保存
                    </el-button>
                    <el-button v-if="state.viewInfo.id" type="primary" v-print="'#pinggu4'">
                        <el-icon><Printer /></el-icon>
                        打印
                    </el-button>
                    <el-button type="primary" v-if="state.viewInfo.id" @click="generatePDF">
                        <el-icon><Position /></el-icon>
                        导出
                    </el-button>
                </div>
            </template>
        </el-dialog>
@@ -142,6 +150,7 @@
</template>
<script setup lang="ts" name="visualizingLinkDemo2">
import html2pdf from 'html2pdf.js';
import { reactive, onMounted, onUnmounted, ref, computed } from 'vue';
import { formatDate } from '/@/utils/formatTime';
import { NextLoading } from '/@/utils/loading';
@@ -264,6 +273,8 @@
        console.log(mode)
        state.viewInfo=mode
        state.tableData=JSON.parse(mode.surveryJsonBody)
        state.tableData.初次调查日期=mode.surveryTime
        state.tableData.更新日期=mode.updateTime
        state.dialogTableVisible = true
@@ -307,6 +318,18 @@
        updateTime: ''
    }
}
const generatePDF=()=> {
      const element = document.getElementById('pinggu4');
      const opt = {
        margin: 10,
        filename: `${state.tableData.表名}.pdf`,
        image: { type: 'jpeg', quality: 0.98 },
        html2canvas: { scale: 2 },
        jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
      };
      html2pdf().set(opt).from(element).save();
}
// 第二步:暴露方法
defineExpose({ getData, openShow })